@patternfly/chatbot 6.5.0-prerelease.4 → 6.5.0-prerelease.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/dist/cjs/FileDetailsLabel/FileDetailsLabel.d.ts +2 -1
  2. package/dist/cjs/Message/CodeBlockMessage/CodeBlockMessage.d.ts +3 -1
  3. package/dist/cjs/Message/CodeBlockMessage/CodeBlockMessage.js +2 -2
  4. package/dist/cjs/Message/Message.d.ts +2 -0
  5. package/dist/cjs/Message/Message.js +6 -6
  6. package/dist/cjs/Message/Message.test.js +32 -0
  7. package/dist/cjs/Message/MessageLoading.d.ts +2 -1
  8. package/dist/cjs/Message/MessageLoading.js +1 -1
  9. package/dist/cjs/Message/TableMessage/TableMessage.d.ts +4 -1
  10. package/dist/cjs/Message/TableMessage/TableMessage.js +2 -2
  11. package/dist/cjs/Message/TextMessage/TextMessage.d.ts +4 -1
  12. package/dist/cjs/Message/TextMessage/TextMessage.js +2 -2
  13. package/dist/css/main.css +21 -0
  14. package/dist/css/main.css.map +1 -1
  15. package/dist/esm/FileDetailsLabel/FileDetailsLabel.d.ts +2 -1
  16. package/dist/esm/Message/CodeBlockMessage/CodeBlockMessage.d.ts +3 -1
  17. package/dist/esm/Message/CodeBlockMessage/CodeBlockMessage.js +2 -2
  18. package/dist/esm/Message/Message.d.ts +2 -0
  19. package/dist/esm/Message/Message.js +6 -6
  20. package/dist/esm/Message/Message.test.js +32 -0
  21. package/dist/esm/Message/MessageLoading.d.ts +2 -1
  22. package/dist/esm/Message/MessageLoading.js +1 -1
  23. package/dist/esm/Message/TableMessage/TableMessage.d.ts +4 -1
  24. package/dist/esm/Message/TableMessage/TableMessage.js +2 -2
  25. package/dist/esm/Message/TextMessage/TextMessage.d.ts +4 -1
  26. package/dist/esm/Message/TextMessage/TextMessage.js +2 -2
  27. package/package.json +1 -1
  28. package/patternfly-docs/content/extensions/chatbot/examples/demos/WhiteEmbeddedChatbot.tsx +19 -5
  29. package/src/FileDetailsLabel/FileDetailsLabel.tsx +2 -2
  30. package/src/Message/CodeBlockMessage/CodeBlockMessage.scss +4 -0
  31. package/src/Message/CodeBlockMessage/CodeBlockMessage.tsx +4 -1
  32. package/src/Message/Message.test.tsx +37 -0
  33. package/src/Message/Message.tsx +8 -4
  34. package/src/Message/MessageLoading.scss +4 -0
  35. package/src/Message/MessageLoading.tsx +2 -2
  36. package/src/Message/TableMessage/TableMessage.scss +4 -0
  37. package/src/Message/TableMessage/TableMessage.tsx +6 -2
  38. package/src/Message/TextMessage/TextMessage.scss +6 -0
  39. package/src/Message/TextMessage/TextMessage.tsx +11 -2
@@ -1,5 +1,6 @@
1
1
  import { PropsWithChildren } from 'react';
2
- export interface FileDetailsLabelProps {
2
+ import { LabelProps } from '@patternfly/react-core';
3
+ export interface FileDetailsLabelProps extends Omit<LabelProps, 'onClose' | 'onClick'> {
3
4
  /** Name of file, including extension */
4
5
  fileName: string;
5
6
  /** Unique id of file */
@@ -18,6 +18,8 @@ export interface CodeBlockMessageProps {
18
18
  collapsedText?: string;
19
19
  /** Custom actions added to header of code block, after any default actions such as the "copy" action. */
20
20
  customActions?: React.ReactNode;
21
+ /** Sets background colors to be appropriate on primary chatbot background */
22
+ isPrimary?: boolean;
21
23
  }
22
- declare const CodeBlockMessage: ({ children, className, "aria-label": ariaLabel, isExpandable, expandableSectionProps, expandableSectionToggleProps, expandedText, collapsedText, customActions, ...props }: CodeBlockMessageProps) => import("react/jsx-runtime").JSX.Element;
24
+ declare const CodeBlockMessage: ({ children, className, "aria-label": ariaLabel, isExpandable, expandableSectionProps, expandableSectionToggleProps, expandedText, collapsedText, customActions, isPrimary, ...props }: CodeBlockMessageProps) => import("react/jsx-runtime").JSX.Element;
23
25
  export default CodeBlockMessage;
@@ -24,7 +24,7 @@ const DEFAULT_EXPANDED_TEXT = 'Show less';
24
24
  const DEFAULT_COLLAPSED_TEXT = 'Show more';
25
25
  const CodeBlockMessage = (_a) => {
26
26
  var _b;
27
- var { children, className, 'aria-label': ariaLabel, isExpandable = false, expandableSectionProps, expandableSectionToggleProps, expandedText = DEFAULT_EXPANDED_TEXT, collapsedText = DEFAULT_COLLAPSED_TEXT, customActions } = _a, props = __rest(_a, ["children", "className", 'aria-label', "isExpandable", "expandableSectionProps", "expandableSectionToggleProps", "expandedText", "collapsedText", "customActions"]);
27
+ var { children, className, 'aria-label': ariaLabel, isExpandable = false, expandableSectionProps, expandableSectionToggleProps, expandedText = DEFAULT_EXPANDED_TEXT, collapsedText = DEFAULT_COLLAPSED_TEXT, customActions, isPrimary } = _a, props = __rest(_a, ["children", "className", 'aria-label', "isExpandable", "expandableSectionProps", "expandableSectionToggleProps", "expandedText", "collapsedText", "customActions", "isPrimary"]);
28
28
  const [copied, setCopied] = (0, react_1.useState)(false);
29
29
  const [isExpanded, setIsExpanded] = (0, react_1.useState)(false);
30
30
  const buttonRef = (0, react_1.useRef)();
@@ -61,7 +61,7 @@ const CodeBlockMessage = (_a) => {
61
61
  }
62
62
  });
63
63
  if (!String(children).includes('\n')) {
64
- return ((0, jsx_runtime_1.jsx)("code", Object.assign({}, props, { className: "pf-chatbot__message-inline-code", children: children })));
64
+ return ((0, jsx_runtime_1.jsx)("code", Object.assign({}, props, { className: `pf-chatbot__message-inline-code ${isPrimary ? 'pf-m-primary' : ''}`, children: children })));
65
65
  }
66
66
  // Setup code block header
67
67
  const actions = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(react_core_1.CodeBlockAction, { className: "pf-chatbot__message-code-block-default-action", children: [language && (0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-code-block-language", children: language }), (0, jsx_runtime_1.jsx)(react_core_1.Button, { ref: buttonRef, "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : 'Copy code', variant: "plain", className: "pf-chatbot__button--copy", onClick: (event) => handleCopy(event, children), children: copied ? (0, jsx_runtime_1.jsx)(check_icon_1.CheckIcon, {}) : (0, jsx_runtime_1.jsx)(copy_icon_1.CopyIcon, {}) }), (0, jsx_runtime_1.jsx)(react_core_1.Tooltip, { id: tooltipID, content: "Copy", position: "top", triggerRef: buttonRef })] }), customActions] }));
@@ -145,6 +145,8 @@ export interface MessageProps extends Omit<HTMLProps<HTMLDivElement>, 'role'> {
145
145
  toolCall?: ToolCallProps;
146
146
  /** Whether user messages default to stripping out images in markdown */
147
147
  hasNoImagesInUserMessages?: boolean;
148
+ /** Sets background colors to be appropriate on primary chatbot background */
149
+ isPrimary?: boolean;
148
150
  }
149
151
  export declare const MessageBase: FunctionComponent<MessageProps>;
150
152
  declare const Message: import("react").ForwardRefExoticComponent<Omit<MessageProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
@@ -58,7 +58,7 @@ const DeepThinking_1 = __importDefault(require("../DeepThinking"));
58
58
  const SuperscriptMessage_1 = __importDefault(require("./SuperscriptMessage/SuperscriptMessage"));
59
59
  const ToolCall_1 = __importDefault(require("../ToolCall"));
60
60
  const MessageBase = (_a) => {
61
- 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 } = _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"]);
61
+ 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"]);
62
62
  const [messageText, setMessageText] = (0, react_1.useState)(content);
63
63
  (0, react_1.useEffect)(() => {
64
64
  setMessageText(content);
@@ -97,13 +97,13 @@ const MessageBase = (_a) => {
97
97
  p: (props) => {
98
98
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
99
99
  const { node } = props, rest = __rest(props, ["node"]);
100
- return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.p }, rest));
100
+ return (0, jsx_runtime_1.jsx)(TextMessage_1.default, Object.assign({ component: react_core_1.ContentVariants.p }, rest, { isPrimary: isPrimary }));
101
101
  },
102
102
  code: (_a) => {
103
103
  var { children } = _a, props = __rest(_a, ["children"]);
104
104
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
105
105
  const { node } = props, codeProps = __rest(props, ["node"]);
106
- return ((0, jsx_runtime_1.jsx)(CodeBlockMessage_1.default, Object.assign({}, codeProps, codeBlockProps, { children: children })));
106
+ return ((0, jsx_runtime_1.jsx)(CodeBlockMessage_1.default, Object.assign({}, codeProps, codeBlockProps, { isPrimary: isPrimary, children: children })));
107
107
  },
108
108
  h1: (props) => {
109
109
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -156,7 +156,7 @@ const MessageBase = (_a) => {
156
156
  return (0, jsx_runtime_1.jsx)(ListItemMessage_1.default, Object.assign({}, rest));
157
157
  },
158
158
  // table requires node attribute for calculating headers for mobile breakpoint
159
- table: (props) => (0, jsx_runtime_1.jsx)(TableMessage_1.default, Object.assign({}, props, tableProps)),
159
+ table: (props) => (0, jsx_runtime_1.jsx)(TableMessage_1.default, Object.assign({}, props, tableProps, { isPrimary: isPrimary })),
160
160
  tbody: (props) => {
161
161
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
162
162
  const { node } = props, rest = __rest(props, ["node"]);
@@ -209,7 +209,7 @@ const MessageBase = (_a) => {
209
209
  };
210
210
  const renderMessage = () => {
211
211
  if (isLoading) {
212
- return (0, jsx_runtime_1.jsx)(MessageLoading_1.default, { loadingWord: loadingWord });
212
+ return (0, jsx_runtime_1.jsx)(MessageLoading_1.default, { loadingWord: loadingWord, isPrimary: isPrimary });
213
213
  }
214
214
  if (isEditable) {
215
215
  return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [beforeMainContent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: beforeMainContent }), (0, jsx_runtime_1.jsx)(MessageInput_1.default, Object.assign({ content: messageText, editPlaceholder: editPlaceholder, updateWord: updateWord, cancelWord: cancelWord, onEditUpdate: (event, value) => {
@@ -221,7 +221,7 @@ const MessageBase = (_a) => {
221
221
  };
222
222
  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) => {
223
223
  var _a;
224
- 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 }) }, (_a = attachment.id) !== null && _a !== void 0 ? _a : attachment.name));
224
+ 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));
225
225
  }) })), !isLoading && endContent && (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: endContent })] })] })] })));
226
226
  };
227
227
  exports.MessageBase = MessageBase;
@@ -831,4 +831,36 @@ describe('Message', () => {
831
831
  expect(react_2.screen.getByText('Thought for 3 seconds')).toBeTruthy();
832
832
  expect(react_2.screen.getByText("Here's why I said this.")).toBeTruthy();
833
833
  });
834
+ it('should handle isPrimary correctly for inline code when it is true', () => {
835
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: INLINE_CODE, isPrimary: true }));
836
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
837
+ });
838
+ it('should handle isPrimary correctly for inline code when it is false', () => {
839
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: INLINE_CODE }));
840
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
841
+ });
842
+ it('should handle isPrimary correctly for table when it is true', () => {
843
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: TABLE, isPrimary: true }));
844
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
845
+ });
846
+ it('should handle isPrimary correctly for table when it is false', () => {
847
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: TABLE }));
848
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
849
+ });
850
+ it('should handle isPrimary correctly for loading when it is true', () => {
851
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: "", isPrimary: true, isLoading: true }));
852
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
853
+ });
854
+ it('should handle isPrimary correctly for loading when it is false', () => {
855
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: "", isLoading: true }));
856
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
857
+ });
858
+ it('should handle isPrimary correctly for attachments when it is true', () => {
859
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: "", isPrimary: true, attachments: [{ name: 'testAttachment' }] }));
860
+ expect(container.querySelector('.pf-m-outline')).toBeTruthy();
861
+ });
862
+ it('should handle isPrimary correctly for attachments when it is false', () => {
863
+ const { container } = (0, react_2.render)((0, jsx_runtime_1.jsx)(Message_1.default, { avatar: "./img", role: "user", name: "User", content: "", attachments: [{ name: 'testAttachment' }] }));
864
+ expect(container.querySelector('.pf-m-outline')).toBeFalsy();
865
+ });
834
866
  });
@@ -1,4 +1,5 @@
1
- declare const MessageLoading: ({ loadingWord }: {
1
+ declare const MessageLoading: ({ loadingWord, isPrimary }: {
2
2
  loadingWord: any;
3
+ isPrimary: any;
3
4
  }) => import("react/jsx-runtime").JSX.Element;
4
5
  export default MessageLoading;
@@ -4,5 +4,5 @@ const jsx_runtime_1 = require("react/jsx-runtime");
4
4
  // ============================================================================
5
5
  // Chatbot Main - Message - Processing
6
6
  // ============================================================================
7
- const MessageLoading = ({ loadingWord }) => ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__message-loading", children: (0, jsx_runtime_1.jsx)("span", { className: "pf-chatbot__message-loading-dots", children: (0, jsx_runtime_1.jsx)("span", { className: "pf-v6-screen-reader", children: loadingWord }) }) }));
7
+ const MessageLoading = ({ loadingWord, isPrimary }) => ((0, jsx_runtime_1.jsx)("div", { className: `pf-chatbot__message-loading ${isPrimary ? 'pf-m-primary' : ''}`, children: (0, jsx_runtime_1.jsx)("span", { className: "pf-chatbot__message-loading-dots", children: (0, jsx_runtime_1.jsx)("span", { className: "pf-v6-screen-reader", children: loadingWord }) }) }));
8
8
  exports.default = MessageLoading;
@@ -15,5 +15,8 @@ export interface TableNode {
15
15
  tagName: string;
16
16
  type: string;
17
17
  }
18
- declare const TableMessage: ({ children, ...props }: Omit<TableProps, "ref"> & ExtraProps) => import("react/jsx-runtime").JSX.Element;
18
+ export interface TableMessageProps {
19
+ isPrimary?: boolean;
20
+ }
21
+ declare const TableMessage: ({ children, isPrimary, ...props }: Omit<TableProps, "ref"> & ExtraProps & TableMessageProps) => import("react/jsx-runtime").JSX.Element;
19
22
  export default TableMessage;
@@ -19,7 +19,7 @@ const react_1 = require("react");
19
19
  const react_table_1 = require("@patternfly/react-table");
20
20
  const TableMessage = (_a) => {
21
21
  var _b;
22
- var { children } = _a, props = __rest(_a, ["children"]);
22
+ var { children, isPrimary } = _a, props = __rest(_a, ["children", "isPrimary"]);
23
23
  const { className } = props, rest = __rest(props, ["className"]);
24
24
  // This allows us to parse the nested data we get back from the 3rd party Markdown parser
25
25
  // Open to feedback here if there is a better way to do this
@@ -60,6 +60,6 @@ const TableMessage = (_a) => {
60
60
  }
61
61
  return (
62
62
  // gridBreakPoint is so we show mobile-styled-PF table
63
- (0, jsx_runtime_1.jsx)(react_table_1.Table, Object.assign({ "aria-label": props['aria-label'], gridBreakPoint: "grid", className: `pf-chatbot__message-table ${className ? className : ''}` }, rest, { children: modifyChildren(children) })));
63
+ (0, jsx_runtime_1.jsx)(react_table_1.Table, Object.assign({ "aria-label": props['aria-label'], gridBreakPoint: "grid", className: `pf-chatbot__message-table ${isPrimary ? 'pf-m-primary' : ''} ${className ? className : ''}` }, rest, { children: modifyChildren(children) })));
64
64
  };
65
65
  exports.default = TableMessage;
@@ -1,4 +1,7 @@
1
1
  import { ExtraProps } from 'react-markdown';
2
2
  import { ContentProps } from '@patternfly/react-core';
3
- declare const TextMessage: ({ component, children, ...props }: Omit<ContentProps, "ref"> & ExtraProps) => import("react/jsx-runtime").JSX.Element;
3
+ export interface TextMessageProps {
4
+ isPrimary?: boolean;
5
+ }
6
+ declare const TextMessage: ({ component, children, isPrimary, ...props }: Omit<ContentProps, "ref"> & ExtraProps & TextMessageProps) => import("react/jsx-runtime").JSX.Element;
4
7
  export default TextMessage;
@@ -14,7 +14,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
14
14
  const jsx_runtime_1 = require("react/jsx-runtime");
15
15
  const react_core_1 = require("@patternfly/react-core");
16
16
  const TextMessage = (_a) => {
17
- var { component, children } = _a, props = __rest(_a, ["component", "children"]);
18
- return ((0, jsx_runtime_1.jsx)("span", { className: "pf-chatbot__message-text", children: (0, jsx_runtime_1.jsx)(react_core_1.Content, Object.assign({ component: component }, props, { children: children })) }));
17
+ var { component, children, isPrimary } = _a, props = __rest(_a, ["component", "children", "isPrimary"]);
18
+ return ((0, jsx_runtime_1.jsx)("span", { className: `pf-chatbot__message-text ${isPrimary ? 'pf-m-primary' : ''}`, children: (0, jsx_runtime_1.jsx)(react_core_1.Content, Object.assign({ component: component }, props, { children: children })) }));
19
19
  };
20
20
  exports.default = TextMessage;
package/dist/css/main.css CHANGED
@@ -1336,6 +1336,9 @@
1336
1336
  background-color: rgba(41, 41, 41, 0.25);
1337
1337
  }
1338
1338
  }
1339
+ .pf-chatbot__message-loading.pf-m-primary {
1340
+ background-color: var(--pf-t--global--background--color--secondary--default);
1341
+ }
1339
1342
 
1340
1343
  .pf-chatbot__message-code-block {
1341
1344
  width: 100%;
@@ -1403,6 +1406,9 @@
1403
1406
  background-color: var(--pf-t--global--background--color--tertiary--default);
1404
1407
  font-size: var(--pf-chatbot-message-text-inline-code-font-size);
1405
1408
  }
1409
+ .pf-chatbot__message-inline-code.pf-m-primary {
1410
+ background-color: var(--pf-t--global--background--color--secondary--default);
1411
+ }
1406
1412
 
1407
1413
  .pf-chatbot__message-code-toggle .pf-v6-c-button.pf-m-link {
1408
1414
  --pf-v6-c-button--m-link--Color: var(--pf-t--global--color--nonstatus--blue--default);
@@ -1445,6 +1451,9 @@
1445
1451
  white-space: nowrap;
1446
1452
  width: 1px;
1447
1453
  }
1454
+ .pf-chatbot__message-text.pf-m-primary code {
1455
+ background-color: var(--pf-t--global--background--color--secondary--default);
1456
+ }
1448
1457
 
1449
1458
  li[id*=user-content-fn-]:has(> span > .pf-chatbot__message-text + .pf-chatbot__message-text) > span > .pf-chatbot__message-text > p {
1450
1459
  margin-block-end: var(--pf-t--global--spacer--md);
@@ -1590,6 +1599,9 @@ li[id*=user-content-fn-]:has(> span > span > .pf-chatbot__message-text + .pf-cha
1590
1599
  background-color: var(--pf-t--global--background--color--tertiary--default);
1591
1600
  font-size: var(--pf-chatbot-message-text-inline-code-font-size);
1592
1601
  }
1602
+ .pf-chatbot__message-inline-code.pf-m-primary {
1603
+ background-color: var(--pf-t--global--background--color--secondary--default);
1604
+ }
1593
1605
 
1594
1606
  .pf-chatbot__message-code-toggle .pf-v6-c-button.pf-m-link {
1595
1607
  --pf-v6-c-button--m-link--Color: var(--pf-t--global--color--nonstatus--blue--default);
@@ -1640,6 +1652,9 @@ li[id*=user-content-fn-]:has(> span > span > .pf-chatbot__message-text + .pf-cha
1640
1652
  white-space: nowrap;
1641
1653
  width: 1px;
1642
1654
  }
1655
+ .pf-chatbot__message-text.pf-m-primary code {
1656
+ background-color: var(--pf-t--global--background--color--secondary--default);
1657
+ }
1643
1658
 
1644
1659
  li[id*=user-content-fn-]:has(> span > .pf-chatbot__message-text + .pf-chatbot__message-text) > span > .pf-chatbot__message-text > p {
1645
1660
  margin-block-end: var(--pf-t--global--spacer--md);
@@ -1734,6 +1749,9 @@ li[id*=user-content-fn-]:has(> span > span > .pf-chatbot__message-text + .pf-cha
1734
1749
  .pf-chatbot__message-table.pf-m-grid.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody):first-of-type {
1735
1750
  border-block-start: 0;
1736
1751
  }
1752
+ .pf-chatbot__message-table.pf-m-primary {
1753
+ --pf-v6-c-table--BackgroundColor: var(--pf-t--global--background--color--secondary--default) !important;
1754
+ }
1737
1755
  .pf-chatbot__message-table tbody {
1738
1756
  border-radius: var(--pf-t--global--border--radius--small);
1739
1757
  }
@@ -1791,6 +1809,9 @@ li[id*=user-content-fn-]:has(> span > span > .pf-chatbot__message-text + .pf-cha
1791
1809
  background-color: rgba(41, 41, 41, 0.25);
1792
1810
  }
1793
1811
  }
1812
+ .pf-chatbot__message-loading.pf-m-primary {
1813
+ background-color: var(--pf-t--global--background--color--secondary--default);
1814
+ }
1794
1815
 
1795
1816
  .pf-chatbot__quickstarts-tile {
1796
1817
  max-width: 650px;
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["../../src/AttachMenu/AttachMenu.scss","../../src/Chatbot/Chatbot.scss","../../src/ChatbotAlert/ChatbotAlert.scss","../../src/ChatbotContent/ChatbotContent.scss","../../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.scss","../../src/ChatbotFooter/ChatbotFootnote.scss","../../src/ChatbotFooter/ChatbotFooter.scss","../../src/ChatbotHeader/ChatbotHeader.scss","../../src/ChatbotModal/ChatbotModal.scss","../../src/ChatbotPopover/ChatbotPopover.scss","../../src/ChatbotToggle/ChatbotToggle.scss","../../src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.scss","../../src/CodeModal/CodeModal.scss","../../src/Compare/Compare.scss","../../src/DeepThinking/DeepThinking.scss","../../src/FileDetails/FileDetails.scss","../../src/FileDetailsLabel/FileDetailsLabel.scss","../../src/FileDropZone/FileDropZone.scss","../../src/FilePreview/FilePreview.scss","../../src/ImagePreview/ImagePreview.scss","../../src/Message/Message.scss","../../src/Message/MessageLoading.scss","../../src/Message/CodeBlockMessage/CodeBlockMessage.scss","../../src/Message/TextMessage/TextMessage.scss","../../src/Message/SuperscriptMessage/SuperscriptMessage.scss","../../src/Message/ImageMessage/ImageMessage.scss","../../src/Message/ListMessage/ListMessage.scss","../../src/Message/TableMessage/TableMessage.scss","../../src/Message/QuickStarts/QuickStartTile.scss","../../src/Message/QuickResponse/QuickResponse.scss","../../src/Message/UserFeedback/UserFeedback.scss","../../src/MessageBar/AttachButton.scss","../../src/MessageBar/MicrophoneButton.scss","../../src/MessageBar/SendButton.scss","../../src/MessageBar/StopButton.scss","../../src/MessageBar/MessageBar.scss","../../src/MessageBox/JumpButton.scss","../../src/MessageBox/MessageBox.scss","../../src/MessageDivider/MessageDivider.scss","../../src/ResponseActions/ResponseActions.scss","../../src/Settings/Settings.scss","../../src/SourcesCard/SourcesCard.scss","../../src/SourceDetailsMenuItem/SourceDetailsMenuItem.scss","../../src/TermsOfUse/TermsOfUse.scss","../../src/ToolResponse/ToolResponse.scss","../../src/ToolCall/ToolCall.scss","../../src/main.scss"],"names":[],"mappings":";AAAA;EACE;EACA;;;AAGF;AACE;AAsBA;AASA;;AA9BA;EACE;EACA;EACA;EACA;;AAEF;EACE;;AAGF;AACE;;AACA;EACE;EACA;EACA;EACA;EACA;;AAKJ;EACE;;AAGF;EACE;;AAIF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;ACxDJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;;AAKF;EA9BF;IA+BI;IACA;;;AAIF;EApCF;IAqCI;;;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EAXF;IAYI;;;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAIF;EAdF;IAeI;;;;AAIJ;EACE;;;AAGF;AAAA;AAAA;EAGE;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAOJ;EACE;;;AC3IF;EACE;EACA;EACA;;;ACAF;EACE;EACA;EACA;EACA;EACA;;AAGA;EARF;IASI;;;AAGF;EACE;;;AAOJ;EAII;AAAA;AAAA;IACE;IACA;;;ACzBJ;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAEF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAMJ;EACE;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAIF;EACE;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAKA;EACE;EACA;EACA;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAKA;EACE;;;AASJ;EACE;;;AASF;AAAA;EACE;;AACA;AAAA;EACE;;;AASJ;EACE;;AACA;EACE;EACA;;AAEF;EACE;;;AAUF;AAAA;AAAA;AAAA;EACE;;;AAKN;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAKE;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;;AAGF;EACE;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;;;AC5PN;EACE;;AAEA;EACE;EACA;;;ACHJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;;AAMF;EAGI;AAAA;IACE;;EACA;AAAA;IACE;;EAGJ;AAAA;IACE;IACA;IACA;;;AASJ;EACE;;;AAQF;EACE;;;AAIJ;EACE;EACA;;;AC/DF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAQN;EAGI;AAAA;IACE;;EAEF;AAAA;IACE;;;AAUJ;AAAA;EACE;;;AAOJ;AAAA;EAEE;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;AAGF;AAAA;AAAA;AAAA;EAEE;EACA;EACA;;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;;AAOJ;EACE;;;AAOJ;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAOA;EACE;EACA;;AAGF;EACE;EACA;;;AAIJ;AAAA;EAEE;EACA;;;AAGF;EACE;;;AClKF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEF;EACE;;;AAOJ;EACE;AAAA;IAEE;IACA;IACA;IACA;IACA;IACA;IACA;;;AAGJ;EACE;AAAA;IAEE;IACA;IACA;IACA;IACA;IACA;IACA;;;AAOJ;EACE;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAQE;EACE;;;AAQN;EACE;;;AAOA;EACE;;AAGF;EACE;EACA;;;ACjGF;EACE;;AAMA;EACE;;AAEF;EACE;;AAEF;EACE;;AAIF;EACE;EACA;;AAEF;EACE;;;ACxBN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;AAIF;EACE;EACA;;;AAIJ;EACE;EACA;EACA;;;AC3BF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;EACA;;AAEA;EACE;;;AAOJ;EAIM;AAAA;IACE;IACA;;;ACpDN;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;AACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;AAAA;AAAA;EAGA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;;AAEF;EACE;;AAGA;EACE;;;AAUF;EACE;EACA;;;AAKN;EACE;;;AAGF;EACE;;;AAIA;EACE;;;AC9FJ;EACE;EACA;EACA;EACA;;;AAEF;EACE;;AAEA;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;;AAEA;EALF;IAMI;;;AAGF;EACE;;AAEA;EAHF;IAII;;;;AAKN;EACE;;AAEA;EACE;;AAGF;EACE;;AAIA;EADF;IAEI;;;;AAIN;EACE;;AAEA;EAHF;IAII;;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;IACA;IACA;;;;ACrEJ;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;ACtBF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;;;ACjCF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EAEA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;EAEE;EACA;;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;;AAKF;EACE;;AAGF;EACE;;;AAIJ;AAAA;EAEE;EACA;;AAEA;AAAA;EACE;;;AAKF;EACE;;;AAMF;AAAA;EACE;;;AC/DJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;;AAGA;EANF;IAOI;;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;AACA;EACE;EACA;EACA;EACA;;;AAME;EADF;IAEI;IACA;IACA;;EAEA;IACE;;;;ACnDR;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;;;ACpBF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;AAAA;EACE;;AAGJ;EACE;EACA;;AAKA;AAAA;EACE;;AAGJ;EACE;;;ACvDJ;EACE;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAKF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAGA;EACE;EAQA;EACA;;AAIF;EACE;EACA;;AAIF;EACE;;AAEF;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAIF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;EACA;EACA;EACA;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAKE;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQE;;AAIJ;EACE;;;AAMJ;EACE;EACA;EACA;;;AAGF;EACE;;;AC9IF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EAEE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;IACE;;EAEF;IAEE;;;;AC9CN;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EAEE;;AAMN;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;EAEE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAGF;EACE;EACA;;;AAKN;EACE;EACA;EACA;;;AAIA;EACE;EACA;;;ACpFJ;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAUJ;EAIE;;;AAIF;EAKE;;;AAIA;EACE;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAIJ;EACE;EACA;;;AASF;EACE;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AC7HN;EACE;EACA;;AACA;EACE;EACA;;;AJwJF;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;AE7KJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EAEE;;AAMN;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;EAEE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAGF;EACE;EACA;;;AAKN;EACE;EACA;EACA;;;AAIA;EACE;EACA;;;AGxFJ;EACE;EACA;EACA;EACA;EAGA;;;AFHF;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAUJ;EAIE;;;AAIF;EAKE;;;AAIA;EACE;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAIJ;EACE;EACA;;;AASF;EACE;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AGzHN;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;;AAKF;AAAA;EAEE;EACA;EACA;;AAGA;AAAA;EACE;;AAMF;EACE;EACA;;AAIJ;EACE;;;ACvCJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;ANjBJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EAEE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;IACE;;EAEF;IAEE;;;;AOjDN;EACE;EACA;;AAEA;EAJF;IAKI;IACA;;;AAKA;EACE;;;AAOF;EACE;;;ACnBJ;EACE;;AAEA;EAHF;IAII;;;AAGF;EAPF;IAQI;;;AAKF;EACE;EACA;;AAIJ;AAAA;EAEE;EACA;;AAIF;EACE;EACA;EACA;;;AC7BJ;EACE;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAKA;EACE;;;AAKF;EACE;;AAGF;EACE;;AAIA;EACE;;;ACnEN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAKA;EACE;;AAIJ;EAEE;;AAEA;EACE;;AAKA;EACE;;;AASR;EACE;EACA;EACA;EACA;;;ACzCF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAMA;EACE;;AAKJ;EACE;EACA;;AAGA;EACE;;AAKA;EACE;;;AAMR;EACE;IACE;;EAEF;IACE;;;AAOJ;EACE;EACA;EACA;EACA;;;ACrDF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;EACA;;AAEA;EACE;;;AAMJ;EACE;;AACA;EACE;;AAIJ;EACE;EACA;;AAGF;AAAA;EAEE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAOJ;EACE;EACA;EACA;EACA;;;AC1DF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAEA;EACE;;AAKA;EACE;;;AASR;EACE;EACA;EACA;EACA;;;AClCF;EACE;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;IACE;IACA;;;AAKF;EACE;IACE;IACA;;;;AAQN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;;AC9HJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;;AAEA;EACE;;AAGF;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAIF;EA3CF;IA4CI;;;;AC9CJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAIA;EAVF;IAWI;;;AAGF;EAdF;IAeI;;;;AAIJ;EACE;;;AAGF;EAII;AAAA;AAAA;IACE;IACA;;;AAMJ;EACE;;;ACnCJ;EACE;EACA;;AAEA;AAAA;EAEE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;EACA;EAEA;;AAGF;EACE;;AAKF;AAAA;EAEE;;;AFrCN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;;AAEA;EACE;;AAGF;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAIF;EA3CF;IA4CI;;;;AGhDJ;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;;;AAKN;EACE;EACA;;;AC1BF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAIA;EACE;EACA;;;AAIJ;EACE;;;AC3CF;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAIA;EACE;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;AAAA;EACE;;AAGJ;EACE;EACA;;AAKA;AAAA;EACE;;AAGJ;EACE;;;AAON;EACE;EACA;;;ACpGJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAIF;EACE;EACA;;;AAGA;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AC9BA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAIF;EACE;IACE;IACA;;;;AAKN;AAAA;EAGE;;AAGE;AAAA;EACE;;AAIJ;AAAA;EACE;;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;;ACnFJ;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;;ACjCJ;EACE;EACA;EAEA;EACA;;AAEA;EACE;EACA;EACA;;AAIA;EACE;EACA;EACA;;AAIJ;EACE;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;;;ACSJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"main.css"}
1
+ {"version":3,"sourceRoot":"","sources":["../../src/AttachMenu/AttachMenu.scss","../../src/Chatbot/Chatbot.scss","../../src/ChatbotAlert/ChatbotAlert.scss","../../src/ChatbotContent/ChatbotContent.scss","../../src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.scss","../../src/ChatbotFooter/ChatbotFootnote.scss","../../src/ChatbotFooter/ChatbotFooter.scss","../../src/ChatbotHeader/ChatbotHeader.scss","../../src/ChatbotModal/ChatbotModal.scss","../../src/ChatbotPopover/ChatbotPopover.scss","../../src/ChatbotToggle/ChatbotToggle.scss","../../src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.scss","../../src/CodeModal/CodeModal.scss","../../src/Compare/Compare.scss","../../src/DeepThinking/DeepThinking.scss","../../src/FileDetails/FileDetails.scss","../../src/FileDetailsLabel/FileDetailsLabel.scss","../../src/FileDropZone/FileDropZone.scss","../../src/FilePreview/FilePreview.scss","../../src/ImagePreview/ImagePreview.scss","../../src/Message/Message.scss","../../src/Message/MessageLoading.scss","../../src/Message/CodeBlockMessage/CodeBlockMessage.scss","../../src/Message/TextMessage/TextMessage.scss","../../src/Message/SuperscriptMessage/SuperscriptMessage.scss","../../src/Message/ImageMessage/ImageMessage.scss","../../src/Message/ListMessage/ListMessage.scss","../../src/Message/TableMessage/TableMessage.scss","../../src/Message/QuickStarts/QuickStartTile.scss","../../src/Message/QuickResponse/QuickResponse.scss","../../src/Message/UserFeedback/UserFeedback.scss","../../src/MessageBar/AttachButton.scss","../../src/MessageBar/MicrophoneButton.scss","../../src/MessageBar/SendButton.scss","../../src/MessageBar/StopButton.scss","../../src/MessageBar/MessageBar.scss","../../src/MessageBox/JumpButton.scss","../../src/MessageBox/MessageBox.scss","../../src/MessageDivider/MessageDivider.scss","../../src/ResponseActions/ResponseActions.scss","../../src/Settings/Settings.scss","../../src/SourcesCard/SourcesCard.scss","../../src/SourceDetailsMenuItem/SourceDetailsMenuItem.scss","../../src/TermsOfUse/TermsOfUse.scss","../../src/ToolResponse/ToolResponse.scss","../../src/ToolCall/ToolCall.scss","../../src/main.scss"],"names":[],"mappings":";AAAA;EACE;EACA;;;AAGF;AACE;AAsBA;AASA;;AA9BA;EACE;EACA;EACA;EACA;;AAEF;EACE;;AAGF;AACE;;AACA;EACE;EACA;EACA;EACA;EACA;;AAKJ;EACE;;AAGF;EACE;;AAIF;EACE;EACA;;AAGF;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;;ACxDJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;;AAKF;EA9BF;IA+BI;IACA;;;AAIF;EApCF;IAqCI;;;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EAXF;IAYI;;;;AAOJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAMF;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAIF;EAdF;IAeI;;;;AAIJ;EACE;;;AAGF;AAAA;AAAA;EAGE;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAOJ;EACE;;;AC3IF;EACE;EACA;EACA;;;ACAF;EACE;EACA;EACA;EACA;EACA;;AAGA;EARF;IASI;;;AAGF;EACE;;;AAOJ;EAII;AAAA;AAAA;IACE;IACA;;;ACzBJ;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAEF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAMJ;EACE;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAIF;EACE;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAKA;EACE;EACA;EACA;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;;AAKA;EACE;;;AASJ;EACE;;;AASF;AAAA;EACE;;AACA;AAAA;EACE;;;AASJ;EACE;;AACA;EACE;EACA;;AAEF;EACE;;;AAUF;AAAA;AAAA;AAAA;EACE;;;AAKN;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAKE;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAIJ;EACE;;AAGF;EACE;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;;;AC5PN;EACE;;AAEA;EACE;EACA;;;ACHJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;;AAMF;EAGI;AAAA;IACE;;EACA;AAAA;IACE;;EAGJ;AAAA;IACE;IACA;IACA;;;AASJ;EACE;;;AAQF;EACE;;;AAIJ;EACE;EACA;;;AC/DF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;;AAKJ;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAQN;EAGI;AAAA;IACE;;EAEF;AAAA;IACE;;;AAUJ;AAAA;EACE;;;AAOJ;AAAA;EAEE;EACA;EACA;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;AAGF;AAAA;AAAA;AAAA;EAEE;EACA;EACA;;AAMA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;;AAOJ;EACE;;;AAOJ;AAAA;EAEE;;;AAGF;EACE;;;AAGF;EACE;;;AAOA;EACE;EACA;;AAGF;EACE;EACA;;;AAIJ;AAAA;EAEE;EACA;;;AAGF;EACE;;;AClKF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAEF;EACE;;;AAOJ;EACE;AAAA;IAEE;IACA;IACA;IACA;IACA;IACA;IACA;;;AAGJ;EACE;AAAA;IAEE;IACA;IACA;IACA;IACA;IACA;IACA;;;AAOJ;EACE;;;AAMF;EACE;EACA;EACA;EACA;EACA;EACA;;;AAQE;EACE;;;AAQN;EACE;;;AAOA;EACE;;AAGF;EACE;EACA;;;ACjGF;EACE;;AAMA;EACE;;AAEF;EACE;;AAEF;EACE;;AAIF;EACE;EACA;;AAEF;EACE;;;ACxBN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;;AAGF;EACE;;AAIF;EACE;EACA;;;AAIJ;EACE;EACA;EACA;;;AC3BF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;EACA;;AAEA;EACE;;;AAOJ;EAIM;AAAA;IACE;IACA;;;ACpDN;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;AACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;AAAA;AAAA;EAGA;EACA;;AAEF;EACE;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;;AAEF;EACE;;AAGA;EACE;;;AAUF;EACE;EACA;;;AAKN;EACE;;;AAGF;EACE;;;AAIA;EACE;;;AC9FJ;EACE;EACA;EACA;EACA;;;AAEF;EACE;;AAEA;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;;AAEA;EALF;IAMI;;;AAGF;EACE;;AAEA;EAHF;IAII;;;;AAKN;EACE;;AAEA;EACE;;AAGF;EACE;;AAIA;EADF;IAEI;;;;AAIN;EACE;;AAEA;EAHF;IAII;;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EARF;IASI;IACA;IACA;;;;ACrEJ;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;ACtBF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;;;ACjCF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EAEA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;EAEE;EACA;;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;;;AAKF;EACE;;AAGF;EACE;;;AAIJ;AAAA;EAEE;EACA;;AAEA;AAAA;EACE;;;AAKF;EACE;;;AAMF;AAAA;EACE;;;AC/DJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;;AAGA;EANF;IAOI;;;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAIJ;AACA;EACE;EACA;EACA;EACA;;;AAME;EADF;IAEI;IACA;IACA;;EAEA;IACE;;;;ACnDR;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAEF;EACE;EACA;;;ACpBF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;AAAA;EACE;;AAGJ;EACE;EACA;;AAKA;AAAA;EACE;;AAGJ;EACE;;;ACvDJ;EACE;EACA;EACA;EACA;;AAIA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAKF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;;AAGA;EACE;EAQA;EACA;;AAIF;EACE;EACA;;AAIF;EACE;;AAEF;EACE;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAIF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;EACA;EACA;EACA;EACA;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAKE;;AAEF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAQE;;AAIJ;EACE;;;AAMJ;EACE;EACA;EACA;;;AAGF;EACE;;;AC9IF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EAEE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;IACE;;EAEF;IAEE;;;AAIJ;EACE;;;ACnDJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EAEE;;AAMN;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;EAEE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAGF;EACE;EACA;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;;;AAKF;EACE;EACA;;;ACxFJ;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;;AAWN;EAIE;;;AAIF;EAKE;;;AAIA;EACE;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAIJ;EACE;EACA;;;AASF;EACE;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;ACnIN;EACE;EACA;;AACA;EACE;EACA;;;AJwJF;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;AE7KJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEA;EAEE;;AAMN;EACE;EACA;EACA;EACA;EACA;;AAEA;AAAA;EAEE;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAGF;EACE;EACA;;;AAKN;EACE;EACA;EACA;;AAEA;EACE;;;AAKF;EACE;EACA;;;AG5FJ;EACE;EACA;EACA;EACA;EAGA;;;AFHF;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;EACE;;;AAWN;EAIE;;;AAIF;EAKE;;;AAIA;EACE;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAIJ;EACE;EACA;;;AASF;EACE;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AG/HN;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;;AAKF;AAAA;EAEE;EACA;EACA;;AAGA;AAAA;EACE;;AAMF;EACE;EACA;;AAIJ;EACE;;;ACvCJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;ANrBJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EAEE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;IACE;;EAEF;IAEE;;;AAIJ;EACE;;;AOtDJ;EACE;EACA;;AAEA;EAJF;IAKI;IACA;;;AAKA;EACE;;;AAOF;EACE;;;ACnBJ;EACE;;AAEA;EAHF;IAII;;;AAGF;EAPF;IAQI;;;AAKF;EACE;EACA;;AAIJ;AAAA;EAEE;EACA;;AAIF;EACE;EACA;EACA;;;AC7BJ;EACE;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;;;AAIF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAKA;EACE;;;AAKF;EACE;;AAGF;EACE;;AAIA;EACE;;;ACnEN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAKA;EACE;;AAIJ;EAEE;;AAEA;EACE;;AAKA;EACE;;;AASR;EACE;EACA;EACA;EACA;;;ACzCF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAMA;EACE;;AAKJ;EACE;EACA;;AAGA;EACE;;AAKA;EACE;;;AAMR;EACE;IACE;;EAEF;IACE;;;AAOJ;EACE;EACA;EACA;EACA;;;ACrDF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAEE;EACA;;AAEA;EACE;;;AAMJ;EACE;;AACA;EACE;;AAIJ;EACE;EACA;;AAGF;AAAA;EAEE;;;AAIJ;EACE;IACE;IACA;;EAEF;IACE;IACA;;;AAOJ;EACE;EACA;EACA;EACA;;;AC1DF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAEA;EACE;;AAKA;EACE;;;AASR;EACE;EACA;EACA;EACA;;;AClCF;EACE;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EAGA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;;;AAIJ;EACE;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;IACE;IACA;;;AAKF;EACE;IACE;IACA;;;;AAQN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;;AC9HJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;;AAEA;EACE;;AAGF;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAIF;EA3CF;IA4CI;;;;AC9CJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAIA;EAVF;IAWI;;;AAGF;EAdF;IAeI;;;;AAIJ;EACE;;;AAGF;EAII;AAAA;AAAA;IACE;IACA;;;AAMJ;EACE;;;ACnCJ;EACE;EACA;;AAEA;AAAA;EAEE;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKF;EACE;EACA;EAEA;;AAGF;EACE;;AAKF;AAAA;EAEE;;;AFrCN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,YACE;EAIF;;AAEA;EACE;;AAGF;EAEE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;;AAIF;EA3CF;IA4CI;;;;AGhDJ;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEF;EACE;EACA;;;AAKN;EACE;EACA;;;AC1BF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;EACA;;;AAIA;EACE;EACA;;;AAIJ;EACE;;;AC3CF;AAAA;EAEE;EACA;EACA;EACA;EACA;;;AAIA;EACE;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAIA;AAAA;EACE;;AAGJ;EACE;EACA;;AAKA;AAAA;EACE;;AAGJ;EACE;;;AAON;EACE;EACA;;;ACpGJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAIF;EACE;EACA;;;AAGA;EACE;;;AAIJ;EACE;;;AAGF;EACE;;;AC9BA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAIF;EACE;IACE;IACA;;;;AAKN;AAAA;EAGE;;AAGE;AAAA;EACE;;AAIJ;AAAA;EACE;;;AAKF;EACE;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;;ACnFJ;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;;ACjCJ;EACE;EACA;EAEA;EACA;;AAEA;EACE;EACA;EACA;;AAIA;EACE;EACA;EACA;;AAIJ;EACE;;AAGF;EACE;;AAEA;EACE;;AAIJ;EACE;;;ACSJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA","file":"main.css"}
@@ -1,5 +1,6 @@
1
1
  import { PropsWithChildren } from 'react';
2
- export interface FileDetailsLabelProps {
2
+ import { LabelProps } from '@patternfly/react-core';
3
+ export interface FileDetailsLabelProps extends Omit<LabelProps, 'onClose' | 'onClick'> {
3
4
  /** Name of file, including extension */
4
5
  fileName: string;
5
6
  /** Unique id of file */
@@ -18,6 +18,8 @@ export interface CodeBlockMessageProps {
18
18
  collapsedText?: string;
19
19
  /** Custom actions added to header of code block, after any default actions such as the "copy" action. */
20
20
  customActions?: React.ReactNode;
21
+ /** Sets background colors to be appropriate on primary chatbot background */
22
+ isPrimary?: boolean;
21
23
  }
22
- declare const CodeBlockMessage: ({ children, className, "aria-label": ariaLabel, isExpandable, expandableSectionProps, expandableSectionToggleProps, expandedText, collapsedText, customActions, ...props }: CodeBlockMessageProps) => import("react/jsx-runtime").JSX.Element;
24
+ declare const CodeBlockMessage: ({ children, className, "aria-label": ariaLabel, isExpandable, expandableSectionProps, expandableSectionToggleProps, expandedText, collapsedText, customActions, isPrimary, ...props }: CodeBlockMessageProps) => import("react/jsx-runtime").JSX.Element;
23
25
  export default CodeBlockMessage;
@@ -22,7 +22,7 @@ const DEFAULT_EXPANDED_TEXT = 'Show less';
22
22
  const DEFAULT_COLLAPSED_TEXT = 'Show more';
23
23
  const CodeBlockMessage = (_a) => {
24
24
  var _b;
25
- var { children, className, 'aria-label': ariaLabel, isExpandable = false, expandableSectionProps, expandableSectionToggleProps, expandedText = DEFAULT_EXPANDED_TEXT, collapsedText = DEFAULT_COLLAPSED_TEXT, customActions } = _a, props = __rest(_a, ["children", "className", 'aria-label', "isExpandable", "expandableSectionProps", "expandableSectionToggleProps", "expandedText", "collapsedText", "customActions"]);
25
+ var { children, className, 'aria-label': ariaLabel, isExpandable = false, expandableSectionProps, expandableSectionToggleProps, expandedText = DEFAULT_EXPANDED_TEXT, collapsedText = DEFAULT_COLLAPSED_TEXT, customActions, isPrimary } = _a, props = __rest(_a, ["children", "className", 'aria-label', "isExpandable", "expandableSectionProps", "expandableSectionToggleProps", "expandedText", "collapsedText", "customActions", "isPrimary"]);
26
26
  const [copied, setCopied] = useState(false);
27
27
  const [isExpanded, setIsExpanded] = useState(false);
28
28
  const buttonRef = useRef();
@@ -59,7 +59,7 @@ const CodeBlockMessage = (_a) => {
59
59
  }
60
60
  });
61
61
  if (!String(children).includes('\n')) {
62
- return (_jsx("code", Object.assign({}, props, { className: "pf-chatbot__message-inline-code", children: children })));
62
+ return (_jsx("code", Object.assign({}, props, { className: `pf-chatbot__message-inline-code ${isPrimary ? 'pf-m-primary' : ''}`, children: children })));
63
63
  }
64
64
  // Setup code block header
65
65
  const actions = (_jsxs(_Fragment, { children: [_jsxs(CodeBlockAction, { className: "pf-chatbot__message-code-block-default-action", children: [language && _jsx("div", { className: "pf-chatbot__message-code-block-language", children: language }), _jsx(Button, { ref: buttonRef, "aria-label": ariaLabel !== null && ariaLabel !== void 0 ? ariaLabel : 'Copy code', variant: "plain", className: "pf-chatbot__button--copy", onClick: (event) => handleCopy(event, children), children: copied ? _jsx(CheckIcon, {}) : _jsx(CopyIcon, {}) }), _jsx(Tooltip, { id: tooltipID, content: "Copy", position: "top", triggerRef: buttonRef })] }), customActions] }));
@@ -145,6 +145,8 @@ export interface MessageProps extends Omit<HTMLProps<HTMLDivElement>, 'role'> {
145
145
  toolCall?: ToolCallProps;
146
146
  /** Whether user messages default to stripping out images in markdown */
147
147
  hasNoImagesInUserMessages?: boolean;
148
+ /** Sets background colors to be appropriate on primary chatbot background */
149
+ isPrimary?: boolean;
148
150
  }
149
151
  export declare const MessageBase: FunctionComponent<MessageProps>;
150
152
  declare const Message: import("react").ForwardRefExoticComponent<Omit<MessageProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
@@ -52,7 +52,7 @@ import DeepThinking from '../DeepThinking';
52
52
  import SuperscriptMessage from './SuperscriptMessage/SuperscriptMessage';
53
53
  import ToolCall from '../ToolCall';
54
54
  export const MessageBase = (_a) => {
55
- 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 } = _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"]);
55
+ 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"]);
56
56
  const [messageText, setMessageText] = useState(content);
57
57
  useEffect(() => {
58
58
  setMessageText(content);
@@ -91,13 +91,13 @@ export const MessageBase = (_a) => {
91
91
  p: (props) => {
92
92
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
93
93
  const { node } = props, rest = __rest(props, ["node"]);
94
- return _jsx(TextMessage, Object.assign({ component: ContentVariants.p }, rest));
94
+ return _jsx(TextMessage, Object.assign({ component: ContentVariants.p }, rest, { isPrimary: isPrimary }));
95
95
  },
96
96
  code: (_a) => {
97
97
  var { children } = _a, props = __rest(_a, ["children"]);
98
98
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
99
99
  const { node } = props, codeProps = __rest(props, ["node"]);
100
- return (_jsx(CodeBlockMessage, Object.assign({}, codeProps, codeBlockProps, { children: children })));
100
+ return (_jsx(CodeBlockMessage, Object.assign({}, codeProps, codeBlockProps, { isPrimary: isPrimary, children: children })));
101
101
  },
102
102
  h1: (props) => {
103
103
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -150,7 +150,7 @@ export const MessageBase = (_a) => {
150
150
  return _jsx(ListItemMessage, Object.assign({}, rest));
151
151
  },
152
152
  // table requires node attribute for calculating headers for mobile breakpoint
153
- table: (props) => _jsx(TableMessage, Object.assign({}, props, tableProps)),
153
+ table: (props) => _jsx(TableMessage, Object.assign({}, props, tableProps, { isPrimary: isPrimary })),
154
154
  tbody: (props) => {
155
155
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
156
156
  const { node } = props, rest = __rest(props, ["node"]);
@@ -203,7 +203,7 @@ export const MessageBase = (_a) => {
203
203
  };
204
204
  const renderMessage = () => {
205
205
  if (isLoading) {
206
- return _jsx(MessageLoading, { loadingWord: loadingWord });
206
+ return _jsx(MessageLoading, { loadingWord: loadingWord, isPrimary: isPrimary });
207
207
  }
208
208
  if (isEditable) {
209
209
  return (_jsxs(_Fragment, { children: [beforeMainContent && _jsx(_Fragment, { children: beforeMainContent }), _jsx(MessageInput, Object.assign({ content: messageText, editPlaceholder: editPlaceholder, updateWord: updateWord, cancelWord: cancelWord, onEditUpdate: (event, value) => {
@@ -215,7 +215,7 @@ export const MessageBase = (_a) => {
215
215
  };
216
216
  return (_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: [_jsx(Avatar, Object.assign({ className: `pf-chatbot__message-avatar ${hasRoundAvatar ? 'pf-chatbot__message-avatar--round' : ''} ${avatarClassName ? avatarClassName : ''}`, src: avatar, alt: "" }, avatarProps)), _jsxs("div", { className: "pf-chatbot__message-contents", children: [_jsxs("div", { className: "pf-chatbot__message-meta", children: [name && (_jsx("span", { className: "pf-chatbot__message-name", children: _jsx(Truncate, { content: name }) })), role === 'bot' && (_jsx(Label, { variant: "outline", isCompact: true, children: botWord })), _jsx(Timestamp, { date: date, children: timestamp })] }), _jsxs("div", { className: "pf-chatbot__message-response", children: [_jsxs("div", { className: "pf-chatbot__message-and-actions", children: [renderMessage(), afterMainContent && _jsx(_Fragment, { children: afterMainContent }), toolResponse && _jsx(ToolResponse, Object.assign({}, toolResponse)), deepThinking && _jsx(DeepThinking, Object.assign({}, deepThinking)), toolCall && _jsx(ToolCall, Object.assign({}, toolCall)), !isLoading && sources && _jsx(SourcesCard, Object.assign({}, sources, { isCompact: isCompact })), quickStarts && quickStarts.quickStart && (_jsx(QuickStartTile, { 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 && _jsx(ResponseActions, { actions: actions }), userFeedbackForm && _jsx(UserFeedback, Object.assign({}, userFeedbackForm, { timestamp: dateString, isCompact: isCompact })), userFeedbackComplete && (_jsx(UserFeedbackComplete, Object.assign({}, userFeedbackComplete, { timestamp: dateString, isCompact: isCompact }))), !isLoading && quickResponses && (_jsx(QuickResponse, { quickResponses: quickResponses, quickResponseContainerProps: quickResponseContainerProps, isCompact: isCompact }))] }), attachments && (_jsx("div", { className: "pf-chatbot__message-attachments-container", children: attachments.map((attachment) => {
217
217
  var _a;
218
- return (_jsx("div", { className: "pf-chatbot__message-attachment", children: _jsx(FileDetailsLabel, { fileName: attachment.name, fileId: attachment.id, onClose: attachment.onClose, onClick: attachment.onClick, isLoading: attachment.isLoading, closeButtonAriaLabel: attachment.closeButtonAriaLabel, languageTestId: attachment.languageTestId, spinnerTestId: attachment.spinnerTestId }) }, (_a = attachment.id) !== null && _a !== void 0 ? _a : attachment.name));
218
+ return (_jsx("div", { className: "pf-chatbot__message-attachment", children: _jsx(FileDetailsLabel, { 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));
219
219
  }) })), !isLoading && endContent && _jsx(_Fragment, { children: endContent })] })] })] })));
220
220
  };
221
221
  const Message = forwardRef((props, ref) => (_jsx(MessageBase, Object.assign({ innerRef: ref }, props))));
@@ -826,4 +826,36 @@ describe('Message', () => {
826
826
  expect(screen.getByText('Thought for 3 seconds')).toBeTruthy();
827
827
  expect(screen.getByText("Here's why I said this.")).toBeTruthy();
828
828
  });
829
+ it('should handle isPrimary correctly for inline code when it is true', () => {
830
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: INLINE_CODE, isPrimary: true }));
831
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
832
+ });
833
+ it('should handle isPrimary correctly for inline code when it is false', () => {
834
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: INLINE_CODE }));
835
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
836
+ });
837
+ it('should handle isPrimary correctly for table when it is true', () => {
838
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: TABLE, isPrimary: true }));
839
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
840
+ });
841
+ it('should handle isPrimary correctly for table when it is false', () => {
842
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: TABLE }));
843
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
844
+ });
845
+ it('should handle isPrimary correctly for loading when it is true', () => {
846
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: "", isPrimary: true, isLoading: true }));
847
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
848
+ });
849
+ it('should handle isPrimary correctly for loading when it is false', () => {
850
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: "", isLoading: true }));
851
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
852
+ });
853
+ it('should handle isPrimary correctly for attachments when it is true', () => {
854
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: "", isPrimary: true, attachments: [{ name: 'testAttachment' }] }));
855
+ expect(container.querySelector('.pf-m-outline')).toBeTruthy();
856
+ });
857
+ it('should handle isPrimary correctly for attachments when it is false', () => {
858
+ const { container } = render(_jsx(Message, { avatar: "./img", role: "user", name: "User", content: "", attachments: [{ name: 'testAttachment' }] }));
859
+ expect(container.querySelector('.pf-m-outline')).toBeFalsy();
860
+ });
829
861
  });
@@ -1,4 +1,5 @@
1
- declare const MessageLoading: ({ loadingWord }: {
1
+ declare const MessageLoading: ({ loadingWord, isPrimary }: {
2
2
  loadingWord: any;
3
+ isPrimary: any;
3
4
  }) => import("react/jsx-runtime").JSX.Element;
4
5
  export default MessageLoading;
@@ -2,5 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
2
2
  // ============================================================================
3
3
  // Chatbot Main - Message - Processing
4
4
  // ============================================================================
5
- const MessageLoading = ({ loadingWord }) => (_jsx("div", { className: "pf-chatbot__message-loading", children: _jsx("span", { className: "pf-chatbot__message-loading-dots", children: _jsx("span", { className: "pf-v6-screen-reader", children: loadingWord }) }) }));
5
+ const MessageLoading = ({ loadingWord, isPrimary }) => (_jsx("div", { className: `pf-chatbot__message-loading ${isPrimary ? 'pf-m-primary' : ''}`, children: _jsx("span", { className: "pf-chatbot__message-loading-dots", children: _jsx("span", { className: "pf-v6-screen-reader", children: loadingWord }) }) }));
6
6
  export default MessageLoading;
@@ -15,5 +15,8 @@ export interface TableNode {
15
15
  tagName: string;
16
16
  type: string;
17
17
  }
18
- declare const TableMessage: ({ children, ...props }: Omit<TableProps, "ref"> & ExtraProps) => import("react/jsx-runtime").JSX.Element;
18
+ export interface TableMessageProps {
19
+ isPrimary?: boolean;
20
+ }
21
+ declare const TableMessage: ({ children, isPrimary, ...props }: Omit<TableProps, "ref"> & ExtraProps & TableMessageProps) => import("react/jsx-runtime").JSX.Element;
19
22
  export default TableMessage;
@@ -17,7 +17,7 @@ import { Children, cloneElement } from 'react';
17
17
  import { Table } from '@patternfly/react-table';
18
18
  const TableMessage = (_a) => {
19
19
  var _b;
20
- var { children } = _a, props = __rest(_a, ["children"]);
20
+ var { children, isPrimary } = _a, props = __rest(_a, ["children", "isPrimary"]);
21
21
  const { className } = props, rest = __rest(props, ["className"]);
22
22
  // This allows us to parse the nested data we get back from the 3rd party Markdown parser
23
23
  // Open to feedback here if there is a better way to do this
@@ -58,6 +58,6 @@ const TableMessage = (_a) => {
58
58
  }
59
59
  return (
60
60
  // gridBreakPoint is so we show mobile-styled-PF table
61
- _jsx(Table, Object.assign({ "aria-label": props['aria-label'], gridBreakPoint: "grid", className: `pf-chatbot__message-table ${className ? className : ''}` }, rest, { children: modifyChildren(children) })));
61
+ _jsx(Table, Object.assign({ "aria-label": props['aria-label'], gridBreakPoint: "grid", className: `pf-chatbot__message-table ${isPrimary ? 'pf-m-primary' : ''} ${className ? className : ''}` }, rest, { children: modifyChildren(children) })));
62
62
  };
63
63
  export default TableMessage;
@@ -1,4 +1,7 @@
1
1
  import { ExtraProps } from 'react-markdown';
2
2
  import { ContentProps } from '@patternfly/react-core';
3
- declare const TextMessage: ({ component, children, ...props }: Omit<ContentProps, "ref"> & ExtraProps) => import("react/jsx-runtime").JSX.Element;
3
+ export interface TextMessageProps {
4
+ isPrimary?: boolean;
5
+ }
6
+ declare const TextMessage: ({ component, children, isPrimary, ...props }: Omit<ContentProps, "ref"> & ExtraProps & TextMessageProps) => import("react/jsx-runtime").JSX.Element;
4
7
  export default TextMessage;
@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
12
12
  import { jsx as _jsx } from "react/jsx-runtime";
13
13
  import { Content } from '@patternfly/react-core';
14
14
  const TextMessage = (_a) => {
15
- var { component, children } = _a, props = __rest(_a, ["component", "children"]);
16
- return (_jsx("span", { className: "pf-chatbot__message-text", children: _jsx(Content, Object.assign({ component: component }, props, { children: children })) }));
15
+ var { component, children, isPrimary } = _a, props = __rest(_a, ["component", "children", "isPrimary"]);
16
+ return (_jsx("span", { className: `pf-chatbot__message-text ${isPrimary ? 'pf-m-primary' : ''}`, children: _jsx(Content, Object.assign({ component: component }, props, { children: children })) }));
17
17
  };
18
18
  export default TextMessage;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/chatbot",
3
- "version": "6.5.0-prerelease.4",
3
+ "version": "6.5.0-prerelease.5",
4
4
  "description": "This library provides React components based on PatternFly 6 that can be used to build chatbots.",
5
5
  "main": "dist/cjs/index.js",
6
6
  "module": "dist/esm/index.js",
@@ -97,6 +97,14 @@ const MessageLoading = () => (
97
97
  export default MessageLoading;
98
98
 
99
99
  ~~~
100
+
101
+ Here is a table:
102
+
103
+ | Version | GA date | User role
104
+ |-|-|-|
105
+ | 2.5 | September 30, 2024 | Administrator |
106
+ | 2.5 | June 27, 2023 | Editor |
107
+ | 3.0 | April 1, 2025 | Administrator
100
108
  `;
101
109
 
102
110
  // It's important to set a date and timestamp prop since the Message components re-render.
@@ -111,7 +119,8 @@ const initialMessages: MessageProps[] = [
111
119
  name: 'User',
112
120
  avatar: userAvatar,
113
121
  timestamp: date.toLocaleString(),
114
- avatarProps: { isBordered: true }
122
+ avatarProps: { isBordered: true },
123
+ isPrimary: true
115
124
  },
116
125
  {
117
126
  id: '2',
@@ -131,7 +140,9 @@ const initialMessages: MessageProps[] = [
131
140
  download: { onClick: () => console.log('Download') },
132
141
  // eslint-disable-next-line no-console
133
142
  listen: { onClick: () => console.log('Listen') }
134
- }
143
+ },
144
+ isPrimary: true,
145
+ attachments: [{ name: 'auth-operator.yml', id: '1' }]
135
146
  }
136
147
  ];
137
148
 
@@ -220,7 +231,8 @@ export const EmbeddedChatbotDemo: FunctionComponent = () => {
220
231
  name: 'User',
221
232
  avatar: userAvatar,
222
233
  timestamp: date.toLocaleString(),
223
- avatarProps: { isBordered: true }
234
+ avatarProps: { isBordered: true },
235
+ isPrimary: true
224
236
  });
225
237
  newMessages.push({
226
238
  id: generateId(),
@@ -229,7 +241,8 @@ export const EmbeddedChatbotDemo: FunctionComponent = () => {
229
241
  name: 'Bot',
230
242
  avatar: patternflyAvatar,
231
243
  isLoading: true,
232
- timestamp: date.toLocaleString()
244
+ timestamp: date.toLocaleString(),
245
+ isPrimary: true
233
246
  });
234
247
  setMessages(newMessages);
235
248
  // make announcement to assistive devices that new messages have been added
@@ -261,7 +274,8 @@ export const EmbeddedChatbotDemo: FunctionComponent = () => {
261
274
  // eslint-disable-next-line no-console
262
275
  listen: { onClick: () => console.log('Listen') }
263
276
  },
264
- timestamp: date.toLocaleString()
277
+ timestamp: date.toLocaleString(),
278
+ isPrimary: true
265
279
  });
266
280
  setMessages(loadedMessages);
267
281
  // make announcement to assistive devices that new message has loaded
@@ -1,10 +1,10 @@
1
1
  import { PropsWithChildren } from 'react';
2
- import { Button, Label } from '@patternfly/react-core';
2
+ import { Button, Label, LabelProps } from '@patternfly/react-core';
3
3
  import FileDetails from '../FileDetails';
4
4
  import { Spinner } from '@patternfly/react-core';
5
5
  import { TimesIcon } from '@patternfly/react-icons';
6
6
 
7
- export interface FileDetailsLabelProps {
7
+ export interface FileDetailsLabelProps extends Omit<LabelProps, 'onClose' | 'onClick'> {
8
8
  /** Name of file, including extension */
9
9
  fileName: string;
10
10
  /** Unique id of file */
@@ -81,6 +81,10 @@
81
81
  --pf-chatbot-message-text-inline-code-font-size: var(--pf-t--global--font--size--body--default);
82
82
  background-color: var(--pf-t--global--background--color--tertiary--default);
83
83
  font-size: var(--pf-chatbot-message-text-inline-code-font-size);
84
+
85
+ &.pf-m-primary {
86
+ background-color: var(--pf-t--global--background--color--secondary--default);
87
+ }
84
88
  }
85
89
 
86
90
  .pf-chatbot__message-code-toggle {
@@ -39,6 +39,8 @@ export interface CodeBlockMessageProps {
39
39
  collapsedText?: string;
40
40
  /** Custom actions added to header of code block, after any default actions such as the "copy" action. */
41
41
  customActions?: React.ReactNode;
42
+ /** Sets background colors to be appropriate on primary chatbot background */
43
+ isPrimary?: boolean;
42
44
  }
43
45
 
44
46
  const DEFAULT_EXPANDED_TEXT = 'Show less';
@@ -54,6 +56,7 @@ const CodeBlockMessage = ({
54
56
  expandedText = DEFAULT_EXPANDED_TEXT,
55
57
  collapsedText = DEFAULT_COLLAPSED_TEXT,
56
58
  customActions,
59
+ isPrimary,
57
60
  ...props
58
61
  }: CodeBlockMessageProps) => {
59
62
  const [copied, setCopied] = useState(false);
@@ -108,7 +111,7 @@ const CodeBlockMessage = ({
108
111
 
109
112
  if (!String(children).includes('\n')) {
110
113
  return (
111
- <code {...props} className="pf-chatbot__message-inline-code">
114
+ <code {...props} className={`pf-chatbot__message-inline-code ${isPrimary ? 'pf-m-primary' : ''}`}>
112
115
  {children}
113
116
  </code>
114
117
  );
@@ -1093,4 +1093,41 @@ describe('Message', () => {
1093
1093
  expect(screen.getByText('Thought for 3 seconds')).toBeTruthy();
1094
1094
  expect(screen.getByText("Here's why I said this.")).toBeTruthy();
1095
1095
  });
1096
+ it('should handle isPrimary correctly for inline code when it is true', () => {
1097
+ const { container } = render(<Message avatar="./img" role="user" name="User" content={INLINE_CODE} isPrimary />);
1098
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
1099
+ });
1100
+ it('should handle isPrimary correctly for inline code when it is false', () => {
1101
+ const { container } = render(<Message avatar="./img" role="user" name="User" content={INLINE_CODE} />);
1102
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
1103
+ });
1104
+ it('should handle isPrimary correctly for table when it is true', () => {
1105
+ const { container } = render(<Message avatar="./img" role="user" name="User" content={TABLE} isPrimary />);
1106
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
1107
+ });
1108
+ it('should handle isPrimary correctly for table when it is false', () => {
1109
+ const { container } = render(<Message avatar="./img" role="user" name="User" content={TABLE} />);
1110
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
1111
+ });
1112
+ it('should handle isPrimary correctly for loading when it is true', () => {
1113
+ const { container } = render(<Message avatar="./img" role="user" name="User" content="" isPrimary isLoading />);
1114
+ expect(container.querySelector('.pf-m-primary')).toBeTruthy();
1115
+ });
1116
+ it('should handle isPrimary correctly for loading when it is false', () => {
1117
+ const { container } = render(<Message avatar="./img" role="user" name="User" content="" isLoading />);
1118
+
1119
+ expect(container.querySelector('.pf-m-primary')).toBeFalsy();
1120
+ });
1121
+ it('should handle isPrimary correctly for attachments when it is true', () => {
1122
+ const { container } = render(
1123
+ <Message avatar="./img" role="user" name="User" content="" isPrimary attachments={[{ name: 'testAttachment' }]} />
1124
+ );
1125
+ expect(container.querySelector('.pf-m-outline')).toBeTruthy();
1126
+ });
1127
+ it('should handle isPrimary correctly for attachments when it is false', () => {
1128
+ const { container } = render(
1129
+ <Message avatar="./img" role="user" name="User" content="" attachments={[{ name: 'testAttachment' }]} />
1130
+ );
1131
+ expect(container.querySelector('.pf-m-outline')).toBeFalsy();
1132
+ });
1096
1133
  });
@@ -189,6 +189,8 @@ export interface MessageProps extends Omit<HTMLProps<HTMLDivElement>, 'role'> {
189
189
  toolCall?: ToolCallProps;
190
190
  /** Whether user messages default to stripping out images in markdown */
191
191
  hasNoImagesInUserMessages?: boolean;
192
+ /** Sets background colors to be appropriate on primary chatbot background */
193
+ isPrimary?: boolean;
192
194
  }
193
195
 
194
196
  export const MessageBase: FunctionComponent<MessageProps> = ({
@@ -236,6 +238,7 @@ export const MessageBase: FunctionComponent<MessageProps> = ({
236
238
  remarkGfmProps,
237
239
  toolCall,
238
240
  hasNoImagesInUserMessages = true,
241
+ isPrimary,
239
242
  ...props
240
243
  }: MessageProps) => {
241
244
  const [messageText, setMessageText] = useState(content);
@@ -286,13 +289,13 @@ export const MessageBase: FunctionComponent<MessageProps> = ({
286
289
  p: (props) => {
287
290
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
288
291
  const { node, ...rest } = props;
289
- return <TextMessage component={ContentVariants.p} {...rest} />;
292
+ return <TextMessage component={ContentVariants.p} {...rest} isPrimary={isPrimary} />;
290
293
  },
291
294
  code: ({ children, ...props }) => {
292
295
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
293
296
  const { node, ...codeProps } = props;
294
297
  return (
295
- <CodeBlockMessage {...codeProps} {...codeBlockProps}>
298
+ <CodeBlockMessage {...codeProps} {...codeBlockProps} isPrimary={isPrimary}>
296
299
  {children}
297
300
  </CodeBlockMessage>
298
301
  );
@@ -348,7 +351,7 @@ export const MessageBase: FunctionComponent<MessageProps> = ({
348
351
  return <ListItemMessage {...rest} />;
349
352
  },
350
353
  // table requires node attribute for calculating headers for mobile breakpoint
351
- table: (props) => <TableMessage {...props} {...tableProps} />,
354
+ table: (props) => <TableMessage {...props} {...tableProps} isPrimary={isPrimary} />,
352
355
  tbody: (props) => {
353
356
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
354
357
  const { node, ...rest } = props;
@@ -416,7 +419,7 @@ export const MessageBase: FunctionComponent<MessageProps> = ({
416
419
 
417
420
  const renderMessage = () => {
418
421
  if (isLoading) {
419
- return <MessageLoading loadingWord={loadingWord} />;
422
+ return <MessageLoading loadingWord={loadingWord} isPrimary={isPrimary} />;
420
423
  }
421
424
  if (isEditable) {
422
425
  return (
@@ -522,6 +525,7 @@ export const MessageBase: FunctionComponent<MessageProps> = ({
522
525
  closeButtonAriaLabel={attachment.closeButtonAriaLabel}
523
526
  languageTestId={attachment.languageTestId}
524
527
  spinnerTestId={attachment.spinnerTestId}
528
+ variant={isPrimary ? 'outline' : undefined}
525
529
  />
526
530
  </div>
527
531
  ))}
@@ -50,4 +50,8 @@
50
50
  background-color: rgba(41, 41, 41, 0.25);
51
51
  }
52
52
  }
53
+
54
+ &.pf-m-primary {
55
+ background-color: var(--pf-t--global--background--color--secondary--default);
56
+ }
53
57
  }
@@ -2,8 +2,8 @@
2
2
  // Chatbot Main - Message - Processing
3
3
  // ============================================================================
4
4
 
5
- const MessageLoading = ({ loadingWord }) => (
6
- <div className="pf-chatbot__message-loading">
5
+ const MessageLoading = ({ loadingWord, isPrimary }) => (
6
+ <div className={`pf-chatbot__message-loading ${isPrimary ? 'pf-m-primary' : ''}`}>
7
7
  <span className="pf-chatbot__message-loading-dots">
8
8
  <span className="pf-v6-screen-reader">{loadingWord}</span>
9
9
  </span>
@@ -8,6 +8,10 @@
8
8
  border-block-start: 0;
9
9
  }
10
10
 
11
+ &.pf-m-primary {
12
+ --pf-v6-c-table--BackgroundColor: var(--pf-t--global--background--color--secondary--default) !important;
13
+ }
14
+
11
15
  tbody {
12
16
  border-radius: var(--pf-t--global--border--radius--small);
13
17
  }
@@ -19,7 +19,11 @@ export interface TableNode {
19
19
  type: string;
20
20
  }
21
21
 
22
- const TableMessage = ({ children, ...props }: Omit<TableProps, 'ref'> & ExtraProps) => {
22
+ export interface TableMessageProps {
23
+ isPrimary?: boolean;
24
+ }
25
+
26
+ const TableMessage = ({ children, isPrimary, ...props }: Omit<TableProps, 'ref'> & ExtraProps & TableMessageProps) => {
23
27
  const { className, ...rest } = props;
24
28
 
25
29
  // This allows us to parse the nested data we get back from the 3rd party Markdown parser
@@ -72,7 +76,7 @@ const TableMessage = ({ children, ...props }: Omit<TableProps, 'ref'> & ExtraPro
72
76
  <Table
73
77
  aria-label={props['aria-label']}
74
78
  gridBreakPoint="grid"
75
- className={`pf-chatbot__message-table ${className ? className : ''}`}
79
+ className={`pf-chatbot__message-table ${isPrimary ? 'pf-m-primary' : ''} ${className ? className : ''}`}
76
80
  {...rest}
77
81
  >
78
82
  {modifyChildren(children)}
@@ -47,6 +47,12 @@
47
47
  white-space: nowrap;
48
48
  width: 1px;
49
49
  }
50
+
51
+ &.pf-m-primary {
52
+ code {
53
+ background-color: var(--pf-t--global--background--color--secondary--default);
54
+ }
55
+ }
50
56
  }
51
57
 
52
58
  // ============================================================================
@@ -5,8 +5,17 @@
5
5
  import { ExtraProps } from 'react-markdown';
6
6
  import { Content, ContentProps } from '@patternfly/react-core';
7
7
 
8
- const TextMessage = ({ component, children, ...props }: Omit<ContentProps, 'ref'> & ExtraProps) => (
9
- <span className="pf-chatbot__message-text">
8
+ export interface TextMessageProps {
9
+ isPrimary?: boolean;
10
+ }
11
+
12
+ const TextMessage = ({
13
+ component,
14
+ children,
15
+ isPrimary,
16
+ ...props
17
+ }: Omit<ContentProps, 'ref'> & ExtraProps & TextMessageProps) => (
18
+ <span className={`pf-chatbot__message-text ${isPrimary ? 'pf-m-primary' : ''}`}>
10
19
  <Content component={component} {...props}>
11
20
  {children}
12
21
  </Content>