@red-hat-developer-hub/backstage-plugin-lightspeed 1.1.1 → 1.2.0

package/dist/components/LightspeedChatBox.esm.js

@@ -1,12 +1,14 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { forwardRef, useRef, useImperativeHandle, useEffect, Fragment } from 'react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+import { forwardRef, useRef, useImperativeHandle, useEffect } from 'react';
 import { makeStyles } from '@material-ui/core';
-import { MessageBox, ChatbotWelcomePrompt, Message } from '@patternfly/chatbot';
+import { ChatbotDisplayMode, MessageBox, ChatbotWelcomePrompt, DeepThinking, ToolCall, Message } from '@patternfly/chatbot';
 import { Alert } from '@patternfly/react-core';
 import { useAutoScroll } from '../hooks/useAutoScroll.esm.js';
 import { useBufferedMessages } from '../hooks/useBufferedMessages.esm.js';
 import { useFeedbackActions } from '../hooks/useFeedbackActions.esm.js';
 import { useTranslation } from '../hooks/useTranslation.esm.js';
+import { parseReasoning } from '../utils/reasoningParser.esm.js';
+import { mapToPatternFlyToolCall } from '../utils/toolCallMapper.esm.js';
 
 const useStyles = makeStyles((theme) => ({
   prompt: {
@@ -18,6 +20,11 @@ const useStyles = makeStyles((theme) => ({
   alert: {
     background: "unset !important"
   },
+  promptSuggestions: {
+    "& div.pf-chatbot__prompt-suggestions": {
+      "flex-direction": "column !important"
+    }
+  },
   userMessageText: {
     "& div.pf-chatbot__message--user": {
       "& div.pf-chatbot__message-text": {
@@ -37,7 +44,8 @@ const LightspeedChatBox = forwardRef(
     profileLoading,
     welcomePrompts,
     isStreaming,
-    topicRestrictionEnabled
+    topicRestrictionEnabled,
+    displayMode
   }, ref) => {
     const classes = useStyles();
     const scrollQueued = useRef(false);
@@ -80,10 +88,21 @@ const LightspeedChatBox = forwardRef(
       };
     }, [autoScroll, cmessages, containerRef]);
     const messageBoxClasses = `${classes.container} ${classes.userMessageText}`;
+    const isEmbeddedMode = displayMode === ChatbotDisplayMode.embedded;
+    const getMessageBoxClassName = () => {
+      if (!welcomePrompts.length) {
+        return messageBoxClasses;
+      }
+      const baseClasses = `${messageBoxClasses} ${classes.prompt}`;
+      if (isEmbeddedMode) {
+        return baseClasses;
+      }
+      return `${baseClasses} ${classes.promptSuggestions}`;
+    };
     return /* @__PURE__ */ jsxs(
       MessageBox,
       {
-        className: welcomePrompts.length ? `${messageBoxClasses} ${classes.prompt}` : messageBoxClasses,
+        className: getMessageBoxClassName(),
         announcement,
         ref: containerRef,
         onScrollToTopClick: scrollToTop,
@@ -113,14 +132,56 @@ const LightspeedChatBox = forwardRef(
                 userName: profileLoading ? t("user.loading") : userName ?? t("user.guest")
               }),
               description: t("chatbox.welcome.description"),
-              prompts: welcomePrompts
+              prompts: welcomePrompts,
+              style: { paddingBottom: "0" }
             }
           ) : /* @__PURE__ */ jsx("br", {}),
           conversationMessages.map((message, index) => {
-            if (index === cmessages.length - 1) {
-              return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(Message, { ...message }, `${message.role}-${index}`) }, `${message.role}-${index}`);
+            const messageContent = message.content;
+            const parsedReasoning = parseReasoning(messageContent || "");
+            const firstToolCall = message.toolCalls?.[0];
+            const toolCallProp = firstToolCall ? mapToPatternFlyToolCall(firstToolCall, t) : undefined;
+            const additionalToolCalls = message.toolCalls?.slice(1);
+            const extraContentParts = {};
+            let deepThinking = undefined;
+            if (parsedReasoning.isReasoningInProgress || parsedReasoning.hasReasoning) {
+              const reasoningContent = parsedReasoning.reasoning || (() => {
+                const reasoningMatch = messageContent.match(/<think>(.*?)$/s);
+                return reasoningMatch ? reasoningMatch[1].trim() : "";
+              })();
+              if (reasoningContent) {
+                deepThinking = {
+                  toggleContent: t("reasoning.thinking"),
+                  body: reasoningContent,
+                  expandableSectionProps: {}
+                };
+                extraContentParts.beforeMainContent = /* @__PURE__ */ jsx(DeepThinking, { ...deepThinking });
+              }
+            }
+            if (additionalToolCalls && additionalToolCalls.length > 0) {
+              extraContentParts.afterMainContent = /* @__PURE__ */ jsx(Fragment, { children: additionalToolCalls.map((tc) => {
+                const tcProps = mapToPatternFlyToolCall(tc, t);
+                return /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    style: { marginTop: "8px" },
+                    children: /* @__PURE__ */ jsx(ToolCall, { ...tcProps })
+                  },
+                  `tool-${tc.id}-${tc.toolName}`
+                );
+              }) });
             }
-            return /* @__PURE__ */ jsx(Message, { ...message }, `${message.role}-${index}`);
+            const extraContent = extraContentParts.beforeMainContent || extraContentParts.afterMainContent ? extraContentParts : undefined;
+            const finalMessage = parsedReasoning.hasReasoning || parsedReasoning.isReasoningInProgress ? { ...message, content: parsedReasoning.mainContent } : message;
+            return /* @__PURE__ */ jsx(
+              Message,
+              {
+                toolCall: toolCallProp,
+                extraContent,
+                ...finalMessage
+              },
+              `${message.role}-${index}`
+            );
           })
         ]
       }

package/dist/components/LightspeedChatBox.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"LightspeedChatBox.esm.js","sources":["../../src/components/LightspeedChatBox.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ForwardedRef,\n  forwardRef,\n  Fragment,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { makeStyles } from '@material-ui/core';\nimport {\n  ChatbotWelcomePrompt,\n  Message,\n  MessageBox,\n  MessageBoxHandle,\n  MessageProps,\n  WelcomePrompt,\n} from '@patternfly/chatbot';\nimport { Alert } from '@patternfly/react-core';\n\nimport { useAutoScroll } from '../hooks/useAutoScroll';\nimport { useBufferedMessages } from '../hooks/useBufferedMessages';\nimport { useFeedbackActions } from '../hooks/useFeedbackActions';\nimport { useTranslation } from '../hooks/useTranslation';\n\nconst useStyles = makeStyles(theme => ({\n  prompt: {\n    'justify-content': 'flex-end',\n  },\n  container: {\n    maxWidth: 'unset !important',\n  },\n  alert: {\n    background: 'unset !important',\n  },\n  userMessageText: {\n    '& div.pf-chatbot__message--user': {\n      '& div.pf-chatbot__message-text': {\n        '& p': {\n          color: theme.palette.common.white,\n        },\n      },\n    },\n  },\n}));\n\ntype LightspeedChatBoxProps = {\n  userName?: string;\n  messages: MessageProps[];\n  profileLoading: boolean;\n  announcement: string | undefined;\n  topicRestrictionEnabled: boolean;\n  welcomePrompts: WelcomePrompt[];\n  conversationId: string;\n  isStreaming: boolean;\n};\n\nexport interface ScrollContainerHandle {\n  scrollToBottom: () => void;\n}\n\nexport const LightspeedChatBox = forwardRef(\n  (\n    {\n      userName,\n      messages,\n      announcement,\n      conversationId,\n      profileLoading,\n      welcomePrompts,\n      isStreaming,\n      topicRestrictionEnabled,\n    }: LightspeedChatBoxProps,\n    ref: ForwardedRef<ScrollContainerHandle>,\n  ) => {\n    const classes = useStyles();\n    const scrollQueued = useRef(false);\n    const containerRef = useRef<MessageBoxHandle>(null);\n    const { t } = useTranslation();\n\n    const cmessages = useBufferedMessages(messages, 30);\n    const { autoScroll, scrollToBottom, scrollToTop } =\n      useAutoScroll(containerRef);\n    const conversationMessages = useFeedbackActions(\n      cmessages,\n      conversationId,\n      isStreaming,\n    );\n\n    useImperativeHandle(ref, () => ({\n      scrollToBottom: () => {\n        if (scrollQueued.current) return;\n        scrollQueued.current = true;\n\n        requestAnimationFrame(() => {\n          scrollToBottom();\n          scrollQueued.current = false;\n        });\n      },\n    }));\n\n    // Auto-scrolls to the latest message\n    useEffect(() => {\n      if (!autoScroll || scrollQueued.current) return undefined;\n\n      scrollQueued.current = true;\n\n      const rafId = requestAnimationFrame(() => {\n        const container = containerRef.current;\n        if (!container) return;\n\n        setTimeout(() => {\n          container.scrollTo({\n            top: container.scrollHeight,\n            behavior: 'auto',\n          });\n        }, 0);\n\n        scrollQueued.current = false;\n      });\n\n      return () => {\n        cancelAnimationFrame(rafId);\n        scrollQueued.current = false;\n      };\n\n      // eslint-disable-next-line\n    }, [autoScroll, cmessages, containerRef]);\n\n    const messageBoxClasses = `${classes.container} ${classes.userMessageText}`;\n    return (\n      <MessageBox\n        className={\n          welcomePrompts.length\n            ? `${messageBoxClasses} ${classes.prompt}`\n            : messageBoxClasses\n        }\n        announcement={announcement}\n        ref={containerRef}\n        onScrollToTopClick={scrollToTop}\n        onScrollToBottomClick={scrollToBottom}\n        jumpButtonBottomProps={{ 'aria-label': t('aria.scroll.down') }}\n        jumpButtonTopProps={{ 'aria-label': t('aria.scroll.up') }}\n        jumpButtonBottomTooltipProps={{ content: t('tooltip.backToBottom') }}\n        jumpButtonTopTooltipProps={{ content: t('tooltip.backToTop') }}\n      >\n        <div>\n          <Alert\n            title={t('aria.important')}\n            variant=\"info\"\n            isInline\n            className={classes.alert}\n          >\n            {topicRestrictionEnabled\n              ? t('disclaimer.withValidation')\n              : t('disclaimer.withoutValidation')}\n          </Alert>\n          <br />\n        </div>\n        {welcomePrompts.length ? (\n          <ChatbotWelcomePrompt\n            title={t('chatbox.welcome.greeting' as any, {\n              userName: profileLoading\n                ? t('user.loading')\n                : (userName ?? t('user.guest')),\n            })}\n            description={t('chatbox.welcome.description')}\n            prompts={welcomePrompts}\n          />\n        ) : (\n          <br />\n        )}\n        {conversationMessages.map((message, index) => {\n          if (index === cmessages.length - 1) {\n            return (\n              <Fragment key={`${message.role}-${index}`}>\n                <Message key={`${message.role}-${index}`} {...message} />\n              </Fragment>\n            );\n          }\n          return <Message key={`${message.role}-${index}`} {...message} />;\n        })}\n      </MessageBox>\n    );\n  },\n);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"LightspeedChatBox.esm.js","sources":["../../src/components/LightspeedChatBox.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  ForwardedRef,\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useRef,\n} from 'react';\n\nimport { makeStyles } from '@material-ui/core';\nimport {\n  ChatbotDisplayMode,\n  ChatbotWelcomePrompt,\n  DeepThinking,\n  DeepThinkingProps,\n  Message,\n  MessageBox,\n  MessageBoxHandle,\n  MessageProps,\n  ToolCall as PatternFlyToolCall,\n  WelcomePrompt,\n} from '@patternfly/chatbot';\nimport { Alert } from '@patternfly/react-core';\n\nimport { useAutoScroll } from '../hooks/useAutoScroll';\nimport { useBufferedMessages } from '../hooks/useBufferedMessages';\nimport { useFeedbackActions } from '../hooks/useFeedbackActions';\nimport { useTranslation } from '../hooks/useTranslation';\nimport { ToolCall } from '../types';\nimport { parseReasoning } from '../utils/reasoningParser';\nimport { mapToPatternFlyToolCall } from '../utils/toolCallMapper';\n\nconst useStyles = makeStyles(theme => ({\n  prompt: {\n    'justify-content': 'flex-end',\n  },\n  container: {\n    maxWidth: 'unset !important',\n  },\n  alert: {\n    background: 'unset !important',\n  },\n  promptSuggestions: {\n    '& div.pf-chatbot__prompt-suggestions': {\n      'flex-direction': 'column !important',\n    },\n  },\n\n  userMessageText: {\n    '& div.pf-chatbot__message--user': {\n      '& div.pf-chatbot__message-text': {\n        '& p': {\n          color: theme.palette.common.white,\n        },\n      },\n    },\n  },\n}));\n\n// Extended message type that includes tool calls\ninterface ExtendedMessageProps extends MessageProps {\n  toolCalls?: ToolCall[];\n}\n\ntype LightspeedChatBoxProps = {\n  userName?: string;\n  messages: ExtendedMessageProps[];\n  profileLoading: boolean;\n  announcement: string | undefined;\n  topicRestrictionEnabled: boolean;\n  welcomePrompts: WelcomePrompt[];\n  conversationId: string;\n  isStreaming: boolean;\n  displayMode?: ChatbotDisplayMode;\n};\n\nexport interface ScrollContainerHandle {\n  scrollToBottom: () => void;\n}\n\nexport const LightspeedChatBox = forwardRef(\n  (\n    {\n      userName,\n      messages,\n      announcement,\n      conversationId,\n      profileLoading,\n      welcomePrompts,\n      isStreaming,\n      topicRestrictionEnabled,\n      displayMode,\n    }: LightspeedChatBoxProps,\n    ref: ForwardedRef<ScrollContainerHandle>,\n  ) => {\n    const classes = useStyles();\n    const scrollQueued = useRef(false);\n    const containerRef = useRef<MessageBoxHandle>(null);\n    const { t } = useTranslation();\n\n    const cmessages = useBufferedMessages(messages, 30);\n    const { autoScroll, scrollToBottom, scrollToTop } =\n      useAutoScroll(containerRef);\n    const conversationMessages = useFeedbackActions(\n      cmessages,\n      conversationId,\n      isStreaming,\n    );\n\n    useImperativeHandle(ref, () => ({\n      scrollToBottom: () => {\n        if (scrollQueued.current) return;\n        scrollQueued.current = true;\n\n        requestAnimationFrame(() => {\n          scrollToBottom();\n          scrollQueued.current = false;\n        });\n      },\n    }));\n\n    // Auto-scrolls to the latest message\n    useEffect(() => {\n      if (!autoScroll || scrollQueued.current) return undefined;\n\n      scrollQueued.current = true;\n\n      const rafId = requestAnimationFrame(() => {\n        const container = containerRef.current;\n        if (!container) return;\n\n        setTimeout(() => {\n          container.scrollTo({\n            top: container.scrollHeight,\n            behavior: 'auto',\n          });\n        }, 0);\n\n        scrollQueued.current = false;\n      });\n\n      return () => {\n        cancelAnimationFrame(rafId);\n        scrollQueued.current = false;\n      };\n\n      // eslint-disable-next-line\n    }, [autoScroll, cmessages, containerRef]);\n\n    const messageBoxClasses = `${classes.container} ${classes.userMessageText}`;\n    const isEmbeddedMode = displayMode === ChatbotDisplayMode.embedded;\n\n    const getMessageBoxClassName = () => {\n      if (!welcomePrompts.length) {\n        return messageBoxClasses;\n      }\n      const baseClasses = `${messageBoxClasses} ${classes.prompt}`;\n      if (isEmbeddedMode) {\n        return baseClasses;\n      }\n      return `${baseClasses} ${classes.promptSuggestions}`;\n    };\n\n    return (\n      <MessageBox\n        className={getMessageBoxClassName()}\n        announcement={announcement}\n        ref={containerRef}\n        onScrollToTopClick={scrollToTop}\n        onScrollToBottomClick={scrollToBottom}\n        jumpButtonBottomProps={{ 'aria-label': t('aria.scroll.down') }}\n        jumpButtonTopProps={{ 'aria-label': t('aria.scroll.up') }}\n        jumpButtonBottomTooltipProps={{ content: t('tooltip.backToBottom') }}\n        jumpButtonTopTooltipProps={{ content: t('tooltip.backToTop') }}\n      >\n        <div>\n          <Alert\n            title={t('aria.important')}\n            variant=\"info\"\n            isInline\n            className={classes.alert}\n          >\n            {topicRestrictionEnabled\n              ? t('disclaimer.withValidation')\n              : t('disclaimer.withoutValidation')}\n          </Alert>\n          <br />\n        </div>\n        {welcomePrompts.length ? (\n          <ChatbotWelcomePrompt\n            title={t('chatbox.welcome.greeting' as any, {\n              userName: profileLoading\n                ? t('user.loading')\n                : (userName ?? t('user.guest')),\n            })}\n            description={t('chatbox.welcome.description')}\n            prompts={welcomePrompts}\n            style={{ paddingBottom: '0' }}\n          />\n        ) : (\n          <br />\n        )}\n        {conversationMessages.map((message, index) => {\n          const messageContent = message.content as string;\n          const parsedReasoning = parseReasoning(messageContent || '');\n\n          // Map first tool call to PatternFly's toolCall prop\n          const firstToolCall = message.toolCalls?.[0];\n          const toolCallProp = firstToolCall\n            ? mapToPatternFlyToolCall(firstToolCall, t)\n            : undefined;\n\n          // Handle additional tool calls (if any) via extraContent\n          const additionalToolCalls = message.toolCalls?.slice(1);\n\n          const extraContentParts: {\n            beforeMainContent?: React.ReactNode;\n            afterMainContent?: React.ReactNode;\n          } = {};\n\n          let deepThinking: DeepThinkingProps | undefined = undefined;\n\n          if (\n            parsedReasoning.isReasoningInProgress ||\n            parsedReasoning.hasReasoning\n          ) {\n            const reasoningContent =\n              parsedReasoning.reasoning ||\n              (() => {\n                const reasoningMatch = messageContent.match(/<think>(.*?)$/s);\n                return reasoningMatch ? reasoningMatch[1].trim() : '';\n              })();\n\n            if (reasoningContent) {\n              deepThinking = {\n                toggleContent: t('reasoning.thinking'),\n                body: reasoningContent,\n                expandableSectionProps: {},\n              };\n              extraContentParts.beforeMainContent = (\n                <DeepThinking {...deepThinking} />\n              );\n            }\n          }\n\n          if (additionalToolCalls && additionalToolCalls.length > 0) {\n            extraContentParts.afterMainContent = (\n              <>\n                {additionalToolCalls.map(tc => {\n                  const tcProps = mapToPatternFlyToolCall(tc, t);\n                  return (\n                    <div\n                      key={`tool-${tc.id}-${tc.toolName}`}\n                      style={{ marginTop: '8px' }}\n                    >\n                      <PatternFlyToolCall {...tcProps} />\n                    </div>\n                  );\n                })}\n              </>\n            );\n          }\n\n          const extraContent =\n            extraContentParts.beforeMainContent ||\n            extraContentParts.afterMainContent\n              ? extraContentParts\n              : undefined;\n\n          const finalMessage =\n            parsedReasoning.hasReasoning ||\n            parsedReasoning.isReasoningInProgress\n              ? { ...message, content: parsedReasoning.mainContent }\n              : message;\n\n          return (\n            <Message\n              key={`${message.role}-${index}`}\n              toolCall={toolCallProp}\n              extraContent={extraContent}\n              {...finalMessage}\n            />\n          );\n        })}\n      </MessageBox>\n    );\n  },\n);\n"],"names":["PatternFlyToolCall"],"mappings":"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"}

package/dist/components/LightspeedChatBoxHeader.esm.js

@@ -3,18 +3,23 @@ import { useState, useMemo } from 'react';
 import { makeStyles, createStyles } from '@material-ui/core';
 import ToggleOffOutlinedIcon from '@mui/icons-material/ToggleOffOutlined';
 import ToggleOnOutlinedIcon from '@mui/icons-material/ToggleOnOutlined';
-import { ChatbotHeaderActions, ChatbotHeaderOptionsDropdown } from '@patternfly/chatbot';
-import { Dropdown, DropdownList, DropdownGroup, DropdownItem, Divider, MenuToggle } from '@patternfly/react-core';
+import Divider from '@mui/material/Divider';
+import { ChatbotHeaderActions, ChatbotHeaderOptionsDropdown, ChatbotDisplayMode } from '@patternfly/chatbot';
+import { Dropdown, DropdownList, DropdownGroup, DropdownItem, MenuToggle } from '@patternfly/react-core';
+import { OutlinedWindowRestoreIcon, OpenDrawerRightIcon, ExpandIcon } from '@patternfly/react-icons';
 import { useTranslation } from '../hooks/useTranslation.esm.js';
 
 const useStyles = makeStyles(
-  () => createStyles({
+  (theme) => createStyles({
     dropdown: {
       "& ul, & li": {
         padding: 0,
         margin: 0
       }
     },
+    header: {
+      backgroundColor: theme.palette.action.disabled
+    },
     optionsToggle: {
       "& svg": {
         transform: "none !important"
@@ -27,10 +32,13 @@ const useStyles = makeStyles(
 );
 const LightspeedChatBoxHeader = ({
   selectedModel,
+  displayMode,
   handleSelectedModel,
   models,
   isPinningChatsEnabled,
-  onPinnedChatsToggle
+  onPinnedChatsToggle,
+  isModelSelectorDisabled = false,
+  setDisplayMode
 }) => {
   const [isOptionsMenuOpen, setIsOptionsMenuOpen] = useState(false);
   const { t } = useTranslation();
@@ -49,10 +57,12 @@ const LightspeedChatBoxHeader = ({
   const toggle = (toggleRef) => /* @__PURE__ */ jsx(
     MenuToggle,
     {
+      className: isModelSelectorDisabled ? styles.header : "",
       variant: "secondary",
       "aria-label": t("aria.chatbotSelector"),
       ref: toggleRef,
       isExpanded: isOptionsMenuOpen,
+      isDisabled: isModelSelectorDisabled,
       onClick: () => setIsOptionsMenuOpen(!isOptionsMenuOpen),
       children: selectedModel
     }
@@ -60,6 +70,15 @@ const LightspeedChatBoxHeader = ({
   const handlePinningChatsToggle = (state) => {
     onPinnedChatsToggle(state);
   };
+  const handleDockedToWindow = () => {
+    setDisplayMode(ChatbotDisplayMode.docked);
+  };
+  const handleFullscreen = () => {
+    setDisplayMode(ChatbotDisplayMode.embedded);
+  };
+  const handleOverlay = () => {
+    setDisplayMode(ChatbotDisplayMode.default);
+  };
   return /* @__PURE__ */ jsxs(ChatbotHeaderActions, { children: [
     /* @__PURE__ */ jsx(
       Dropdown,
@@ -92,7 +111,7 @@ const LightspeedChatBoxHeader = ({
         ) })
       }
     ),
-    /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(
       ChatbotHeaderOptionsDropdown,
       {
         isCompact: true,
@@ -103,27 +122,66 @@ const LightspeedChatBoxHeader = ({
         tooltipProps: {
           content: t("tooltip.settings")
         },
-        children: /* @__PURE__ */ jsx(DropdownGroup, { children: /* @__PURE__ */ jsx(DropdownList, { children: isPinningChatsEnabled ? /* @__PURE__ */ jsx(
-          DropdownItem,
-          {
-            value: "disablePinningChats",
-            icon: /* @__PURE__ */ jsx(ToggleOnOutlinedIcon, { sx: { marginTop: "8px" } }),
-            description: t("settings.pinned.enabled.description"),
-            onClick: () => handlePinningChatsToggle(false),
-            children: t("settings.pinned.disable")
-          },
-          "disablePinningChat"
-        ) : /* @__PURE__ */ jsx(
-          DropdownItem,
-          {
-            value: "enablePinningChats",
-            icon: /* @__PURE__ */ jsx(ToggleOffOutlinedIcon, { sx: { marginTop: "8px" } }),
-            description: t("settings.pinned.disabled.description"),
-            onClick: () => handlePinningChatsToggle(true),
-            children: t("settings.pinned.enable")
-          },
-          "enablePinningChats"
-        ) }) })
+        children: [
+          /* @__PURE__ */ jsx(DropdownGroup, { children: /* @__PURE__ */ jsxs(DropdownList, { children: [
+            /* @__PURE__ */ jsx(DropdownItem, { isDisabled: true, children: t("settings.displayMode.label") }, "displayModeLabel"),
+            /* @__PURE__ */ jsx(
+              DropdownItem,
+              {
+                value: ChatbotDisplayMode.default,
+                icon: /* @__PURE__ */ jsx(OutlinedWindowRestoreIcon, {}),
+                onClick: handleOverlay,
+                isSelected: displayMode === ChatbotDisplayMode.default,
+                children: t("settings.displayMode.overlay")
+              },
+              "switchDisplayOverlay"
+            ),
+            /* @__PURE__ */ jsx(
+              DropdownItem,
+              {
+                value: ChatbotDisplayMode.docked,
+                icon: /* @__PURE__ */ jsx(OpenDrawerRightIcon, {}),
+                onClick: handleDockedToWindow,
+                isSelected: displayMode === ChatbotDisplayMode.docked,
+                children: t("settings.displayMode.docked")
+              },
+              "switchDisplayDock"
+            ),
+            /* @__PURE__ */ jsx(
+              DropdownItem,
+              {
+                value: ChatbotDisplayMode.embedded,
+                icon: /* @__PURE__ */ jsx(ExpandIcon, {}),
+                onClick: handleFullscreen,
+                isSelected: displayMode === ChatbotDisplayMode.embedded,
+                children: t("settings.displayMode.fullscreen")
+              },
+              "switchDisplayFullscreen"
+            )
+          ] }) }),
+          /* @__PURE__ */ jsx(Divider, {}),
+          /* @__PURE__ */ jsx(DropdownGroup, { children: /* @__PURE__ */ jsx(DropdownList, { children: isPinningChatsEnabled ? /* @__PURE__ */ jsx(
+            DropdownItem,
+            {
+              value: "disablePinningChats",
+              icon: /* @__PURE__ */ jsx(ToggleOnOutlinedIcon, { sx: { marginTop: "8px" } }),
+              description: t("settings.pinned.enabled.description"),
+              onClick: () => handlePinningChatsToggle(false),
+              children: t("settings.pinned.disable")
+            },
+            "disablePinningChat"
+          ) : /* @__PURE__ */ jsx(
+            DropdownItem,
+            {
+              value: "enablePinningChats",
+              icon: /* @__PURE__ */ jsx(ToggleOffOutlinedIcon, { sx: { marginTop: "8px" } }),
+              description: t("settings.pinned.disabled.description"),
+              onClick: () => handlePinningChatsToggle(true),
+              children: t("settings.pinned.enable")
+            },
+            "enablePinningChats"
+          ) }) })
+        ]
       }
     )
   ] });

package/dist/components/LightspeedChatBoxHeader.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"LightspeedChatBoxHeader.esm.js","sources":["../../src/components/LightspeedChatBoxHeader.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Ref, useMemo, useState } from 'react';\n\nimport { createStyles, makeStyles } from '@material-ui/core';\nimport ToggleOffOutlinedIcon from '@mui/icons-material/ToggleOffOutlined';\nimport ToggleOnOutlinedIcon from '@mui/icons-material/ToggleOnOutlined';\nimport {\n  ChatbotHeaderActions,\n  ChatbotHeaderOptionsDropdown,\n} from '@patternfly/chatbot';\nimport {\n  Divider,\n  Dropdown,\n  DropdownGroup,\n  DropdownItem,\n  DropdownList,\n  MenuToggle,\n  MenuToggleElement,\n} from '@patternfly/react-core';\n\nimport { useTranslation } from '../hooks/useTranslation';\n\ntype LightspeedChatBoxHeaderProps = {\n  selectedModel: string;\n  handleSelectedModel: (item: string) => void;\n  models: { label: string; value: string; provider: string }[];\n  isPinningChatsEnabled: boolean;\n  onPinnedChatsToggle: (state: boolean) => void;\n};\n\nconst useStyles = makeStyles(() =>\n  createStyles({\n    dropdown: {\n      '& ul, & li': {\n        padding: 0,\n        margin: 0,\n      },\n    },\n    optionsToggle: {\n      '& svg': {\n        transform: 'none !important',\n      },\n    },\n    groupTitle: {\n      fontWeight: 'bold',\n    },\n  }),\n);\n\nexport const LightspeedChatBoxHeader = ({\n  selectedModel,\n  handleSelectedModel,\n  models,\n  isPinningChatsEnabled,\n  onPinnedChatsToggle,\n}: LightspeedChatBoxHeaderProps) => {\n  const [isOptionsMenuOpen, setIsOptionsMenuOpen] = useState(false);\n  const { t } = useTranslation();\n\n  const styles = useStyles();\n\n  // Group models by provider\n  const groupedModels = useMemo(() => {\n    const groups: {\n      [key: string]: { label: string; value: string; provider: string }[];\n    } = {};\n\n    models.forEach(model => {\n      const provider = model.provider || t('chatbox.provider.other');\n      if (!groups[provider]) {\n        groups[provider] = [];\n      }\n      groups[provider].push(model);\n    });\n\n    return groups;\n  }, [models, t]);\n\n  const toggle = (toggleRef: Ref<MenuToggleElement>) => (\n    <MenuToggle\n      variant=\"secondary\"\n      aria-label={t('aria.chatbotSelector')}\n      ref={toggleRef}\n      isExpanded={isOptionsMenuOpen}\n      onClick={() => setIsOptionsMenuOpen(!isOptionsMenuOpen)}\n    >\n      {selectedModel}\n    </MenuToggle>\n  );\n\n  const handlePinningChatsToggle = (state: boolean) => {\n    onPinnedChatsToggle(state);\n  };\n\n  return (\n    <ChatbotHeaderActions>\n      <Dropdown\n        className={styles.dropdown}\n        isOpen={isOptionsMenuOpen}\n        onSelect={(_e, value) => {\n          handleSelectedModel(value as string);\n          setIsOptionsMenuOpen(false);\n        }}\n        onOpenChange={isOpen => setIsOptionsMenuOpen(isOpen)}\n        popperProps={{ position: 'right' }}\n        shouldFocusToggleOnSelect\n        shouldFocusFirstItemOnOpen={false}\n        toggle={toggle}\n      >\n        <DropdownList>\n          {Object.entries(groupedModels).map(\n            ([provider, providerModels], index) => (\n              <>\n                <DropdownGroup\n                  className={styles.groupTitle}\n                  key={provider}\n                  label={provider}\n                  labelHeadingLevel=\"h1\"\n                >\n                  {providerModels.map(model => (\n                    <DropdownItem value={model.value} key={model.value}>\n                      {model.label}\n                    </DropdownItem>\n                  ))}\n                </DropdownGroup>\n                {index < Object.entries(groupedModels).length - 1 && (\n                  <Divider component=\"li\" />\n                )}\n              </>\n            ),\n          )}\n        </DropdownList>\n      </Dropdown>\n      <ChatbotHeaderOptionsDropdown\n        isCompact\n        toggleProps={{\n          'aria-label': t('aria.settings.label'),\n          className: styles.optionsToggle,\n        }}\n        tooltipProps={{\n          content: t('tooltip.settings'),\n        }}\n      >\n        <DropdownGroup>\n          <DropdownList>\n            {isPinningChatsEnabled ? (\n              <DropdownItem\n                value=\"disablePinningChats\"\n                key=\"disablePinningChat\"\n                icon={<ToggleOnOutlinedIcon sx={{ marginTop: '8px' }} />}\n                description={t('settings.pinned.enabled.description')}\n                onClick={() => handlePinningChatsToggle(false)}\n              >\n                {t('settings.pinned.disable')}\n              </DropdownItem>\n            ) : (\n              <DropdownItem\n                value=\"enablePinningChats\"\n                key=\"enablePinningChats\"\n                icon={<ToggleOffOutlinedIcon sx={{ marginTop: '8px' }} />}\n                description={t('settings.pinned.disabled.description')}\n                onClick={() => handlePinningChatsToggle(true)}\n              >\n                {t('settings.pinned.enable')}\n              </DropdownItem>\n            )}\n          </DropdownList>\n        </DropdownGroup>\n      </ChatbotHeaderOptionsDropdown>\n    </ChatbotHeaderActions>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AA6CA,MAAM,SAAY,GAAA,UAAA;AAAA,EAAW,MAC3B,YAAa,CAAA;AAAA,IACX,QAAU,EAAA;AAAA,MACR,YAAc,EAAA;AAAA,QACZ,OAAS,EAAA,CAAA;AAAA,QACT,MAAQ,EAAA;AAAA;AACV,KACF;AAAA,IACA,aAAe,EAAA;AAAA,MACb,OAAS,EAAA;AAAA,QACP,SAAW,EAAA;AAAA;AACb,KACF;AAAA,IACA,UAAY,EAAA;AAAA,MACV,UAAY,EAAA;AAAA;AACd,GACD;AACH,CAAA;AAEO,MAAM,0BAA0B,CAAC;AAAA,EACtC,aAAA;AAAA,EACA,mBAAA;AAAA,EACA,MAAA;AAAA,EACA,qBAAA;AAAA,EACA;AACF,CAAoC,KAAA;AAClC,EAAA,MAAM,CAAC,iBAAA,EAAmB,oBAAoB,CAAA,GAAI,SAAS,KAAK,CAAA;AAChE,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,cAAe,EAAA;AAE7B,EAAA,MAAM,SAAS,SAAU,EAAA;AAGzB,EAAM,MAAA,aAAA,GAAgB,QAAQ,MAAM;AAClC,IAAA,MAAM,SAEF,EAAC;AAEL,IAAA,MAAA,CAAO,QAAQ,CAAS,KAAA,KAAA;AACtB,MAAA,MAAM,QAAW,GAAA,KAAA,CAAM,QAAY,IAAA,CAAA,CAAE,wBAAwB,CAAA;AAC7D,MAAI,IAAA,CAAC,MAAO,CAAA,QAAQ,CAAG,EAAA;AACrB,QAAO,MAAA,CAAA,QAAQ,IAAI,EAAC;AAAA;AAEtB,MAAO,MAAA,CAAA,QAAQ,CAAE,CAAA,IAAA,CAAK,KAAK,CAAA;AAAA,KAC5B,CAAA;AAED,IAAO,OAAA,MAAA;AAAA,GACN,EAAA,CAAC,MAAQ,EAAA,CAAC,CAAC,CAAA;AAEd,EAAM,MAAA,MAAA,GAAS,CAAC,SACd,qBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,OAAQ,EAAA,WAAA;AAAA,MACR,YAAA,EAAY,EAAE,sBAAsB,CAAA;AAAA,MACpC,GAAK,EAAA,SAAA;AAAA,MACL,UAAY,EAAA,iBAAA;AAAA,MACZ,OAAS,EAAA,MAAM,oBAAqB,CAAA,CAAC,iBAAiB,CAAA;AAAA,MAErD,QAAA,EAAA;AAAA;AAAA,GACH;AAGF,EAAM,MAAA,wBAAA,GAA2B,CAAC,KAAmB,KAAA;AACnD,IAAA,mBAAA,CAAoB,KAAK,CAAA;AAAA,GAC3B;AAEA,EAAA,4BACG,oBACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACC,WAAW,MAAO,CAAA,QAAA;AAAA,QAClB,MAAQ,EAAA,iBAAA;AAAA,QACR,QAAA,EAAU,CAAC,EAAA,EAAI,KAAU,KAAA;AACvB,UAAA,mBAAA,CAAoB,KAAe,CAAA;AACnC,UAAA,oBAAA,CAAqB,KAAK,CAAA;AAAA,SAC5B;AAAA,QACA,YAAA,EAAc,CAAU,MAAA,KAAA,oBAAA,CAAqB,MAAM,CAAA;AAAA,QACnD,WAAA,EAAa,EAAE,QAAA,EAAU,OAAQ,EAAA;AAAA,QACjC,yBAAyB,EAAA,IAAA;AAAA,QACzB,0BAA4B,EAAA,KAAA;AAAA,QAC5B,MAAA;AAAA,QAEA,QAAC,kBAAA,GAAA,CAAA,YAAA,EAAA,EACE,QAAO,EAAA,MAAA,CAAA,OAAA,CAAQ,aAAa,CAAE,CAAA,GAAA;AAAA,UAC7B,CAAC,CAAC,QAAA,EAAU,cAAc,CAAA,EAAG,0BAEzB,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,4BAAA,GAAA;AAAA,cAAC,aAAA;AAAA,cAAA;AAAA,gBACC,WAAW,MAAO,CAAA,UAAA;AAAA,gBAElB,KAAO,EAAA,QAAA;AAAA,gBACP,iBAAkB,EAAA,IAAA;AAAA,gBAEjB,QAAe,EAAA,cAAA,CAAA,GAAA,CAAI,CAClB,KAAA,qBAAA,GAAA,CAAC,YAAa,EAAA,EAAA,KAAA,EAAO,KAAM,CAAA,KAAA,EACxB,QAAM,EAAA,KAAA,CAAA,KAAA,EAAA,EAD8B,KAAM,CAAA,KAE7C,CACD;AAAA,eAAA;AAAA,cARI;AAAA,aASP;AAAA,YACC,KAAA,GAAQ,MAAO,CAAA,OAAA,CAAQ,aAAa,CAAA,CAAE,SAAS,CAC9C,oBAAA,GAAA,CAAC,OAAQ,EAAA,EAAA,SAAA,EAAU,IAAK,EAAA;AAAA,WAE5B,EAAA;AAAA,SAGN,EAAA;AAAA;AAAA,KACF;AAAA,oBACA,GAAA;AAAA,MAAC,4BAAA;AAAA,MAAA;AAAA,QACC,SAAS,EAAA,IAAA;AAAA,QACT,WAAa,EAAA;AAAA,UACX,YAAA,EAAc,EAAE,qBAAqB,CAAA;AAAA,UACrC,WAAW,MAAO,CAAA;AAAA,SACpB;AAAA,QACA,YAAc,EAAA;AAAA,UACZ,OAAA,EAAS,EAAE,kBAAkB;AAAA,SAC/B;AAAA,QAEA,QAAC,kBAAA,GAAA,CAAA,aAAA,EAAA,EACC,QAAC,kBAAA,GAAA,CAAA,YAAA,EAAA,EACE,QACC,EAAA,qBAAA,mBAAA,GAAA;AAAA,UAAC,YAAA;AAAA,UAAA;AAAA,YACC,KAAM,EAAA,qBAAA;AAAA,YAEN,sBAAO,GAAA,CAAA,oBAAA,EAAA,EAAqB,IAAI,EAAE,SAAA,EAAW,OAAS,EAAA,CAAA;AAAA,YACtD,WAAA,EAAa,EAAE,qCAAqC,CAAA;AAAA,YACpD,OAAA,EAAS,MAAM,wBAAA,CAAyB,KAAK,CAAA;AAAA,YAE5C,YAAE,yBAAyB;AAAA,WAAA;AAAA,UALxB;AAAA,SAQN,mBAAA,GAAA;AAAA,UAAC,YAAA;AAAA,UAAA;AAAA,YACC,KAAM,EAAA,oBAAA;AAAA,YAEN,sBAAO,GAAA,CAAA,qBAAA,EAAA,EAAsB,IAAI,EAAE,SAAA,EAAW,OAAS,EAAA,CAAA;AAAA,YACvD,WAAA,EAAa,EAAE,sCAAsC,CAAA;AAAA,YACrD,OAAA,EAAS,MAAM,wBAAA,CAAyB,IAAI,CAAA;AAAA,YAE3C,YAAE,wBAAwB;AAAA,WAAA;AAAA,UALvB;AAAA,WAQV,CACF,EAAA;AAAA;AAAA;AACF,GACF,EAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"LightspeedChatBoxHeader.esm.js","sources":["../../src/components/LightspeedChatBoxHeader.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { Ref, useMemo, useState } from 'react';\n\nimport { createStyles, makeStyles } from '@material-ui/core';\nimport ToggleOffOutlinedIcon from '@mui/icons-material/ToggleOffOutlined';\nimport ToggleOnOutlinedIcon from '@mui/icons-material/ToggleOnOutlined';\nimport Divider from '@mui/material/Divider';\nimport {\n  ChatbotDisplayMode,\n  ChatbotHeaderActions,\n  ChatbotHeaderOptionsDropdown,\n} from '@patternfly/chatbot';\nimport {\n  Dropdown,\n  DropdownGroup,\n  DropdownItem,\n  DropdownList,\n  MenuToggle,\n  MenuToggleElement,\n} from '@patternfly/react-core';\nimport {\n  ExpandIcon,\n  OpenDrawerRightIcon,\n  OutlinedWindowRestoreIcon,\n} from '@patternfly/react-icons';\n\nimport { useTranslation } from '../hooks/useTranslation';\n\ntype LightspeedChatBoxHeaderProps = {\n  displayMode: ChatbotDisplayMode;\n  selectedModel: string;\n  handleSelectedModel: (item: string) => void;\n  models: { label: string; value: string; provider: string }[];\n  isPinningChatsEnabled: boolean;\n  onPinnedChatsToggle: (state: boolean) => void;\n  isModelSelectorDisabled?: boolean;\n  setDisplayMode: (mode: ChatbotDisplayMode) => void;\n};\n\nconst useStyles = makeStyles(theme =>\n  createStyles({\n    dropdown: {\n      '& ul, & li': {\n        padding: 0,\n        margin: 0,\n      },\n    },\n    header: {\n      backgroundColor: theme.palette.action.disabled,\n    },\n    optionsToggle: {\n      '& svg': {\n        transform: 'none !important',\n      },\n    },\n    groupTitle: {\n      fontWeight: 'bold',\n    },\n  }),\n);\n\nexport const LightspeedChatBoxHeader = ({\n  selectedModel,\n  displayMode,\n  handleSelectedModel,\n  models,\n  isPinningChatsEnabled,\n  onPinnedChatsToggle,\n  isModelSelectorDisabled = false,\n  setDisplayMode,\n}: LightspeedChatBoxHeaderProps) => {\n  const [isOptionsMenuOpen, setIsOptionsMenuOpen] = useState(false);\n  const { t } = useTranslation();\n\n  const styles = useStyles();\n\n  // Group models by provider\n  const groupedModels = useMemo(() => {\n    const groups: {\n      [key: string]: { label: string; value: string; provider: string }[];\n    } = {};\n\n    models.forEach(model => {\n      const provider = model.provider || t('chatbox.provider.other');\n      if (!groups[provider]) {\n        groups[provider] = [];\n      }\n      groups[provider].push(model);\n    });\n\n    return groups;\n  }, [models, t]);\n\n  const toggle = (toggleRef: Ref<MenuToggleElement>) => (\n    <MenuToggle\n      className={isModelSelectorDisabled ? styles.header : ''}\n      variant=\"secondary\"\n      aria-label={t('aria.chatbotSelector')}\n      ref={toggleRef}\n      isExpanded={isOptionsMenuOpen}\n      isDisabled={isModelSelectorDisabled}\n      onClick={() => setIsOptionsMenuOpen(!isOptionsMenuOpen)}\n    >\n      {selectedModel}\n    </MenuToggle>\n  );\n\n  const handlePinningChatsToggle = (state: boolean) => {\n    onPinnedChatsToggle(state);\n  };\n\n  const handleDockedToWindow = () => {\n    setDisplayMode(ChatbotDisplayMode.docked);\n  };\n\n  const handleFullscreen = () => {\n    setDisplayMode(ChatbotDisplayMode.embedded);\n  };\n\n  const handleOverlay = () => {\n    setDisplayMode(ChatbotDisplayMode.default);\n  };\n\n  return (\n    <ChatbotHeaderActions>\n      <Dropdown\n        className={styles.dropdown}\n        isOpen={isOptionsMenuOpen}\n        onSelect={(_e, value) => {\n          handleSelectedModel(value as string);\n          setIsOptionsMenuOpen(false);\n        }}\n        onOpenChange={isOpen => setIsOptionsMenuOpen(isOpen)}\n        popperProps={{ position: 'right' }}\n        shouldFocusToggleOnSelect\n        shouldFocusFirstItemOnOpen={false}\n        toggle={toggle}\n      >\n        <DropdownList>\n          {Object.entries(groupedModels).map(\n            ([provider, providerModels], index) => (\n              <>\n                <DropdownGroup\n                  className={styles.groupTitle}\n                  key={provider}\n                  label={provider}\n                  labelHeadingLevel=\"h1\"\n                >\n                  {providerModels.map(model => (\n                    <DropdownItem value={model.value} key={model.value}>\n                      {model.label}\n                    </DropdownItem>\n                  ))}\n                </DropdownGroup>\n                {index < Object.entries(groupedModels).length - 1 && (\n                  <Divider component=\"li\" />\n                )}\n              </>\n            ),\n          )}\n        </DropdownList>\n      </Dropdown>\n      <ChatbotHeaderOptionsDropdown\n        isCompact\n        toggleProps={{\n          'aria-label': t('aria.settings.label'),\n          className: styles.optionsToggle,\n        }}\n        tooltipProps={{\n          content: t('tooltip.settings'),\n        }}\n      >\n        <DropdownGroup>\n          <DropdownList>\n            <DropdownItem key=\"displayModeLabel\" isDisabled>\n              {t('settings.displayMode.label')}\n            </DropdownItem>\n            <DropdownItem\n              value={ChatbotDisplayMode.default}\n              key=\"switchDisplayOverlay\"\n              icon={<OutlinedWindowRestoreIcon />}\n              onClick={handleOverlay}\n              isSelected={displayMode === ChatbotDisplayMode.default}\n            >\n              {t('settings.displayMode.overlay')}\n            </DropdownItem>\n            <DropdownItem\n              value={ChatbotDisplayMode.docked}\n              key=\"switchDisplayDock\"\n              icon={<OpenDrawerRightIcon />}\n              onClick={handleDockedToWindow}\n              isSelected={displayMode === ChatbotDisplayMode.docked}\n            >\n              {t('settings.displayMode.docked')}\n            </DropdownItem>\n            <DropdownItem\n              value={ChatbotDisplayMode.embedded}\n              key=\"switchDisplayFullscreen\"\n              icon={<ExpandIcon />}\n              onClick={handleFullscreen}\n              isSelected={displayMode === ChatbotDisplayMode.embedded}\n            >\n              {t('settings.displayMode.fullscreen')}\n            </DropdownItem>\n          </DropdownList>\n        </DropdownGroup>\n        <Divider />\n        <DropdownGroup>\n          <DropdownList>\n            {isPinningChatsEnabled ? (\n              <DropdownItem\n                value=\"disablePinningChats\"\n                key=\"disablePinningChat\"\n                icon={<ToggleOnOutlinedIcon sx={{ marginTop: '8px' }} />}\n                description={t('settings.pinned.enabled.description')}\n                onClick={() => handlePinningChatsToggle(false)}\n              >\n                {t('settings.pinned.disable')}\n              </DropdownItem>\n            ) : (\n              <DropdownItem\n                value=\"enablePinningChats\"\n                key=\"enablePinningChats\"\n                icon={<ToggleOffOutlinedIcon sx={{ marginTop: '8px' }} />}\n                description={t('settings.pinned.disabled.description')}\n                onClick={() => handlePinningChatsToggle(true)}\n              >\n                {t('settings.pinned.enable')}\n              </DropdownItem>\n            )}\n          </DropdownList>\n        </DropdownGroup>\n      </ChatbotHeaderOptionsDropdown>\n    </ChatbotHeaderActions>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/LightspeedChatContainer.esm.js

@@ -0,0 +1,118 @@
+import { jsx } from 'react/jsx-runtime';
+import { useState, useMemo, useEffect } from 'react';
+import { useAsync } from 'react-use';
+import { useApi, identityApiRef } from '@backstage/core-plugin-api';
+import { useTheme } from '@material-ui/core/styles';
+import { QueryClientProvider } from '@tanstack/react-query';
+import { useAllModels } from '../hooks/useAllModels.esm.js';
+import { useLightspeedViewPermission } from '../hooks/useLightspeedViewPermission.esm.js';
+import { useTopicRestrictionStatus } from '../hooks/useQuestionValidation.esm.js';
+import queryClient from '../utils/queryClient.esm.js';
+import FileAttachmentContextProvider from './AttachmentContext.esm.js';
+import { LightspeedChat } from './LightSpeedChat.esm.js';
+import PermissionRequiredState from './PermissionRequiredState.esm.js';
+
+const THEME_DARK = "dark";
+const THEME_DARK_CLASS = "pf-v6-theme-dark";
+const LAST_SELECTED_MODEL_KEY = "lastSelectedModel";
+const LightspeedChatContainerInner = () => {
+  const {
+    palette: { type }
+  } = useTheme();
+  const identityApi = useApi(identityApiRef);
+  const { data: models } = useAllModels();
+  const { allowed: hasViewAccess, loading } = useLightspeedViewPermission();
+  const { value: profile, loading: profileLoading } = useAsync(
+    async () => await identityApi.getProfileInfo()
+  );
+  const [selectedModel, setSelectedModel] = useState("");
+  const [selectedProvider, setSelectedProvider] = useState("");
+  const { data: topicRestrictionEnabled } = useTopicRestrictionStatus();
+  const modelsItems = useMemo(
+    () => models ? models.filter((model) => model.model_type === "llm").map((m) => ({
+      label: m.provider_resource_id,
+      value: m.provider_resource_id,
+      provider: m.provider_id
+    })) : [],
+    [models]
+  );
+  useEffect(() => {
+    const htmlTagElement = document.documentElement;
+    if (type === THEME_DARK) {
+      htmlTagElement.classList.add(THEME_DARK_CLASS);
+    } else {
+      htmlTagElement.classList.remove(THEME_DARK_CLASS);
+    }
+  }, [type]);
+  useEffect(() => {
+    if (modelsItems.length > 0) {
+      try {
+        const storedData = localStorage.getItem(LAST_SELECTED_MODEL_KEY);
+        const parsedData = storedData ? JSON.parse(storedData) : null;
+        const storedModel = parsedData?.model ? modelsItems.find((m) => m.value === parsedData.model) : null;
+        if (storedModel) {
+          setSelectedModel(storedModel.value);
+          setSelectedProvider(storedModel.provider);
+        } else {
+          setSelectedModel(modelsItems[0].value);
+          setSelectedProvider(modelsItems[0].provider);
+        }
+      } catch (error) {
+        console.error(
+          "Error loading last selected model from localStorage:",
+          error
+        );
+        setSelectedModel(modelsItems[0].value);
+        setSelectedProvider(modelsItems[0].provider);
+      }
+    }
+  }, [modelsItems]);
+  useEffect(() => {
+    if (selectedModel && selectedProvider) {
+      try {
+        localStorage.setItem(
+          LAST_SELECTED_MODEL_KEY,
+          JSON.stringify({
+            model: selectedModel,
+            provider: selectedProvider
+          })
+        );
+      } catch (error) {
+        console.error(
+          "Error saving last selected model to localStorage:",
+          error
+        );
+      }
+    }
+  }, [selectedModel, selectedProvider]);
+  if (loading) {
+    return null;
+  }
+  if (!hasViewAccess) {
+    return /* @__PURE__ */ jsx(PermissionRequiredState, {});
+  }
+  return /* @__PURE__ */ jsx(FileAttachmentContextProvider, { children: /* @__PURE__ */ jsx(
+    LightspeedChat,
+    {
+      selectedModel,
+      selectedProvider,
+      topicRestrictionEnabled: topicRestrictionEnabled ?? false,
+      handleSelectedModel: (item) => {
+        setSelectedModel(item);
+        setSelectedProvider(
+          modelsItems.find((m) => m.value === item)?.provider || ""
+        );
+      },
+      models: modelsItems,
+      userName: profile?.displayName,
+      avatar: profile?.picture,
+      profileLoading
+    }
+  ) });
+};
+const LightspeedChatContainer = () => {
+  return /* @__PURE__ */ jsx(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx(LightspeedChatContainerInner, {}) });
+};
+
+export { LightspeedChatContainer };
+//# sourceMappingURL=LightspeedChatContainer.esm.js.map

package/dist/components/LightspeedChatContainer.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightspeedChatContainer.esm.js","sources":["../../src/components/LightspeedChatContainer.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useEffect, useMemo, useState } from 'react';\nimport { useAsync } from 'react-use';\n\nimport { identityApiRef, useApi } from '@backstage/core-plugin-api';\n\nimport { useTheme } from '@material-ui/core/styles';\nimport { QueryClientProvider } from '@tanstack/react-query';\n\nimport { useAllModels } from '../hooks/useAllModels';\nimport { useLightspeedViewPermission } from '../hooks/useLightspeedViewPermission';\nimport { useTopicRestrictionStatus } from '../hooks/useQuestionValidation';\nimport queryClient from '../utils/queryClient';\nimport FileAttachmentContextProvider from './AttachmentContext';\nimport { LightspeedChat } from './LightSpeedChat';\nimport PermissionRequiredState from './PermissionRequiredState';\n\nconst THEME_DARK = 'dark';\nconst THEME_DARK_CLASS = 'pf-v6-theme-dark';\nconst LAST_SELECTED_MODEL_KEY = 'lastSelectedModel';\n\n/**\n * Inner component that contains all the Lightspeed chat rendering logic\n */\nconst LightspeedChatContainerInner = () => {\n  const {\n    palette: { type },\n  } = useTheme();\n\n  const identityApi = useApi(identityApiRef);\n\n  const { data: models } = useAllModels();\n\n  const { allowed: hasViewAccess, loading } = useLightspeedViewPermission();\n\n  const { value: profile, loading: profileLoading } = useAsync(\n    async () => await identityApi.getProfileInfo(),\n  );\n\n  const [selectedModel, setSelectedModel] = useState('');\n  const [selectedProvider, setSelectedProvider] = useState('');\n\n  const { data: topicRestrictionEnabled } = useTopicRestrictionStatus();\n\n  const modelsItems = useMemo(\n    () =>\n      models\n        ? models\n            .filter(model => model.model_type === 'llm')\n            .map(m => ({\n              label: m.provider_resource_id,\n              value: m.provider_resource_id,\n              provider: m.provider_id,\n            }))\n        : [],\n    [models],\n  );\n\n  // Handle dark theme class on document\n  useEffect(() => {\n    const htmlTagElement = document.documentElement;\n    if (type === THEME_DARK) {\n      htmlTagElement.classList.add(THEME_DARK_CLASS);\n    } else {\n      htmlTagElement.classList.remove(THEME_DARK_CLASS);\n    }\n  }, [type]);\n\n  // Load last selected model from localStorage\n  useEffect(() => {\n    if (modelsItems.length > 0) {\n      try {\n        const storedData = localStorage.getItem(LAST_SELECTED_MODEL_KEY);\n        const parsedData = storedData ? JSON.parse(storedData) : null;\n\n        const storedModel = parsedData?.model\n          ? modelsItems.find(m => m.value === parsedData.model)\n          : null;\n\n        if (storedModel) {\n          setSelectedModel(storedModel.value);\n          setSelectedProvider(storedModel.provider);\n        } else {\n          setSelectedModel(modelsItems[0].value);\n          setSelectedProvider(modelsItems[0].provider);\n        }\n      } catch (error) {\n        // eslint-disable-next-line no-console\n        console.error(\n          'Error loading last selected model from localStorage:',\n          error,\n        );\n        setSelectedModel(modelsItems[0].value);\n        setSelectedProvider(modelsItems[0].provider);\n      }\n    }\n  }, [modelsItems]);\n\n  // Save selected model to localStorage\n  useEffect(() => {\n    if (selectedModel && selectedProvider) {\n      try {\n        localStorage.setItem(\n          LAST_SELECTED_MODEL_KEY,\n          JSON.stringify({\n            model: selectedModel,\n            provider: selectedProvider,\n          }),\n        );\n      } catch (error) {\n        // eslint-disable-next-line no-console\n        console.error(\n          'Error saving last selected model to localStorage:',\n          error,\n        );\n      }\n    }\n  }, [selectedModel, selectedProvider]);\n\n  if (loading) {\n    return null;\n  }\n\n  if (!hasViewAccess) {\n    return <PermissionRequiredState />;\n  }\n\n  return (\n    <FileAttachmentContextProvider>\n      <LightspeedChat\n        selectedModel={selectedModel}\n        selectedProvider={selectedProvider}\n        topicRestrictionEnabled={topicRestrictionEnabled ?? false}\n        handleSelectedModel={item => {\n          setSelectedModel(item);\n          setSelectedProvider(\n            modelsItems.find((m: any) => m.value === item)?.provider || '',\n          );\n        }}\n        models={modelsItems}\n        userName={profile?.displayName}\n        avatar={profile?.picture}\n        profileLoading={profileLoading}\n      />\n    </FileAttachmentContextProvider>\n  );\n};\n\n/**\n * @public\n */\nexport const LightspeedChatContainer = () => {\n  return (\n    <QueryClientProvider client={queryClient}>\n      <LightspeedChatContainerInner />\n    </QueryClientProvider>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/LightspeedDrawerContext.esm.js

@@ -0,0 +1,6 @@
+import { createContext } from 'react';
+
+const LightspeedDrawerContext = createContext(undefined);
+
+export { LightspeedDrawerContext };
+//# sourceMappingURL=LightspeedDrawerContext.esm.js.map

package/dist/components/LightspeedDrawerContext.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"LightspeedDrawerContext.esm.js","sources":["../../src/components/LightspeedDrawerContext.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { createContext } from 'react';\n\nimport { ChatbotDisplayMode } from '@patternfly/chatbot';\n\nimport { FileContent } from '../types';\n\n/**\n * Type for LightspeedDrawerContext\n *\n * @public\n */\nexport interface LightspeedDrawerContextType {\n  /**\n   * Whether the chatbot is active\n   */\n  isChatbotActive: boolean;\n  /**\n   * Toggle the chatbot open/closed\n   */\n  toggleChatbot: () => void;\n  /**\n   * The current display mode\n   */\n  displayMode: ChatbotDisplayMode;\n  /**\n   * Set the display mode (overlay, docked, or fullscreen/embedded)\n   */\n  setDisplayMode: (mode: ChatbotDisplayMode) => void;\n  /**\n   * The drawer width (for docked mode)\n   */\n  drawerWidth: number;\n  /**\n   * The function for setting the drawer width\n   */\n  setDrawerWidth: React.Dispatch<React.SetStateAction<number>>;\n  /**\n   * The current conversation ID\n   */\n  currentConversationId?: string;\n  /**\n   * Set the current conversation ID and update the route if in embedded mode\n   * Pass undefined to clear the conversation (example: for new chat)\n   */\n  setCurrentConversationId: (id: string | undefined) => void;\n  /**\n   * The message in the chat input box\n   * Used to preserve input content when switching between display modes\n   */\n  draftMessage: string;\n  /**\n   * To save the input message as a draft when switching modes\n   */\n  setDraftMessage: (message: string) => void;\n  /**\n   * The file attachments in the chat input\n   * Used to preserve file attachments when switching between display modes\n   */\n  draftFileContents: FileContent[];\n  /**\n   * To save file attachments as a draft when switching modes\n   */\n  setDraftFileContents: (files: FileContent[]) => void;\n}\n\n/**\n * @public\n */\nexport const LightspeedDrawerContext = createContext<\n  LightspeedDrawerContextType | undefined\n>(undefined);\n"],"names":[],"mappings":";;AAoFa,MAAA,uBAAA,GAA0B,cAErC,SAAS;;;;"}