@patternfly/chatbot 2.2.0-prerelease.9 → 2.2.1
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.
- package/dist/cjs/AttachmentEdit/AttachmentEdit.test.d.ts +1 -0
- package/dist/cjs/AttachmentEdit/AttachmentEdit.test.js +52 -0
- package/dist/cjs/Chatbot/Chatbot.d.ts +2 -1
- package/dist/cjs/Chatbot/Chatbot.js +1 -0
- package/dist/cjs/Chatbot/Chatbot.test.d.ts +1 -0
- package/dist/cjs/Chatbot/Chatbot.test.js +28 -0
- package/dist/cjs/ChatbotAlert/ChatbotAlert.test.d.ts +1 -0
- package/dist/cjs/ChatbotAlert/ChatbotAlert.test.js +27 -0
- package/dist/cjs/ChatbotContent/ChatbotContent.test.d.ts +1 -0
- package/dist/cjs/ChatbotContent/ChatbotContent.test.js +18 -0
- package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.d.ts +3 -3
- package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.js +3 -1
- package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.d.ts +27 -4
- package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.js +24 -12
- package/dist/cjs/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.js +99 -3
- package/dist/cjs/ChatbotConversationHistoryNav/EmptyState.d.ts +11 -0
- package/dist/cjs/ChatbotConversationHistoryNav/EmptyState.js +29 -0
- package/dist/cjs/ChatbotConversationHistoryNav/LoadingState.d.ts +4 -0
- package/dist/cjs/ChatbotConversationHistoryNav/LoadingState.js +45 -0
- package/dist/cjs/ChatbotFooter/ChatbotFooter.test.d.ts +1 -0
- package/dist/cjs/ChatbotFooter/ChatbotFooter.test.js +18 -0
- package/dist/cjs/ChatbotFooter/ChatbotFooternote.test.d.ts +1 -0
- package/dist/cjs/ChatbotFooter/ChatbotFooternote.test.js +87 -0
- package/dist/cjs/ChatbotFooter/ChatbotFootnote.d.ts +1 -1
- package/dist/cjs/ChatbotFooter/ChatbotFootnote.js +1 -1
- package/dist/cjs/ChatbotHeader/ChatbotHeader.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeader.test.js +18 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderActions.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderActions.test.js +18 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderCloseButton.js +3 -1
- package/dist/cjs/ChatbotHeader/ChatbotHeaderCloseButton.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderCloseButton.test.js +20 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderMain.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderMain.test.js +18 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderMenu.js +3 -1
- package/dist/cjs/ChatbotHeader/ChatbotHeaderMenu.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderMenu.test.js +20 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderOptionsDropdown.js +3 -1
- package/dist/cjs/ChatbotHeader/ChatbotHeaderOptionsDropdown.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderOptionsDropdown.test.js +43 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderSelectorDropdown.js +6 -4
- package/dist/cjs/ChatbotHeader/ChatbotHeaderSelectorDropdown.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderSelectorDropdown.test.js +41 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderTitle.d.ts +3 -1
- package/dist/cjs/ChatbotHeader/ChatbotHeaderTitle.js +4 -2
- package/dist/cjs/ChatbotHeader/ChatbotHeaderTitle.test.d.ts +1 -0
- package/dist/cjs/ChatbotHeader/ChatbotHeaderTitle.test.js +55 -0
- package/dist/cjs/ChatbotToggle/ChatbotToggle.js +3 -1
- package/dist/cjs/ChatbotWelcomePrompt/ChatbotWelcomePrompt.test.js +19 -11
- package/dist/cjs/Compare/Compare.d.ts +17 -0
- package/dist/cjs/Compare/Compare.js +50 -0
- package/dist/cjs/Compare/Compare.test.d.ts +1 -0
- package/dist/cjs/Compare/Compare.test.js +20 -0
- package/dist/cjs/Compare/index.d.ts +2 -0
- package/dist/cjs/Compare/index.js +23 -0
- package/dist/cjs/Message/ErrorMessage/ErrorMessage.d.ts +4 -0
- package/dist/cjs/Message/ErrorMessage/ErrorMessage.js +26 -0
- package/dist/cjs/Message/ImageMessage/ImageMessage.d.ts +4 -0
- package/dist/cjs/Message/ImageMessage/ImageMessage.js +25 -0
- package/dist/cjs/Message/LinkMessage/LinkMessage.d.ts +4 -0
- package/dist/cjs/Message/LinkMessage/LinkMessage.js +30 -0
- package/dist/cjs/Message/Message.d.ts +35 -8
- package/dist/cjs/Message/Message.js +68 -18
- package/dist/cjs/Message/Message.test.js +239 -3
- package/dist/cjs/Message/QuickResponse/QuickResponse.d.ts +17 -0
- package/dist/cjs/Message/QuickResponse/QuickResponse.js +34 -0
- package/dist/cjs/Message/TableMessage/TableMessage.d.ts +20 -0
- package/dist/cjs/Message/TableMessage/TableMessage.js +67 -0
- package/dist/cjs/Message/TableMessage/TbodyMessage.d.ts +7 -0
- package/dist/cjs/Message/TableMessage/TbodyMessage.js +33 -0
- package/dist/cjs/Message/TableMessage/TdMessage.d.ts +5 -0
- package/dist/cjs/Message/TableMessage/TdMessage.js +26 -0
- package/dist/cjs/Message/TableMessage/ThMessage.d.ts +5 -0
- package/dist/cjs/Message/TableMessage/ThMessage.js +26 -0
- package/dist/cjs/Message/TableMessage/TheadMessage.d.ts +5 -0
- package/dist/cjs/Message/TableMessage/TheadMessage.js +26 -0
- package/dist/cjs/Message/TableMessage/TrMessage.d.ts +7 -0
- package/dist/cjs/Message/TableMessage/TrMessage.js +37 -0
- package/dist/cjs/Message/TextMessage/TextMessage.d.ts +2 -1
- package/dist/cjs/Message/TextMessage/TextMessage.js +2 -2
- package/dist/cjs/Message/UserFeedback/CloseButton.d.ts +10 -0
- package/dist/cjs/Message/UserFeedback/CloseButton.js +14 -0
- package/dist/cjs/Message/UserFeedback/UserFeedback.d.ts +39 -0
- package/dist/cjs/Message/UserFeedback/UserFeedback.js +54 -0
- package/dist/cjs/Message/UserFeedback/UserFeedback.test.d.ts +1 -0
- package/dist/cjs/Message/UserFeedback/UserFeedback.test.js +133 -0
- package/dist/cjs/Message/UserFeedback/UserFeedbackComplete.d.ts +42 -0
- package/dist/cjs/Message/UserFeedback/UserFeedbackComplete.js +117 -0
- package/dist/cjs/Message/UserFeedback/UserFeedbackComplete.test.d.ts +1 -0
- package/dist/cjs/Message/UserFeedback/UserFeedbackComplete.test.js +249 -0
- package/dist/cjs/MessageBar/AttachButton.js +4 -2
- package/dist/cjs/MessageBar/MessageBar.d.ts +11 -4
- package/dist/cjs/MessageBar/MessageBar.js +127 -46
- package/dist/cjs/MessageBar/MessageBar.test.js +12 -4
- package/dist/cjs/MessageBar/MicrophoneButton.d.ts +1 -1
- package/dist/cjs/MessageBar/SendButton.js +3 -1
- package/dist/cjs/MessageBar/StopButton.js +3 -1
- package/dist/cjs/MessageBox/MessageBox.test.d.ts +1 -0
- package/dist/cjs/MessageBox/MessageBox.test.js +22 -0
- package/dist/cjs/PreviewAttachment/PreviewAttachment.test.d.ts +1 -0
- package/dist/cjs/PreviewAttachment/PreviewAttachment.test.js +28 -0
- package/dist/cjs/ResponseActions/ResponseActionButton.d.ts +4 -1
- package/dist/cjs/ResponseActions/ResponseActionButton.js +21 -6
- package/dist/cjs/ResponseActions/ResponseActions.d.ts +8 -2
- package/dist/cjs/ResponseActions/ResponseActions.js +7 -7
- package/dist/cjs/ResponseActions/ResponseActions.test.js +2 -2
- package/dist/cjs/Settings/SettingsForm.test.d.ts +1 -0
- package/dist/cjs/Settings/SettingsForm.test.js +26 -0
- package/dist/cjs/__mocks__/rehype-external-links.d.ts +2 -0
- package/dist/cjs/__mocks__/rehype-external-links.js +4 -0
- package/dist/cjs/__mocks__/rehype-sanitize.d.ts +2 -0
- package/dist/cjs/__mocks__/rehype-sanitize.js +4 -0
- package/dist/cjs/__mocks__/rehype-unwrap-images.d.ts +2 -0
- package/dist/cjs/__mocks__/rehype-unwrap-images.js +4 -0
- package/dist/cjs/index.d.ts +4 -0
- package/dist/cjs/index.js +7 -1
- package/dist/cjs/tracking/console_tracking_provider.d.ts +10 -0
- package/dist/cjs/tracking/console_tracking_provider.js +27 -0
- package/dist/cjs/tracking/index.d.ts +2 -0
- package/dist/cjs/tracking/index.js +23 -0
- package/dist/cjs/tracking/posthog_tracking_provider.d.ts +9 -0
- package/dist/cjs/tracking/posthog_tracking_provider.js +37 -0
- package/dist/cjs/tracking/segment_tracking_provider.d.ts +10 -0
- package/dist/cjs/tracking/segment_tracking_provider.js +50 -0
- package/dist/cjs/tracking/trackingProviderProxy.d.ts +9 -0
- package/dist/cjs/tracking/trackingProviderProxy.js +24 -0
- package/dist/cjs/tracking/tracking_api.d.ts +8 -0
- package/dist/cjs/tracking/tracking_api.js +2 -0
- package/dist/cjs/tracking/tracking_registry.d.ts +4 -0
- package/dist/cjs/tracking/tracking_registry.js +33 -0
- package/dist/cjs/tracking/tracking_spi.d.ts +9 -0
- package/dist/cjs/tracking/tracking_spi.js +2 -0
- package/dist/cjs/tracking/umami_tracking_provider.d.ts +14 -0
- package/dist/cjs/tracking/umami_tracking_provider.js +44 -0
- package/dist/css/main.css +420 -148
- package/dist/css/main.css.map +1 -1
- package/dist/dynamic/Compare/package.json +1 -0
- package/dist/dynamic/tracking/package.json +1 -0
- package/dist/esm/AttachmentEdit/AttachmentEdit.test.d.ts +1 -0
- package/dist/esm/AttachmentEdit/AttachmentEdit.test.js +47 -0
- package/dist/esm/Chatbot/Chatbot.d.ts +2 -1
- package/dist/esm/Chatbot/Chatbot.js +1 -0
- package/dist/esm/Chatbot/Chatbot.test.d.ts +1 -0
- package/dist/esm/Chatbot/Chatbot.test.js +23 -0
- package/dist/esm/ChatbotAlert/ChatbotAlert.test.d.ts +1 -0
- package/dist/esm/ChatbotAlert/ChatbotAlert.test.js +22 -0
- package/dist/esm/ChatbotContent/ChatbotContent.test.d.ts +1 -0
- package/dist/esm/ChatbotContent/ChatbotContent.test.js +13 -0
- package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.d.ts +3 -3
- package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.js +3 -1
- package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.d.ts +27 -4
- package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.js +24 -12
- package/dist/esm/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.js +99 -3
- package/dist/esm/ChatbotConversationHistoryNav/EmptyState.d.ts +11 -0
- package/dist/esm/ChatbotConversationHistoryNav/EmptyState.js +22 -0
- package/dist/esm/ChatbotConversationHistoryNav/LoadingState.d.ts +4 -0
- package/dist/esm/ChatbotConversationHistoryNav/LoadingState.js +38 -0
- package/dist/esm/ChatbotFooter/ChatbotFooter.test.d.ts +1 -0
- package/dist/esm/ChatbotFooter/ChatbotFooter.test.js +13 -0
- package/dist/esm/ChatbotFooter/ChatbotFooternote.test.d.ts +1 -0
- package/dist/esm/ChatbotFooter/ChatbotFooternote.test.js +82 -0
- package/dist/esm/ChatbotFooter/ChatbotFootnote.d.ts +1 -1
- package/dist/esm/ChatbotFooter/ChatbotFootnote.js +1 -1
- package/dist/esm/ChatbotHeader/ChatbotHeader.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeader.test.js +13 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderActions.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderActions.test.js +13 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderCloseButton.js +3 -1
- package/dist/esm/ChatbotHeader/ChatbotHeaderCloseButton.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderCloseButton.test.js +15 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderMain.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderMain.test.js +13 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderMenu.js +3 -1
- package/dist/esm/ChatbotHeader/ChatbotHeaderMenu.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderMenu.test.js +15 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderOptionsDropdown.js +3 -1
- package/dist/esm/ChatbotHeader/ChatbotHeaderOptionsDropdown.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderOptionsDropdown.test.js +38 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.js +6 -4
- package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderSelectorDropdown.test.js +36 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderTitle.d.ts +3 -1
- package/dist/esm/ChatbotHeader/ChatbotHeaderTitle.js +4 -2
- package/dist/esm/ChatbotHeader/ChatbotHeaderTitle.test.d.ts +1 -0
- package/dist/esm/ChatbotHeader/ChatbotHeaderTitle.test.js +50 -0
- package/dist/esm/ChatbotToggle/ChatbotToggle.js +3 -1
- package/dist/esm/ChatbotWelcomePrompt/ChatbotWelcomePrompt.test.js +19 -11
- package/dist/esm/Compare/Compare.d.ts +17 -0
- package/dist/esm/Compare/Compare.js +43 -0
- package/dist/esm/Compare/Compare.test.d.ts +1 -0
- package/dist/esm/Compare/Compare.test.js +15 -0
- package/dist/esm/Compare/index.d.ts +2 -0
- package/dist/esm/Compare/index.js +2 -0
- package/dist/esm/Message/ErrorMessage/ErrorMessage.d.ts +4 -0
- package/dist/esm/Message/ErrorMessage/ErrorMessage.js +21 -0
- package/dist/esm/Message/ImageMessage/ImageMessage.d.ts +4 -0
- package/dist/esm/Message/ImageMessage/ImageMessage.js +20 -0
- package/dist/esm/Message/LinkMessage/LinkMessage.d.ts +4 -0
- package/dist/esm/Message/LinkMessage/LinkMessage.js +25 -0
- package/dist/esm/Message/Message.d.ts +35 -8
- package/dist/esm/Message/Message.js +66 -16
- package/dist/esm/Message/Message.test.js +239 -3
- package/dist/esm/Message/QuickResponse/QuickResponse.d.ts +17 -0
- package/dist/esm/Message/QuickResponse/QuickResponse.js +27 -0
- package/dist/esm/Message/TableMessage/TableMessage.d.ts +20 -0
- package/dist/esm/Message/TableMessage/TableMessage.js +62 -0
- package/dist/esm/Message/TableMessage/TbodyMessage.d.ts +7 -0
- package/dist/esm/Message/TableMessage/TbodyMessage.js +28 -0
- package/dist/esm/Message/TableMessage/TdMessage.d.ts +5 -0
- package/dist/esm/Message/TableMessage/TdMessage.js +21 -0
- package/dist/esm/Message/TableMessage/ThMessage.d.ts +5 -0
- package/dist/esm/Message/TableMessage/ThMessage.js +21 -0
- package/dist/esm/Message/TableMessage/TheadMessage.d.ts +5 -0
- package/dist/esm/Message/TableMessage/TheadMessage.js +21 -0
- package/dist/esm/Message/TableMessage/TrMessage.d.ts +7 -0
- package/dist/esm/Message/TableMessage/TrMessage.js +32 -0
- package/dist/esm/Message/TextMessage/TextMessage.d.ts +2 -1
- package/dist/esm/Message/TextMessage/TextMessage.js +3 -3
- package/dist/esm/Message/UserFeedback/CloseButton.d.ts +10 -0
- package/dist/esm/Message/UserFeedback/CloseButton.js +9 -0
- package/dist/esm/Message/UserFeedback/UserFeedback.d.ts +39 -0
- package/dist/esm/Message/UserFeedback/UserFeedback.js +49 -0
- package/dist/esm/Message/UserFeedback/UserFeedback.test.d.ts +1 -0
- package/dist/esm/Message/UserFeedback/UserFeedback.test.js +128 -0
- package/dist/esm/Message/UserFeedback/UserFeedbackComplete.d.ts +42 -0
- package/dist/esm/Message/UserFeedback/UserFeedbackComplete.js +112 -0
- package/dist/esm/Message/UserFeedback/UserFeedbackComplete.test.d.ts +1 -0
- package/dist/esm/Message/UserFeedback/UserFeedbackComplete.test.js +244 -0
- package/dist/esm/MessageBar/AttachButton.js +4 -2
- package/dist/esm/MessageBar/MessageBar.d.ts +11 -4
- package/dist/esm/MessageBar/MessageBar.js +127 -46
- package/dist/esm/MessageBar/MessageBar.test.js +12 -4
- package/dist/esm/MessageBar/MicrophoneButton.d.ts +1 -1
- package/dist/esm/MessageBar/SendButton.js +3 -1
- package/dist/esm/MessageBar/StopButton.js +3 -1
- package/dist/esm/MessageBox/MessageBox.test.d.ts +1 -0
- package/dist/esm/MessageBox/MessageBox.test.js +17 -0
- package/dist/esm/PreviewAttachment/PreviewAttachment.test.d.ts +1 -0
- package/dist/esm/PreviewAttachment/PreviewAttachment.test.js +23 -0
- package/dist/esm/ResponseActions/ResponseActionButton.d.ts +4 -1
- package/dist/esm/ResponseActions/ResponseActionButton.js +18 -3
- package/dist/esm/ResponseActions/ResponseActions.d.ts +8 -2
- package/dist/esm/ResponseActions/ResponseActions.js +7 -7
- package/dist/esm/ResponseActions/ResponseActions.test.js +2 -2
- package/dist/esm/Settings/SettingsForm.test.d.ts +1 -0
- package/dist/esm/Settings/SettingsForm.test.js +21 -0
- package/dist/esm/__mocks__/rehype-external-links.d.ts +2 -0
- package/dist/esm/__mocks__/rehype-external-links.js +2 -0
- package/dist/esm/__mocks__/rehype-sanitize.d.ts +2 -0
- package/dist/esm/__mocks__/rehype-sanitize.js +2 -0
- package/dist/esm/__mocks__/rehype-unwrap-images.d.ts +2 -0
- package/dist/esm/__mocks__/rehype-unwrap-images.js +2 -0
- package/dist/esm/index.d.ts +4 -0
- package/dist/esm/index.js +4 -0
- package/dist/esm/tracking/console_tracking_provider.d.ts +10 -0
- package/dist/esm/tracking/console_tracking_provider.js +23 -0
- package/dist/esm/tracking/index.d.ts +2 -0
- package/dist/esm/tracking/index.js +2 -0
- package/dist/esm/tracking/posthog_tracking_provider.d.ts +9 -0
- package/dist/esm/tracking/posthog_tracking_provider.js +33 -0
- package/dist/esm/tracking/segment_tracking_provider.d.ts +10 -0
- package/dist/esm/tracking/segment_tracking_provider.js +46 -0
- package/dist/esm/tracking/trackingProviderProxy.d.ts +9 -0
- package/dist/esm/tracking/trackingProviderProxy.js +22 -0
- package/dist/esm/tracking/tracking_api.d.ts +8 -0
- package/dist/esm/tracking/tracking_api.js +1 -0
- package/dist/esm/tracking/tracking_registry.d.ts +4 -0
- package/dist/esm/tracking/tracking_registry.js +26 -0
- package/dist/esm/tracking/tracking_spi.d.ts +9 -0
- package/dist/esm/tracking/tracking_spi.js +1 -0
- package/dist/esm/tracking/umami_tracking_provider.d.ts +14 -0
- package/dist/esm/tracking/umami_tracking_provider.js +40 -0
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +8 -3
- package/patternfly-docs/content/extensions/chatbot/about-chatbot.md +8 -2
- package/patternfly-docs/content/extensions/chatbot/design-guidelines.md +192 -15
- package/patternfly-docs/content/extensions/chatbot/examples/Analytics/Analytics.md +219 -0
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/AttachmentError.tsx +2 -2
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/BotMessage.tsx +214 -12
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/FileDropZone.tsx +2 -1
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithAttachment.tsx +2 -2
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithCustomResponseActions.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithFeedback.tsx +71 -0
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithFeedbackTimeout.tsx +27 -0
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithQuickResponses.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithQuickStart.tsx +2 -2
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithResponseActions.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/MessageWithSources.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/Messages.md +49 -8
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/UserMessage.tsx +244 -14
- package/patternfly-docs/content/extensions/chatbot/examples/Messages/UserMessageWithExtraContent.tsx +54 -0
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotFooter.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotFootnote.tsx +5 -5
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderBasic.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawer.tsx +36 -3
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerNavigation.tsx +67 -0
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotHeaderDrawerResizable.tsx +94 -0
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotMessageBarAttach.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotWelcomeInteraction.tsx +1 -1
- package/patternfly-docs/content/extensions/chatbot/examples/UI/ChatbotWelcomePrompt.tsx +7 -7
- package/patternfly-docs/content/extensions/chatbot/examples/UI/UI.md +21 -6
- package/patternfly-docs/content/extensions/chatbot/examples/demos/AttachmentDemos.md +14 -0
- package/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.md +39 -1
- package/patternfly-docs/content/extensions/chatbot/examples/demos/Chatbot.tsx +48 -35
- package/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachment.tsx +2 -2
- package/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotAttachmentMenu.tsx +3 -3
- package/patternfly-docs/content/extensions/chatbot/examples/demos/ChatbotInDrawer.tsx +453 -0
- package/patternfly-docs/content/extensions/chatbot/examples/demos/EmbeddedChatbot.tsx +11 -11
- package/patternfly-docs/content/extensions/chatbot/examples/demos/EmbeddedComparisonChatbot.tsx +206 -0
- package/patternfly-docs/content/extensions/chatbot/examples/demos/Feedback.tsx +104 -0
- package/patternfly-docs/content/extensions/chatbot/img/ai-action-inpage.svg +85 -0
- package/patternfly-docs/content/extensions/chatbot/img/ai-action-message.svg +63 -0
- package/patternfly-docs/content/extensions/chatbot/img/analytics-example.svg +127 -0
- package/patternfly-docs/content/extensions/chatbot/img/attached-file.svg +24 -29
- package/patternfly-docs/content/extensions/chatbot/img/attachment-menu.svg +4 -4
- package/patternfly-docs/content/extensions/chatbot/img/attachment-unsent.svg +30 -58
- package/patternfly-docs/content/extensions/chatbot/img/chatbot-analytics.svg +51 -0
- package/patternfly-docs/content/extensions/chatbot/img/chatbot-elements.svg +11 -12
- package/patternfly-docs/content/extensions/chatbot/img/chatbot-quickstarts-tile.svg +58 -0
- package/patternfly-docs/content/extensions/chatbot/img/chatbot-settings.svg +83 -0
- package/patternfly-docs/content/extensions/chatbot/img/comparison.svg +45 -0
- package/patternfly-docs/content/extensions/chatbot/img/conversation-history.svg +6 -29
- package/patternfly-docs/content/extensions/chatbot/img/docked.svg +259 -241
- package/patternfly-docs/content/extensions/chatbot/img/drawer.svg +255 -0
- package/patternfly-docs/content/extensions/chatbot/img/error-state.svg +30 -0
- package/patternfly-docs/content/extensions/chatbot/img/feedback-form.svg +88 -0
- package/patternfly-docs/content/extensions/chatbot/img/footnote.svg +1 -1
- package/patternfly-docs/content/extensions/chatbot/img/fullscreen.svg +25 -16
- package/patternfly-docs/content/extensions/chatbot/img/listening-pulse.svg +22 -0
- package/patternfly-docs/content/extensions/chatbot/img/listening.svg +1 -1
- package/patternfly-docs/content/extensions/chatbot/img/loading-state.svg +28 -0
- package/patternfly-docs/content/extensions/chatbot/img/masthead-toggle-notification.svg +49 -0
- package/patternfly-docs/content/extensions/chatbot/img/masthead-toggle.svg +75 -0
- package/patternfly-docs/content/extensions/chatbot/img/message-bar-elements.svg +3 -3
- package/patternfly-docs/content/extensions/chatbot/img/message-elements.svg +84 -142
- package/patternfly-docs/content/extensions/chatbot/img/message-feedback.svg +52 -0
- package/patternfly-docs/content/extensions/chatbot/img/message-responses.svg +54 -0
- package/patternfly-docs/content/extensions/chatbot/img/new-chat-emptystate.svg +27 -0
- package/patternfly-docs/content/extensions/chatbot/img/no-results-emptystate.svg +27 -0
- package/patternfly-docs/content/extensions/chatbot/img/overlay.svg +54 -39
- package/patternfly-docs/content/extensions/chatbot/img/posthog.svg +30 -0
- package/patternfly-docs/content/extensions/chatbot/img/segment.svg +36 -0
- package/patternfly-docs/content/extensions/chatbot/img/settings-menu.svg +122 -0
- package/patternfly-docs/content/extensions/chatbot/img/source-tile.svg +62 -0
- package/patternfly-docs/content/extensions/chatbot/img/thank-you-card.svg +81 -0
- package/patternfly-docs/content/extensions/chatbot/img/toggle-customizations.svg +12 -0
- package/patternfly-docs/content/extensions/chatbot/img/toggle-tooltips.svg +38 -0
- package/patternfly-docs/content/extensions/chatbot/img/umami.svg +30 -0
- package/patternfly-docs/content/extensions/chatbot/img/welcome-elements.svg +82 -0
- package/patternfly-docs/content/extensions/chatbot/img/welcome-message.svg +94 -0
- package/src/AttachMenu/AttachMenu.scss +1 -1
- package/src/AttachmentEdit/AttachmentEdit.test.tsx +55 -0
- package/src/Chatbot/Chatbot.scss +20 -1
- package/src/Chatbot/Chatbot.test.tsx +31 -0
- package/src/Chatbot/Chatbot.tsx +2 -1
- package/src/ChatbotAlert/ChatbotAlert.test.tsx +31 -0
- package/src/ChatbotContent/ChatbotContent.scss +1 -0
- package/src/ChatbotContent/ChatbotContent.test.tsx +15 -0
- package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryDropdown.tsx +10 -4
- package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.scss +24 -1
- package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.test.tsx +242 -3
- package/src/ChatbotConversationHistoryNav/ChatbotConversationHistoryNav.tsx +94 -26
- package/src/ChatbotConversationHistoryNav/EmptyState.tsx +44 -0
- package/src/ChatbotConversationHistoryNav/LoadingState.tsx +38 -0
- package/src/ChatbotFooter/ChatbotFooter.scss +8 -4
- package/src/ChatbotFooter/ChatbotFooter.test.tsx +15 -0
- package/src/ChatbotFooter/ChatbotFooternote.test.tsx +84 -0
- package/src/ChatbotFooter/ChatbotFootnote.tsx +2 -2
- package/src/ChatbotHeader/ChatbotHeader.scss +5 -6
- package/src/ChatbotHeader/ChatbotHeader.test.tsx +15 -0
- package/src/ChatbotHeader/ChatbotHeaderActions.test.tsx +17 -0
- package/src/ChatbotHeader/ChatbotHeaderCloseButton.test.tsx +20 -0
- package/src/ChatbotHeader/ChatbotHeaderCloseButton.tsx +7 -1
- package/src/ChatbotHeader/ChatbotHeaderMain.test.tsx +17 -0
- package/src/ChatbotHeader/ChatbotHeaderMenu.test.tsx +19 -0
- package/src/ChatbotHeader/ChatbotHeaderMenu.tsx +7 -1
- package/src/ChatbotHeader/ChatbotHeaderOptionsDropdown.test.tsx +45 -0
- package/src/ChatbotHeader/ChatbotHeaderOptionsDropdown.tsx +8 -1
- package/src/ChatbotHeader/ChatbotHeaderSelectorDropdown.test.tsx +43 -0
- package/src/ChatbotHeader/ChatbotHeaderSelectorDropdown.tsx +11 -4
- package/src/ChatbotHeader/ChatbotHeaderTitle.test.tsx +75 -0
- package/src/ChatbotHeader/ChatbotHeaderTitle.tsx +7 -2
- package/src/ChatbotModal/ChatbotModal.scss +12 -12
- package/src/ChatbotToggle/ChatbotToggle.tsx +6 -1
- package/src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.scss +2 -0
- package/src/ChatbotWelcomePrompt/ChatbotWelcomePrompt.test.tsx +26 -18
- package/src/ChatbotWelcomePrompt/__snapshots__/ChatbotWelcomePrompt.test.tsx.snap +2 -2
- package/src/CodeModal/CodeModal.scss +7 -4
- package/src/Compare/Compare.scss +72 -0
- package/src/Compare/Compare.test.tsx +31 -0
- package/src/Compare/Compare.tsx +98 -0
- package/src/Compare/index.ts +2 -0
- package/src/FileDetails/FileDetails.scss +1 -1
- package/src/FileDetailsLabel/FileDetailsLabel.scss +2 -2
- package/src/FileDropZone/__snapshots__/FileDropZone.test.tsx.snap +1 -0
- package/src/Message/CodeBlockMessage/CodeBlockMessage.scss +4 -4
- package/src/Message/ErrorMessage/ErrorMessage.tsx +14 -0
- package/src/Message/ImageMessage/ImageMessage.scss +9 -0
- package/src/Message/ImageMessage/ImageMessage.tsx +14 -0
- package/src/Message/LinkMessage/LinkMessage.tsx +34 -0
- package/src/Message/ListMessage/ListMessage.scss +6 -6
- package/src/Message/Message.scss +4 -26
- package/src/Message/Message.test.tsx +313 -3
- package/src/Message/Message.tsx +130 -31
- package/src/Message/MessageLoading.scss +2 -2
- package/src/Message/QuickResponse/QuickResponse.scss +33 -0
- package/src/Message/QuickResponse/QuickResponse.tsx +54 -0
- package/src/Message/QuickStarts/QuickStartTile.scss +0 -1
- package/src/Message/TableMessage/TableMessage.scss +23 -0
- package/src/Message/TableMessage/TableMessage.tsx +83 -0
- package/src/Message/TableMessage/TbodyMessage.tsx +20 -0
- package/src/Message/TableMessage/TdMessage.tsx +11 -0
- package/src/Message/TableMessage/ThMessage.tsx +11 -0
- package/src/Message/TableMessage/TheadMessage.tsx +11 -0
- package/src/Message/TableMessage/TrMessage.tsx +27 -0
- package/src/Message/TextMessage/TextMessage.scss +21 -12
- package/src/Message/TextMessage/TextMessage.tsx +3 -3
- package/src/Message/UserFeedback/CloseButton.tsx +21 -0
- package/src/Message/UserFeedback/UserFeedback.scss +53 -0
- package/src/Message/UserFeedback/UserFeedback.test.tsx +236 -0
- package/src/Message/UserFeedback/UserFeedback.tsx +128 -0
- package/src/Message/UserFeedback/UserFeedbackComplete.test.tsx +255 -0
- package/src/Message/UserFeedback/UserFeedbackComplete.tsx +211 -0
- package/src/MessageBar/AttachButton.scss +19 -3
- package/src/MessageBar/AttachButton.tsx +3 -1
- package/src/MessageBar/MessageBar.scss +58 -24
- package/src/MessageBar/MessageBar.test.tsx +12 -4
- package/src/MessageBar/MessageBar.tsx +164 -65
- package/src/MessageBar/MicrophoneButton.scss +8 -8
- package/src/MessageBar/MicrophoneButton.tsx +1 -1
- package/src/MessageBar/SendButton.tsx +2 -0
- package/src/MessageBar/StopButton.scss +17 -3
- package/src/MessageBar/StopButton.tsx +2 -0
- package/src/MessageBox/JumpButton.scss +6 -6
- package/src/MessageBox/MessageBox.scss +1 -0
- package/src/MessageBox/MessageBox.test.tsx +26 -0
- package/src/PreviewAttachment/PreviewAttachment.test.tsx +51 -0
- package/src/ResponseActions/ResponseActionButton.tsx +14 -2
- package/src/ResponseActions/ResponseActions.scss +2 -2
- package/src/ResponseActions/ResponseActions.test.tsx +4 -2
- package/src/ResponseActions/ResponseActions.tsx +26 -2
- package/src/Settings/Settings.scss +2 -2
- package/src/Settings/SettingsForm.test.tsx +28 -0
- package/src/SourceDetailsMenuItem/SourceDetailsMenuItem.scss +2 -2
- package/src/SourcesCard/SourcesCard.scss +9 -3
- package/src/TermsOfUse/TermsOfUse.scss +1 -1
- package/src/__mocks__/rehype-external-links.ts +3 -0
- package/src/__mocks__/rehype-sanitize.ts +3 -0
- package/src/__mocks__/rehype-unwrap-images.tsx +3 -0
- package/src/index.ts +6 -0
- package/src/main.scss +5 -6
- package/src/tracking/console_tracking_provider.ts +30 -0
- package/src/tracking/index.ts +3 -0
- package/src/tracking/posthog_tracking_provider.ts +42 -0
- package/src/tracking/segment_tracking_provider.ts +62 -0
- package/src/tracking/trackingProviderProxy.ts +28 -0
- package/src/tracking/tracking_api.ts +11 -0
- package/src/tracking/tracking_registry.ts +33 -0
- package/src/tracking/tracking_spi.ts +14 -0
- package/src/tracking/umami_tracking_provider.ts +54 -0
@@ -50,6 +50,7 @@
|
|
50
50
|
align-items: center;
|
51
51
|
.pf-v6-c-menu-toggle.pf-m-secondary {
|
52
52
|
width: 160px;
|
53
|
+
--pf-v6-c-menu-toggle--BackgroundColor: var(--pf-t--global--background--color--control--default);
|
53
54
|
}
|
54
55
|
}
|
55
56
|
}
|
@@ -70,15 +71,13 @@
|
|
70
71
|
}
|
71
72
|
|
72
73
|
// ============================================================================
|
73
|
-
// Chatbot Display Mode - Docked
|
74
|
+
// Chatbot Display Mode - Docked and Drawer
|
74
75
|
// ============================================================================
|
76
|
+
.pf-chatbot--drawer,
|
75
77
|
.pf-chatbot--docked {
|
76
78
|
.pf-chatbot__header {
|
77
79
|
background-color: var(--pf-t--chatbot--background);
|
78
80
|
}
|
79
|
-
.pf-chatbot__header__divider {
|
80
|
-
display: none;
|
81
|
-
}
|
82
81
|
}
|
83
82
|
|
84
83
|
// ============================================================================
|
@@ -95,7 +94,7 @@
|
|
95
94
|
.pf-v6-c-button__icon,
|
96
95
|
.pf-v6-c-menu-toggle__icon,
|
97
96
|
.pf-v6-c-icon__content {
|
98
|
-
color: var(--pf-t--
|
97
|
+
color: var(--pf-t--global--icon--color--subtle);
|
99
98
|
}
|
100
99
|
|
101
100
|
.pf-v6-c-button__icon,
|
@@ -111,7 +110,7 @@
|
|
111
110
|
.pf-v6-c-button__icon,
|
112
111
|
.pf-v6-c-menu-toggle__icon,
|
113
112
|
.pf-v6-c-icon__content {
|
114
|
-
color: var(--pf-t--
|
113
|
+
color: var(--pf-t--global--icon--color--regular);
|
115
114
|
}
|
116
115
|
}
|
117
116
|
}
|
@@ -0,0 +1,15 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { render, screen } from '@testing-library/react';
|
3
|
+
import ChatbotHeader from './ChatbotHeader';
|
4
|
+
|
5
|
+
describe('ChatbotHeader', () => {
|
6
|
+
it('should render ChatbotHeader with children', () => {
|
7
|
+
render(<ChatbotHeader>Chatbot Header</ChatbotHeader>);
|
8
|
+
expect(screen.getByText('Chatbot Header')).toBeTruthy();
|
9
|
+
});
|
10
|
+
|
11
|
+
it('should render ChatbotHeader with custom classname', () => {
|
12
|
+
const { container } = render(<ChatbotHeader className="custom-header-class">Chatbot Content</ChatbotHeader>);
|
13
|
+
expect(container.querySelector('.custom-header-class')).toBeTruthy();
|
14
|
+
});
|
15
|
+
});
|
@@ -0,0 +1,17 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { render, screen } from '@testing-library/react';
|
3
|
+
import ChatbotHeaderActions from './ChatbotHeaderActions';
|
4
|
+
|
5
|
+
describe('ChatbotHeaderActions', () => {
|
6
|
+
it('should render ChatbotHeaderActions with children', () => {
|
7
|
+
render(<ChatbotHeaderActions>Chatbot Header</ChatbotHeaderActions>);
|
8
|
+
expect(screen.getByText('Chatbot Header')).toBeTruthy();
|
9
|
+
});
|
10
|
+
|
11
|
+
it('should render ChatbotHeaderActions with custom classname', () => {
|
12
|
+
const { container } = render(
|
13
|
+
<ChatbotHeaderActions className="custom-header-action-class">Chatbot Content</ChatbotHeaderActions>
|
14
|
+
);
|
15
|
+
expect(container.querySelector('.custom-header-action-class')).toBeTruthy();
|
16
|
+
});
|
17
|
+
});
|
@@ -0,0 +1,20 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { fireEvent, render, screen } from '@testing-library/react';
|
3
|
+
import { ChatbotHeaderCloseButton } from './ChatbotHeaderCloseButton';
|
4
|
+
|
5
|
+
describe('ChatbotHeaderCloseButton', () => {
|
6
|
+
it('should render ChatbotHeaderCloseButton', () => {
|
7
|
+
const { container } = render(
|
8
|
+
<ChatbotHeaderCloseButton className="custom-header-close-button" onClick={jest.fn()} />
|
9
|
+
);
|
10
|
+
|
11
|
+
expect(container.querySelector('.custom-header-close-button')).toBeTruthy();
|
12
|
+
});
|
13
|
+
|
14
|
+
it('should call onClick handler when close button is pressed', () => {
|
15
|
+
const onClick = jest.fn();
|
16
|
+
render(<ChatbotHeaderCloseButton className="custom-header-close-button" onClick={onClick} />);
|
17
|
+
fireEvent.click(screen.getByRole('button', { name: 'Close' }));
|
18
|
+
expect(onClick).toHaveBeenCalled();
|
19
|
+
});
|
20
|
+
});
|
@@ -27,7 +27,13 @@ const ChatbotHeaderCloseButtonBase: React.FunctionComponent<ChatbotHeaderCloseBu
|
|
27
27
|
tooltipContent = 'Close'
|
28
28
|
}: ChatbotHeaderCloseButtonProps) => (
|
29
29
|
<div className={`pf-chatbot__menu ${className}`}>
|
30
|
-
<Tooltip
|
30
|
+
<Tooltip
|
31
|
+
content={tooltipContent}
|
32
|
+
position="bottom"
|
33
|
+
// prevents VO announcements of both aria label and tooltip
|
34
|
+
aria="none"
|
35
|
+
{...tooltipProps}
|
36
|
+
>
|
31
37
|
<Button
|
32
38
|
className="pf-chatbot__button--toggle-menu"
|
33
39
|
variant="plain"
|
@@ -0,0 +1,17 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { render, screen } from '@testing-library/react';
|
3
|
+
import ChatbotHeaderMain from './ChatbotHeaderMain';
|
4
|
+
|
5
|
+
describe('ChatbotHeaderMain', () => {
|
6
|
+
it('should render ChatbotHeaderMain with children', () => {
|
7
|
+
render(<ChatbotHeaderMain>Chatbot Header Main</ChatbotHeaderMain>);
|
8
|
+
expect(screen.getByText('Chatbot Header Main')).toBeTruthy();
|
9
|
+
});
|
10
|
+
|
11
|
+
it('should render ChatbotHeaderMain with custom classname', () => {
|
12
|
+
const { container } = render(
|
13
|
+
<ChatbotHeaderMain className="custom-header-class">Chatbot Content</ChatbotHeaderMain>
|
14
|
+
);
|
15
|
+
expect(container.querySelector('.custom-header-class')).toBeTruthy();
|
16
|
+
});
|
17
|
+
});
|
@@ -0,0 +1,19 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { fireEvent, render, screen } from '@testing-library/react';
|
3
|
+
import { ChatbotHeaderMenu } from './ChatbotHeaderMenu';
|
4
|
+
|
5
|
+
describe('ChatbotHeaderMenu', () => {
|
6
|
+
it('should render ChatbotHeaderMenu with custom class', () => {
|
7
|
+
const { container } = render(<ChatbotHeaderMenu className="custom-header-menu" onMenuToggle={jest.fn()} />);
|
8
|
+
|
9
|
+
expect(container.querySelector('.custom-header-menu')).toBeTruthy();
|
10
|
+
});
|
11
|
+
|
12
|
+
it('should call onMenuToggle when ChatbotHeaderMenu button is clicked', () => {
|
13
|
+
const onMenuToggle = jest.fn();
|
14
|
+
render(<ChatbotHeaderMenu className="custom-header-menu" onMenuToggle={onMenuToggle} />);
|
15
|
+
fireEvent.click(screen.getByRole('button', { name: 'Toggle menu' }));
|
16
|
+
|
17
|
+
expect(onMenuToggle).toHaveBeenCalled();
|
18
|
+
});
|
19
|
+
});
|
@@ -27,7 +27,13 @@ const ChatbotHeaderMenuBase: React.FunctionComponent<ChatbotHeaderMenuProps> = (
|
|
27
27
|
tooltipContent = 'Menu'
|
28
28
|
}: ChatbotHeaderMenuProps) => (
|
29
29
|
<div className={`pf-chatbot__menu ${className}`}>
|
30
|
-
<Tooltip
|
30
|
+
<Tooltip
|
31
|
+
content={tooltipContent}
|
32
|
+
position="bottom"
|
33
|
+
// prevents VO announcements of both aria label and tooltip
|
34
|
+
aria="none"
|
35
|
+
{...tooltipProps}
|
36
|
+
>
|
31
37
|
<Button
|
32
38
|
className="pf-chatbot__button--toggle-menu"
|
33
39
|
variant="plain"
|
@@ -0,0 +1,45 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { DropdownItem } from '@patternfly/react-core';
|
3
|
+
import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
|
4
|
+
import { ChatbotHeaderOptionsDropdown } from './ChatbotHeaderOptionsDropdown';
|
5
|
+
|
6
|
+
describe('ChatbotHeaderOptionsDropdown', () => {
|
7
|
+
const dropdownItems = (
|
8
|
+
<>
|
9
|
+
<DropdownItem>Option 1</DropdownItem>
|
10
|
+
<DropdownItem>Option 2</DropdownItem>
|
11
|
+
<DropdownItem>Option 3</DropdownItem>
|
12
|
+
</>
|
13
|
+
);
|
14
|
+
|
15
|
+
it('should render ChatbotHeaderOptionsDropdown', () => {
|
16
|
+
render(<ChatbotHeaderOptionsDropdown>{dropdownItems}</ChatbotHeaderOptionsDropdown>);
|
17
|
+
|
18
|
+
expect(screen.getByRole('button', { name: 'Chatbot options' })).toBeTruthy();
|
19
|
+
});
|
20
|
+
|
21
|
+
it('should call onselect handler when a dropdown item is clicked', async () => {
|
22
|
+
const onSelect = jest.fn();
|
23
|
+
const { container } = render(
|
24
|
+
<ChatbotHeaderOptionsDropdown className="custom-header-options-dropdown" onSelect={onSelect}>
|
25
|
+
{dropdownItems}
|
26
|
+
</ChatbotHeaderOptionsDropdown>
|
27
|
+
);
|
28
|
+
|
29
|
+
act(() => {
|
30
|
+
fireEvent.click(screen.getByRole('button', { name: 'Chatbot options' }));
|
31
|
+
});
|
32
|
+
|
33
|
+
await waitFor(() => {
|
34
|
+
expect(container.querySelector('.custom-header-options-dropdown')).toBeTruthy();
|
35
|
+
|
36
|
+
expect(screen.getByText('Option 1'));
|
37
|
+
expect(screen.getByText('Option 2'));
|
38
|
+
expect(screen.getByText('Option 3'));
|
39
|
+
|
40
|
+
fireEvent.click(screen.getByText('Option 3'));
|
41
|
+
|
42
|
+
expect(onSelect).toHaveBeenCalled();
|
43
|
+
});
|
44
|
+
});
|
45
|
+
});
|
@@ -33,7 +33,14 @@ export const ChatbotHeaderOptionsDropdown: React.FunctionComponent<ChatbotHeader
|
|
33
33
|
const [isOptionsMenuOpen, setIsOptionsMenuOpen] = React.useState(false);
|
34
34
|
|
35
35
|
const toggle = (toggleRef: React.Ref<MenuToggleElement>) => (
|
36
|
-
<Tooltip
|
36
|
+
<Tooltip
|
37
|
+
className="pf-chatbot__tooltip"
|
38
|
+
content="Chatbot options"
|
39
|
+
position="bottom"
|
40
|
+
// prevents VO announcements of both aria label and tooltip
|
41
|
+
aria="none"
|
42
|
+
{...tooltipProps}
|
43
|
+
>
|
37
44
|
<MenuToggle
|
38
45
|
className="pf-chatbot__button--toggle-options"
|
39
46
|
variant="plain"
|
@@ -0,0 +1,43 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { DropdownItem } from '@patternfly/react-core';
|
3
|
+
import { act, fireEvent, render, screen, waitFor } from '@testing-library/react';
|
4
|
+
import { ChatbotHeaderSelectorDropdown } from './ChatbotHeaderSelectorDropdown';
|
5
|
+
|
6
|
+
describe('ChatbotHeaderSelectorDropdown', () => {
|
7
|
+
const dropdownItems = (
|
8
|
+
<>
|
9
|
+
<DropdownItem>Option 1</DropdownItem>
|
10
|
+
<DropdownItem>Option 2</DropdownItem>
|
11
|
+
<DropdownItem>Option 3</DropdownItem>
|
12
|
+
</>
|
13
|
+
);
|
14
|
+
|
15
|
+
it('should render ChatbotHeaderSelectorDropdown', () => {
|
16
|
+
render(<ChatbotHeaderSelectorDropdown value="Option 1">{dropdownItems}</ChatbotHeaderSelectorDropdown>);
|
17
|
+
|
18
|
+
expect(screen.getByRole('button', { name: /Select model/i })).toBeTruthy();
|
19
|
+
});
|
20
|
+
|
21
|
+
it('should call onselect handler when a dropdown item is clicked', async () => {
|
22
|
+
const onSelect = jest.fn();
|
23
|
+
const { container } = render(
|
24
|
+
<ChatbotHeaderSelectorDropdown value="Option 1" className="custom-header-selector-dropdown" onSelect={onSelect}>
|
25
|
+
{dropdownItems}
|
26
|
+
</ChatbotHeaderSelectorDropdown>
|
27
|
+
);
|
28
|
+
|
29
|
+
act(() => {
|
30
|
+
fireEvent.click(screen.getByRole('button', { name: /Select model/i }));
|
31
|
+
});
|
32
|
+
|
33
|
+
await waitFor(() => {
|
34
|
+
expect(container.querySelector('.custom-header-selector-dropdown')).toBeTruthy();
|
35
|
+
|
36
|
+
expect(screen.getByText('Option 3'));
|
37
|
+
|
38
|
+
fireEvent.click(screen.getByText('Option 3'));
|
39
|
+
|
40
|
+
expect(onSelect).toHaveBeenCalled();
|
41
|
+
});
|
42
|
+
});
|
43
|
+
});
|
@@ -23,15 +23,22 @@ export const ChatbotHeaderSelectorDropdown: React.FunctionComponent<ChatbotHeade
|
|
23
23
|
children,
|
24
24
|
onSelect,
|
25
25
|
tooltipProps,
|
26
|
-
tooltipContent = '
|
26
|
+
tooltipContent = 'Select model',
|
27
27
|
menuToggleAriaLabel,
|
28
28
|
...props
|
29
29
|
}: ChatbotHeaderSelectorDropdownProps) => {
|
30
30
|
const [isOptionsMenuOpen, setIsOptionsMenuOpen] = React.useState(false);
|
31
|
-
const [defaultAriaLabel, setDefaultAriaLabel] = React.useState('
|
31
|
+
const [defaultAriaLabel, setDefaultAriaLabel] = React.useState('Select model');
|
32
32
|
|
33
33
|
const toggle = (toggleRef: React.Ref<MenuToggleElement>) => (
|
34
|
-
<Tooltip
|
34
|
+
<Tooltip
|
35
|
+
className="pf-chatbot__tooltip"
|
36
|
+
content={tooltipContent}
|
37
|
+
position="bottom"
|
38
|
+
// prevents VO announcements of both aria label and tooltip
|
39
|
+
aria="none"
|
40
|
+
{...tooltipProps}
|
41
|
+
>
|
35
42
|
<MenuToggle
|
36
43
|
variant="secondary"
|
37
44
|
aria-label={menuToggleAriaLabel ?? defaultAriaLabel}
|
@@ -50,7 +57,7 @@ export const ChatbotHeaderSelectorDropdown: React.FunctionComponent<ChatbotHeade
|
|
50
57
|
isOpen={isOptionsMenuOpen}
|
51
58
|
onSelect={(e, value) => {
|
52
59
|
onSelect && onSelect(e, value);
|
53
|
-
setDefaultAriaLabel(`
|
60
|
+
setDefaultAriaLabel(`Select model: ${value}`);
|
54
61
|
setIsOptionsMenuOpen(false);
|
55
62
|
}}
|
56
63
|
onOpenChange={(isOpen) => setIsOptionsMenuOpen(isOpen)}
|
@@ -0,0 +1,75 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { render, screen } from '@testing-library/react';
|
3
|
+
import { ChatbotDisplayMode } from '../Chatbot/Chatbot';
|
4
|
+
import ChatbotHeaderTitle from './ChatbotHeaderTitle';
|
5
|
+
|
6
|
+
describe('ChatbotHeaderTitle', () => {
|
7
|
+
it('should render ChatbotHeaderTitle with children', () => {
|
8
|
+
render(<ChatbotHeaderTitle>Chatbot Header Title</ChatbotHeaderTitle>);
|
9
|
+
expect(screen.getByText('Chatbot Header Title')).toBeTruthy();
|
10
|
+
});
|
11
|
+
|
12
|
+
it('should render ChatbotHeaderTitle with custom classname', () => {
|
13
|
+
const { container } = render(
|
14
|
+
<ChatbotHeaderTitle className="custom-header-class">Chatbot Header Title</ChatbotHeaderTitle>
|
15
|
+
);
|
16
|
+
expect(container.querySelector('.custom-header-class')).toBeTruthy();
|
17
|
+
});
|
18
|
+
|
19
|
+
it('should render title for default display mode', () => {
|
20
|
+
render(<ChatbotHeaderTitle displayMode={ChatbotDisplayMode.default} showOnDefault="Default header title" />);
|
21
|
+
expect(screen.getByText('Default header title')).toBeTruthy();
|
22
|
+
});
|
23
|
+
|
24
|
+
it('should render title for docked display mode', () => {
|
25
|
+
render(<ChatbotHeaderTitle displayMode={ChatbotDisplayMode.docked} showOnDocked="Docked header title" />);
|
26
|
+
expect(screen.getByText('Docked header title')).toBeTruthy();
|
27
|
+
});
|
28
|
+
|
29
|
+
it('should fallback to default title when docked display mode title is not configured', () => {
|
30
|
+
render(<ChatbotHeaderTitle displayMode={ChatbotDisplayMode.docked} showOnDefault="Default header title" />);
|
31
|
+
expect(screen.getByText('Default header title')).toBeTruthy();
|
32
|
+
});
|
33
|
+
|
34
|
+
it('should render title for embedded display mode', () => {
|
35
|
+
render(<ChatbotHeaderTitle displayMode={ChatbotDisplayMode.embedded} showOnEmbedded="Embedded header title" />);
|
36
|
+
expect(screen.getByText('Embedded header title')).toBeTruthy();
|
37
|
+
});
|
38
|
+
|
39
|
+
it('should fallback to default title when embedded display mode title is not configured', () => {
|
40
|
+
render(<ChatbotHeaderTitle displayMode={ChatbotDisplayMode.embedded} showOnDefault="Default header title" />);
|
41
|
+
expect(screen.getByText('Default header title')).toBeTruthy();
|
42
|
+
});
|
43
|
+
|
44
|
+
it('should render title for fullscreen display mode', () => {
|
45
|
+
render(
|
46
|
+
<ChatbotHeaderTitle
|
47
|
+
displayMode={ChatbotDisplayMode.fullscreen}
|
48
|
+
showOnFullScreen="Fullscreen header title"
|
49
|
+
className="custom-header-class"
|
50
|
+
/>
|
51
|
+
);
|
52
|
+
expect(screen.getByText('Fullscreen header title')).toBeTruthy();
|
53
|
+
});
|
54
|
+
|
55
|
+
it('should fallback to default title when fullscreen display mode title is not configured', () => {
|
56
|
+
render(<ChatbotHeaderTitle displayMode={ChatbotDisplayMode.fullscreen} showOnDefault="Default header title" />);
|
57
|
+
expect(screen.getByText('Default header title')).toBeTruthy();
|
58
|
+
});
|
59
|
+
|
60
|
+
it('should render title for drawer display mode', () => {
|
61
|
+
render(
|
62
|
+
<ChatbotHeaderTitle
|
63
|
+
displayMode={ChatbotDisplayMode.drawer}
|
64
|
+
showOnDrawer="Drawer header title"
|
65
|
+
className="custom-header-class"
|
66
|
+
/>
|
67
|
+
);
|
68
|
+
expect(screen.getByText('Drawer header title')).toBeTruthy();
|
69
|
+
});
|
70
|
+
|
71
|
+
it('should fallback to default title when drawer display mode title is not configured', () => {
|
72
|
+
render(<ChatbotHeaderTitle displayMode={ChatbotDisplayMode.drawer} showOnDefault="Default header title" />);
|
73
|
+
expect(screen.getByText('Default header title')).toBeTruthy();
|
74
|
+
});
|
75
|
+
});
|
@@ -14,8 +14,10 @@ export interface ChatbotHeaderTitleProps {
|
|
14
14
|
showOnFullScreen?: React.ReactNode | string;
|
15
15
|
/** Content to display on docked screen */
|
16
16
|
showOnDocked?: React.ReactNode | string;
|
17
|
-
/** Content to display on
|
17
|
+
/** Content to display on embedded screen */
|
18
18
|
showOnEmbedded?: React.ReactNode | string;
|
19
|
+
/** Content to display in drawer mode */
|
20
|
+
showOnDrawer?: React.ReactNode | string;
|
19
21
|
/** Content to display by default; this will be shown if a case is not explicitly set */
|
20
22
|
showOnDefault?: React.ReactNode | string;
|
21
23
|
}
|
@@ -27,10 +29,11 @@ export const ChatbotHeaderTitle: React.FunctionComponent<ChatbotHeaderTitleProps
|
|
27
29
|
showOnFullScreen,
|
28
30
|
showOnDocked,
|
29
31
|
showOnEmbedded,
|
32
|
+
showOnDrawer,
|
30
33
|
showOnDefault
|
31
34
|
}: ChatbotHeaderTitleProps) => {
|
32
35
|
const renderChildren = () => {
|
33
|
-
if (displayMode
|
36
|
+
if (displayMode) {
|
34
37
|
/* eslint-disable indent */
|
35
38
|
switch (displayMode) {
|
36
39
|
case ChatbotDisplayMode.fullscreen:
|
@@ -39,6 +42,8 @@ export const ChatbotHeaderTitle: React.FunctionComponent<ChatbotHeaderTitleProps
|
|
39
42
|
return showOnDocked ?? showOnDefault;
|
40
43
|
case ChatbotDisplayMode.embedded:
|
41
44
|
return showOnEmbedded ?? showOnDefault;
|
45
|
+
case ChatbotDisplayMode.drawer:
|
46
|
+
return showOnDrawer ?? showOnDefault;
|
42
47
|
default:
|
43
48
|
return showOnDefault;
|
44
49
|
}
|
@@ -1,22 +1,22 @@
|
|
1
1
|
.pf-chatbot__chatbot-modal-backdrop {
|
2
|
-
position: static;
|
2
|
+
position: static !important;
|
3
3
|
}
|
4
4
|
|
5
5
|
.pf-chatbot__chatbot-modal {
|
6
|
-
--pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--medium);
|
7
|
-
position: fixed;
|
6
|
+
--pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--medium) !important;
|
7
|
+
position: fixed !important;
|
8
8
|
inset-block-end: var(--pf-t--global--spacer--800); // no associated semantic token
|
9
9
|
inset-inline-end: var(--pf-t--global--spacer--lg);
|
10
|
-
width: 30rem;
|
10
|
+
width: 30rem !important;
|
11
11
|
height: 70vh;
|
12
|
-
background-color: var(--pf-t--global--background--color--secondary--default);
|
12
|
+
background-color: var(--pf-t--global--background--color--secondary--default) !important;
|
13
13
|
|
14
14
|
.pf-v6-c-modal-box__title {
|
15
15
|
--pf-v6-c-modal-box__title--FontSize: var(--pf-t--global--font--size--heading--h3);
|
16
16
|
}
|
17
17
|
.pf-v6-c-button.pf-m-primary.pf-m-block,
|
18
18
|
.pf-v6-c-button.pf-m-link.pf-m-block {
|
19
|
-
--pf-v6-c-button--FontWeight:
|
19
|
+
--pf-v6-c-button--FontWeight: var(--pf-t--global--font--weight--body--bold);
|
20
20
|
}
|
21
21
|
.pf-v6-c-modal-box__footer {
|
22
22
|
padding-block-start: var(--pf-t--global--spacer--xl);
|
@@ -47,8 +47,8 @@
|
|
47
47
|
.pf-chatbot__chatbot-modal--fullscreen {
|
48
48
|
inset-block-end: 0;
|
49
49
|
inset-inline-end: 0;
|
50
|
-
width: 50
|
51
|
-
height: fit-content;
|
50
|
+
width: 50% !important;
|
51
|
+
height: fit-content !important;
|
52
52
|
top: 50%;
|
53
53
|
left: 50%;
|
54
54
|
transform: translate(-50%, -50%);
|
@@ -59,7 +59,7 @@
|
|
59
59
|
// Chatbot Display Mode - Default
|
60
60
|
// ============================================================================
|
61
61
|
.pf-chatbot__chatbot-modal--default {
|
62
|
-
box-shadow: unset;
|
62
|
+
box-shadow: unset !important;
|
63
63
|
}
|
64
64
|
|
65
65
|
// ============================================================================
|
@@ -69,9 +69,9 @@
|
|
69
69
|
height: 100vh;
|
70
70
|
inset-block-end: 0;
|
71
71
|
inset-inline-end: 0;
|
72
|
-
border-radius: 0;
|
73
|
-
--pf-v6-c-modal-box--MaxHeight: 100vh;
|
74
|
-
box-shadow: unset;
|
72
|
+
border-radius: 0 !important;
|
73
|
+
--pf-v6-c-modal-box--MaxHeight: 100vh !important;
|
74
|
+
box-shadow: unset !important;
|
75
75
|
}
|
76
76
|
|
77
77
|
// ============================================================================
|
@@ -65,7 +65,12 @@ const ChatbotToggleBase: React.FunctionComponent<ChatbotToggleProps> = ({
|
|
65
65
|
const icon = isChatbotVisible ? <AngleDownIcon data-testid={openIconTestId} /> : closedIcon;
|
66
66
|
|
67
67
|
return (
|
68
|
-
<Tooltip
|
68
|
+
<Tooltip
|
69
|
+
content={tooltipLabel}
|
70
|
+
// prevents VO announcements of both aria label and tooltip
|
71
|
+
aria="none"
|
72
|
+
{...tooltipProps}
|
73
|
+
>
|
69
74
|
<Button
|
70
75
|
className={`pf-chatbot__button ${isChatbotVisible ? 'pf-chatbot__button--active' : ''} ${isRound ? 'pf-chatbot__button--round' : ''} ${className ? className : ''}`}
|
71
76
|
variant="plain"
|
@@ -7,53 +7,61 @@ import userEvent from '@testing-library/user-event';
|
|
7
7
|
describe('ChatbotWelcomePrompt', () => {
|
8
8
|
it('should render welcome prompt', () => {
|
9
9
|
const { container } = render(
|
10
|
-
<ChatbotWelcomePrompt title="
|
10
|
+
<ChatbotWelcomePrompt title="Hi, ChatBot User!" description="How can I help you today?" />
|
11
11
|
);
|
12
12
|
expect(container).toMatchSnapshot();
|
13
13
|
});
|
14
14
|
|
15
15
|
it('should render correctly', () => {
|
16
|
-
render(<ChatbotWelcomePrompt title="
|
17
|
-
expect(screen.getByText('
|
18
|
-
expect(screen.getByText('How
|
16
|
+
render(<ChatbotWelcomePrompt title="Hi, ChatBot User!" description="How can I help you today?" />);
|
17
|
+
expect(screen.getByText('Hi, ChatBot User!')).toBeTruthy();
|
18
|
+
expect(screen.getByText('How can I help you today?')).toBeTruthy();
|
19
19
|
});
|
20
20
|
it('should render prompts with titles correctly', () => {
|
21
21
|
render(
|
22
22
|
<ChatbotWelcomePrompt
|
23
|
-
title="
|
24
|
-
description="How
|
25
|
-
prompts={[{ title: '
|
23
|
+
title="Hi, ChatBot User!"
|
24
|
+
description="How can I help you today?"
|
25
|
+
prompts={[{ title: 'Set up account' }]}
|
26
26
|
/>
|
27
27
|
);
|
28
|
-
expect(screen.getByText('
|
28
|
+
expect(screen.getByText('Set up account')).toBeTruthy();
|
29
29
|
});
|
30
30
|
it('should render prompts with messages correctly', () => {
|
31
31
|
render(
|
32
32
|
<ChatbotWelcomePrompt
|
33
|
-
title="
|
34
|
-
description="How
|
35
|
-
prompts={[
|
33
|
+
title="Hi, ChatBot User!"
|
34
|
+
description="How can I help you today?"
|
35
|
+
prompts={[
|
36
|
+
{ title: 'Set up account', message: 'Choose the necessary settings and preferences for your account.' }
|
37
|
+
]}
|
36
38
|
/>
|
37
39
|
);
|
38
|
-
expect(screen.getByText('
|
40
|
+
expect(screen.getByText('Choose the necessary settings and preferences for your account.')).toBeTruthy();
|
39
41
|
});
|
40
42
|
it('should render prompts with onClick correctly', async () => {
|
41
43
|
const spy = jest.fn();
|
42
44
|
render(
|
43
45
|
<ChatbotWelcomePrompt
|
44
|
-
title="
|
45
|
-
description="How
|
46
|
-
prompts={[
|
46
|
+
title="Hi, ChatBot User!"
|
47
|
+
description="How can I help you today?"
|
48
|
+
prompts={[
|
49
|
+
{
|
50
|
+
title: 'Set up account',
|
51
|
+
message: 'Choose the necessary settings and preferences for your account.',
|
52
|
+
onClick: spy
|
53
|
+
}
|
54
|
+
]}
|
47
55
|
/>
|
48
56
|
);
|
49
|
-
await userEvent.click(screen.getByRole('button', { name: /
|
57
|
+
await userEvent.click(screen.getByRole('button', { name: /Set up account/i }));
|
50
58
|
expect(spy).toHaveBeenCalled();
|
51
59
|
});
|
52
60
|
it('should apply className appropriately', () => {
|
53
61
|
render(
|
54
62
|
<ChatbotWelcomePrompt
|
55
|
-
title="
|
56
|
-
description="How
|
63
|
+
title="Hi, ChatBot User!"
|
64
|
+
description="How can I help you today?"
|
57
65
|
className="test"
|
58
66
|
testId="welcome-prompt"
|
59
67
|
/>
|
@@ -15,13 +15,13 @@ exports[`ChatbotWelcomePrompt should render welcome prompt 1`] = `
|
|
15
15
|
<span
|
16
16
|
class="pf-chatbot__hello"
|
17
17
|
>
|
18
|
-
|
18
|
+
Hi, ChatBot User!
|
19
19
|
</span>
|
20
20
|
<br />
|
21
21
|
<span
|
22
22
|
class="pf-chatbot__question"
|
23
23
|
>
|
24
|
-
How
|
24
|
+
How can I help you today?
|
25
25
|
</span>
|
26
26
|
</h1>
|
27
27
|
</div>
|
@@ -4,9 +4,10 @@
|
|
4
4
|
--pf-v6-c-code-editor__main--BorderEndStartRadius: 0;
|
5
5
|
--pf-v6-c-code-editor__main--BorderEndEndRadius: 0;
|
6
6
|
--pf-v6-c-code-editor__tab--BorderStartEndRadius: var(--pf-t--global--border--radius--small);
|
7
|
+
--pf-v6-c-code-editor--m-read-only__main--BackgroundColor: #1f1f1f;
|
7
8
|
}
|
8
9
|
.pf-v6-c-code-editor__header {
|
9
|
-
background: #1f1f1f;
|
10
|
+
background: #1f1f1f !important;
|
10
11
|
/** this is for the attachment editor header */
|
11
12
|
border-start-start-radius: var(--pf-t--global--border--radius--small);
|
12
13
|
border-start-end-radius: var(--pf-t--global--border--radius--small);
|
@@ -24,7 +25,9 @@
|
|
24
25
|
.pf-v6-c-code-editor__header-content {
|
25
26
|
--pf-v6-c-code-editor__header-content--BackgroundColor: #1f1f1f;
|
26
27
|
--pf-v6-c-code-editor__header-content--m-plain--BackgroundColor: #1f1f1f;
|
27
|
-
--pf-v6-c-code-editor__header-content--BorderStartStartRadius: var(
|
28
|
+
--pf-v6-c-code-editor__header-content--BorderStartStartRadius: var(
|
29
|
+
--pf-t--global--border--radius--small
|
30
|
+
) !important;
|
28
31
|
--pf-v6-c-code-editor__header-content--PaddingInlineEnd: 0;
|
29
32
|
justify-content: flex-end;
|
30
33
|
}
|
@@ -38,7 +41,7 @@
|
|
38
41
|
border: none;
|
39
42
|
--pf-v6-c-code-editor__tab--BorderStartEndRadius: 0;
|
40
43
|
border-start-start-radius: var(--pf-t--global--border--radius--small);
|
41
|
-
--pf-t--global--font--weight--body--default:
|
44
|
+
--pf-t--global--font--weight--body--default: var(--pf-t--global--font--weight--body--bold);
|
42
45
|
}
|
43
46
|
.pf-v6-c-code-editor__tab-icon {
|
44
47
|
display: none;
|
@@ -80,5 +83,5 @@
|
|
80
83
|
}
|
81
84
|
|
82
85
|
.pf-chatbot__code-modal--fullscreen {
|
83
|
-
height: inherit; // override shared modal so code editor works in full screen
|
86
|
+
height: inherit !important; // override shared modal so code editor works in full screen
|
84
87
|
}
|