@patternfly/chatbot 6.5.0-prerelease.9 → 6.5.0

package/dist/esm/ToolCall/ToolCall.test.js

@@ -136,4 +136,61 @@ describe('ToolCall', () => {
         render(_jsx(ToolCall, Object.assign({}, defaultProps, { cardFooterProps: { id: 'card-footer-test-id' } })));
         expect(screen.getByRole('button', { name: 'Run tool' }).closest('#card-footer-test-id')).toBeVisible();
     });
+    it('Renders collapsed by default when expandableContent is provided', () => {
+        render(_jsx(ToolCall, Object.assign({}, defaultProps, { expandableContent: "Expandable Content" })));
+        expect(screen.getByRole('button', { name: defaultProps.titleText })).toHaveAttribute('aria-expanded', 'false');
+        expect(screen.queryByText('Expandable Content')).not.toBeVisible();
+    });
+    it('Renders expanded when isDefaultExpanded is true', () => {
+        render(_jsx(ToolCall, Object.assign({}, defaultProps, { isDefaultExpanded: true, expandableContent: "Expandable Content" })));
+        expect(screen.getByRole('button', { name: defaultProps.titleText })).toHaveAttribute('aria-expanded', 'true');
+        expect(screen.getByText('Expandable Content')).toBeVisible();
+    });
+    it('expandableSectionProps.isExpanded overrides isDefaultExpanded', () => {
+        render(_jsx(ToolCall, Object.assign({}, defaultProps, { isDefaultExpanded: false, expandableContent: "Expandable Content", expandableSectionProps: { isExpanded: true } })));
+        expect(screen.getByRole('button', { name: defaultProps.titleText })).toHaveAttribute('aria-expanded', 'true');
+        expect(screen.getByText('Expandable Content')).toBeVisible();
+    });
+    it('expandableSectionProps.onToggle overrides internal onToggle behavior', () => __awaiter(void 0, void 0, void 0, function* () {
+        const user = userEvent.setup();
+        const customOnToggle = jest.fn();
+        render(_jsx(ToolCall, Object.assign({}, defaultProps, { isDefaultExpanded: false, expandableContent: "Expandable Content", expandableSectionProps: { onToggle: customOnToggle } })));
+        const toggleButton = screen.getByRole('button', { name: defaultProps.titleText });
+        expect(toggleButton).toHaveAttribute('aria-expanded', 'false');
+        yield user.click(toggleButton);
+        expect(customOnToggle).toHaveBeenCalledTimes(1);
+        expect(toggleButton).toHaveAttribute('aria-expanded', 'false');
+        expect(screen.queryByText('Expandable Content')).not.toBeVisible();
+    }));
+    it('should render titleText as markdown when isTitleMarkdown is true', () => {
+        const titleText = '**Bold title**';
+        const { container } = render(_jsx(ToolCall, { titleText: titleText, isTitleMarkdown: true }));
+        expect(container.querySelector('strong')).toBeTruthy();
+        expect(screen.getByText('Bold title')).toBeTruthy();
+    });
+    it('should not render titleText as markdown when isTitleMarkdown is false', () => {
+        const titleText = '**Bold title**';
+        render(_jsx(ToolCall, { titleText: titleText }));
+        expect(screen.getByText('**Bold title**')).toBeTruthy();
+    });
+    it('should render expandableContent as markdown when isExpandableContentMarkdown is true', () => __awaiter(void 0, void 0, void 0, function* () {
+        const user = userEvent.setup();
+        const expandableContent = '**Bold expandable content**';
+        const { container } = render(_jsx(ToolCall, Object.assign({}, defaultProps, { expandableContent: expandableContent, isExpandableContentMarkdown: true })));
+        yield user.click(screen.getByRole('button', { name: defaultProps.titleText }));
+        expect(container.querySelector('strong')).toBeTruthy();
+        expect(screen.getByText('Bold expandable content')).toBeTruthy();
+    }));
+    it('should not render expandableContent as markdown when isExpandableContentMarkdown is false', () => __awaiter(void 0, void 0, void 0, function* () {
+        const user = userEvent.setup();
+        const expandableContent = '**Bold expandable content**';
+        render(_jsx(ToolCall, Object.assign({}, defaultProps, { expandableContent: expandableContent })));
+        yield user.click(screen.getByRole('button', { name: defaultProps.titleText }));
+        expect(screen.getByText('**Bold expandable content**')).toBeTruthy();
+    }));
+    it('should pass markdownContentProps to MarkdownContent component', () => {
+        const titleText = '**Bold title**';
+        const { container } = render(_jsx(ToolCall, { titleText: titleText, isTitleMarkdown: true, markdownContentProps: { isPrimary: true } }));
+        expect(container.querySelector('.pf-m-primary')).toBeTruthy();
+    });
 });

package/dist/esm/ToolResponse/ToolResponse.d.ts

@@ -1,8 +1,11 @@
 import { CardBodyProps, CardProps, CardTitleProps, DividerProps, ExpandableSectionProps } from '@patternfly/react-core';
 import { type FunctionComponent } from 'react';
+import type { MarkdownContentProps } from '../MarkdownContent';
 export interface ToolResponseProps {
     /** Toggle content shown for expandable section */
     toggleContent: React.ReactNode;
+    /** Flag indicating whether the expandable content is expanded by default. */
+    isDefaultExpanded?: boolean;
     /** Additional props passed to expandable section */
     expandableSectionProps?: Omit<ExpandableSectionProps, 'ref'>;
     /** Subheading rendered inside expandable section */
@@ -25,6 +28,20 @@ export interface ToolResponseProps {
     toolResponseCardDividerProps?: DividerProps;
     /** Additional props passed to tool response card title */
     toolResponseCardTitleProps?: CardTitleProps;
+    /** Whether to enable markdown rendering for toggleContent. When true and toggleContent is a string, it will be parsed as markdown. */
+    isToggleContentMarkdown?: boolean;
+    /** Whether to enable markdown rendering for subheading. When true, subheading will be parsed as markdown. */
+    isSubheadingMarkdown?: boolean;
+    /** Whether to enable markdown rendering for body. When true and body is a string, it will be parsed as markdown. */
+    isBodyMarkdown?: boolean;
+    /** Whether to enable markdown rendering for cardBody. When true and cardBody is a string, it will be parsed as markdown. */
+    isCardBodyMarkdown?: boolean;
+    /** Whether to enable markdown rendering for cardTitle. When true and cardTitle is a string, it will be parsed as markdown. */
+    isCardTitleMarkdown?: boolean;
+    /** Props passed to MarkdownContent component when markdown is enabled */
+    markdownContentProps?: Omit<MarkdownContentProps, 'content'>;
+    /** Whether to retain styles in the MarkdownContent component. Defaults to false. */
+    shouldRetainStyles?: boolean;
 }
 export declare const ToolResponse: FunctionComponent<ToolResponseProps>;
 export default ToolResponse;

package/dist/esm/ToolResponse/ToolResponse.js

@@ -4,11 +4,54 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // ============================================================================
 import { Card, CardBody, CardTitle, Divider, ExpandableSection } from '@patternfly/react-core';
 import { useState } from 'react';
-export const ToolResponse = ({ body, cardProps, expandableSectionProps, subheading, cardBody, cardTitle, cardBodyProps, toggleContent, toolResponseCardBodyProps, toolResponseCardDividerProps, toolResponseCardProps, toolResponseCardTitleProps }) => {
-    const [isExpanded, setIsExpanded] = useState(true);
+import MarkdownContent from '../MarkdownContent';
+export const ToolResponse = ({ body, cardProps, expandableSectionProps, subheading, cardBody, cardTitle, cardBodyProps, toggleContent, isDefaultExpanded = true, toolResponseCardBodyProps, toolResponseCardDividerProps, toolResponseCardProps, toolResponseCardTitleProps, isToggleContentMarkdown, isSubheadingMarkdown, isBodyMarkdown, isCardBodyMarkdown, isCardTitleMarkdown, markdownContentProps, shouldRetainStyles = false }) => {
+    const [isExpanded, setIsExpanded] = useState(isDefaultExpanded);
     const onToggle = (_event, isExpanded) => {
         setIsExpanded(isExpanded);
     };
-    return (_jsx(Card, Object.assign({ isCompact: true, className: "pf-chatbot__tool-response" }, cardProps, { children: _jsx(CardBody, Object.assign({}, cardBodyProps, { children: _jsx(ExpandableSection, Object.assign({ toggleContent: toggleContent, onToggle: onToggle, isExpanded: isExpanded, isIndented: true, className: "pf-chatbot__tool-response-expandable-section" }, expandableSectionProps, { children: _jsxs("div", { className: "pf-chatbot__tool-response-section", children: [subheading && (_jsx("div", { className: "pf-chatbot__tool-response-subheading", children: _jsx("span", { children: subheading }) })), body && _jsx("div", { className: "pf-chatbot__tool-response-body", children: body }), (cardTitle || cardBody) && (_jsxs(Card, Object.assign({ isCompact: true, className: "pf-chatbot__tool-response-card" }, toolResponseCardProps, { children: [cardTitle && _jsx(CardTitle, Object.assign({}, toolResponseCardTitleProps, { children: cardTitle })), cardTitle && cardBody && _jsx(Divider, Object.assign({}, toolResponseCardDividerProps)), cardBody && _jsx(CardBody, Object.assign({}, toolResponseCardBodyProps, { children: cardBody }))] })))] }) })) })) })));
+    const renderToggleContent = () => {
+        if (isToggleContentMarkdown && typeof toggleContent === 'string') {
+            return (_jsx(MarkdownContent, Object.assign({ shouldRetainStyles: shouldRetainStyles, content: toggleContent }, markdownContentProps)));
+        }
+        return toggleContent;
+    };
+    const renderSubheading = () => {
+        if (!subheading) {
+            return null;
+        }
+        if (isSubheadingMarkdown) {
+            return _jsx(MarkdownContent, Object.assign({ shouldRetainStyles: shouldRetainStyles, content: subheading }, markdownContentProps));
+        }
+        return subheading;
+    };
+    const renderBody = () => {
+        if (!body) {
+            return null;
+        }
+        if (isBodyMarkdown && typeof body === 'string') {
+            return _jsx(MarkdownContent, Object.assign({ shouldRetainStyles: shouldRetainStyles, content: body }, markdownContentProps));
+        }
+        return body;
+    };
+    const renderCardTitle = () => {
+        if (!cardTitle) {
+            return null;
+        }
+        if (isCardTitleMarkdown && typeof cardTitle === 'string') {
+            return _jsx(MarkdownContent, Object.assign({ shouldRetainStyles: shouldRetainStyles, content: cardTitle }, markdownContentProps));
+        }
+        return cardTitle;
+    };
+    const renderCardBody = () => {
+        if (!cardBody) {
+            return null;
+        }
+        if (isCardBodyMarkdown && typeof cardBody === 'string') {
+            return _jsx(MarkdownContent, Object.assign({ shouldRetainStyles: shouldRetainStyles, content: cardBody }, markdownContentProps));
+        }
+        return cardBody;
+    };
+    return (_jsx(Card, Object.assign({ isCompact: true, className: "pf-chatbot__tool-response" }, cardProps, { children: _jsx(CardBody, Object.assign({}, cardBodyProps, { children: _jsx(ExpandableSection, Object.assign({ toggleContent: renderToggleContent(), onToggle: onToggle, isExpanded: isExpanded, isIndented: true, className: "pf-chatbot__tool-response-expandable-section" }, expandableSectionProps, { children: _jsxs("div", { className: "pf-chatbot__tool-response-section", children: [subheading && (_jsx("div", { className: "pf-chatbot__tool-response-subheading", children: _jsx("span", { children: renderSubheading() }) })), body && _jsx("div", { className: "pf-chatbot__tool-response-body", children: renderBody() }), (cardTitle || cardBody) && (_jsxs(Card, Object.assign({ isCompact: true, className: "pf-chatbot__tool-response-card" }, toolResponseCardProps, { children: [cardTitle && _jsx(CardTitle, Object.assign({}, toolResponseCardTitleProps, { children: renderCardTitle() })), cardTitle && cardBody && _jsx(Divider, Object.assign({}, toolResponseCardDividerProps)), cardBody && _jsx(CardBody, Object.assign({}, toolResponseCardBodyProps, { children: renderCardBody() }))] })))] }) })) })) })));
 };
 export default ToolResponse;

package/dist/esm/ToolResponse/ToolResponse.test.js

@@ -1,5 +1,15 @@
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { render, screen } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
 import '@testing-library/jest-dom';
 import ToolResponse from './ToolResponse';
 describe('ToolResponse', () => {
@@ -76,4 +86,94 @@ describe('ToolResponse', () => {
         const { container } = render(_jsx(ToolResponse, Object.assign({}, defaultProps, { cardBody: undefined })));
         expect(container.querySelector('.pf-v6-c-divider')).toBeFalsy();
     });
+    it('Renders expanded by default', () => {
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps)));
+        expect(screen.getByRole('button', { name: defaultProps.toggleContent })).toHaveAttribute('aria-expanded', 'true');
+        expect(screen.getByText(defaultProps.cardTitle)).toBeVisible();
+        expect(screen.getByText(defaultProps.cardBody)).toBeVisible();
+    });
+    it('Renders collapsed when isDefaultExpanded is false', () => {
+        render(_jsx(ToolResponse, Object.assign({ isDefaultExpanded: false }, defaultProps)));
+        expect(screen.getByRole('button', { name: defaultProps.toggleContent })).toHaveAttribute('aria-expanded', 'false');
+        expect(screen.getByText(defaultProps.cardTitle)).not.toBeVisible();
+        expect(screen.getByText(defaultProps.cardBody)).not.toBeVisible();
+    });
+    it('expandableSectionProps.isExpanded overrides isDefaultExpanded', () => {
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps, { isDefaultExpanded: false, expandableSectionProps: { isExpanded: true } })));
+        expect(screen.getByRole('button', { name: defaultProps.toggleContent })).toHaveAttribute('aria-expanded', 'true');
+        expect(screen.getByText(defaultProps.cardTitle)).toBeVisible();
+        expect(screen.getByText(defaultProps.cardBody)).toBeVisible();
+    });
+    it('expandableSectionProps.onToggle overrides internal onToggle behavior', () => __awaiter(void 0, void 0, void 0, function* () {
+        const user = userEvent.setup();
+        const customOnToggle = jest.fn();
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps, { isDefaultExpanded: false, expandableSectionProps: { onToggle: customOnToggle } })));
+        const toggleButton = screen.getByRole('button', { name: defaultProps.toggleContent });
+        expect(toggleButton).toHaveAttribute('aria-expanded', 'false');
+        yield user.click(toggleButton);
+        expect(customOnToggle).toHaveBeenCalledTimes(1);
+        expect(toggleButton).toHaveAttribute('aria-expanded', 'false');
+        expect(screen.getByText(defaultProps.cardTitle)).not.toBeVisible();
+        expect(screen.getByText(defaultProps.cardBody)).not.toBeVisible();
+    }));
+    it('should render toggleContent as markdown when isToggleContentMarkdown is true', () => {
+        const toggleContent = '**Bold toggle**';
+        const { container } = render(_jsx(ToolResponse, Object.assign({}, defaultProps, { toggleContent: toggleContent, isToggleContentMarkdown: true })));
+        expect(container.querySelector('strong')).toBeTruthy();
+        expect(screen.getByText('Bold toggle')).toBeTruthy();
+    });
+    it('should not render toggleContent as markdown when isToggleContentMarkdown is false', () => {
+        const toggleContent = '**Bold toggle**';
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps, { toggleContent: toggleContent })));
+        expect(screen.getByText('**Bold toggle**')).toBeTruthy();
+    });
+    it('should render subheading as markdown when isSubheadingMarkdown is true', () => {
+        const subheading = '**Bold subheading**';
+        const { container } = render(_jsx(ToolResponse, Object.assign({}, defaultProps, { subheading: subheading, isSubheadingMarkdown: true })));
+        expect(container.querySelector('strong')).toBeTruthy();
+        expect(screen.getByText('Bold subheading')).toBeTruthy();
+    });
+    it('should not render subheading as markdown when isSubheadingMarkdown is false', () => {
+        const subheading = '**Bold subheading**';
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps, { subheading: subheading })));
+        expect(screen.getByText('**Bold subheading**')).toBeTruthy();
+    });
+    it('should render body as markdown when isBodyMarkdown is true', () => {
+        const body = '**Bold body**';
+        const { container } = render(_jsx(ToolResponse, Object.assign({}, defaultProps, { body: body, isBodyMarkdown: true })));
+        expect(container.querySelector('strong')).toBeTruthy();
+        expect(screen.getByText('Bold body')).toBeTruthy();
+    });
+    it('should not render body as markdown when isBodyMarkdown is false', () => {
+        const body = '**Bold body**';
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps, { body: body })));
+        expect(screen.getByText('**Bold body**')).toBeTruthy();
+    });
+    it('should render cardTitle as markdown when isCardTitleMarkdown is true', () => {
+        const cardTitle = '**Bold card title**';
+        const { container } = render(_jsx(ToolResponse, Object.assign({}, defaultProps, { cardTitle: cardTitle, isCardTitleMarkdown: true })));
+        expect(container.querySelector('strong')).toBeTruthy();
+        expect(screen.getByText('Bold card title')).toBeTruthy();
+    });
+    it('should not render cardTitle as markdown when isCardTitleMarkdown is false', () => {
+        const cardTitle = '**Bold card title**';
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps, { cardTitle: cardTitle })));
+        expect(screen.getByText('**Bold card title**')).toBeTruthy();
+    });
+    it('should render cardBody as markdown when isCardBodyMarkdown is true', () => {
+        const cardBody = '**Bold card body**';
+        const { container } = render(_jsx(ToolResponse, Object.assign({}, defaultProps, { cardBody: cardBody, isCardBodyMarkdown: true })));
+        expect(container.querySelector('strong')).toBeTruthy();
+        expect(screen.getByText('Bold card body')).toBeTruthy();
+    });
+    it('should not render cardBody as markdown when isCardBodyMarkdown is false', () => {
+        const cardBody = '**Bold card body**';
+        render(_jsx(ToolResponse, Object.assign({}, defaultProps, { cardBody: cardBody })));
+        expect(screen.getByText('**Bold card body**')).toBeTruthy();
+    });
+    it('should pass markdownContentProps to MarkdownContent component', () => {
+        const body = '**Bold body**';
+        const { container } = render(_jsx(ToolResponse, Object.assign({}, defaultProps, { body: body, isBodyMarkdown: true, markdownContentProps: { isPrimary: true } })));
+        expect(container.querySelector('.pf-m-primary')).toBeTruthy();
+    });
 });

package/dist/esm/index.d.ts

@@ -40,6 +40,8 @@ export { default as ImagePreview } from './ImagePreview';
 export * from './ImagePreview';
 export { default as LoadingMessage } from './LoadingMessage';
 export * from './LoadingMessage';
+export { default as MarkdownContent } from './MarkdownContent';
+export * from './MarkdownContent';
 export { default as Message } from './Message';
 export * from './Message';
 export { default as MessageBar } from './MessageBar';
@@ -48,6 +50,8 @@ export { default as MessageBox } from './MessageBox';
 export * from './MessageBox';
 export { default as MessageDivider } from './MessageDivider';
 export * from './MessageDivider';
+export { default as Onboarding } from './Onboarding';
+export * from './Onboarding';
 export { default as PreviewAttachment } from './PreviewAttachment';
 export * from './PreviewAttachment';
 export { default as ResponseActions } from './ResponseActions';

package/dist/esm/index.js

@@ -41,6 +41,8 @@ export { default as ImagePreview } from './ImagePreview';
 export * from './ImagePreview';
 export { default as LoadingMessage } from './LoadingMessage';
 export * from './LoadingMessage';
+export { default as MarkdownContent } from './MarkdownContent';
+export * from './MarkdownContent';
 export { default as Message } from './Message';
 export * from './Message';
 export { default as MessageBar } from './MessageBar';
@@ -49,6 +51,8 @@ export { default as MessageBox } from './MessageBox';
 export * from './MessageBox';
 export { default as MessageDivider } from './MessageDivider';
 export * from './MessageDivider';
+export { default as Onboarding } from './Onboarding';
+export * from './Onboarding';
 export { default as PreviewAttachment } from './PreviewAttachment';
 export * from './PreviewAttachment';
 export { default as ResponseActions } from './ResponseActions';

package/dist/tsconfig.tsbuildinfo

@@ -1 +1 @@
-{"root":["../src/index.ts","../src/AttachMenu/AttachMenu.tsx","../src/AttachMenu/index.ts","../src/AttachmentEdit/AttachmentEdit.test.tsx","../src/AttachmentEdit/AttachmentEdit.tsx","../src/AttachmentEdit/index.ts","../src/Chatbot/Chatbot.test.tsx","../src/Chatbot/Chatbot.tsx","../src/Chatbot/index.ts","../src/ChatbotAlert/ChatbotAlert.test.tsx","../src/ChatbotAlert/ChatbotAlert.tsx","../src/ChatbotAlert/index.ts","../src/ChatbotContent/ChatbotContent.test.tsx","../src/ChatbotContent/ChatbotContent.tsx","../src/ChatbotContent/index.ts","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.test.tsx","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx","../src/ChatbotConversationHistoryNav/EmptyState.tsx","../src/ChatbotConversationHistoryNav/LoadingState.tsx","../src/ChatbotConversationHistoryNav/index.ts","../src/ChatbotFooter/ChatbotFooter.test.tsx","../src/ChatbotFooter/ChatbotFooter.tsx","../src/ChatbotFooter/ChatbotFooternote.test.tsx","../src/ChatbotFooter/ChatbotFootnote.tsx","../src/ChatbotFooter/index.ts","../src/ChatbotHeader/ChatbotHeader.test.tsx","../src/ChatbotHeader/ChatbotHeader.tsx","../src/ChatbotHeader/ChatbotHeaderActions.test.tsx","../src/ChatbotHeader/ChatbotHeaderActions.tsx","../src/ChatbotHeader/ChatbotHeaderCloseButton.test.tsx","../src/ChatbotHeader/ChatbotHeaderCloseButton.tsx","../src/ChatbotHeader/ChatbotHeaderMain.test.tsx","../src/ChatbotHeader/ChatbotHeaderMain.tsx","../src/ChatbotHeader/ChatbotHeaderMenu.test.tsx","../src/ChatbotHeader/ChatbotHeaderMenu.tsx","../src/ChatbotHeader/ChatbotHeaderNewChatButton.test.tsx","../src/ChatbotHeader/ChatbotHeaderNewChatButton.tsx","../src/ChatbotHeader/ChatbotHeaderOptionsDropdown.test.tsx","../src/ChatbotHeader/ChatbotHeaderOptionsDropdown.tsx","../src/ChatbotHeader/ChatbotHeaderSelectorDropdown.test.tsx","../src/ChatbotHeader/ChatbotHeaderSelectorDropdown.tsx","../src/ChatbotHeader/ChatbotHeaderTitle.test.tsx","../src/ChatbotHeader/ChatbotHeaderTitle.tsx","../src/ChatbotHeader/index.ts","../src/ChatbotModal/ChatbotModal.test.tsx","../src/ChatbotModal/ChatbotModal.tsx","../src/ChatbotModal/index.ts","../src/ChatbotPopover/ChatbotPopover.tsx","../src/ChatbotPopover/index.ts","../src/ChatbotToggle/ChatbotToggle.test.tsx","../src/ChatbotToggle/ChatbotToggle.tsx","../src/ChatbotToggle/index.ts","../src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.test.tsx","../src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.tsx","../src/ChatbotWelcomePrompt/index.ts","../src/CodeModal/CodeModal.test.tsx","../src/CodeModal/CodeModal.tsx","../src/CodeModal/index.ts","../src/Compare/Compare.test.tsx","../src/Compare/Compare.tsx","../src/Compare/index.ts","../src/DeepThinking/DeepThinking.test.tsx","../src/DeepThinking/DeepThinking.tsx","../src/DeepThinking/index.ts","../src/FileDetails/FileDetails.test.tsx","../src/FileDetails/FileDetails.tsx","../src/FileDetails/index.ts","../src/FileDetailsLabel/FileDetailsLabel.test.tsx","../src/FileDetailsLabel/FileDetailsLabel.tsx","../src/FileDetailsLabel/index.ts","../src/FileDropZone/FileDropZone.test.tsx","../src/FileDropZone/FileDropZone.tsx","../src/FileDropZone/index.ts","../src/FilePreview/FilePreview.test.tsx","../src/FilePreview/FilePreview.tsx","../src/FilePreview/index.ts","../src/ImagePreview/ImagePreview.test.tsx","../src/ImagePreview/ImagePreview.tsx","../src/ImagePreview/index.ts","../src/LoadingMessage/LoadingMessage.test.tsx","../src/LoadingMessage/LoadingMessage.tsx","../src/LoadingMessage/index.ts","../src/Message/Message.test.tsx","../src/Message/Message.tsx","../src/Message/MessageInput.tsx","../src/Message/MessageLoading.tsx","../src/Message/index.ts","../src/Message/CodeBlockMessage/CodeBlockMessage.tsx","../src/Message/ErrorMessage/ErrorMessage.tsx","../src/Message/ImageMessage/ImageMessage.tsx","../src/Message/LinkMessage/LinkMessage.tsx","../src/Message/ListMessage/ListItemMessage.tsx","../src/Message/ListMessage/OrderedListMessage.tsx","../src/Message/ListMessage/UnorderedListMessage.tsx","../src/Message/Plugins/index.ts","../src/Message/Plugins/rehypeCodeBlockToggle.ts","../src/Message/Plugins/rehypeMoveImagesOutOfParagraphs.ts","../src/Message/QuickResponse/QuickResponse.tsx","../src/Message/QuickStarts/FallbackImg.tsx","../src/Message/QuickStarts/QuickStartTile.tsx","../src/Message/QuickStarts/QuickStartTileDescription.test.tsx","../src/Message/QuickStarts/QuickStartTileDescription.tsx","../src/Message/QuickStarts/QuickStartTileHeader.tsx","../src/Message/QuickStarts/monitor-sampleapp-quickstart-with-image.ts","../src/Message/QuickStarts/monitor-sampleapp-quickstart.ts","../src/Message/QuickStarts/types.ts","../src/Message/SuperscriptMessage/SuperscriptMessage.tsx","../src/Message/TableMessage/TableMessage.tsx","../src/Message/TableMessage/TbodyMessage.tsx","../src/Message/TableMessage/TdMessage.tsx","../src/Message/TableMessage/ThMessage.tsx","../src/Message/TableMessage/TheadMessage.tsx","../src/Message/TableMessage/TrMessage.tsx","../src/Message/TextMessage/TextMessage.tsx","../src/Message/UserFeedback/CloseButton.tsx","../src/Message/UserFeedback/UserFeedback.test.tsx","../src/Message/UserFeedback/UserFeedback.tsx","../src/Message/UserFeedback/UserFeedbackComplete.test.tsx","../src/Message/UserFeedback/UserFeedbackComplete.tsx","../src/MessageBar/AttachButton.test.tsx","../src/MessageBar/AttachButton.tsx","../src/MessageBar/MessageBar.test.tsx","../src/MessageBar/MessageBar.tsx","../src/MessageBar/MicrophoneButton.tsx","../src/MessageBar/SendButton.test.tsx","../src/MessageBar/SendButton.tsx","../src/MessageBar/StopButton.test.tsx","../src/MessageBar/StopButton.tsx","../src/MessageBar/index.ts","../src/MessageBox/JumpButton.test.tsx","../src/MessageBox/JumpButton.tsx","../src/MessageBox/MessageBox.test.tsx","../src/MessageBox/MessageBox.tsx","../src/MessageBox/index.ts","../src/MessageDivider/MessageDivider.test.tsx","../src/MessageDivider/MessageDivider.tsx","../src/MessageDivider/index.ts","../src/PreviewAttachment/PreviewAttachment.test.tsx","../src/PreviewAttachment/PreviewAttachment.tsx","../src/PreviewAttachment/index.ts","../src/ResponseActions/ResponseActionButton.test.tsx","../src/ResponseActions/ResponseActionButton.tsx","../src/ResponseActions/ResponseActions.test.tsx","../src/ResponseActions/ResponseActions.tsx","../src/ResponseActions/index.ts","../src/Settings/SettingsForm.test.tsx","../src/Settings/SettingsForm.tsx","../src/Settings/index.ts","../src/SourceDetailsMenuItem/SourceDetailsMenuItem.tsx","../src/SourceDetailsMenuItem/index.ts","../src/SourcesCard/SourcesCard.test.tsx","../src/SourcesCard/SourcesCard.tsx","../src/SourcesCard/index.ts","../src/SourcesCardBase/SourcesCardBase.test.tsx","../src/SourcesCardBase/SourcesCardBase.tsx","../src/SourcesCardBase/index.ts","../src/TermsOfUse/TermsOfUse.test.tsx","../src/TermsOfUse/TermsOfUse.tsx","../src/TermsOfUse/index.ts","../src/ToolCall/ToolCall.test.tsx","../src/ToolCall/ToolCall.tsx","../src/ToolCall/index.ts","../src/ToolResponse/ToolResponse.test.tsx","../src/ToolResponse/ToolResponse.tsx","../src/ToolResponse/index.ts","../src/__mocks__/monaco-editor.ts","../src/__mocks__/rehype-external-links.ts","../src/__mocks__/rehype-highlight.ts","../src/__mocks__/rehype-sanitize.ts","../src/__mocks__/rehype-unwrap-images.tsx","../src/tracking/console_tracking_provider.ts","../src/tracking/index.ts","../src/tracking/posthog_tracking_provider.ts","../src/tracking/segment_tracking_provider.ts","../src/tracking/trackingProviderProxy.ts","../src/tracking/tracking_api.ts","../src/tracking/tracking_registry.ts","../src/tracking/tracking_spi.ts","../src/tracking/umami_tracking_provider.ts"],"version":"5.6.3"}
+{"root":["../src/index.ts","../src/AttachMenu/AttachMenu.tsx","../src/AttachMenu/index.ts","../src/AttachmentEdit/AttachmentEdit.test.tsx","../src/AttachmentEdit/AttachmentEdit.tsx","../src/AttachmentEdit/index.ts","../src/Chatbot/Chatbot.test.tsx","../src/Chatbot/Chatbot.tsx","../src/Chatbot/index.ts","../src/ChatbotAlert/ChatbotAlert.test.tsx","../src/ChatbotAlert/ChatbotAlert.tsx","../src/ChatbotAlert/index.ts","../src/ChatbotContent/ChatbotContent.test.tsx","../src/ChatbotContent/ChatbotContent.tsx","../src/ChatbotContent/index.ts","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.test.tsx","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx","../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx","../src/ChatbotConversationHistoryNav/EmptyState.tsx","../src/ChatbotConversationHistoryNav/LoadingState.tsx","../src/ChatbotConversationHistoryNav/index.ts","../src/ChatbotFooter/ChatbotFooter.test.tsx","../src/ChatbotFooter/ChatbotFooter.tsx","../src/ChatbotFooter/ChatbotFooternote.test.tsx","../src/ChatbotFooter/ChatbotFootnote.tsx","../src/ChatbotFooter/index.ts","../src/ChatbotHeader/ChatbotHeader.test.tsx","../src/ChatbotHeader/ChatbotHeader.tsx","../src/ChatbotHeader/ChatbotHeaderActions.test.tsx","../src/ChatbotHeader/ChatbotHeaderActions.tsx","../src/ChatbotHeader/ChatbotHeaderCloseButton.test.tsx","../src/ChatbotHeader/ChatbotHeaderCloseButton.tsx","../src/ChatbotHeader/ChatbotHeaderMain.test.tsx","../src/ChatbotHeader/ChatbotHeaderMain.tsx","../src/ChatbotHeader/ChatbotHeaderMenu.test.tsx","../src/ChatbotHeader/ChatbotHeaderMenu.tsx","../src/ChatbotHeader/ChatbotHeaderNewChatButton.test.tsx","../src/ChatbotHeader/ChatbotHeaderNewChatButton.tsx","../src/ChatbotHeader/ChatbotHeaderOptionsDropdown.test.tsx","../src/ChatbotHeader/ChatbotHeaderOptionsDropdown.tsx","../src/ChatbotHeader/ChatbotHeaderSelectorDropdown.test.tsx","../src/ChatbotHeader/ChatbotHeaderSelectorDropdown.tsx","../src/ChatbotHeader/ChatbotHeaderTitle.test.tsx","../src/ChatbotHeader/ChatbotHeaderTitle.tsx","../src/ChatbotHeader/index.ts","../src/ChatbotModal/ChatbotModal.test.tsx","../src/ChatbotModal/ChatbotModal.tsx","../src/ChatbotModal/index.ts","../src/ChatbotPopover/ChatbotPopover.tsx","../src/ChatbotPopover/index.ts","../src/ChatbotToggle/ChatbotToggle.test.tsx","../src/ChatbotToggle/ChatbotToggle.tsx","../src/ChatbotToggle/index.ts","../src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.test.tsx","../src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.tsx","../src/ChatbotWelcomePrompt/index.ts","../src/CodeModal/CodeModal.test.tsx","../src/CodeModal/CodeModal.tsx","../src/CodeModal/index.ts","../src/Compare/Compare.test.tsx","../src/Compare/Compare.tsx","../src/Compare/index.ts","../src/DeepThinking/DeepThinking.test.tsx","../src/DeepThinking/DeepThinking.tsx","../src/DeepThinking/index.ts","../src/FileDetails/FileDetails.test.tsx","../src/FileDetails/FileDetails.tsx","../src/FileDetails/index.ts","../src/FileDetailsLabel/FileDetailsLabel.test.tsx","../src/FileDetailsLabel/FileDetailsLabel.tsx","../src/FileDetailsLabel/index.ts","../src/FileDropZone/FileDropZone.test.tsx","../src/FileDropZone/FileDropZone.tsx","../src/FileDropZone/index.ts","../src/FilePreview/FilePreview.test.tsx","../src/FilePreview/FilePreview.tsx","../src/FilePreview/index.ts","../src/ImagePreview/ImagePreview.test.tsx","../src/ImagePreview/ImagePreview.tsx","../src/ImagePreview/index.ts","../src/LoadingMessage/LoadingMessage.test.tsx","../src/LoadingMessage/LoadingMessage.tsx","../src/LoadingMessage/index.ts","../src/MarkdownContent/MarkdownContent.test.tsx","../src/MarkdownContent/MarkdownContent.tsx","../src/MarkdownContent/index.ts","../src/Message/Message.test.tsx","../src/Message/Message.tsx","../src/Message/MessageInput.tsx","../src/Message/MessageLoading.test.tsx","../src/Message/MessageLoading.tsx","../src/Message/index.ts","../src/Message/CodeBlockMessage/CodeBlockMessage.test.tsx","../src/Message/CodeBlockMessage/CodeBlockMessage.tsx","../src/Message/ErrorMessage/ErrorMessage.test.tsx","../src/Message/ErrorMessage/ErrorMessage.tsx","../src/Message/ImageMessage/ImageMessage.tsx","../src/Message/LinkMessage/LinkMessage.tsx","../src/Message/ListMessage/ListItemMessage.tsx","../src/Message/ListMessage/OrderedListMessage.tsx","../src/Message/ListMessage/UnorderedListMessage.tsx","../src/Message/MessageAndActions/MessageAndActions.test.tsx","../src/Message/MessageAndActions/MessageAndActions.tsx","../src/Message/MessageAndActions/index.ts","../src/Message/MessageAttachments/MessageAttachmentItem.test.tsx","../src/Message/MessageAttachments/MessageAttachmentItem.tsx","../src/Message/MessageAttachments/MessageAttachmentsContainer.test.tsx","../src/Message/MessageAttachments/MessageAttachmentsContainer.tsx","../src/Message/MessageAttachments/index.ts","../src/Message/Plugins/index.ts","../src/Message/Plugins/rehypeCodeBlockToggle.ts","../src/Message/Plugins/rehypeMoveImagesOutOfParagraphs.ts","../src/Message/QuickResponse/QuickResponse.test.tsx","../src/Message/QuickResponse/QuickResponse.tsx","../src/Message/QuickResponse/index.ts","../src/Message/QuickStarts/FallbackImg.tsx","../src/Message/QuickStarts/QuickStartTile.tsx","../src/Message/QuickStarts/QuickStartTileDescription.test.tsx","../src/Message/QuickStarts/QuickStartTileDescription.tsx","../src/Message/QuickStarts/QuickStartTileHeader.tsx","../src/Message/QuickStarts/index.ts","../src/Message/QuickStarts/monitor-sampleapp-quickstart-with-image.ts","../src/Message/QuickStarts/monitor-sampleapp-quickstart.ts","../src/Message/QuickStarts/types.ts","../src/Message/SuperscriptMessage/SuperscriptMessage.tsx","../src/Message/TableMessage/TableMessage.tsx","../src/Message/TableMessage/TbodyMessage.tsx","../src/Message/TableMessage/TdMessage.tsx","../src/Message/TableMessage/ThMessage.tsx","../src/Message/TableMessage/TheadMessage.tsx","../src/Message/TableMessage/TrMessage.tsx","../src/Message/TextMessage/TextMessage.tsx","../src/Message/UserFeedback/CloseButton.tsx","../src/Message/UserFeedback/UserFeedback.test.tsx","../src/Message/UserFeedback/UserFeedback.tsx","../src/Message/UserFeedback/UserFeedbackComplete.test.tsx","../src/Message/UserFeedback/UserFeedbackComplete.tsx","../src/Message/UserFeedback/index.ts","../src/MessageBar/AttachButton.test.tsx","../src/MessageBar/AttachButton.tsx","../src/MessageBar/MessageBar.test.tsx","../src/MessageBar/MessageBar.tsx","../src/MessageBar/MicrophoneButton.tsx","../src/MessageBar/SendButton.test.tsx","../src/MessageBar/SendButton.tsx","../src/MessageBar/StopButton.test.tsx","../src/MessageBar/StopButton.tsx","../src/MessageBar/index.ts","../src/MessageBox/JumpButton.test.tsx","../src/MessageBox/JumpButton.tsx","../src/MessageBox/MessageBox.test.tsx","../src/MessageBox/MessageBox.tsx","../src/MessageBox/index.ts","../src/MessageDivider/MessageDivider.test.tsx","../src/MessageDivider/MessageDivider.tsx","../src/MessageDivider/index.ts","../src/Onboarding/Onboarding.test.tsx","../src/Onboarding/Onboarding.tsx","../src/Onboarding/index.ts","../src/PreviewAttachment/PreviewAttachment.test.tsx","../src/PreviewAttachment/PreviewAttachment.tsx","../src/PreviewAttachment/index.ts","../src/ResponseActions/ResponseActionButton.test.tsx","../src/ResponseActions/ResponseActionButton.tsx","../src/ResponseActions/ResponseActions.test.tsx","../src/ResponseActions/ResponseActions.tsx","../src/ResponseActions/ResponseActionsGroups.test.tsx","../src/ResponseActions/ResponseActionsGroups.tsx","../src/ResponseActions/index.ts","../src/Settings/SettingsForm.test.tsx","../src/Settings/SettingsForm.tsx","../src/Settings/index.ts","../src/SourceDetailsMenuItem/SourceDetailsMenuItem.tsx","../src/SourceDetailsMenuItem/index.ts","../src/SourcesCard/SourcesCard.test.tsx","../src/SourcesCard/SourcesCard.tsx","../src/SourcesCard/index.ts","../src/SourcesCardBase/SourcesCardBase.test.tsx","../src/SourcesCardBase/SourcesCardBase.tsx","../src/SourcesCardBase/index.ts","../src/TermsOfUse/TermsOfUse.test.tsx","../src/TermsOfUse/TermsOfUse.tsx","../src/TermsOfUse/index.ts","../src/ToolCall/ToolCall.test.tsx","../src/ToolCall/ToolCall.tsx","../src/ToolCall/index.ts","../src/ToolResponse/ToolResponse.test.tsx","../src/ToolResponse/ToolResponse.tsx","../src/ToolResponse/index.ts","../src/__mocks__/monaco-editor.ts","../src/__mocks__/rehype-external-links.ts","../src/__mocks__/rehype-highlight.ts","../src/__mocks__/rehype-sanitize.ts","../src/__mocks__/rehype-unwrap-images.tsx","../src/tracking/console_tracking_provider.ts","../src/tracking/index.ts","../src/tracking/posthog_tracking_provider.ts","../src/tracking/segment_tracking_provider.ts","../src/tracking/trackingProviderProxy.ts","../src/tracking/tracking_api.ts","../src/tracking/tracking_registry.ts","../src/tracking/tracking_spi.ts","../src/tracking/umami_tracking_provider.ts"],"version":"5.6.3"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/chatbot",
-  "version": "6.5.0-prerelease.9",
+  "version": "6.5.0",
   "description": "This library provides React components based on PatternFly 6 that can be used to build chatbots.",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",
@@ -36,10 +36,10 @@
     "@patternfly/react-code-editor": "^6.1.0",
     "@patternfly/react-core": "^6.1.0",
     "@patternfly/react-icons": "^6.1.0",
+    "@patternfly/react-styles": "^6.1.0",
     "@patternfly/react-table": "^6.1.0",
     "@segment/analytics-next": "^1.76.0",
     "clsx": "^2.1.0",
-    "monaco-editor": "^0.54.0",
     "path-browserify": "^1.0.1",
     "posthog-js": "^1.194.4",
     "react-markdown": "^9.0.1",
@@ -51,12 +51,22 @@
     "unist-util-visit": "^5.0.0"
   },
   "peerDependencies": {
+    "@monaco-editor/react": "^4.7.0",
+    "monaco-editor": "^0.54.0",
     "react": "^18 || ^19",
     "react-dom": "^18 || ^19"
   },
+  "peerDependenciesMeta": {
+    "@monaco-editor/react": {
+      "optional": false
+    },
+    "monaco-editor": {
+      "optional": false
+    }
+  },
   "devDependencies": {
     "@octokit/rest": "^18.0.0",
-    "@patternfly/documentation-framework": "6.28.6",
+    "@patternfly/documentation-framework": "6.28.9",
     "@patternfly/patternfly": "^6.1.0",
     "@patternfly/patternfly-a11y": "^5.0.0",
     "@types/dom-speech-recognition": "^0.0.4",

package/patternfly-docs/content/extensions/chatbot/chatbot.md

@@ -0,0 +1,57 @@
+---
+id: Overview
+title: ChatBot overview
+section: extensions
+subsection: ChatBot
+sortValue: 1
+source: ChatBot
+---
+
+**Note:** The PatternFly ChatBot extension lives in its own package [`@patternfly/chatbot`](https://www.npmjs.com/package/@patternfly/chatbot).
+
+The PatternFly **ChatBot** extension contains a React implementation of an AI-focused chatbot, providing users with access to convenient and persistent help. This extension is intended to remain in alignment with our [AI principles and design guidelines](/ai/overview).
+
+*Only use this ChatBot when it adds value to your users' experiences.* Don't use it simply for the sake of novelty—it must directly help users reach their goals.
+
+---
+
+## How do I use ChatBot? 
+
+To get started:
+1. Install the `@patternfly/chatbot` package by following [the README instructions](https://github.com/patternfly/chatbot).
+2. To use a ChatBot component in your project, import the ChatBot and the  component you need. For example: `import ChatbotWelcomePrompt from '@patternfly/chatbot/dist/dynamic/ChatbotWelcomePrompt';`
+3. To build out and customize your ChatBot experience, refer to our extensive documentation on PatternFly.org.
+
+## What does a built-out ChatBot look like?
+
+To illustrate holistic ChatBot solutions, we offer these interactive demos: 
+- [Basic ChatBot](/extensions/chatbot/overview/demo#basic-chatbot): A standard ChatBot that can swap between display modes.
+- [Compact ChatBot](/extensions/chatbot/overview/demo#compact-chatbot): A compact version of a standard ChatBot that allows for more information density. 
+- [Embedded ChatBot](/extensions/chatbot/overview/demo#embedded-chatbot): A ChatBot experience that can be embedded into a page within an application.
+- [Inline drawer ChatBot](/extensions/chatbot/overview/demo#inline-drawer-chatbot): A ChatBot placed within a drawer that is inline with page content, rather than one that overlays the page.
+
+## How do I build a ChatBot for my product?
+
+To learn how to design ChatBot experiences, refer to [the design guidelines](/extensions/chatbot/overview/design-guidelines) and our [conversation design guidelines](/ai/conversation-design/).
+
+Explore our documentation, which covers both the components you'll need to build your ChatBot and the guidance to follow for different functionality:
+- UI: Structural, core components
+    - [Structural elements](/extensions/chatbot/ui#structure)
+    - [Toggle](/extensions/chatbot/ui#toggle)
+    - [Header](/extensions/chatbot/ui#header)
+    - [Footer](/extensions/chatbot/ui#footer)
+    - [Navigation](/extensions/chatbot/ui#navigation)
+    - [Modals](/extensions/chatbot/ui#modals)
+- Messages: Components that customize features related to the conversation  
+    - [Bot and user messages](/extensions/chatbot/messages)
+    - [File attachments](/extensions/chatbot/messages#file-attachments)
+- Patterns: More opinionated implementation solutions for common use cases
+    - [Primary color background](/extensions/chatbot/overview/demo#primary-color-background)
+    - [Display mode switcher](/extensions/chatbot/overview/demo#display-mode-switcher)
+    - [Chat transcripts](/extensions/chatbot/overview/demo#chat-transcripts)
+- [Analytics](/extensions/chatbot/analytics): Tracking for ChatBot interactions
+- [Customizing messages](/extensions/chatbot/customizing-messages): Details for the implementation of custom messages
+
+---
+
+We will continue to grow and evolve our ChatBot. If you notice a bug or have any suggestions, feel free to file an issue in our [GitHub repository!](https://github.com/patternfly/chatbot/issues) Make sure to check if there is already a pre-existing issue before creating a new one.

package/patternfly-docs/content/extensions/chatbot/design-guidelines.md

@@ -1,5 +1,5 @@
 ---
-section: PatternFly-AI
+section: extensions
 subsection: ChatBot
 id: Overview
 sortValue: 1
@@ -22,7 +22,7 @@ import "./images.css"
 1. **Attachments:** Details about files that a user has uploaded to the ChatBot.
 1. **Footer:** A persistent region at the bottom of the ChatBot window that contains the message bar and the footnote.
 1. **Footnote (optional):** A persistent, short message that contains any legal disclaimers or important information about the ChatBot. Footnotes are optional, but strongly recommended. More details can be found in the [footnote guidelines](#footnotes).
-1. **Toggle:** The button that allows users to open and close the ChatBot window. When the ChatBot is opened, the toggle should appear below the ChatBot window. The toggle shape and icon can be customized as needed, as shown in these [ChatBot toggle examples](/patternfly-ai/chatbot/ui#custom-toggle-icon). More details can be found in the [guidelines for accessing a ChatBot](#accessing-a-chatbot).
+1. **Toggle:** The button that allows users to open and close the ChatBot window. When the ChatBot is opened, the toggle should appear below the ChatBot window. The toggle shape and icon can be customized as needed, as shown in these [ChatBot toggle examples](/extensions/chatbot/ui#custom-toggle-icon). More details can be found in the [guidelines for accessing a ChatBot](#accessing-a-chatbot).
 
 ### Messages
 
@@ -37,7 +37,7 @@ import "./images.css"
 1. **Timestamp:** The relative or absolute time that a message was sent.
 1. **Label:** Labels ChatBot messages as "AI."
 1. **Quick responses:** Programmable, clickable actions that allow users to quickly answer questions from the ChatBot.
-1. **Message actions:** Actions that allow users to interact with a bot message. These typically include providing feedback, copying, sharing, or reading aloud, but [custom message actions](/patternfly-ai/chatbot/messages#custom-message-actions) are also supported. More details for the feedback actions can be found in the [message feedback](#message-feedback) section.
+1. **Message actions:** Actions that allow users to interact with a bot message. These typically include providing feedback, copying, sharing, or reading aloud, but [custom message actions](/extensions/chatbot/messages#custom-message-actions) are also supported. More details for the feedback actions can be found in the [message feedback](#message-feedback) section.
 
 #### Welcome message
 
@@ -77,7 +77,7 @@ Selecting the quick start title, or the "Start" link can be configured to launch
 
 ### Message actions 
 
-To allow users to interact with bot messages, utilize message actions. Refer to [the message actions React example](/patternfly-ai/chatbot/messages#message-actions) for an interactive visual.
+To allow users to interact with bot messages, utilize message actions. Refer to [the message actions React example](/extensions/chatbot/messages#message-actions) for an interactive visual.
 
 The following actions can be used for some of the most common interactions:
 
@@ -91,7 +91,7 @@ The following actions can be used for some of the most common interactions:
 1. **Download:** Downloads the chat message. [Learn more about downloading chat transcripts](#downloading-chat-transcripts).
 1. **Listen:** Reads the message content out loud.
 
-You can also use [custom message actions](/patternfly-ai/chatbot/messages#custom-message-actions) as needed for your particular use case. When using custom actions, be sure to add a tooltip that describes the effect that the action will have. For more information, view [our tooltips guidelines](/ux-writing/tooltips). 
+You can also use [custom message actions](/extensions/chatbot/messages#custom-message-actions) as needed for your particular use case. When using custom actions, be sure to add a tooltip that describes the effect that the action will have. For more information, view [our tooltips guidelines](/ux-writing/tooltips). 
 
 #### Message feedback
 
@@ -133,7 +133,7 @@ To message the ChatBot, users can type directly into the message bar in the foot
 1. **Use microphone button:** Supports speech recognition to allow users to use voice input. This feature is currently only available in Chrome and Safari.
 1. **Send button:** Allows users to send a typed message. This button should be disabled until a user has input text.
 
-When a user chooses to use speech input via the microphone button, the button will display a pulsing animation to indicate that the ChatBot is listening to the user (as shown in [this speech recognition example](/patternfly-ai/chatbot/ui#message-bar-with-speech-recognition-and-file-attachment)).
+When a user chooses to use speech input via the microphone button, the button will display a pulsing animation to indicate that the ChatBot is listening to the user (as shown in [this speech recognition example](/extensions/chatbot/ui#message-bar-with-speech-recognition-and-file-attachment)).
 
 <div class="ws-docs-content-img">
 ![Animation phases of the listening button in the message bar.](./img/listening-pulse.svg)
@@ -266,7 +266,7 @@ As much as possible, the suggested prompts should consider the user’s location
 
 Instead of automatically initiating what sounds like a request from a user, the ChatBot should ask users to confirm or deny their intent. This differentiates moments where users are simply asking about feasibility, rather than actually making a request.
 
-This can be done using the [quick response](/patternfly-ai/chatbot/messages#messages-with-quick-responses) buttons:
+This can be done using the [quick response](/extensions/chatbot/messages#messages-with-quick-responses) buttons:
 
 <div class="ws-docs-content-img">
 ![Confirmation options from a bot in response to a user's request.](./img/quick-response-confirmation.svg)
@@ -310,7 +310,7 @@ Within the settings menu, users can select their preferences for a variety of Ch
 
 ### Attaching files
 
-Using [the attach button](/patternfly-ai/chatbot/overview/design-guidelines#message-bar) in the message bar, users can [attach files](/patternfly-ai/chatbot/messages#file-attachments) to their message to share with the ChatBot.
+Using [the attach button](/extensions/chatbot/overview/design-guidelines#message-bar) in the message bar, users can [attach files](/extensions/chatbot/messages#file-attachments) to their message to share with the ChatBot.
 
 The attach button can follow a couple of patterns, including:
 
@@ -333,7 +333,7 @@ If a message attachment is successful, a label with the file details will be dis
 ![File attached to user message.](./img/attached-file.svg)
 </div>
 
-Users can select the file label to either preview or edit their attachment, as shown in these [attachment examples](/patternfly-ai/chatbot/messages#attachment-preview).
+Users can select the file label to either preview or edit their attachment, as shown in these [attachment examples](/extensions/chatbot/messages#attachment-preview).
 
 If a message attachment fails, an error message should share the reason for failure:
 
@@ -351,7 +351,7 @@ Choose the download action location that best works for your ChatBot:
 
 #### Download via conversation history drawer
 
-If your ChatBot uses a conversation history drawer, you can provide a download option in the [actions menu linked to a previous conversation](/patternfly-ai/chatbot/ui#drawer-with-conversation-actions).
+If your ChatBot uses a conversation history drawer, you can provide a download option in the [actions menu linked to a previous conversation](/extensions/chatbot/ui#drawer-with-conversation-actions).
 
 <div class="ws-docs-content-img">
 ![Expanded menu for previous chat in the history window, which shows a download option.](./img/download-chat-history.svg)
@@ -415,7 +415,7 @@ There are a few display modes that users can choose when interacting with a Chat
 
 ### Layouts
 
-ChatBot supports a side-by-side [comparison layout](/patternfly-ai/chatbot/overview/demo#comparing-chatbots), which allows users to compare 2 chats at once. This can be helpful to let users understand how different models respond to the same prompt.
+ChatBot supports a side-by-side [comparison layout](/extensions/chatbot/overview/demo#comparing-chatbots), which allows users to compare 2 chats at once. This can be helpful to let users understand how different models respond to the same prompt.
 
 <div class="ws-docs-content-img">
 ![2 ChatBots in comparison mode.](./img/comparison.svg)
@@ -429,7 +429,7 @@ Refer to the additional guidelines for [accessing a ChatBot](#accessing-a-chatbo
 
 ## Content considerations
 
-For guidance on writing ChatBot content, refer to our [conversation design guidelines](/patternfly-ai/conversation-design).
+For guidance on writing ChatBot content, refer to our [conversation design guidelines](/ai/conversation-design).
 
 ## Accessibility
 

package/patternfly-docs/content/extensions/chatbot/examples/Analytics/Analytics.md

@@ -1,7 +1,7 @@
 ---
 # Sidenav top-level section
 # should be the same for all markdown files
-section: PatternFly-AI
+section: extensions
 subsection: ChatBot
 # Sidenav secondary level section
 # should be the same for all markdown files

package/patternfly-docs/content/extensions/chatbot/examples/Customizing Messages/Customizing Messages.md

@@ -1,7 +1,7 @@
 ---
 # Sidenav top-level section
 # should be the same for all markdown files
-section: PatternFly-AI
+section: extensions
 subsection: ChatBot
 # Sidenav secondary level section
 # should be the same for all markdown files

package/patternfly-docs/content/extensions/chatbot/examples/Messages/BotMessage.tsx

@@ -318,6 +318,7 @@ _Italic text, formatted with single underscores_
         content="This bot has a square avatar. You can further customize the avatar by applying an additional class or passing [PatternFly avatar props](/components/avatar) to the `<Message>` component via `avatarProps`."
         hasRoundAvatar={false}
       />
+      <Message name="Bot" role="bot" content="This is a message from a bot with no avatar." />
       <Select
         id="single-select"
         isOpen={isOpen}