diff --git a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx index 5a3d01855..acbdafac1 100644 --- a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx +++ b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx @@ -561,4 +561,20 @@ describe('ChatbotConversationHistoryNav', () => { ); expect(screen.getByRole('listitem')).toHaveClass('test'); }); + + it('should be able to spread search input props when searchInputProps is passed', () => { + render( + + ); + + expect(screen.getByRole('dialog', { name: /Chat history I am a sample search/i })).toBeInTheDocument(); + }); }); diff --git a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx index af464f1cf..237e7fdaf 100644 --- a/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx +++ b/packages/module/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx @@ -34,7 +34,8 @@ import { Icon, MenuProps, // Remove in next breaking change TitleProps, - ListProps + ListProps, + SearchInputProps } from '@patternfly/react-core'; import { OutlinedClockIcon, OutlinedCommentAltIcon, PenToSquareIcon } from '@patternfly/react-icons'; @@ -94,6 +95,8 @@ export interface ChatbotConversationHistoryNavProps extends DrawerProps { searchInputPlaceholder?: string; /** Aria label for search input */ searchInputAriaLabel?: string; + /** Additional props passed to search input */ + searchInputProps?: SearchInputProps; /** A callback for when the input value changes. Omit to hide input field */ handleTextInputChange?: (value: string) => void; /** Display mode of chatbot */ @@ -149,6 +152,7 @@ export const ChatbotConversationHistoryNav: FunctionComponent handleTextInputChange(value)} placeholder={searchInputPlaceholder} + {...searchInputProps} /> )}