From ba94db30b9709e15736c8530ffdf3e8fc7826d8f Mon Sep 17 00:00:00 2001 From: Rebecca Alpert Date: Wed, 15 Jul 2026 11:34:39 -0400 Subject: [PATCH 1/2] fix(icons): Replace in history, header, settings menus Replace with RH brand icons. --- .../chatbot/examples/UI/ChatbotHeaderBasic.tsx | 10 ++++------ .../chatbot/examples/UI/ChatbotHeaderDrawer.tsx | 6 +++--- .../examples/UI/ChatbotHeaderDrawerResizable.tsx | 4 ++-- .../examples/UI/ChatbotHeaderDrawerWithPin.tsx | 4 ++-- .../UI/ChatbotHeaderDrawerWithSearchActions.tsx | 6 +++--- .../chatbot/examples/UI/CompactSettings.tsx | 15 ++++++++++----- .../extensions/chatbot/examples/UI/Settings.tsx | 15 ++++++++++----- .../content/extensions/chatbot/examples/UI/UI.md | 16 +--------------- .../chatbot/examples/demos/AttachmentDemos.md | 4 +--- .../extensions/chatbot/examples/demos/Chatbot.md | 4 +--- .../chatbot/examples/demos/Chatbot.tsx | 11 ++++------- .../chatbot/examples/demos/ChatbotAttachment.tsx | 10 ++++------ .../chatbot/examples/demos/ChatbotCompact.tsx | 11 ++++------- .../examples/demos/ChatbotDisplayMode.tsx | 11 ++++------- .../chatbot/examples/demos/ChatbotScrolling.tsx | 12 ++++-------- .../examples/demos/ChatbotTranscripts.tsx | 11 ++++------- .../ChatbotConversationHistoryDropdown.tsx | 5 ++--- .../ChatbotConversationHistoryNav.tsx | 8 ++++---- .../ChatbotHeader/ChatbotHeaderNewChatButton.tsx | 5 ++--- 19 files changed, 69 insertions(+), 99 deletions(-) diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderBasic.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderBasic.tsx index 8c9c866da..b641735c5 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderBasic.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderBasic.tsx @@ -21,9 +21,7 @@ import { ChatbotHeaderNewChatButton } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; import { ChatbotDisplayMode } from '@patternfly/chatbot/dist/dynamic/Chatbot'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import PFHorizontalLogoColor from './PF-HorizontalLogo-Color.svg'; import PFHorizontalLogoReverse from './PF-HorizontalLogo-Reverse.svg'; @@ -170,21 +168,21 @@ export const BasicDemo: FunctionComponent = () => { } + icon={} > Overlay } + icon={} > Dock to window } + icon={} > Fullscreen diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawer.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawer.tsx index dfae47e15..e840a7772 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawer.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawer.tsx @@ -4,7 +4,7 @@ import ChatbotConversationHistoryNav, { Conversation } from '@patternfly/chatbot/dist/dynamic/ChatbotConversationHistoryNav'; import { Checkbox, EmptyStateStatus, Spinner } from '@patternfly/react-core'; -import { OutlinedCommentsIcon, SearchIcon } from '@patternfly/react-icons'; +import { RhUiCommentsIcon, RhUiSearchIcon } from '@patternfly/react-icons'; const initialConversations: { [key: string]: Conversation[] } = { Today: [{ id: '1', text: 'Red Hat products and services' }], @@ -50,13 +50,13 @@ const ERROR = { const NO_RESULTS = { bodyText: 'Adjust your search query and try again. Check your spelling or try a more general term.', titleText: 'No results found', - icon: SearchIcon + icon: RhUiSearchIcon }; const EMPTY_STATE = { bodyText: 'Access timely assistance by starting a conversation with an AI model.', titleText: 'Start a new chat', - icon: OutlinedCommentsIcon + icon: RhUiCommentsIcon }; export const ChatbotHeaderTitleDemo: FunctionComponent = () => { diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerResizable.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerResizable.tsx index 75c7abc4a..225a88878 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerResizable.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerResizable.tsx @@ -4,7 +4,7 @@ import ChatbotConversationHistoryNav, { Conversation } from '@patternfly/chatbot/dist/dynamic/ChatbotConversationHistoryNav'; import { Checkbox } from '@patternfly/react-core'; -import { SearchIcon } from '@patternfly/react-icons'; +import { RhUiSearchIcon } from '@patternfly/react-icons'; const initialConversations: { [key: string]: Conversation[] } = { Today: [{ id: '1', text: 'Red Hat products and services' }], @@ -35,7 +35,7 @@ const initialConversations: { [key: string]: Conversation[] } = { const NO_RESULTS = { bodyText: 'Adjust your search query and try again. Check your spelling or try a more general term.', titleText: 'No results found', - icon: SearchIcon + icon: RhUiSearchIcon }; export const ChatbotHeaderDrawerResizableDemo: FunctionComponent = () => { diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithPin.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithPin.tsx index 854bdf301..a16140f77 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithPin.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithPin.tsx @@ -5,7 +5,7 @@ import ChatbotConversationHistoryNav, { Conversation } from '@patternfly/chatbot/dist/dynamic/ChatbotConversationHistoryNav'; import { Checkbox, DropdownItem, DropdownList } from '@patternfly/react-core'; -import { ThumbtackIcon } from '@patternfly/react-icons'; +import { RhUiThumbtackFillIcon } from '@patternfly/react-icons'; // Sample conversations const initialConversations: { [key: string]: Conversation[] } = { @@ -144,7 +144,7 @@ export const ChatbotHeaderPinDemo: FunctionComponent = () => { pinnedItems.push({ ...conv, menuItems: createMenuItems(conv.id), - icon: , + icon: , dropdownId: `pin-demo-${conv.id}-dropdown` }); } diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithSearchActions.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithSearchActions.tsx index f0b9c3b2f..03ba051f4 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithSearchActions.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerWithSearchActions.tsx @@ -13,7 +13,7 @@ import { SelectOption, Tooltip } from '@patternfly/react-core'; -import { FilterIcon, SortAmountDownIcon } from '@patternfly/react-icons'; +import { RhUiFilterFillIcon, RhMicronsSortDownLargeToSmallIcon } from '@patternfly/react-icons'; const initialConversations: { [key: string]: Conversation[] } = { Today: [{ id: '1', text: 'Red Hat products and services' }], @@ -148,7 +148,7 @@ export const ChatbotHeaderTitleDemo: FunctionComponent = () => { aria-label="Filter options" // eslint-disable-next-line no-console onClick={() => console.log('Filter button clicked')} - icon={} + icon={} /> ) : undefined @@ -171,7 +171,7 @@ export const ChatbotHeaderTitleDemo: FunctionComponent = () => { variant="plain" aria-label={`${sortLabels[selectedSort]}, Sort conversations`} icon={ - { const [isChecked, setIsChecked] = useState(true); @@ -222,7 +227,7 @@ export const CompactSettingsDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -230,7 +235,7 @@ export const CompactSettingsDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.docked} > Dock to window @@ -238,7 +243,7 @@ export const CompactSettingsDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen @@ -247,7 +252,7 @@ export const CompactSettingsDemo: FunctionComponent = () => { - }> + }> Settings diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/Settings.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/Settings.tsx index 9e68a6cbf..f22962cc2 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/Settings.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/Settings.tsx @@ -20,7 +20,12 @@ import ChatbotHeader, { ChatbotHeaderOptionsDropdown, ChatbotHeaderTitle } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; -import { CogIcon, ExpandIcon, OpenDrawerRightIcon, OutlinedWindowRestoreIcon } from '@patternfly/react-icons'; +import { + RhUiExpandIcon, + RhUiOpenDrawerRightIcon, + RhUiRestoreWindowIcon, + RhUiSettingsFillIcon +} from '@patternfly/react-icons'; export const SettingsDemo: FunctionComponent = () => { const [isChecked, setIsChecked] = useState(true); @@ -222,7 +227,7 @@ export const SettingsDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -230,7 +235,7 @@ export const SettingsDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.docked} > Dock to window @@ -238,7 +243,7 @@ export const SettingsDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen @@ -247,7 +252,7 @@ export const SettingsDemo: FunctionComponent = () => { - }> + }> Settings diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/UI.md b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/UI.md index 06dd9f441..03eb020a7 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/UI.md +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/UI/UI.md @@ -70,30 +70,16 @@ import { MessageBar } from '@patternfly/chatbot/dist/dynamic/MessageBar'; import SourceDetailsMenuItem from '@patternfly/chatbot/dist/dynamic/SourceDetailsMenuItem'; import { ChatbotModal } from '@patternfly/chatbot/dist/dynamic/ChatbotModal'; import SettingsForm from '@patternfly/chatbot/dist/dynamic/Settings'; -import RhUiAttentionBellIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-attention-bell-icon'; -import RhUiCalendarIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-calendar-icon'; -import RhUiClipboardIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-clipboard-icon'; -import RhUiCodeIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-code-icon'; -import RhUiAddIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-add-icon'; -import { ThumbtackIcon } from '@patternfly/react-icons'; -import RhUiUploadIcon from '@patternfly/react-icons/dist/esm/icons/rh-ui-upload-icon'; import { useDropzone } from 'react-dropzone'; - import ChatbotConversationHistoryNav from '@patternfly/chatbot/dist/dynamic/ChatbotConversationHistoryNav'; import { Button, Label, DropdownItem, DropdownList, Checkbox, MenuToggle, Select, SelectList, SelectOption } from '@patternfly/react-core'; - -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import CogIcon from '@patternfly/react-icons/dist/esm/icons/cog-icon'; -import PenToSquareIcon from '@patternfly/react-icons/dist/esm/icons/pen-to-square-icon'; import PFHorizontalLogoColor from './PF-HorizontalLogo-Color.svg'; import PFHorizontalLogoReverse from './PF-HorizontalLogo-Reverse.svg'; import userAvatar from '../Messages/user_avatar.svg'; import patternflyAvatar from '../Messages/patternfly_avatar.jpg'; import termsAndConditionsHeader from './PF-TermsAndConditionsHeader.svg'; import onboardingHeader from './RH-Hat-Image.svg'; -import { CloseIcon, SearchIcon, OutlinedCommentsIcon, FilterIcon, SortAmountDownIcon } from '@patternfly/react-icons'; +import { RhMicronsSortDownLargeToSmallIcon, RhUiAddIcon, RhUiAttentionBellIcon, RhUiCalendarIcon, RhUiClipboardIcon, RhUiCodeIcon, RhUiCommentsIcon, RhUiEditFillIcon, RhUiExpandIcon, RhUiFilterFillIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon, RhUiSearchIcon, RhUiSettingsFillIcon, RhUiThumbtackFillIcon, RhUiUploadIcon } from '@patternfly/react-icons'; import { FunctionComponent, FormEvent, useState, useRef, MouseEvent, isValidElement, cloneElement, Children, ReactNode, Ref, MouseEvent as ReactMouseEvent, CSSProperties, useEffect} from 'react'; import FilePreview from '@patternfly/chatbot/dist/dynamic/FilePreview'; diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/AttachmentDemos.md b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/AttachmentDemos.md index 3f5d11431..3fa46923b 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/AttachmentDemos.md +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/AttachmentDemos.md @@ -37,9 +37,7 @@ ChatbotHeaderSelectorDropdown, ChatbotHeaderOptionsDropdown } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; import ChatbotAlert from '@patternfly/chatbot/dist/dynamic/ChatbotAlert'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import PFIconLogoColor from '../UI/PF-IconLogo-Color.svg'; import PFIconLogoReverse from '../UI/PF-IconLogo-Reverse.svg'; import userAvatar from '../Messages/user_avatar.svg'; diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.md b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.md index a47d413cf..2946cc72c 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.md +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.md @@ -48,9 +48,7 @@ ChatbotHeaderOptionsDropdown, ChatbotHeaderCloseButton, } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import { BarsIcon } from '@patternfly/react-icons/dist/esm/icons/bars-icon'; import { CopyIcon } from '@patternfly/react-icons/dist/esm/icons/copy-icon'; import { WrenchIcon } from '@patternfly/react-icons/dist/esm/icons/wrench-icon'; diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.tsx index bac6b0cbe..77358e440 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.tsx @@ -21,10 +21,7 @@ import ChatbotHeader, { ChatbotHeaderOptionsDropdown } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; - +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import PFHorizontalLogoColor from '../UI/PF-HorizontalLogo-Color.svg'; import PFHorizontalLogoReverse from '../UI/PF-HorizontalLogo-Reverse.svg'; import PFIconLogoColor from '../UI/PF-IconLogo-Color.svg'; @@ -393,7 +390,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -401,7 +398,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.docked} > Dock to window @@ -409,7 +406,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachment.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachment.tsx index 843b86930..92c771b44 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachment.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachment.tsx @@ -20,9 +20,7 @@ import ChatbotHeader, { ChatbotHeaderMain } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; import ChatbotAlert from '@patternfly/chatbot/dist/dynamic/ChatbotAlert'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import PFHorizontalLogoColor from '../UI/PF-HorizontalLogo-Color.svg'; import PFHorizontalLogoReverse from '../UI/PF-HorizontalLogo-Reverse.svg'; import PFIconLogoColor from '../UI/PF-IconLogo-Color.svg'; @@ -197,7 +195,7 @@ export const BasicDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -205,7 +203,7 @@ export const BasicDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.docked} > Dock to window @@ -213,7 +211,7 @@ export const BasicDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotCompact.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotCompact.tsx index a6ecfbf44..d6f3f6583 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotCompact.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotCompact.tsx @@ -21,10 +21,7 @@ import ChatbotHeader, { ChatbotHeaderOptionsDropdown } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; - +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import PFHorizontalLogoColor from '../UI/PF-HorizontalLogo-Color.svg'; import PFHorizontalLogoReverse from '../UI/PF-HorizontalLogo-Reverse.svg'; import PFIconLogoColor from '../UI/PF-IconLogo-Color.svg'; @@ -381,7 +378,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -389,7 +386,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.docked} > Dock to window @@ -397,7 +394,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotDisplayMode.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotDisplayMode.tsx index 27108189b..95bd45633 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotDisplayMode.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotDisplayMode.tsx @@ -43,10 +43,7 @@ import ChatbotHeader, { } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; import PFIconLogoColor from '../UI/PF-IconLogo-Color.svg'; import PFIconLogoReverse from '../UI/PF-IconLogo-Reverse.svg'; -import { BarsIcon } from '@patternfly/react-icons'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; +import { BarsIcon, RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import userAvatar from '../Messages/user_avatar.svg'; import '@patternfly/react-core/dist/styles/base.css'; import '@patternfly/chatbot/dist/css/main.css'; @@ -365,7 +362,7 @@ export const ChatbotDisplayModeDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -373,7 +370,7 @@ export const ChatbotDisplayModeDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.drawer} > Drawer @@ -381,7 +378,7 @@ export const ChatbotDisplayModeDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotScrolling.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotScrolling.tsx index 20be2b9f2..25d7d244b 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotScrolling.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotScrolling.tsx @@ -21,11 +21,7 @@ import ChatbotHeader, { ChatbotHeaderSelectorDropdown, ChatbotHeaderOptionsDropdown } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; - -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; - +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import PFHorizontalLogoColor from '../UI/PF-HorizontalLogo-Color.svg'; import PFHorizontalLogoReverse from '../UI/PF-HorizontalLogo-Reverse.svg'; import PFIconLogoColor from '../UI/PF-IconLogo-Color.svg'; @@ -450,7 +446,7 @@ export const ChatbotScrollingDemo: React.FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -458,7 +454,7 @@ export const ChatbotScrollingDemo: React.FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.docked} > Dock to window @@ -466,7 +462,7 @@ export const ChatbotScrollingDemo: React.FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen diff --git a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotTranscripts.tsx b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotTranscripts.tsx index a824f2f84..1b7f81864 100644 --- a/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotTranscripts.tsx +++ b/packages/module/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotTranscripts.tsx @@ -21,10 +21,7 @@ import ChatbotHeader, { ChatbotHeaderOptionsDropdown } from '@patternfly/chatbot/dist/dynamic/ChatbotHeader'; -import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon'; -import OpenDrawerRightIcon from '@patternfly/react-icons/dist/esm/icons/open-drawer-right-icon'; -import OutlinedWindowRestoreIcon from '@patternfly/react-icons/dist/esm/icons/outlined-window-restore-icon'; - +import { RhUiExpandIcon, RhUiOpenDrawerRightIcon, RhUiRestoreWindowIcon } from '@patternfly/react-icons'; import PFHorizontalLogoColor from '../UI/PF-HorizontalLogo-Color.svg'; import PFHorizontalLogoReverse from '../UI/PF-HorizontalLogo-Reverse.svg'; import PFIconLogoColor from '../UI/PF-IconLogo-Color.svg'; @@ -470,7 +467,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.default} > Overlay @@ -478,7 +475,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.docked} > Dock to window @@ -486,7 +483,7 @@ export const ChatbotDemo: FunctionComponent = () => { } + icon={} isSelected={displayMode === ChatbotDisplayMode.fullscreen} > Fullscreen diff --git a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx index eb91f08ce..97f67653f 100644 --- a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx +++ b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx @@ -7,8 +7,7 @@ import { useState } from 'react'; // Import PatternFly components import { MenuToggleElement, Tooltip, MenuToggle, Dropdown, DropdownProps } from '@patternfly/react-core'; - -import EllipsisIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon'; +import { RhUiEllipsisVerticalFillIcon } from '@patternfly/react-icons/dist/esm/icons/rh-ui-ellipsis-vertical-fill-icon'; export interface ChatbotConversationHistoryDropdownProps extends Omit { /** Dropdown items rendered in conversation settings dropdown */ @@ -53,7 +52,7 @@ export const ChatbotConversationHistoryDropdown: FunctionComponent - + ); diff --git a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx index 96c0e01e2..bf21815f8 100644 --- a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx +++ b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx @@ -45,7 +45,7 @@ import { MenuContentProps } from '@patternfly/react-core'; -import { OutlinedClockIcon, OutlinedCommentAltIcon, PenToSquareIcon } from '@patternfly/react-icons'; +import { RhUiClockIcon, RhUiCommentIcon, RhUiEditFillIcon } from '@patternfly/react-icons'; import { ChatbotDisplayMode } from '../Chatbot/Chatbot'; import ConversationHistoryDropdown from './ChatbotConversationHistoryDropdown'; import LoadingState from './LoadingState'; @@ -195,7 +195,7 @@ export const ChatbotConversationHistoryNav: FunctionComponent, + navTitleIcon = , searchInputScreenReaderText, searchActionStart, searchActionEnd, @@ -218,7 +218,7 @@ export const ChatbotConversationHistoryNav: FunctionComponent })} + {...(conversation.noIcon ? {} : { icon: conversation.icon ?? })} /* eslint-disable indent */ {...(conversation.menuItems ? { @@ -354,7 +354,7 @@ export const ChatbotConversationHistoryNav: FunctionComponent} + icon={} {...newChatButtonProps} > {newChatButtonText} diff --git a/packages/module/src/ChatbotHeader/ChatbotHeaderNewChatButton.tsx b/packages/module/src/ChatbotHeader/ChatbotHeaderNewChatButton.tsx index 3eb4127d0..6f55daf32 100644 --- a/packages/module/src/ChatbotHeader/ChatbotHeaderNewChatButton.tsx +++ b/packages/module/src/ChatbotHeader/ChatbotHeaderNewChatButton.tsx @@ -2,8 +2,7 @@ import type { Ref, FunctionComponent } from 'react'; import { forwardRef } from 'react'; import { Button, ButtonProps, Icon, Tooltip, TooltipProps } from '@patternfly/react-core'; -import { PenToSquareIcon } from '@patternfly/react-icons/dist/esm/icons/pen-to-square-icon'; - +import { RhUiEditFillIcon } from '@patternfly/react-icons/dist/esm/icons/rh-ui-edit-fill-icon'; export interface ChatbotHeaderNewChatButtonProps extends ButtonProps { /** Callback function for when button is clicked */ onClick: () => void; @@ -47,7 +46,7 @@ const ChatbotHeaderNewChatButtonBase: FunctionComponent - + } size={isCompact ? 'sm' : undefined} From 3623f4e25edc268c27e89ed7a82151ec033f5519 Mon Sep 17 00:00:00 2001 From: Rebecca Alpert Date: Fri, 17 Jul 2026 16:39:19 -0400 Subject: [PATCH 2/2] swap close icon --- .../module/src/ChatbotHeader/ChatbotHeaderCloseButton.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/module/src/ChatbotHeader/ChatbotHeaderCloseButton.tsx b/packages/module/src/ChatbotHeader/ChatbotHeaderCloseButton.tsx index 59acaa3b0..989ebe514 100644 --- a/packages/module/src/ChatbotHeader/ChatbotHeaderCloseButton.tsx +++ b/packages/module/src/ChatbotHeader/ChatbotHeaderCloseButton.tsx @@ -2,7 +2,7 @@ import type { Ref, FunctionComponent } from 'react'; import { forwardRef } from 'react'; import { Button, ButtonProps, Icon, Tooltip, TooltipProps } from '@patternfly/react-core'; -import { CloseIcon } from '@patternfly/react-icons'; +import { RhMicronsCloseIcon } from '@patternfly/react-icons'; export interface ChatbotHeaderCloseButtonProps extends ButtonProps { /** Callback function for when button is clicked */ @@ -47,7 +47,7 @@ const ChatbotHeaderCloseButtonBase: FunctionComponent - + } size={isCompact ? 'sm' : undefined}