@patternfly/chatbot 6.4.0-prerelease.5 → 6.4.0-prerelease.7

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 (21) hide show
  1. package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.js +1 -1
  2. package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.test.js +6 -6
  3. package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.d.ts +15 -4
  4. package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.js +7 -13
  5. package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.js +25 -0
  6. package/dist/css/main.css +31 -27
  7. package/dist/css/main.css.map +1 -1
  8. package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.js +1 -1
  9. package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.test.js +6 -6
  10. package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.d.ts +15 -4
  11. package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.js +8 -14
  12. package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.js +25 -0
  13. package/package.json +1 -1
  14. package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotConversationEditing.tsx +202 -0
  15. package/patternfly-docs/content/extensions/chatbot/examples/UI/UI.md +14 -1
  16. package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.test.tsx +6 -6
  17. package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx +0 -1
  18. package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.scss +40 -32
  19. package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx +86 -0
  20. package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx +60 -49
  21. package/src/ChatbotModal/ChatbotModal.scss +1 -1
package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.js CHANGED
@@ -13,7 +13,7 @@ const ChatbotConversationHistoryDropdown = ({ menuItems, menuClassName, onSelect
13
13
  const [isOpen, setIsOpen] = (0, react_1.useState)(false);
14
14
  const toggle = (toggleRef) => ((0, jsx_runtime_1.jsx)(react_core_1.Tooltip, { className: "pf-chatbot__tooltip", content: label !== null && label !== void 0 ? label : 'Conversation options', position: "bottom",
15
15
  // prevents VO announcements of both aria label and tooltip
16
- aria: "none", children: (0, jsx_runtime_1.jsx)(react_core_1.MenuToggle, { className: "pf-chatbot__history-actions", variant: "plain", "aria-label": label !== null && label !== void 0 ? label : 'Conversation options', ref: toggleRef, isExpanded: isOpen, onClick: () => setIsOpen(!isOpen), role: "menuitem", children: (0, jsx_runtime_1.jsx)(ellipsis_v_icon_1.default, {}) }) }));
16
+ aria: "none", children: (0, jsx_runtime_1.jsx)(react_core_1.MenuToggle, { className: "pf-chatbot__history-actions", variant: "plain", "aria-label": label !== null && label !== void 0 ? label : 'Conversation options', ref: toggleRef, isExpanded: isOpen, onClick: () => setIsOpen(!isOpen), children: (0, jsx_runtime_1.jsx)(ellipsis_v_icon_1.default, {}) }) }));
17
17
  return ((0, jsx_runtime_1.jsx)(react_core_1.Dropdown, { className: `pf-chatbot__selections ${menuClassName !== null && menuClassName !== void 0 ? menuClassName : ''}`, isOpen: isOpen, onSelect: (props) => {
18
18
  onSelect === null || onSelect === void 0 ? void 0 : onSelect(props);
19
19
  setIsOpen((prev) => !prev);
package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.test.js CHANGED
@@ -22,11 +22,11 @@ describe('ChatbotConversationHistoryDropdown', () => {
22
22
  const menuItems = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.DropdownItem, { children: "Rename" }), (0, jsx_runtime_1.jsx)(react_core_1.DropdownItem, { children: "Delete" })] }));
23
23
  it('should render the dropdown', () => {
24
24
  (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuItems: menuItems, menuClassName: "custom-class" }));
25
- expect(react_1.screen.queryByRole('menuitem', { name: /Conversation options/i })).toBeInTheDocument();
25
+ expect(react_1.screen.queryByRole('button', { name: /Conversation options/i })).toBeInTheDocument();
26
26
  });
27
27
  it('should display the dropdown menuItems', () => {
28
28
  (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuItems: menuItems }));
29
- const toggle = react_1.screen.queryByRole('menuitem', { name: /Conversation options/i });
29
+ const toggle = react_1.screen.queryByRole('button', { name: /Conversation options/i });
30
30
  expect(toggle).toBeInTheDocument();
31
31
  react_1.fireEvent.click(toggle);
32
32
  (0, react_1.waitFor)(() => {
@@ -36,14 +36,14 @@ describe('ChatbotConversationHistoryDropdown', () => {
36
36
  });
37
37
  it('should invoke onSelect callback when menuitem is clicked', () => {
38
38
  (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuItems: menuItems, onSelect: onSelect }));
39
- const toggle = react_1.screen.queryByRole('menuitem', { name: /Conversation options/i });
39
+ const toggle = react_1.screen.queryByRole('button', { name: /Conversation options/i });
40
40
  react_1.fireEvent.click(toggle);
41
41
  react_1.fireEvent.click(react_1.screen.getByText('Rename'));
42
42
  expect(onSelect).toHaveBeenCalled();
43
43
  });
44
44
  it('should toggle the dropdown when menuitem is clicked', () => {
45
45
  (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuItems: menuItems, onSelect: onSelect }));
46
- const toggle = react_1.screen.queryByRole('menuitem', { name: /Conversation options/i });
46
+ const toggle = react_1.screen.queryByRole('button', { name: /Conversation options/i });
47
47
  react_1.fireEvent.click(toggle);
48
48
  react_1.fireEvent.click(react_1.screen.getByText('Delete'));
49
49
  expect(onSelect).toHaveBeenCalled();
@@ -51,7 +51,7 @@ describe('ChatbotConversationHistoryDropdown', () => {
51
51
  });
52
52
  it('should close the dropdown when user clicks outside', () => {
53
53
  (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuItems: menuItems, onSelect: onSelect }));
54
- const toggle = react_1.screen.queryByRole('menuitem', { name: /Conversation options/i });
54
+ const toggle = react_1.screen.queryByRole('button', { name: /Conversation options/i });
55
55
  react_1.fireEvent.click(toggle);
56
56
  expect(react_1.screen.queryByText('Delete')).toBeInTheDocument();
57
57
  react_1.fireEvent.click(toggle.parentElement);
@@ -59,7 +59,7 @@ describe('ChatbotConversationHistoryDropdown', () => {
59
59
  });
60
60
  it('should show the tooltip when the user hovers over the toggle button', () => __awaiter(void 0, void 0, void 0, function* () {
61
61
  (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuItems: menuItems, label: "Actions dropdown" }));
62
- const toggle = react_1.screen.queryByRole('menuitem', { name: /Actions dropdown/i });
62
+ const toggle = react_1.screen.queryByRole('button', { name: /Actions dropdown/i });
63
63
  (0, react_1.fireEvent)(toggle, new MouseEvent('mouseenter', {
64
64
  bubbles: false,
65
65
  cancelable: false
package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import type { FunctionComponent } from 'react';
2
- import { DrawerProps, MenuItemProps, MenuProps, DrawerPanelContentProps, DrawerContentProps, DrawerContentBodyProps, DrawerHeadProps, DrawerActionsProps, DrawerCloseButtonProps, DrawerPanelBodyProps, SkeletonProps, ButtonProps } from '@patternfly/react-core';
2
+ import { ButtonProps, DrawerProps, ListItemProps, DrawerPanelContentProps, DrawerContentProps, DrawerContentBodyProps, DrawerHeadProps, DrawerActionsProps, DrawerCloseButtonProps, DrawerPanelBodyProps, SkeletonProps, MenuProps, // Remove in next breaking change
3
+ TitleProps, ListProps, SearchInputProps } from '@patternfly/react-core';
3
4
  import { ChatbotDisplayMode } from '../Chatbot/Chatbot';
4
5
  import { HistoryEmptyStateProps } from './EmptyState';
5
6
  export interface Conversation {
@@ -19,8 +20,10 @@ export interface Conversation {
19
20
  label?: string;
20
21
  /** Callback for when user selects item. */
21
22
  onSelect?: (event?: React.MouseEvent, value?: string | number) => void;
22
- /** Additional props passed to conversation menu item */
23
- additionalProps?: MenuItemProps;
23
+ /** Additional props passed to conversation button item */
24
+ additionalProps?: ButtonProps;
25
+ /** Additional props passed to conversation list item */
26
+ listItemProps?: Omit<ListItemProps, 'children'>;
24
27
  }
25
28
  export interface ChatbotConversationHistoryNavProps extends DrawerProps {
26
29
  /** Function called to toggle drawer */
@@ -38,6 +41,12 @@ export interface ChatbotConversationHistoryNavProps extends DrawerProps {
38
41
  };
39
42
  /** Additional button props for new chat button. */
40
43
  newChatButtonProps?: ButtonProps;
44
+ /** Additional props applied to all conversation list headers */
45
+ titleProps?: Partial<TitleProps>;
46
+ /** Additional props applied to conversation list. If conversations is an object, you should pass an object of ListProps for each group. */
47
+ listProps?: ListProps | {
48
+ [key: string]: ListProps;
49
+ };
41
50
  /** Text shown in blue button */
42
51
  newChatButtonText?: string;
43
52
  /** Callback function for when blue button is clicked. Omit to hide blue "new chat button" */
@@ -48,6 +57,8 @@ export interface ChatbotConversationHistoryNavProps extends DrawerProps {
48
57
  searchInputPlaceholder?: string;
49
58
  /** Aria label for search input */
50
59
  searchInputAriaLabel?: string;
60
+ /** Additional props passed to search input */
61
+ searchInputProps?: SearchInputProps;
51
62
  /** A callback for when the input value changes. Omit to hide input field */
52
63
  handleTextInputChange?: (value: string) => void;
53
64
  /** Display mode of chatbot */
@@ -56,7 +67,7 @@ export interface ChatbotConversationHistoryNavProps extends DrawerProps {
56
67
  reverseButtonOrder?: boolean;
57
68
  /** Custom test id for the drawer actions */
58
69
  drawerActionsTestId?: string;
59
- /** Additional props applied to menu */
70
+ /** @deprecated Additional props applied to list container */
60
71
  menuProps?: MenuProps;
61
72
  /** Additional props applied to panel */
62
73
  drawerPanelContentProps?: DrawerPanelContentProps;
package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.js CHANGED
@@ -25,27 +25,21 @@ const ChatbotConversationHistoryDropdown_1 = __importDefault(require("./ChatbotC
25
25
  const LoadingState_1 = __importDefault(require("./LoadingState"));
26
26
  const EmptyState_1 = __importDefault(require("./EmptyState"));
27
27
  const ChatbotConversationHistoryNav = (_a) => {
28
- var { onDrawerToggle, isDrawerOpen, setIsDrawerOpen, activeItemId, onSelectActiveItem, conversations, newChatButtonText = 'New chat', drawerContent, onNewChat, newChatButtonProps, searchInputPlaceholder = 'Search previous conversations...', searchInputAriaLabel = 'Filter menu items', handleTextInputChange, displayMode, reverseButtonOrder = false, drawerActionsTestId = 'chatbot-nav-drawer-actions', menuProps, drawerPanelContentProps, drawerContentProps, drawerContentBodyProps, drawerHeadProps, drawerActionsProps, drawerCloseButtonProps, drawerPanelBodyProps, isLoading, loadingState, errorState, emptyState, noResultsState, isCompact, title = 'Chat history' } = _a, props = __rest(_a, ["onDrawerToggle", "isDrawerOpen", "setIsDrawerOpen", "activeItemId", "onSelectActiveItem", "conversations", "newChatButtonText", "drawerContent", "onNewChat", "newChatButtonProps", "searchInputPlaceholder", "searchInputAriaLabel", "handleTextInputChange", "displayMode", "reverseButtonOrder", "drawerActionsTestId", "menuProps", "drawerPanelContentProps", "drawerContentProps", "drawerContentBodyProps", "drawerHeadProps", "drawerActionsProps", "drawerCloseButtonProps", "drawerPanelBodyProps", "isLoading", "loadingState", "errorState", "emptyState", "noResultsState", "isCompact", "title"]);
28
+ var { onDrawerToggle, isDrawerOpen, setIsDrawerOpen, activeItemId, onSelectActiveItem, conversations, titleProps, listProps, newChatButtonText = 'New chat', drawerContent, onNewChat, newChatButtonProps, searchInputPlaceholder = 'Search previous conversations...', searchInputAriaLabel = 'Filter menu items', searchInputProps, handleTextInputChange, displayMode, reverseButtonOrder = false, drawerActionsTestId = 'chatbot-nav-drawer-actions', drawerPanelContentProps, drawerContentProps, drawerContentBodyProps, drawerHeadProps, drawerActionsProps, drawerCloseButtonProps, drawerPanelBodyProps, isLoading, loadingState, errorState, emptyState, noResultsState, isCompact, title = 'Chat history' } = _a, props = __rest(_a, ["onDrawerToggle", "isDrawerOpen", "setIsDrawerOpen", "activeItemId", "onSelectActiveItem", "conversations", "titleProps", "listProps", "newChatButtonText", "drawerContent", "onNewChat", "newChatButtonProps", "searchInputPlaceholder", "searchInputAriaLabel", "searchInputProps", "handleTextInputChange", "displayMode", "reverseButtonOrder", "drawerActionsTestId", "drawerPanelContentProps", "drawerContentProps", "drawerContentBodyProps", "drawerHeadProps", "drawerActionsProps", "drawerCloseButtonProps", "drawerPanelBodyProps", "isLoading", "loadingState", "errorState", "emptyState", "noResultsState", "isCompact", "title"]);
29
29
  const drawerRef = (0, react_1.useRef)(null);
30
30
  const onExpand = () => {
31
31
  drawerRef.current && drawerRef.current.focus();
32
32
  };
33
33
  const getNavItem = (conversation) => {
34
34
  var _a;
35
- return ((0, jsx_runtime_1.jsx)(react_core_1.MenuItem, Object.assign({ className: `pf-chatbot__menu-item ${activeItemId && activeItemId === conversation.id ? 'pf-chatbot__menu-item--active' : ''}`, itemId: conversation.id }, (conversation.noIcon ? {} : { icon: (_a = conversation.icon) !== null && _a !== void 0 ? _a : (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedCommentAltIcon, {}) }), (conversation.menuItems
36
- ? {
37
- actions: ((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuClassName: conversation.menuClassName, onSelect: conversation.onSelect, menuItems: conversation.menuItems, label: conversation.label }))
38
- }
39
- : {}), conversation.additionalProps, { children: conversation.text }), conversation.id));
35
+ return ((0, jsx_runtime_1.jsx)(react_core_1.ListItem, Object.assign({ className: `pf-chatbot__conversation-list-item ${activeItemId && activeItemId === conversation.id ? 'pf-chatbot__conversation-list-item--active' : ''}` }, conversation.listItemProps, { children: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.Button, Object.assign({ className: "pf-chatbot__conversation-history-item", variant: "link" }, conversation.additionalProps, (conversation.noIcon ? {} : { icon: (_a = conversation.icon) !== null && _a !== void 0 ? _a : (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedCommentAltIcon, {}) }), { onClick: (event) => onSelectActiveItem === null || onSelectActiveItem === void 0 ? void 0 : onSelectActiveItem(event, conversation.id), children: conversation.text })), conversation.menuItems && ((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryDropdown_1.default, { menuClassName: conversation.menuClassName, onSelect: conversation.onSelect, menuItems: conversation.menuItems, label: conversation.label }))] }) }), conversation.id));
40
36
  };
41
- const buildMenu = () => {
37
+ const buildConversations = () => {
42
38
  if (Array.isArray(conversations)) {
43
- // Render for array of MenuItemObject
44
- return ((0, jsx_runtime_1.jsx)(react_core_1.MenuList, { children: conversations.map((conversation) => ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: getNavItem(conversation) }, conversation.id))) }));
39
+ return ((0, jsx_runtime_1.jsx)(react_core_1.List, Object.assign({ className: "pf-chatbot__conversation-list", isPlain: true }, listProps, { children: conversations.map((conversation) => ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: getNavItem(conversation) }, conversation.id))) })));
45
40
  }
46
41
  else {
47
- // Render for object with NavItemObject arrays as values
48
- return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: Object.keys(conversations).map((navGroup) => ((0, jsx_runtime_1.jsx)(react_core_1.MenuGroup, { className: "pf-chatbot__menu-item-header", label: navGroup, children: (0, jsx_runtime_1.jsx)(react_core_1.MenuList, { children: conversations[navGroup].map((conversation) => ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: getNavItem(conversation) }, conversation.id))) }) }, navGroup))) }));
42
+ return ((0, jsx_runtime_1.jsx)("div", { children: Object.keys(conversations).map((navGroup) => ((0, jsx_runtime_1.jsxs)("section", { children: [(0, jsx_runtime_1.jsx)(react_core_1.Title, Object.assign({ headingLevel: "h4", className: "pf-chatbot__conversation-list-header" }, titleProps, { children: navGroup })), (0, jsx_runtime_1.jsx)(react_core_1.List, Object.assign({ className: "pf-chatbot__conversation-list", isPlain: true }, listProps === null || listProps === void 0 ? void 0 : listProps[navGroup], { children: conversations[navGroup].map((conversation) => ((0, jsx_runtime_1.jsx)(react_1.Fragment, { children: getNavItem(conversation) }, conversation.id))) }))] }, navGroup))) }));
49
43
  }
50
44
  };
51
45
  // Menu Content
@@ -61,11 +55,11 @@ const ChatbotConversationHistoryNav = (_a) => {
61
55
  if (noResultsState) {
62
56
  return (0, jsx_runtime_1.jsx)(EmptyState_1.default, Object.assign({}, noResultsState));
63
57
  }
64
- return ((0, jsx_runtime_1.jsx)(react_core_1.Menu, Object.assign({ isPlain: true, onSelect: onSelectActiveItem, activeItemId: activeItemId }, menuProps, { children: (0, jsx_runtime_1.jsx)(react_core_1.MenuContent, { children: buildMenu() }) })));
58
+ return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: buildConversations() });
65
59
  };
66
60
  const renderDrawerContent = () => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(react_core_1.DrawerPanelBody, Object.assign({}, drawerPanelBodyProps, { children: renderMenuContent() })) }));
67
61
  const renderPanelContent = () => {
68
- const drawer = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.DrawerHead, Object.assign({}, drawerHeadProps, { children: (0, jsx_runtime_1.jsxs)(react_core_1.DrawerActions, Object.assign({ "data-testid": drawerActionsTestId, className: reverseButtonOrder ? 'pf-v6-c-drawer__actions--reversed' : '' }, drawerActionsProps, { children: [(0, jsx_runtime_1.jsx)(react_core_1.DrawerCloseButton, Object.assign({ onClick: onDrawerToggle }, drawerCloseButtonProps)), onNewChat && ((0, jsx_runtime_1.jsx)(react_core_1.Button, Object.assign({ size: isCompact ? 'sm' : undefined, onClick: onNewChat, icon: (0, jsx_runtime_1.jsx)(react_icons_1.PenToSquareIcon, {}) }, newChatButtonProps, { children: newChatButtonText })))] })) })), (0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__title-container", children: [(0, jsx_runtime_1.jsxs)(react_core_1.Title, { headingLevel: "h3", children: [(0, jsx_runtime_1.jsx)(react_core_1.Icon, { size: "lg", className: "pf-chatbot__title-icon", children: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedClockIcon, {}) }), title] }), !isLoading && handleTextInputChange && ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__input", children: (0, jsx_runtime_1.jsx)(react_core_1.SearchInput, { "aria-label": searchInputAriaLabel, onChange: (_event, value) => handleTextInputChange(value), placeholder: searchInputPlaceholder }) }))] }), isLoading ? (0, jsx_runtime_1.jsx)(LoadingState_1.default, Object.assign({}, loadingState)) : renderDrawerContent()] }));
62
+ const drawer = ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(react_core_1.DrawerHead, Object.assign({}, drawerHeadProps, { children: (0, jsx_runtime_1.jsxs)(react_core_1.DrawerActions, Object.assign({ "data-testid": drawerActionsTestId, className: reverseButtonOrder ? 'pf-v6-c-drawer__actions--reversed' : '' }, drawerActionsProps, { children: [(0, jsx_runtime_1.jsx)(react_core_1.DrawerCloseButton, Object.assign({ onClick: onDrawerToggle }, drawerCloseButtonProps)), onNewChat && ((0, jsx_runtime_1.jsx)(react_core_1.Button, Object.assign({ size: isCompact ? 'sm' : undefined, onClick: onNewChat, icon: (0, jsx_runtime_1.jsx)(react_icons_1.PenToSquareIcon, {}) }, newChatButtonProps, { children: newChatButtonText })))] })) })), (0, jsx_runtime_1.jsxs)("div", { className: "pf-chatbot__title-container", children: [(0, jsx_runtime_1.jsxs)(react_core_1.Title, { headingLevel: "h3", children: [(0, jsx_runtime_1.jsx)(react_core_1.Icon, { size: "lg", className: "pf-chatbot__title-icon", children: (0, jsx_runtime_1.jsx)(react_icons_1.OutlinedClockIcon, {}) }), title] }), !isLoading && handleTextInputChange && ((0, jsx_runtime_1.jsx)("div", { className: "pf-chatbot__input", children: (0, jsx_runtime_1.jsx)(react_core_1.SearchInput, Object.assign({ "aria-label": searchInputAriaLabel, onChange: (_event, value) => handleTextInputChange(value), placeholder: searchInputPlaceholder }, searchInputProps)) }))] }), isLoading ? (0, jsx_runtime_1.jsx)(LoadingState_1.default, Object.assign({}, loadingState)) : renderDrawerContent()] }));
69
63
  return ((0, jsx_runtime_1.jsx)(react_core_1.DrawerPanelContent, Object.assign({ "aria-live": "polite", focusTrap: { enabled: true }, defaultSize: "384px" }, drawerPanelContentProps, { children: drawer })));
70
64
  };
71
65
  // An onKeyDown property must be passed to the Drawer component to handle closing
package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.js CHANGED
@@ -198,4 +198,29 @@ describe('ChatbotConversationHistoryNav', () => {
198
198
  const iconElement = container.querySelector('.pf-chatbot__title-icon');
199
199
  expect(iconElement).toBeInTheDocument();
200
200
  });
201
+ it('Passes titleProps to Title', () => {
202
+ (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, titleProps: { className: 'test' } }));
203
+ expect(react_1.screen.getByRole('heading', { name: /Today/i })).toHaveClass('test');
204
+ });
205
+ it('Overrides Title heading level when titleProps.headingLevel is passed', () => {
206
+ (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, titleProps: { headingLevel: 'h2' } }));
207
+ expect(react_1.screen.queryByRole('heading', { name: /Today/i, level: 4 })).not.toBeInTheDocument();
208
+ expect(react_1.screen.getByRole('heading', { name: /Today/i, level: 2 })).toBeInTheDocument();
209
+ });
210
+ it('Passes listProps to List when conversations is an array', () => {
211
+ (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, listProps: { className: 'test' } }));
212
+ expect(react_1.screen.getByRole('list')).toHaveClass('test');
213
+ });
214
+ it('Passes listProps to List when conversations is an object', () => {
215
+ (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, listProps: { Today: { className: 'test' } } }));
216
+ expect(react_1.screen.getByRole('list')).toHaveClass('test');
217
+ });
218
+ it('Passes listItemProps to ListItem', () => {
219
+ (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: [{ id: '1', text: 'ChatBot documentation', listItemProps: { className: 'test' } }] }));
220
+ expect(react_1.screen.getByRole('listitem')).toHaveClass('test');
221
+ });
222
+ it('should be able to spread search input props when searchInputProps is passed', () => {
223
+ (0, react_1.render)((0, jsx_runtime_1.jsx)(ChatbotConversationHistoryNav_1.default, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: Chatbot_1.ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, handleTextInputChange: jest.fn(), searchInputProps: { value: 'I am a sample search' } }));
224
+ expect(react_1.screen.getByRole('dialog', { name: /Chat history I am a sample search/i })).toBeInTheDocument();
225
+ });
201
226
  });
package/dist/css/main.css CHANGED
@@ -206,47 +206,51 @@
206
206
  padding-inline-end: var(--pf-t--global--spacer--md);
207
207
  padding-inline-start: var(--pf-t--global--spacer--sm);
208
208
  }
209
- .pf-chatbot__history .pf-v6-c-menu {
210
- --pf-v6-c-menu--PaddingBlockStart: 0;
211
- --pf-v6-c-menu--BackgroundColor: var(--pf-t--global--background--color--floating--default);
212
- overflow: initial;
213
- position: relative;
214
- }
215
- .pf-chatbot__history .pf-v6-c-menu__item-main {
216
- --pf-v6-c-menu__item-main--ColumnGap: var(--pf-t--global--spacer--md);
209
+ .pf-chatbot__history .pf-chatbot__conversation-list {
210
+ --pf-v6-c-list--Gap: var(--pf-t--global--spacer--xs);
211
+ margin-block-start: var(--pf-t--global--spacer--md);
212
+ margin-block-end: var(--pf-t--global--spacer--md);
217
213
  }
218
- .pf-chatbot__history .pf-chatbot__menu-item-header > .pf-v6-c-menu__group-title {
214
+ .pf-chatbot__history .pf-chatbot__conversation-list-header {
219
215
  color: var(--pf-t--global--text--color--subtle);
220
216
  font-weight: var(--pf-t--global--font--weight--body--bold);
221
217
  font-size: var(--pf-t--global--icon--size--font--sm);
222
- --pf-v6-c-menu__group-title--PaddingInlineStart: var(--pf-t--global--spacer--sm);
223
- --pf-v6-c-menu__group-title--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
218
+ padding-inline-start: var(--pf-t--global--spacer--sm);
219
+ padding-inline-end: var(--pf-t--global--spacer--sm);
224
220
  position: -webkit-sticky;
225
221
  position: sticky;
226
222
  top: 0;
227
223
  background-color: var(--pf-t--global--background--color--floating--default);
228
224
  z-index: var(--pf-t--global--z-index--md);
229
225
  }
230
- .pf-chatbot__history .pf-chatbot__menu-item {
231
- --pf-v6-c-menu__item--PaddingInlineStart: var(--pf-t--global--spacer--sm);
232
- --pf-v6-c-menu__item--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
233
- padding-block-start: var(--pf-t--global--spacer--xs);
234
- padding-block-end: var(--pf-t--global--spacer--xs);
235
- color: var(--pf-t--global--text--color--regular);
236
- font-size: var(--pf-t--global--font--size--body--lg);
237
- font-weight: var(--pf-t--global--font--weight--body--default);
238
- border-radius: var(--pf-t--global--border--radius--small);
239
- }
240
- .pf-chatbot__history .pf-v6-c-menu__list-item.pf-chatbot__menu-item {
226
+ .pf-chatbot__history .pf-chatbot__conversation-list-item > span {
227
+ display: flex;
228
+ column-gap: var(--pf-t--global--spacer--sm);
229
+ }
230
+ .pf-chatbot__history .pf-chatbot__conversation-list-item .pf-chatbot__conversation-history-item {
231
+ --pf-v6-c-button--JustifyContent: flex-start;
232
+ --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--lg);
233
+ --pf-v6-c-button--m-link--Color: var(--pf-t--global--text--color--regular);
234
+ --pf-v6-c-button--m-link__icon--Color: var(--pf-t--global--icon--color--regular);
235
+ --pf-v6-c-button--m-link--hover--Color: var(--pf-t--global--text--color--regular--hover);
236
+ --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-t--global--icon--color--regular);
237
+ --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-t--global--text--color--regular--clicked);
238
+ --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-t--global--icon--color--regular);
239
+ column-gap: var(--pf-t--global--spacer--md);
240
+ flex-basis: 100%;
241
+ }
242
+ .pf-chatbot__history .pf-chatbot__conversation-list-item .pf-chatbot__conversation-history-item .pf-v6-c-button__text {
241
243
  overflow: hidden;
244
+ text-overflow: ellipsis;
245
+ white-space: nowrap;
242
246
  }
243
247
  .pf-chatbot__history .pf-chatbot__history-actions {
244
248
  transform: rotate(90deg);
245
249
  }
246
- .pf-chatbot__history .pf-chatbot__menu-item--active {
250
+ .pf-chatbot__history .pf-chatbot__conversation-list-item--active {
247
251
  background-color: var(--pf-t--global--background--color--action--plain--clicked);
248
252
  }
249
- .pf-chatbot__history button.pf-chatbot__menu-item--active {
253
+ .pf-chatbot__history button.pf-chatbot__conversation-list-item--active {
250
254
  background-color: initial;
251
255
  }
252
256
 
@@ -363,8 +367,8 @@
363
367
  --pf-v6-c-drawer__panel__body--PaddingInlineStart: var(--pf-t--global--spacer--md);
364
368
  --pf-v6-c-drawer__panel__body--PaddingInlineEnd: var(--pf-t--global--spacer--md);
365
369
  }
366
- .pf-chatbot__history.pf-m-compact .pf-chatbot__menu-item {
367
- font-size: var(--pf-t--global--font--size--body--md);
370
+ .pf-chatbot__history.pf-m-compact .pf-chatbot__conversation-history-item {
371
+ --pf-v6-c-button--FontSize: var(--pf-t--global--font--size--body--md);
368
372
  }
369
373
  .pf-chatbot__history.pf-m-compact .pf-v6-c-drawer__head {
370
374
  --pf-v6-c-drawer__head--PaddingInlineStart: var(--pf-t--global--spacer--lg);
@@ -590,7 +594,7 @@
590
594
  padding-block-end: var(--pf-t--global--spacer--xl);
591
595
  }
592
596
  .pf-chatbot__chatbot-modal .pf-v6-c-modal-box__header {
593
- padding-block-end: var(--pf-t--global--spacer--lg);
597
+ padding-block-end: var(--pf-t--global--spacer--sm);
594
598
  }
595
599
 
596
600
  @media screen and (max-width: 600px) {
package/dist/css/main.css.map CHANGED
@@ -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/FileDetails/FileDetails.scss","../../src/FileDetailsLabel/FileDetailsLabel.scss","../../src/FileDropZone/FileDropZone.scss","../../src/Message/Message.scss","../../src/Message/MessageLoading.scss","../../src/Message/CodeBlockMessage/CodeBlockMessage.scss","../../src/Message/TextMessage/TextMessage.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/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;;AAGA;EACE;;AAKF;EAvBF;IAwBI;IACA;;;AAIF;EA7BF;IA8BI;;;;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;;;ACpIF;EACE;EACA;EACA;;;ACAF;EACE;EACA;EACA;EACA;EACA;;AAGA;EARF;IASI;;;;AAOJ;EAII;AAAA;AAAA;IACE;IACA;;;ACrBJ;EACE;EACA;;AAQF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;;AAEF;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;;;ACtPN;EACE;;AAEA;EACE;EACA;;;ACHJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAMF;EAGI;AAAA;IACE;;EACA;AAAA;IACE;;EAGJ;AAAA;IACE;IACA;IACA;;;AASJ;EACE;;;AAQF;EACE;;;AAIJ;EACE;EACA;;;AC3DF;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;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;;AAEF;EACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;;AAEF;EACE;;AAGA;EACE;;;AAUF;EACE;EACA;;;AAKN;EACE;;;AAGF;EACE;;;AAIA;EACE;;;AC5FJ;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;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;;;ACvBF;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;;;;AChDR;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;;;AAMJ;EACE;EACA;EACA;;;AAGF;EACE;;;ACnGF;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;;AAGF;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;;;AAIA;EACE;EACA;;;AClFJ;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;;AAWF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AHmCJ;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;AEjIJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;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;;;AAIA;EACE;EACA;;;AEtFJ;EACE;EACA;EACA;EACA;EAGA;;;ADHF;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;;AAWF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AE1EN;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;;AAKF;AAAA;EAEE;EACA;EACA;;;ACtBJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;ALjBJ;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;;;;AMjDN;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;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;;;AC1HJ;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;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAII;AAAA;AAAA;IACE;IACA;;;AAMJ;EACE;;;AC/CJ;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;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;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;;;AChFJ;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;;;AC/CJ;EACE;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/FileDetails/FileDetails.scss","../../src/FileDetailsLabel/FileDetailsLabel.scss","../../src/FileDropZone/FileDropZone.scss","../../src/Message/Message.scss","../../src/Message/MessageLoading.scss","../../src/Message/CodeBlockMessage/CodeBlockMessage.scss","../../src/Message/TextMessage/TextMessage.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/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;;AAGA;EACE;;AAKF;EAvBF;IAwBI;IACA;;;AAIF;EA7BF;IA8BI;;;;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;;;ACpIF;EACE;EACA;EACA;;;ACAF;EACE;EACA;EACA;EACA;EACA;;AAGA;EARF;IASI;;;;AAOJ;EAII;AAAA;AAAA;IACE;IACA;;;ACrBJ;EACE;EACA;;AAKF;EACE;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;;AAIF;EACE;EAEA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;;AAEA;EACE;EACA;EACA;;AAKN;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;;;AC9PN;EACE;;AAEA;EACE;EACA;;;ACHJ;EACE;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;EACA;EACA;;;AAMF;EAGI;AAAA;IACE;;EACA;AAAA;IACE;;EAGJ;AAAA;IACE;IACA;IACA;;;AASJ;EACE;;;AAQF;EACE;;;AAIJ;EACE;EACA;;;AC3DF;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;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;;AAEF;EACE;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;AAEF;EACE;EACA;;AAEF;EACE;;AAGA;EACE;;;AAUF;EACE;EACA;;;AAKN;EACE;;;AAGF;EACE;;;AAIA;EACE;;;AC5FJ;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;EACA;EACA;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;;;AAIF;EACE;EACA;EACA;EACA;EACA;;;ACvBF;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;;;;AChDR;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;;;AAMJ;EACE;EACA;EACA;;;AAGF;EACE;;;ACnGF;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;;AAGF;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;;;AAIA;EACE;EACA;;;AClFJ;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;;AAWF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AHmCJ;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;AEjIJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;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;;;AAIA;EACE;EACA;;;AEtFJ;EACE;EACA;EACA;EACA;EAGA;;;ADHF;EACE;;AAGE;EACE;;;AAMN;EACE;EACA;EACA;;AAEA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AAKF;EACE;EACA;EACA;EACA;;AACA;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;;AAWF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;AAGF;EACE;EACA;;;AE1EN;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;EAGE;;;AAKF;AAAA;EAEE;EACA;EACA;;;ACtBJ;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;;ALjBJ;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;;;;AMjDN;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;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;;;AC1HJ;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;;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAGF;EAII;AAAA;AAAA;IACE;IACA;;;AAMJ;EACE;;;AC/CJ;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;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAIJ;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;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;;;AChFJ;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;;;AC/CJ;EACE;EACA","file":"main.css"}
package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.js CHANGED
@@ -7,7 +7,7 @@ export const ChatbotConversationHistoryDropdown = ({ menuItems, menuClassName, o
7
7
  const [isOpen, setIsOpen] = useState(false);
8
8
  const toggle = (toggleRef) => (_jsx(Tooltip, { className: "pf-chatbot__tooltip", content: label !== null && label !== void 0 ? label : 'Conversation options', position: "bottom",
9
9
  // prevents VO announcements of both aria label and tooltip
10
- aria: "none", children: _jsx(MenuToggle, { className: "pf-chatbot__history-actions", variant: "plain", "aria-label": label !== null && label !== void 0 ? label : 'Conversation options', ref: toggleRef, isExpanded: isOpen, onClick: () => setIsOpen(!isOpen), role: "menuitem", children: _jsx(EllipsisIcon, {}) }) }));
10
+ aria: "none", children: _jsx(MenuToggle, { className: "pf-chatbot__history-actions", variant: "plain", "aria-label": label !== null && label !== void 0 ? label : 'Conversation options', ref: toggleRef, isExpanded: isOpen, onClick: () => setIsOpen(!isOpen), children: _jsx(EllipsisIcon, {}) }) }));
11
11
  return (_jsx(Dropdown, { className: `pf-chatbot__selections ${menuClassName !== null && menuClassName !== void 0 ? menuClassName : ''}`, isOpen: isOpen, onSelect: (props) => {
12
12
  onSelect === null || onSelect === void 0 ? void 0 : onSelect(props);
13
13
  setIsOpen((prev) => !prev);
package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.test.js CHANGED
@@ -17,11 +17,11 @@ describe('ChatbotConversationHistoryDropdown', () => {
17
17
  const menuItems = (_jsxs(_Fragment, { children: [_jsx(DropdownItem, { children: "Rename" }), _jsx(DropdownItem, { children: "Delete" })] }));
18
18
  it('should render the dropdown', () => {
19
19
  render(_jsx(ChatbotConversationHistoryDropdown, { menuItems: menuItems, menuClassName: "custom-class" }));
20
- expect(screen.queryByRole('menuitem', { name: /Conversation options/i })).toBeInTheDocument();
20
+ expect(screen.queryByRole('button', { name: /Conversation options/i })).toBeInTheDocument();
21
21
  });
22
22
  it('should display the dropdown menuItems', () => {
23
23
  render(_jsx(ChatbotConversationHistoryDropdown, { menuItems: menuItems }));
24
- const toggle = screen.queryByRole('menuitem', { name: /Conversation options/i });
24
+ const toggle = screen.queryByRole('button', { name: /Conversation options/i });
25
25
  expect(toggle).toBeInTheDocument();
26
26
  fireEvent.click(toggle);
27
27
  waitFor(() => {
@@ -31,14 +31,14 @@ describe('ChatbotConversationHistoryDropdown', () => {
31
31
  });
32
32
  it('should invoke onSelect callback when menuitem is clicked', () => {
33
33
  render(_jsx(ChatbotConversationHistoryDropdown, { menuItems: menuItems, onSelect: onSelect }));
34
- const toggle = screen.queryByRole('menuitem', { name: /Conversation options/i });
34
+ const toggle = screen.queryByRole('button', { name: /Conversation options/i });
35
35
  fireEvent.click(toggle);
36
36
  fireEvent.click(screen.getByText('Rename'));
37
37
  expect(onSelect).toHaveBeenCalled();
38
38
  });
39
39
  it('should toggle the dropdown when menuitem is clicked', () => {
40
40
  render(_jsx(ChatbotConversationHistoryDropdown, { menuItems: menuItems, onSelect: onSelect }));
41
- const toggle = screen.queryByRole('menuitem', { name: /Conversation options/i });
41
+ const toggle = screen.queryByRole('button', { name: /Conversation options/i });
42
42
  fireEvent.click(toggle);
43
43
  fireEvent.click(screen.getByText('Delete'));
44
44
  expect(onSelect).toHaveBeenCalled();
@@ -46,7 +46,7 @@ describe('ChatbotConversationHistoryDropdown', () => {
46
46
  });
47
47
  it('should close the dropdown when user clicks outside', () => {
48
48
  render(_jsx(ChatbotConversationHistoryDropdown, { menuItems: menuItems, onSelect: onSelect }));
49
- const toggle = screen.queryByRole('menuitem', { name: /Conversation options/i });
49
+ const toggle = screen.queryByRole('button', { name: /Conversation options/i });
50
50
  fireEvent.click(toggle);
51
51
  expect(screen.queryByText('Delete')).toBeInTheDocument();
52
52
  fireEvent.click(toggle.parentElement);
@@ -54,7 +54,7 @@ describe('ChatbotConversationHistoryDropdown', () => {
54
54
  });
55
55
  it('should show the tooltip when the user hovers over the toggle button', () => __awaiter(void 0, void 0, void 0, function* () {
56
56
  render(_jsx(ChatbotConversationHistoryDropdown, { menuItems: menuItems, label: "Actions dropdown" }));
57
- const toggle = screen.queryByRole('menuitem', { name: /Actions dropdown/i });
57
+ const toggle = screen.queryByRole('button', { name: /Actions dropdown/i });
58
58
  fireEvent(toggle, new MouseEvent('mouseenter', {
59
59
  bubbles: false,
60
60
  cancelable: false
package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import type { FunctionComponent } from 'react';
2
- import { DrawerProps, MenuItemProps, MenuProps, DrawerPanelContentProps, DrawerContentProps, DrawerContentBodyProps, DrawerHeadProps, DrawerActionsProps, DrawerCloseButtonProps, DrawerPanelBodyProps, SkeletonProps, ButtonProps } from '@patternfly/react-core';
2
+ import { ButtonProps, DrawerProps, ListItemProps, DrawerPanelContentProps, DrawerContentProps, DrawerContentBodyProps, DrawerHeadProps, DrawerActionsProps, DrawerCloseButtonProps, DrawerPanelBodyProps, SkeletonProps, MenuProps, // Remove in next breaking change
3
+ TitleProps, ListProps, SearchInputProps } from '@patternfly/react-core';
3
4
  import { ChatbotDisplayMode } from '../Chatbot/Chatbot';
4
5
  import { HistoryEmptyStateProps } from './EmptyState';
5
6
  export interface Conversation {
@@ -19,8 +20,10 @@ export interface Conversation {
19
20
  label?: string;
20
21
  /** Callback for when user selects item. */
21
22
  onSelect?: (event?: React.MouseEvent, value?: string | number) => void;
22
- /** Additional props passed to conversation menu item */
23
- additionalProps?: MenuItemProps;
23
+ /** Additional props passed to conversation button item */
24
+ additionalProps?: ButtonProps;
25
+ /** Additional props passed to conversation list item */
26
+ listItemProps?: Omit<ListItemProps, 'children'>;
24
27
  }
25
28
  export interface ChatbotConversationHistoryNavProps extends DrawerProps {
26
29
  /** Function called to toggle drawer */
@@ -38,6 +41,12 @@ export interface ChatbotConversationHistoryNavProps extends DrawerProps {
38
41
  };
39
42
  /** Additional button props for new chat button. */
40
43
  newChatButtonProps?: ButtonProps;
44
+ /** Additional props applied to all conversation list headers */
45
+ titleProps?: Partial<TitleProps>;
46
+ /** Additional props applied to conversation list. If conversations is an object, you should pass an object of ListProps for each group. */
47
+ listProps?: ListProps | {
48
+ [key: string]: ListProps;
49
+ };
41
50
  /** Text shown in blue button */
42
51
  newChatButtonText?: string;
43
52
  /** Callback function for when blue button is clicked. Omit to hide blue "new chat button" */
@@ -48,6 +57,8 @@ export interface ChatbotConversationHistoryNavProps extends DrawerProps {
48
57
  searchInputPlaceholder?: string;
49
58
  /** Aria label for search input */
50
59
  searchInputAriaLabel?: string;
60
+ /** Additional props passed to search input */
61
+ searchInputProps?: SearchInputProps;
51
62
  /** A callback for when the input value changes. Omit to hide input field */
52
63
  handleTextInputChange?: (value: string) => void;
53
64
  /** Display mode of chatbot */
@@ -56,7 +67,7 @@ export interface ChatbotConversationHistoryNavProps extends DrawerProps {
56
67
  reverseButtonOrder?: boolean;
57
68
  /** Custom test id for the drawer actions */
58
69
  drawerActionsTestId?: string;
59
- /** Additional props applied to menu */
70
+ /** @deprecated Additional props applied to list container */
60
71
  menuProps?: MenuProps;
61
72
  /** Additional props applied to panel */
62
73
  drawerPanelContentProps?: DrawerPanelContentProps;
package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.js CHANGED
@@ -12,34 +12,28 @@ var __rest = (this && this.__rest) || function (s, e) {
12
12
  import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
13
13
  import { useRef, Fragment } from 'react';
14
14
  // Import PatternFly components
15
- import { Button, Drawer, DrawerPanelContent, DrawerContent, DrawerPanelBody, DrawerHead, DrawerActions, DrawerCloseButton, DrawerContentBody, SearchInput, Menu, MenuList, MenuGroup, MenuItem, MenuContent, Title, Icon } from '@patternfly/react-core';
15
+ import { Button, Drawer, DrawerPanelContent, DrawerContent, DrawerPanelBody, DrawerHead, DrawerActions, DrawerCloseButton, DrawerContentBody, SearchInput, List, ListItem, Title, Icon } from '@patternfly/react-core';
16
16
  import { OutlinedClockIcon, OutlinedCommentAltIcon, PenToSquareIcon } from '@patternfly/react-icons';
17
17
  import { ChatbotDisplayMode } from '../Chatbot/Chatbot';
18
18
  import ConversationHistoryDropdown from './ChatbotConversationHistoryDropdown';
19
19
  import LoadingState from './LoadingState';
20
20
  import HistoryEmptyState from './EmptyState';
21
21
  export const ChatbotConversationHistoryNav = (_a) => {
22
- var { onDrawerToggle, isDrawerOpen, setIsDrawerOpen, activeItemId, onSelectActiveItem, conversations, newChatButtonText = 'New chat', drawerContent, onNewChat, newChatButtonProps, searchInputPlaceholder = 'Search previous conversations...', searchInputAriaLabel = 'Filter menu items', handleTextInputChange, displayMode, reverseButtonOrder = false, drawerActionsTestId = 'chatbot-nav-drawer-actions', menuProps, drawerPanelContentProps, drawerContentProps, drawerContentBodyProps, drawerHeadProps, drawerActionsProps, drawerCloseButtonProps, drawerPanelBodyProps, isLoading, loadingState, errorState, emptyState, noResultsState, isCompact, title = 'Chat history' } = _a, props = __rest(_a, ["onDrawerToggle", "isDrawerOpen", "setIsDrawerOpen", "activeItemId", "onSelectActiveItem", "conversations", "newChatButtonText", "drawerContent", "onNewChat", "newChatButtonProps", "searchInputPlaceholder", "searchInputAriaLabel", "handleTextInputChange", "displayMode", "reverseButtonOrder", "drawerActionsTestId", "menuProps", "drawerPanelContentProps", "drawerContentProps", "drawerContentBodyProps", "drawerHeadProps", "drawerActionsProps", "drawerCloseButtonProps", "drawerPanelBodyProps", "isLoading", "loadingState", "errorState", "emptyState", "noResultsState", "isCompact", "title"]);
22
+ var { onDrawerToggle, isDrawerOpen, setIsDrawerOpen, activeItemId, onSelectActiveItem, conversations, titleProps, listProps, newChatButtonText = 'New chat', drawerContent, onNewChat, newChatButtonProps, searchInputPlaceholder = 'Search previous conversations...', searchInputAriaLabel = 'Filter menu items', searchInputProps, handleTextInputChange, displayMode, reverseButtonOrder = false, drawerActionsTestId = 'chatbot-nav-drawer-actions', drawerPanelContentProps, drawerContentProps, drawerContentBodyProps, drawerHeadProps, drawerActionsProps, drawerCloseButtonProps, drawerPanelBodyProps, isLoading, loadingState, errorState, emptyState, noResultsState, isCompact, title = 'Chat history' } = _a, props = __rest(_a, ["onDrawerToggle", "isDrawerOpen", "setIsDrawerOpen", "activeItemId", "onSelectActiveItem", "conversations", "titleProps", "listProps", "newChatButtonText", "drawerContent", "onNewChat", "newChatButtonProps", "searchInputPlaceholder", "searchInputAriaLabel", "searchInputProps", "handleTextInputChange", "displayMode", "reverseButtonOrder", "drawerActionsTestId", "drawerPanelContentProps", "drawerContentProps", "drawerContentBodyProps", "drawerHeadProps", "drawerActionsProps", "drawerCloseButtonProps", "drawerPanelBodyProps", "isLoading", "loadingState", "errorState", "emptyState", "noResultsState", "isCompact", "title"]);
23
23
  const drawerRef = useRef(null);
24
24
  const onExpand = () => {
25
25
  drawerRef.current && drawerRef.current.focus();
26
26
  };
27
27
  const getNavItem = (conversation) => {
28
28
  var _a;
29
- return (_jsx(MenuItem, Object.assign({ className: `pf-chatbot__menu-item ${activeItemId && activeItemId === conversation.id ? 'pf-chatbot__menu-item--active' : ''}`, itemId: conversation.id }, (conversation.noIcon ? {} : { icon: (_a = conversation.icon) !== null && _a !== void 0 ? _a : _jsx(OutlinedCommentAltIcon, {}) }), (conversation.menuItems
30
- ? {
31
- actions: (_jsx(ConversationHistoryDropdown, { menuClassName: conversation.menuClassName, onSelect: conversation.onSelect, menuItems: conversation.menuItems, label: conversation.label }))
32
- }
33
- : {}), conversation.additionalProps, { children: conversation.text }), conversation.id));
29
+ return (_jsx(ListItem, Object.assign({ className: `pf-chatbot__conversation-list-item ${activeItemId && activeItemId === conversation.id ? 'pf-chatbot__conversation-list-item--active' : ''}` }, conversation.listItemProps, { children: _jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ className: "pf-chatbot__conversation-history-item", variant: "link" }, conversation.additionalProps, (conversation.noIcon ? {} : { icon: (_a = conversation.icon) !== null && _a !== void 0 ? _a : _jsx(OutlinedCommentAltIcon, {}) }), { onClick: (event) => onSelectActiveItem === null || onSelectActiveItem === void 0 ? void 0 : onSelectActiveItem(event, conversation.id), children: conversation.text })), conversation.menuItems && (_jsx(ConversationHistoryDropdown, { menuClassName: conversation.menuClassName, onSelect: conversation.onSelect, menuItems: conversation.menuItems, label: conversation.label }))] }) }), conversation.id));
34
30
  };
35
- const buildMenu = () => {
31
+ const buildConversations = () => {
36
32
  if (Array.isArray(conversations)) {
37
- // Render for array of MenuItemObject
38
- return (_jsx(MenuList, { children: conversations.map((conversation) => (_jsx(Fragment, { children: getNavItem(conversation) }, conversation.id))) }));
33
+ return (_jsx(List, Object.assign({ className: "pf-chatbot__conversation-list", isPlain: true }, listProps, { children: conversations.map((conversation) => (_jsx(Fragment, { children: getNavItem(conversation) }, conversation.id))) })));
39
34
  }
40
35
  else {
41
- // Render for object with NavItemObject arrays as values
42
- return (_jsx(_Fragment, { children: Object.keys(conversations).map((navGroup) => (_jsx(MenuGroup, { className: "pf-chatbot__menu-item-header", label: navGroup, children: _jsx(MenuList, { children: conversations[navGroup].map((conversation) => (_jsx(Fragment, { children: getNavItem(conversation) }, conversation.id))) }) }, navGroup))) }));
36
+ return (_jsx("div", { children: Object.keys(conversations).map((navGroup) => (_jsxs("section", { children: [_jsx(Title, Object.assign({ headingLevel: "h4", className: "pf-chatbot__conversation-list-header" }, titleProps, { children: navGroup })), _jsx(List, Object.assign({ className: "pf-chatbot__conversation-list", isPlain: true }, listProps === null || listProps === void 0 ? void 0 : listProps[navGroup], { children: conversations[navGroup].map((conversation) => (_jsx(Fragment, { children: getNavItem(conversation) }, conversation.id))) }))] }, navGroup))) }));
43
37
  }
44
38
  };
45
39
  // Menu Content
@@ -55,11 +49,11 @@ export const ChatbotConversationHistoryNav = (_a) => {
55
49
  if (noResultsState) {
56
50
  return _jsx(HistoryEmptyState, Object.assign({}, noResultsState));
57
51
  }
58
- return (_jsx(Menu, Object.assign({ isPlain: true, onSelect: onSelectActiveItem, activeItemId: activeItemId }, menuProps, { children: _jsx(MenuContent, { children: buildMenu() }) })));
52
+ return _jsx(_Fragment, { children: buildConversations() });
59
53
  };
60
54
  const renderDrawerContent = () => (_jsx(_Fragment, { children: _jsx(DrawerPanelBody, Object.assign({}, drawerPanelBodyProps, { children: renderMenuContent() })) }));
61
55
  const renderPanelContent = () => {
62
- const drawer = (_jsxs(_Fragment, { children: [_jsx(DrawerHead, Object.assign({}, drawerHeadProps, { children: _jsxs(DrawerActions, Object.assign({ "data-testid": drawerActionsTestId, className: reverseButtonOrder ? 'pf-v6-c-drawer__actions--reversed' : '' }, drawerActionsProps, { children: [_jsx(DrawerCloseButton, Object.assign({ onClick: onDrawerToggle }, drawerCloseButtonProps)), onNewChat && (_jsx(Button, Object.assign({ size: isCompact ? 'sm' : undefined, onClick: onNewChat, icon: _jsx(PenToSquareIcon, {}) }, newChatButtonProps, { children: newChatButtonText })))] })) })), _jsxs("div", { className: "pf-chatbot__title-container", children: [_jsxs(Title, { headingLevel: "h3", children: [_jsx(Icon, { size: "lg", className: "pf-chatbot__title-icon", children: _jsx(OutlinedClockIcon, {}) }), title] }), !isLoading && handleTextInputChange && (_jsx("div", { className: "pf-chatbot__input", children: _jsx(SearchInput, { "aria-label": searchInputAriaLabel, onChange: (_event, value) => handleTextInputChange(value), placeholder: searchInputPlaceholder }) }))] }), isLoading ? _jsx(LoadingState, Object.assign({}, loadingState)) : renderDrawerContent()] }));
56
+ const drawer = (_jsxs(_Fragment, { children: [_jsx(DrawerHead, Object.assign({}, drawerHeadProps, { children: _jsxs(DrawerActions, Object.assign({ "data-testid": drawerActionsTestId, className: reverseButtonOrder ? 'pf-v6-c-drawer__actions--reversed' : '' }, drawerActionsProps, { children: [_jsx(DrawerCloseButton, Object.assign({ onClick: onDrawerToggle }, drawerCloseButtonProps)), onNewChat && (_jsx(Button, Object.assign({ size: isCompact ? 'sm' : undefined, onClick: onNewChat, icon: _jsx(PenToSquareIcon, {}) }, newChatButtonProps, { children: newChatButtonText })))] })) })), _jsxs("div", { className: "pf-chatbot__title-container", children: [_jsxs(Title, { headingLevel: "h3", children: [_jsx(Icon, { size: "lg", className: "pf-chatbot__title-icon", children: _jsx(OutlinedClockIcon, {}) }), title] }), !isLoading && handleTextInputChange && (_jsx("div", { className: "pf-chatbot__input", children: _jsx(SearchInput, Object.assign({ "aria-label": searchInputAriaLabel, onChange: (_event, value) => handleTextInputChange(value), placeholder: searchInputPlaceholder }, searchInputProps)) }))] }), isLoading ? _jsx(LoadingState, Object.assign({}, loadingState)) : renderDrawerContent()] }));
63
57
  return (_jsx(DrawerPanelContent, Object.assign({ "aria-live": "polite", focusTrap: { enabled: true }, defaultSize: "384px" }, drawerPanelContentProps, { children: drawer })));
64
58
  };
65
59
  // An onKeyDown property must be passed to the Drawer component to handle closing
package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.js CHANGED
@@ -193,4 +193,29 @@ describe('ChatbotConversationHistoryNav', () => {
193
193
  const iconElement = container.querySelector('.pf-chatbot__title-icon');
194
194
  expect(iconElement).toBeInTheDocument();
195
195
  });
196
+ it('Passes titleProps to Title', () => {
197
+ render(_jsx(ChatbotConversationHistoryNav, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, titleProps: { className: 'test' } }));
198
+ expect(screen.getByRole('heading', { name: /Today/i })).toHaveClass('test');
199
+ });
200
+ it('Overrides Title heading level when titleProps.headingLevel is passed', () => {
201
+ render(_jsx(ChatbotConversationHistoryNav, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, titleProps: { headingLevel: 'h2' } }));
202
+ expect(screen.queryByRole('heading', { name: /Today/i, level: 4 })).not.toBeInTheDocument();
203
+ expect(screen.getByRole('heading', { name: /Today/i, level: 2 })).toBeInTheDocument();
204
+ });
205
+ it('Passes listProps to List when conversations is an array', () => {
206
+ render(_jsx(ChatbotConversationHistoryNav, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, listProps: { className: 'test' } }));
207
+ expect(screen.getByRole('list')).toHaveClass('test');
208
+ });
209
+ it('Passes listProps to List when conversations is an object', () => {
210
+ render(_jsx(ChatbotConversationHistoryNav, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: { Today: initialConversations }, listProps: { Today: { className: 'test' } } }));
211
+ expect(screen.getByRole('list')).toHaveClass('test');
212
+ });
213
+ it('Passes listItemProps to ListItem', () => {
214
+ render(_jsx(ChatbotConversationHistoryNav, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: [{ id: '1', text: 'ChatBot documentation', listItemProps: { className: 'test' } }] }));
215
+ expect(screen.getByRole('listitem')).toHaveClass('test');
216
+ });
217
+ it('should be able to spread search input props when searchInputProps is passed', () => {
218
+ render(_jsx(ChatbotConversationHistoryNav, { onDrawerToggle: onDrawerToggle, isDrawerOpen: true, displayMode: ChatbotDisplayMode.fullscreen, setIsDrawerOpen: jest.fn(), conversations: initialConversations, handleTextInputChange: jest.fn(), searchInputProps: { value: 'I am a sample search' } }));
219
+ expect(screen.getByRole('dialog', { name: /Chat history I am a sample search/i })).toBeInTheDocument();
220
+ });
196
221
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/chatbot",
3
- "version": "6.4.0-prerelease.5",
3
+ "version": "6.4.0-prerelease.7",
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",