@patternfly/chatbot 6.5.0-prerelease.9 → 6.6.0-prerelease.1

package/dist/cjs/Message/ErrorMessage/ErrorMessage.js

@@ -11,13 +11,15 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.ErrorMessage = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 // ============================================================================
 // Chatbot Main - Message - Content - Error
 // ============================================================================
 const react_core_1 = require("@patternfly/react-core");
 const ErrorMessage = (_a) => {
-    var { title, actionLinks, children } = _a, props = __rest(_a, ["title", "actionLinks", "children"]);
-    return ((0, jsx_runtime_1.jsx)(react_core_1.Alert, Object.assign({ isInline: true, variant: "danger", title: title, actionLinks: actionLinks }, props, { children: children })));
+    var { title, actionLinks, children, className } = _a, props = __rest(_a, ["title", "actionLinks", "children", "className"]);
+    return ((0, jsx_runtime_1.jsx)(react_core_1.Alert, Object.assign({ isInline: true, variant: "danger", title: title, actionLinks: actionLinks, className: className }, props, { children: children })));
 };
-exports.default = ErrorMessage;
+exports.ErrorMessage = ErrorMessage;
+exports.default = exports.ErrorMessage;

package/dist/cjs/Message/ErrorMessage/ErrorMessage.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';

package/dist/cjs/Message/ErrorMessage/ErrorMessage.test.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("@testing-library/react");
+require("@testing-library/jest-dom");
+const ErrorMessage_1 = __importDefault(require("./ErrorMessage"));
+test('Renders with title', () => {
+    (0, react_1.render)((0, jsx_runtime_1.jsx)(ErrorMessage_1.default, { title: "Error occurred" }));
+    expect(react_1.screen.getByText('Error occurred')).toBeVisible();
+});
+test('Renders with children', () => {
+    (0, react_1.render)((0, jsx_runtime_1.jsx)(ErrorMessage_1.default, { title: "Error occurred", children: "This is the error message body" }));
+    expect(react_1.screen.getByText('This is the error message body')).toBeVisible();
+});
+test('Renders with action links', () => {
+    const actionLinks = ((0, jsx_runtime_1.jsx)("a", { href: "#retry", "data-testid": "retry-link", children: "Retry action link" }));
+    (0, react_1.render)((0, jsx_runtime_1.jsx)(ErrorMessage_1.default, { title: "Error occurred", actionLinks: actionLinks }));
+    expect(react_1.screen.getByText('Retry action link')).toBeVisible();
+});
+test('Renders with custom className', () => {
+    (0, react_1.render)((0, jsx_runtime_1.jsx)(ErrorMessage_1.default, { title: "Error occurred", className: "custom-error-class" }));
+    expect(react_1.screen.getByText('Error occurred').parentElement).toHaveClass('custom-error-class');
+});
+test('Renders with spread props', () => {
+    (0, react_1.render)((0, jsx_runtime_1.jsx)(ErrorMessage_1.default, { title: "Error occurred", id: "test-error-id" }));
+    expect(react_1.screen.getByText('Error occurred').parentElement).toHaveAttribute('id', 'test-error-id');
+});

package/dist/cjs/Message/LinkMessage/LinkMessage.d.ts

@@ -1,4 +1,8 @@
 import { ButtonProps } from '@patternfly/react-core';
 import { ExtraProps } from 'react-markdown';
-declare const LinkMessage: ({ children, target, href, id, ...props }: ButtonProps & ExtraProps) => import("react/jsx-runtime").JSX.Element;
+export interface LinkMessageProps {
+    /** Flag indicating that the content should retain message styles when using Markdown. */
+    shouldRetainStyles?: boolean;
+}
+declare const LinkMessage: ({ children, target, href, id, shouldRetainStyles, ...props }: LinkMessageProps & ButtonProps & ExtraProps) => import("react/jsx-runtime").JSX.Element;
 export default LinkMessage;

package/dist/cjs/Message/LinkMessage/LinkMessage.js

@@ -17,15 +17,16 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 // ============================================================================
 const react_core_1 = require("@patternfly/react-core");
 const react_icons_1 = require("@patternfly/react-icons");
+const react_styles_1 = require("@patternfly/react-styles");
 const LinkMessage = (_a) => {
-    var { children, target, href, id } = _a, props = __rest(_a, ["children", "target", "href", "id"]);
+    var { children, target, href, id, shouldRetainStyles } = _a, props = __rest(_a, ["children", "target", "href", "id", "shouldRetainStyles"]);
     if (target === '_blank') {
         return ((0, jsx_runtime_1.jsx)(react_core_1.Button, Object.assign({ component: "a", variant: "link", href: href, icon: (0, jsx_runtime_1.jsx)(react_icons_1.ExternalLinkSquareAltIcon, {}), iconPosition: "end", isInline: true, target: target, 
             // need to explicitly call this out or id doesn't seem to get passed - required for footnotes
-            id: id }, props, { children: children })));
+            id: id }, props, { className: (0, react_styles_1.css)(shouldRetainStyles && 'pf-m-markdown', props === null || props === void 0 ? void 0 : props.className), children: children })));
     }
     return (
     // need to explicitly call this out or id doesn't seem to get passed - required for footnotes
-    (0, jsx_runtime_1.jsx)(react_core_1.Button, Object.assign({ isInline: true, component: "a", href: href, variant: "link", id: id }, props, { children: children })));
+    (0, jsx_runtime_1.jsx)(react_core_1.Button, Object.assign({ isInline: true, component: "a", href: href, variant: "link", id: id }, props, { className: (0, react_styles_1.css)(shouldRetainStyles && 'pf-m-markdown', props === null || props === void 0 ? void 0 : props.className), children: children })));
 };
 exports.default = LinkMessage;

package/dist/cjs/Message/ListMessage/OrderedListMessage.d.ts

@@ -1,3 +1,11 @@
 import { ExtraProps } from 'react-markdown';
-declare const OrderedListMessage: ({ children, start }: JSX.IntrinsicElements["ol"] & ExtraProps) => import("react/jsx-runtime").JSX.Element;
+export interface OrderedListMessageProps {
+    /** The ordered list content */
+    children?: React.ReactNode;
+    /** The number to start the ordered list at. */
+    start?: number;
+    /** Flag indicating that the content should retain message styles when using Markdown. */
+    shouldRetainStyles?: boolean;
+}
+declare const OrderedListMessage: ({ children, start, shouldRetainStyles }: OrderedListMessageProps & JSX.IntrinsicElements["ol"] & ExtraProps) => import("react/jsx-runtime").JSX.Element;
 export default OrderedListMessage;

package/dist/cjs/Message/ListMessage/OrderedListMessage.js

@@ -2,5 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_core_1 = require("@patternfly/react-core");
-const OrderedListMessage = ({ children, start }) => ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-ordered-list", children: (0, jsx_runtime_1.jsx)(react_core_1.List, { component: react_core_1.ListComponent.ol, type: react_core_1.OrderType.number, start: start, children: children }) }));
+const react_styles_1 = require("@patternfly/react-styles");
+const OrderedListMessage = ({ children, start, shouldRetainStyles }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, react_styles_1.css)('pf-chatbot__message-ordered-list', shouldRetainStyles && 'pf-m-markdown'), children: (0, jsx_runtime_1.jsx)(react_core_1.List, { component: react_core_1.ListComponent.ol, type: react_core_1.OrderType.number, start: start, children: children }) }));
 exports.default = OrderedListMessage;

package/dist/cjs/Message/ListMessage/UnorderedListMessage.d.ts

@@ -1,3 +1,9 @@
 import { ExtraProps } from 'react-markdown';
-declare const UnorderedListMessage: ({ children }: JSX.IntrinsicElements["ul"] & ExtraProps) => import("react/jsx-runtime").JSX.Element;
+export interface UnrderedListMessageProps {
+    /** The ordered list content */
+    children?: React.ReactNode;
+    /** Flag indicating that the content should retain message styles when using Markdown. */
+    shouldRetainStyles?: boolean;
+}
+declare const UnorderedListMessage: ({ children, shouldRetainStyles }: UnrderedListMessageProps & JSX.IntrinsicElements["ul"] & ExtraProps) => import("react/jsx-runtime").JSX.Element;
 export default UnorderedListMessage;

package/dist/cjs/Message/ListMessage/UnorderedListMessage.js

@@ -2,5 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const jsx_runtime_1 = require("react/jsx-runtime");
 const react_core_1 = require("@patternfly/react-core");
-const UnorderedListMessage = ({ children }) => ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-unordered-list", children: (0, jsx_runtime_1.jsx)(react_core_1.List, { children: children }) }));
+const react_styles_1 = require("@patternfly/react-styles");
+const UnorderedListMessage = ({ children, shouldRetainStyles }) => ((0, jsx_runtime_1.jsx)("div", { className: (0, react_styles_1.css)('pf-chatbot__message-unordered-list', shouldRetainStyles && 'pf-m-markdown'), children: (0, jsx_runtime_1.jsx)(react_core_1.List, { children: children }) }));
 exports.default = UnorderedListMessage;

package/dist/cjs/Message/Message.d.ts

@@ -42,6 +42,8 @@ export interface MessageExtraContent {
     endContent?: ReactNode;
 }
 export interface MessageProps extends Omit<HTMLProps<HTMLDivElement>, 'role'> {
+    /** Children to render instead of the default message structure, allowing more fine-tuned message control. When provided, this will override the default rendering of content, toolResponse, deepThinking, toolCall, sources, quickStarts, actions, etc. */
+    children?: ReactNode;
     /** Unique id for message */
     id?: string;
     /** Role of the user sending the message */
@@ -53,17 +55,32 @@ export interface MessageProps extends Omit<HTMLProps<HTMLDivElement>, 'role'> {
     /** Name of the user */
     name?: string;
     /** Avatar src for the user */
-    avatar: string;
+    avatar?: string;
     /** Timestamp for the message */
     timestamp?: string;
     /** Set this to true if message is being loaded */
     isLoading?: boolean;
     /** Array of attachments attached to a message */
     attachments?: MessageAttachment[];
-    /** Props for message actions, such as feedback (positive or negative), copy button, edit message, share, and listen */
+    /** Props for message actions, such as feedback (positive or negative), copy button, edit message, share, and listen.
+     * Can be a single actions object or an array of action group objects. When passing an array, you can pass an object of actions or
+     * an object that contains an actions property for finer control of selection persistence.
+     */
     actions?: {
         [key: string]: ActionProps;
-    };
+    } | {
+        [key: string]: ActionProps;
+    }[] | {
+        actions: {
+            [key: string]: ActionProps;
+        };
+        persistActionSelection?: boolean;
+    }[];
+    /** When true, the selected action will persist even when clicking outside the component.
+     * When false (default), clicking outside or clicking another action will deselect the current selection.
+     * For finer control of multiple action groups, use persistActionSelection on each group.
+     */
+    persistActionSelection?: boolean;
     /** Sources for message */
     sources?: SourcesCardProps;
     /** Label for the English word "AI," used to tag messages with role "bot" */

package/dist/cjs/Message/Message.js

@@ -20,57 +20,30 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 // Chatbot Main - Message
 // ============================================================================
 const react_1 = require("react");
-const react_markdown_1 = __importDefault(require("react-markdown"));
-const remark_gfm_1 = __importDefault(require("remark-gfm"));
 const react_core_1 = require("@patternfly/react-core");
 const MessageLoading_1 = __importDefault(require("./MessageLoading"));
-const CodeBlockMessage_1 = __importDefault(require("./CodeBlockMessage/CodeBlockMessage"));
-const TextMessage_1 = __importDefault(require("./TextMessage/TextMessage"));
 const FileDetailsLabel_1 = __importDefault(require("../FileDetailsLabel/FileDetailsLabel"));
 const ResponseActions_1 = __importDefault(require("../ResponseActions/ResponseActions"));
 const SourcesCard_1 = __importDefault(require("../SourcesCard"));
-const ListItemMessage_1 = __importDefault(require("./ListMessage/ListItemMessage"));
-const UnorderedListMessage_1 = __importDefault(require("./ListMessage/UnorderedListMessage"));
-const OrderedListMessage_1 = __importDefault(require("./ListMessage/OrderedListMessage"));
 const QuickStartTile_1 = __importDefault(require("./QuickStarts/QuickStartTile"));
 const QuickResponse_1 = __importDefault(require("./QuickResponse/QuickResponse"));
 const UserFeedback_1 = __importDefault(require("./UserFeedback/UserFeedback"));
 const UserFeedbackComplete_1 = __importDefault(require("./UserFeedback/UserFeedbackComplete"));
-const TableMessage_1 = __importDefault(require("./TableMessage/TableMessage"));
-const TrMessage_1 = __importDefault(require("./TableMessage/TrMessage"));
-const TdMessage_1 = __importDefault(require("./TableMessage/TdMessage"));
-const TbodyMessage_1 = __importDefault(require("./TableMessage/TbodyMessage"));
-const TheadMessage_1 = __importDefault(require("./TableMessage/TheadMessage"));
-const ThMessage_1 = __importDefault(require("./TableMessage/ThMessage"));
-const ImageMessage_1 = __importDefault(require("./ImageMessage/ImageMessage"));
-const rehype_unwrap_images_1 = __importDefault(require("rehype-unwrap-images"));
-const rehype_external_links_1 = __importDefault(require("rehype-external-links"));
-const rehype_sanitize_1 = __importDefault(require("rehype-sanitize"));
-const rehype_highlight_1 = __importDefault(require("rehype-highlight"));
 // see the full list of styles here: https://highlightjs.org/examples
 require("highlight.js/styles/vs2015.css");
-const LinkMessage_1 = __importDefault(require("./LinkMessage/LinkMessage"));
 const ErrorMessage_1 = __importDefault(require("./ErrorMessage/ErrorMessage"));
 const MessageInput_1 = __importDefault(require("./MessageInput"));
-const rehypeMoveImagesOutOfParagraphs_1 = require("./Plugins/rehypeMoveImagesOutOfParagraphs");
 const ToolResponse_1 = __importDefault(require("../ToolResponse"));
 const DeepThinking_1 = __importDefault(require("../DeepThinking"));
-const SuperscriptMessage_1 = __importDefault(require("./SuperscriptMessage/SuperscriptMessage"));
 const ToolCall_1 = __importDefault(require("../ToolCall"));
+const MarkdownContent_1 = __importDefault(require("../MarkdownContent"));
 const MessageBase = (_a) => {
-    var { role, content, extraContent, name, avatar, timestamp, isLoading, actions, sources, botWord = 'AI', loadingWord = 'Loading message', codeBlockProps, quickResponses, quickResponseContainerProps = { numLabels: 5 }, attachments, hasRoundAvatar = true, avatarProps, quickStarts, userFeedbackForm, userFeedbackComplete, isLiveRegion = true, innerRef, tableProps, openLinkInNewTab = true, additionalRehypePlugins = [], additionalRemarkPlugins = [], linkProps, error, isEditable, editPlaceholder = 'Edit prompt message...', updateWord = 'Update', cancelWord = 'Cancel', onEditUpdate, onEditCancel, inputRef, editFormProps, isCompact, isMarkdownDisabled, reactMarkdownProps, toolResponse, deepThinking, remarkGfmProps, toolCall, hasNoImagesInUserMessages = true, isPrimary } = _a, props = __rest(_a, ["role", "content", "extraContent", "name", "avatar", "timestamp", "isLoading", "actions", "sources", "botWord", "loadingWord", "codeBlockProps", "quickResponses", "quickResponseContainerProps", "attachments", "hasRoundAvatar", "avatarProps", "quickStarts", "userFeedbackForm", "userFeedbackComplete", "isLiveRegion", "innerRef", "tableProps", "openLinkInNewTab", "additionalRehypePlugins", "additionalRemarkPlugins", "linkProps", "error", "isEditable", "editPlaceholder", "updateWord", "cancelWord", "onEditUpdate", "onEditCancel", "inputRef", "editFormProps", "isCompact", "isMarkdownDisabled", "reactMarkdownProps", "toolResponse", "deepThinking", "remarkGfmProps", "toolCall", "hasNoImagesInUserMessages", "isPrimary"]);
+    var { children, role, content, extraContent, name, avatar, timestamp, isLoading, actions, persistActionSelection, sources, botWord = 'AI', loadingWord = 'Loading message', codeBlockProps, quickResponses, quickResponseContainerProps = { numLabels: 5 }, attachments, hasRoundAvatar = true, avatarProps, quickStarts, userFeedbackForm, userFeedbackComplete, isLiveRegion = true, innerRef, tableProps, openLinkInNewTab = true, additionalRehypePlugins = [], additionalRemarkPlugins = [], linkProps, error, isEditable, editPlaceholder = 'Edit prompt message...', updateWord = 'Update', cancelWord = 'Cancel', onEditUpdate, onEditCancel, inputRef, editFormProps, isCompact, isMarkdownDisabled, reactMarkdownProps, toolResponse, deepThinking, remarkGfmProps, toolCall, hasNoImagesInUserMessages = true, isPrimary } = _a, props = __rest(_a, ["children", "role", "content", "extraContent", "name", "avatar", "timestamp", "isLoading", "actions", "persistActionSelection", "sources", "botWord", "loadingWord", "codeBlockProps", "quickResponses", "quickResponseContainerProps", "attachments", "hasRoundAvatar", "avatarProps", "quickStarts", "userFeedbackForm", "userFeedbackComplete", "isLiveRegion", "innerRef", "tableProps", "openLinkInNewTab", "additionalRehypePlugins", "additionalRemarkPlugins", "linkProps", "error", "isEditable", "editPlaceholder", "updateWord", "cancelWord", "onEditUpdate", "onEditCancel", "inputRef", "editFormProps", "isCompact", "isMarkdownDisabled", "reactMarkdownProps", "toolResponse", "deepThinking", "remarkGfmProps", "toolCall", "hasNoImagesInUserMessages", "isPrimary"]);
     const [messageText, setMessageText] = (0, react_1.useState)(content);
     (0, react_1.useEffect)(() => {
         setMessageText(content);
     }, [content]);
     const { beforeMainContent, afterMainContent, endContent } = extraContent || {};
-    let rehypePlugins = [rehype_unwrap_images_1.default, rehypeMoveImagesOutOfParagraphs_1.rehypeMoveImagesOutOfParagraphs, rehype_highlight_1.default];
-    if (openLinkInNewTab) {
-        rehypePlugins = rehypePlugins.concat([[rehype_external_links_1.default, { target: '_blank' }, rehype_sanitize_1.default]]);
-    }
-    if (additionalRehypePlugins) {
-        rehypePlugins.push(...additionalRehypePlugins);
-    }
     let avatarClassName;
     if (avatarProps && 'className' in avatarProps) {
         const { className } = avatarProps, rest = __rest(avatarProps, ["className"]);
@@ -80,133 +53,7 @@ const MessageBase = (_a) => {
     // Keep timestamps consistent between Timestamp component and aria-label
     const date = new Date();
     const dateString = timestamp !== null && timestamp !== void 0 ? timestamp : `${date.toLocaleDateString()} ${date.toLocaleTimeString()}`;
-    const disallowedElements = role === 'user' && hasNoImagesInUserMessages ? ['img'] : [];
-    if (reactMarkdownProps && reactMarkdownProps.disallowedElements) {
-        disallowedElements.push(...reactMarkdownProps.disallowedElements);
-    }
-    const handleMarkdown = () => {
-        if (isMarkdownDisabled) {
-            return ((0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.p }, props, { children: messageText })));
-        }
-        return ((0, jsx_runtime_1.jsx)(react_markdown_1.default, Object.assign({ components: {
-                section: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)("section", Object.assign({}, rest, { className: `pf-chatbot__message-text ${rest === null || rest === void 0 ? void 0 : rest.className}` }));
-                },
-                p: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.p }, rest, { isPrimary: isPrimary }));
-                },
-                code: (_a) => {
-                    var { children } = _a, props = __rest(_a, ["children"]);
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, codeProps = __rest(props, ["node"]);
-                    return ((0, jsx_runtime_1.jsx)(CodeBlockMessage_1.default, Object.assign({}, codeProps, codeBlockProps, { isPrimary: isPrimary, children: children })));
-                },
-                h1: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.h1 }, rest));
-                },
-                h2: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.h2 }, rest));
-                },
-                h3: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.h3 }, rest));
-                },
-                h4: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.h4 }, rest));
-                },
-                h5: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.h5 }, rest));
-                },
-                h6: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.h6 }, rest));
-                },
-                blockquote: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.blockquote }, rest));
-                },
-                ul: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(UnorderedListMessage_1.default, Object.assign({}, rest));
-                },
-                ol: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(OrderedListMessage_1.default, Object.assign({}, rest));
-                },
-                li: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(ListItemMessage_1.default, Object.assign({}, rest));
-                },
-                // table requires node attribute for calculating headers for mobile breakpoint
-                table: (props) => (0, jsx_runtime_1.jsx)(TableMessage_1.default, Object.assign({}, props, tableProps, { isPrimary: isPrimary })),
-                tbody: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TbodyMessage_1.default, Object.assign({}, rest));
-                },
-                thead: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TheadMessage_1.default, Object.assign({}, rest));
-                },
-                tr: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(TrMessage_1.default, Object.assign({}, rest));
-                },
-                td: (props) => {
-                    // Conflicts with Td type
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node, width } = props, rest = __rest(props, ["node", "width"]);
-                    return (0, jsx_runtime_1.jsx)(TdMessage_1.default, Object.assign({}, rest));
-                },
-                th: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(ThMessage_1.default, Object.assign({}, rest));
-                },
-                img: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(ImageMessage_1.default, Object.assign({}, rest));
-                },
-                a: (props) => {
-                    // node is just the details of the document structure - not needed
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (
-                    // some a types conflict with ButtonProps, but it's ok because we are using an a tag
-                    // there are too many to handle manually
-                    (0, jsx_runtime_1.jsx)(LinkMessage_1.default, Object.assign({}, rest, linkProps, { children: props.children })));
-                },
-                // used for footnotes
-                sup: (props) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-                    const { node } = props, rest = __rest(props, ["node"]);
-                    return (0, jsx_runtime_1.jsx)(SuperscriptMessage_1.default, Object.assign({}, rest));
-                }
-            }, remarkPlugins: [[remark_gfm_1.default, Object.assign({}, remarkGfmProps)], ...additionalRemarkPlugins], rehypePlugins: rehypePlugins }, reactMarkdownProps, { remarkRehypeOptions: Object.assign({ 
-                // removes sr-only class from footnote labels applied by default
-                footnoteLabelProperties: { className: [''] } }, reactMarkdownProps === null || reactMarkdownProps === void 0 ? void 0 : reactMarkdownProps.remarkRehypeOptions), disallowedElements: disallowedElements, children: messageText })));
-    };
+    const handleMarkdown = () => ((0, jsx_runtime_1.jsx)(MarkdownContent_1.default, { content: messageText, isMarkdownDisabled: isMarkdownDisabled, codeBlockProps: codeBlockProps, tableProps: tableProps, openLinkInNewTab: openLinkInNewTab, additionalRehypePlugins: additionalRehypePlugins, additionalRemarkPlugins: additionalRemarkPlugins, linkProps: linkProps, reactMarkdownProps: reactMarkdownProps, remarkGfmProps: remarkGfmProps, hasNoImages: role === 'user' && hasNoImagesInUserMessages, isPrimary: isPrimary }));
     const renderMessage = () => {
         if (isLoading) {
             return (0, jsx_runtime_1.jsx)(MessageLoading_1.default, { loadingWord: loadingWord, isPrimary: isPrimary });
@@ -219,10 +66,10 @@ const MessageBase = (_a) => {
         }
         return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [beforeMainContent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: beforeMainContent }), error ? (0, jsx_runtime_1.jsx)(ErrorMessage_1.default, Object.assign({}, error)) : handleMarkdown()] }));
     };
-    return ((0, jsx_runtime_1.jsxs)("section", Object.assign({ "aria-label": `Message from ${role} - ${dateString}`, className: `pf-chatbot__message pf-chatbot__message--${role}`, "aria-live": isLiveRegion ? 'polite' : undefined, "aria-atomic": isLiveRegion ? false : undefined, ref: innerRef }, props, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Avatar, Object.assign({ className: `pf-chatbot__message-avatar ${hasRoundAvatar ? 'pf-chatbot__message-avatar--round' : ''} ${avatarClassName ? avatarClassName : ''}`, src: avatar, alt: "" }, avatarProps)), (0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__message-contents", children: [(0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__message-meta", children: [name && ((0, jsx_runtime_1.jsx)("span", { className: "pf-chatbot__message-name", children: (0, jsx_runtime_1.jsx)(react_core_1.Truncate, { content: name }) })), role === 'bot' && ((0, jsx_runtime_1.jsx)(react_core_1.Label, { variant: "outline", isCompact: true, children: botWord })), (0, jsx_runtime_1.jsx)(react_core_1.Timestamp, { date: date, children: timestamp })] }), (0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__message-response", children: [(0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__message-and-actions", children: [renderMessage(), afterMainContent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: afterMainContent }), toolResponse && (0, jsx_runtime_1.jsx)(ToolResponse_1.default, Object.assign({}, toolResponse)), deepThinking && (0, jsx_runtime_1.jsx)(DeepThinking_1.default, Object.assign({}, deepThinking)), toolCall && (0, jsx_runtime_1.jsx)(ToolCall_1.default, Object.assign({}, toolCall)), !isLoading && sources && (0, jsx_runtime_1.jsx)(SourcesCard_1.default, Object.assign({}, sources, { isCompact: isCompact })), quickStarts && quickStarts.quickStart && ((0, jsx_runtime_1.jsx)(QuickStartTile_1.default, { quickStart: quickStarts.quickStart, onSelectQuickStart: quickStarts.onSelectQuickStart, minuteWord: quickStarts.minuteWord, minuteWordPlural: quickStarts.minuteWordPlural, prerequisiteWord: quickStarts.prerequisiteWord, prerequisiteWordPlural: quickStarts.prerequisiteWordPlural, quickStartButtonAriaLabel: quickStarts.quickStartButtonAriaLabel, isCompact: isCompact })), !isLoading && !isEditable && actions && (0, jsx_runtime_1.jsx)(ResponseActions_1.default, { actions: actions }), userFeedbackForm && (0, jsx_runtime_1.jsx)(UserFeedback_1.default, Object.assign({}, userFeedbackForm, { timestamp: dateString, isCompact: isCompact })), userFeedbackComplete && ((0, jsx_runtime_1.jsx)(UserFeedbackComplete_1.default, Object.assign({}, userFeedbackComplete, { timestamp: dateString, isCompact: isCompact }))), !isLoading && quickResponses && ((0, jsx_runtime_1.jsx)(QuickResponse_1.default, { quickResponses: quickResponses, quickResponseContainerProps: quickResponseContainerProps, isCompact: isCompact }))] }), attachments && ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-attachments-container", children: attachments.map((attachment) => {
-                                    var _a;
-                                    return ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-attachment", children: (0, jsx_runtime_1.jsx)(FileDetailsLabel_1.default, { fileName: attachment.name, fileId: attachment.id, onClose: attachment.onClose, onClick: attachment.onClick, isLoading: attachment.isLoading, closeButtonAriaLabel: attachment.closeButtonAriaLabel, languageTestId: attachment.languageTestId, spinnerTestId: attachment.spinnerTestId, variant: isPrimary ? 'outline' : undefined }) }, (_a = attachment.id) !== null && _a !== void 0 ? _a : attachment.name));
-                                }) })), !isLoading && endContent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: endContent })] })] })] })));
+    return ((0, jsx_runtime_1.jsxs)("section", Object.assign({ "aria-label": `Message from ${role} - ${dateString}`, className: `pf-chatbot__message pf-chatbot__message--${role}`, "aria-live": isLiveRegion ? 'polite' : undefined, "aria-atomic": isLiveRegion ? false : undefined, ref: innerRef }, props, { children: [avatar && ((0, jsx_runtime_1.jsx)(react_core_1.Avatar, Object.assign({ className: `pf-chatbot__message-avatar ${hasRoundAvatar ? 'pf-chatbot__message-avatar--round' : ''} ${avatarClassName ? avatarClassName : ''}`, src: avatar, alt: "" }, avatarProps))), (0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__message-contents", children: [(0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__message-meta", children: [name && ((0, jsx_runtime_1.jsx)("span", { className: "pf-chatbot__message-name", children: (0, jsx_runtime_1.jsx)(react_core_1.Truncate, { content: name }) })), role === 'bot' && ((0, jsx_runtime_1.jsx)(react_core_1.Label, { variant: "outline", isCompact: true, children: botWord })), (0, jsx_runtime_1.jsx)(react_core_1.Timestamp, { date: date, children: timestamp })] }), (0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-response", children: children ? ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__message-and-actions", children: [renderMessage(), afterMainContent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: afterMainContent }), toolResponse && (0, jsx_runtime_1.jsx)(ToolResponse_1.default, Object.assign({}, toolResponse)), deepThinking && (0, jsx_runtime_1.jsx)(DeepThinking_1.default, Object.assign({}, deepThinking)), toolCall && (0, jsx_runtime_1.jsx)(ToolCall_1.default, Object.assign({}, toolCall)), !isLoading && sources && (0, jsx_runtime_1.jsx)(SourcesCard_1.default, Object.assign({}, sources, { isCompact: isCompact })), quickStarts && quickStarts.quickStart && ((0, jsx_runtime_1.jsx)(QuickStartTile_1.default, { quickStart: quickStarts.quickStart, onSelectQuickStart: quickStarts.onSelectQuickStart, minuteWord: quickStarts.minuteWord, minuteWordPlural: quickStarts.minuteWordPlural, prerequisiteWord: quickStarts.prerequisiteWord, prerequisiteWordPlural: quickStarts.prerequisiteWordPlural, quickStartButtonAriaLabel: quickStarts.quickStartButtonAriaLabel, isCompact: isCompact })), !isLoading && !isEditable && actions && ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Array.isArray(actions) ? ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__response-actions-groups", children: actions.map((actionGroup, index) => ((0, jsx_runtime_1.jsx)(ResponseActions_1.default, { actions: actionGroup.actions || actionGroup, persistActionSelection: persistActionSelection || actionGroup.persistActionSelection }, index))) })) : ((0, jsx_runtime_1.jsx)(ResponseActions_1.default, { actions: actions, persistActionSelection: persistActionSelection })) })), userFeedbackForm && ((0, jsx_runtime_1.jsx)(UserFeedback_1.default, Object.assign({}, userFeedbackForm, { timestamp: dateString, isCompact: isCompact }))), userFeedbackComplete && ((0, jsx_runtime_1.jsx)(UserFeedbackComplete_1.default, Object.assign({}, userFeedbackComplete, { timestamp: dateString, isCompact: isCompact }))), !isLoading && quickResponses && ((0, jsx_runtime_1.jsx)(QuickResponse_1.default, { quickResponses: quickResponses, quickResponseContainerProps: quickResponseContainerProps, isCompact: isCompact }))] }), attachments && ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-attachments-container", children: attachments.map((attachment) => {
+                                        var _a;
+                                        return ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-attachment", children: (0, jsx_runtime_1.jsx)(FileDetailsLabel_1.default, { fileName: attachment.name, fileId: attachment.id, onClose: attachment.onClose, onClick: attachment.onClick, isLoading: attachment.isLoading, closeButtonAriaLabel: attachment.closeButtonAriaLabel, languageTestId: attachment.languageTestId, spinnerTestId: attachment.spinnerTestId, variant: isPrimary ? 'outline' : undefined }) }, (_a = attachment.id) !== null && _a !== void 0 ? _a : attachment.name));
+                                    }) })), !isLoading && endContent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: endContent })] })) })] })] })));
 };
 exports.MessageBase = MessageBase;
 const Message = (0, react_1.forwardRef)((props, ref) => ((0, jsx_runtime_1.jsx)(exports.MessageBase, Object.assign({ innerRef: ref }, props))));

package/dist/cjs/Message/Message.test.js

@@ -209,6 +209,10 @@ describe('Message', () => {
         (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./testImg", role: "bot", name: "Bot", content: "Hi" }));
         expect(react_2.screen.getByRole('img')).toHaveAttribute('src', './testImg');
     });
+    it('should not render avatar if no avatar prop is passed', () => {
+        (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { role: "bot", name: "Bot", content: "Hi" }));
+        expect(react_2.screen.queryByRole('img')).not.toBeInTheDocument();
+    });
     it('should render botWord correctly', () => {
         (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Hi", botWord: "\u4EBA\u5DE5\u77E5\u80FD" }));
         expect(react_2.screen.getByText('Bot')).toBeTruthy();
@@ -356,7 +360,7 @@ describe('Message', () => {
         expect(react_2.screen.queryByRole('button', { name: /No/i })).toBeFalsy();
         expect(react_2.screen.getByRole('button', { name: /1 more/i }));
     }));
-    it('should be able to show actions', () => __awaiter(void 0, void 0, void 0, function* () {
+    it('Renders response actions when a single actions object is passed', () => __awaiter(void 0, void 0, void 0, function* () {
         (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Hi", actions: {
                 // eslint-disable-next-line no-console
                 positive: { onClick: () => console.log('Good response') },
@@ -374,9 +378,132 @@ describe('Message', () => {
                 listen: { onClick: () => console.log('Listen') }
             } }));
         ALL_ACTIONS.forEach(({ label }) => {
-            expect(react_2.screen.getByRole('button', { name: label })).toBeTruthy();
+            expect(react_2.screen.getByRole('button', { name: label })).toBeVisible();
+        });
+    }));
+    it('Renders response actions when an array of actions objects is passed', () => __awaiter(void 0, void 0, void 0, function* () {
+        (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Hi", actions: [
+                {
+                    // eslint-disable-next-line no-console
+                    positive: { onClick: () => console.log('Good response') },
+                    // eslint-disable-next-line no-console
+                    negative: { onClick: () => console.log('Bad response') }
+                },
+                {
+                    // eslint-disable-next-line no-console
+                    copy: { onClick: () => console.log('Copy') },
+                    // eslint-disable-next-line no-console
+                    edit: { onClick: () => console.log('Edit') },
+                    // eslint-disable-next-line no-console
+                    share: { onClick: () => console.log('Share') },
+                    // eslint-disable-next-line no-console
+                    download: { onClick: () => console.log('Download') }
+                },
+                {
+                    // eslint-disable-next-line no-console
+                    listen: { onClick: () => console.log('Listen') }
+                }
+            ] }));
+        ALL_ACTIONS.forEach(({ label }) => {
+            expect(react_2.screen.getByRole('button', { name: label })).toBeVisible();
+        });
+    }));
+    it('Renders response actions when an array of objects containing actions objects is passed', () => __awaiter(void 0, void 0, void 0, function* () {
+        (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Hi", actions: [
+                {
+                    actions: {
+                        // eslint-disable-next-line no-console
+                        positive: { onClick: () => console.log('Good response') },
+                        // eslint-disable-next-line no-console
+                        negative: { onClick: () => console.log('Bad response') }
+                    }
+                },
+                {
+                    actions: {
+                        // eslint-disable-next-line no-console
+                        copy: { onClick: () => console.log('Copy') },
+                        // eslint-disable-next-line no-console
+                        edit: { onClick: () => console.log('Edit') },
+                        // eslint-disable-next-line no-console
+                        share: { onClick: () => console.log('Share') },
+                        // eslint-disable-next-line no-console
+                        download: { onClick: () => console.log('Download') }
+                    }
+                },
+                {
+                    actions: {
+                        // eslint-disable-next-line no-console
+                        listen: { onClick: () => console.log('Listen') }
+                    }
+                }
+            ] }));
+        ALL_ACTIONS.forEach(({ label }) => {
+            expect(react_2.screen.getByRole('button', { name: label })).toBeVisible();
         });
     }));
+    it('should handle persistActionSelection correctly when a single actions object is passed', () => __awaiter(void 0, void 0, void 0, function* () {
+        (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Test message", persistActionSelection: true, actions: {
+                positive: { onClick: jest.fn() },
+                negative: { onClick: jest.fn() }
+            } }));
+        const goodBtn = react_2.screen.getByRole('button', { name: /Good response/i });
+        const badBtn = react_2.screen.getByRole('button', { name: /Bad response/i });
+        yield user_event_1.default.click(goodBtn);
+        expect(react_2.screen.getByRole('button', { name: /Good response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        yield user_event_1.default.click(react_2.screen.getByText('Test message'));
+        expect(react_2.screen.getByRole('button', { name: /Good response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        yield user_event_1.default.click(badBtn);
+        expect(react_2.screen.getByRole('button', { name: /Bad response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        expect(goodBtn).not.toHaveClass('pf-chatbot__button--response-action-clicked');
+    }));
+    it('should handle persistActionSelection correctly when an array of actions objects is passed', () => __awaiter(void 0, void 0, void 0, function* () {
+        (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Test message", persistActionSelection: true, actions: [
+                {
+                    positive: { onClick: jest.fn() },
+                    negative: { onClick: jest.fn() }
+                },
+                {
+                    copy: { onClick: jest.fn() }
+                }
+            ] }));
+        const goodBtn = react_2.screen.getByRole('button', { name: /Good response/i });
+        const copyBtn = react_2.screen.getByRole('button', { name: /Copy/i });
+        yield user_event_1.default.click(goodBtn);
+        expect(react_2.screen.getByRole('button', { name: /Good response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        yield user_event_1.default.click(react_2.screen.getByText('Test message'));
+        expect(react_2.screen.getByRole('button', { name: /Good response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        yield user_event_1.default.click(copyBtn);
+        expect(react_2.screen.getByRole('button', { name: /Copied/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        yield user_event_1.default.click(react_2.screen.getByText('Test message'));
+        expect(react_2.screen.getByRole('button', { name: /Good response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        expect(react_2.screen.getByRole('button', { name: /Copied/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+    }));
+    it('should handle persistActionSelection correctly when an array of objects containing actions objects is passed', () => __awaiter(void 0, void 0, void 0, function* () {
+        (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Test message", actions: [
+                {
+                    actions: {
+                        positive: { onClick: jest.fn() },
+                        negative: { onClick: jest.fn() }
+                    },
+                    persistActionSelection: true
+                },
+                {
+                    actions: {
+                        copy: { onClick: jest.fn() }
+                    },
+                    persistActionSelection: false
+                }
+            ] }));
+        const goodBtn = react_2.screen.getByRole('button', { name: /Good response/i });
+        const copyBtn = react_2.screen.getByRole('button', { name: /Copy/i });
+        yield user_event_1.default.click(goodBtn);
+        expect(react_2.screen.getByRole('button', { name: /Good response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        yield user_event_1.default.click(copyBtn);
+        expect(react_2.screen.getByRole('button', { name: /Copied/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        yield user_event_1.default.click(react_2.screen.getByText('Test message'));
+        expect(react_2.screen.getByRole('button', { name: /Good response recorded/i })).toHaveClass('pf-chatbot__button--response-action-clicked');
+        expect(copyBtn).not.toHaveClass('pf-chatbot__button--response-action-clicked');
+    }));
     it('should not show actions if loading', () => __awaiter(void 0, void 0, void 0, function* () {
         (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "bot", name: "Bot", content: "Hi", isLoading: true, actions: {
                 // eslint-disable-next-line no-console

package/dist/cjs/Message/MessageAndActions/MessageAndActions.d.ts

@@ -0,0 +1,14 @@
+import { FunctionComponent, HTMLProps, ReactNode } from 'react';
+/**
+ * The container that wraps the primary message content and inline actions, such as ToolCall, ToolResponse, DeepThinking, ResponseActions, etc.
+ * Attachments should not be rendered inside this container.
+ * Use this component when passing children to Message to customize its structure.
+ */
+export interface MessageAndActionsProps extends HTMLProps<HTMLDivElement> {
+    /** Content to render inside the message and actions container. */
+    children: ReactNode;
+    /** Additional classes applied to the message and actions container. */
+    className?: string;
+}
+export declare const MessageAndActions: FunctionComponent<MessageAndActionsProps>;
+export default MessageAndActions;

package/dist/cjs/Message/MessageAndActions/MessageAndActions.js

@@ -0,0 +1,22 @@
+"use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MessageAndActions = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_styles_1 = require("@patternfly/react-styles");
+const MessageAndActions = (_a) => {
+    var { children, className } = _a, props = __rest(_a, ["children", "className"]);
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: (0, react_styles_1.css)('pf-chatbot__message-and-actions', className) }, props, { children: children })));
+};
+exports.MessageAndActions = MessageAndActions;
+exports.default = exports.MessageAndActions;

package/dist/cjs/Message/MessageAndActions/MessageAndActions.test.d.ts

@@ -0,0 +1 @@
+import '@testing-library/jest-dom';