@red-hat-developer-hub/backstage-plugin-intelligent-assistant 5.0.1 → 5.0.2

package/dist/components/LightspeedChatModelsState.esm.js

@@ -1,74 +1,53 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { CircularProgress, Box, Typography, Button, Link } from '@material-ui/core';
-import { makeStyles, createStyles } from '@material-ui/core/styles';
 import ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';
 import OpenInNewIcon from '@mui/icons-material/OpenInNew';
 import SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined';
+import Box from '@mui/material/Box';
+import Button from '@mui/material/Button';
+import CircularProgress from '@mui/material/CircularProgress';
+import Link from '@mui/material/Link';
+import Typography from '@mui/material/Typography';
 import { useTranslation } from '../hooks/useTranslation.esm.js';
 
 const LLAMA_STACK_CONFIGURE_DOCS_URL = "https://docs.redhat.com/en/documentation/red_hat_developer_hub/latest/html/interacting_with_red_hat_developer_lightspeed_for_red_hat_developer_hub/developer-lightspeed#proc-installing-and-configuring-lightspeed_developer-lightspeed";
 const LIGHTSPEED_BACKEND_README_URL = "https://github.com/redhat-developer/rhdh-plugins/blob/main/workspaces/intelligent-assistant/plugins/intelligent-assistant-backend/README.md";
-const useStyles = makeStyles(
-  (theme) => createStyles({
-    root: {
-      display: "flex",
-      flexDirection: "column",
-      boxSizing: "border-box",
-      width: "100%",
-      maxWidth: "100%",
-      minWidth: 0,
-      minHeight: "100%",
-      height: "100%",
-      flex: "1 1 auto",
-      alignItems: "center",
-      justifyContent: "center",
-      padding: theme.spacing(4, 2),
-      backgroundColor: theme.palette.background.default
-    },
-    panel: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      textAlign: "center",
-      width: "100%",
-      maxWidth: 440,
-      gap: theme.spacing(2)
-    },
-    emptyStateIcon: {
-      fontSize: 64,
-      color: theme.palette.text.secondary
-    },
-    errorIcon: {
-      fontSize: 64,
-      color: theme.palette.warning.main
-    },
-    description: {
-      lineHeight: 1.5,
-      color: theme.palette.text.secondary
-    },
-    actions: {
-      display: "flex",
-      flexDirection: "column",
-      alignItems: "center",
-      gap: theme.spacing(1.5),
-      marginTop: theme.spacing(1)
-    },
-    backendLink: {
-      display: "inline-flex",
-      alignItems: "center",
-      gap: theme.spacing(0.5),
-      fontSize: theme.typography.body1.fontSize,
-      fontWeight: 500
-    }
-  })
-);
+const rootSx = (theme) => ({
+  display: "flex",
+  flexDirection: "column",
+  boxSizing: "border-box",
+  width: "100%",
+  maxWidth: "100%",
+  minWidth: 0,
+  minHeight: "100%",
+  height: "100%",
+  flex: "1 1 auto",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: theme.spacing(4, 2),
+  backgroundColor: theme.palette.background.default
+});
+const panelSx = (theme) => ({
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  textAlign: "center",
+  width: "100%",
+  maxWidth: 440,
+  gap: theme.spacing(2)
+});
+const actionsSx = (theme) => ({
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  gap: theme.spacing(1.5),
+  marginTop: theme.spacing(1)
+});
 const LightspeedChatModelsLoading = () => {
-  const classes = useStyles();
   const { t } = useTranslation();
   return /* @__PURE__ */ jsx(
-    "div",
+    Box,
     {
-      className: classes.root,
+      sx: rootSx,
       "data-testid": "lightspeed-models-loading",
       role: "status",
       "aria-busy": "true",
@@ -78,19 +57,21 @@ const LightspeedChatModelsLoading = () => {
   );
 };
 const LcoreNotConfiguredEmptyState = () => {
-  const classes = useStyles();
   const { t } = useTranslation();
-  return /* @__PURE__ */ jsx("div", { className: classes.root, "data-testid": "lightspeed-lcore-not-configured", children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Box, { sx: rootSx, "data-testid": "lightspeed-lcore-not-configured", children: /* @__PURE__ */ jsxs(
     Box,
     {
-      className: classes.panel,
+      sx: panelSx,
       component: "section",
       "aria-labelledby": "lightspeed-lcore-empty-title",
       children: [
         /* @__PURE__ */ jsx(
           SmartToyOutlinedIcon,
           {
-            className: classes.emptyStateIcon,
+            sx: (theme) => ({
+              fontSize: 64,
+              color: theme.palette.text.secondary
+            }),
             "aria-hidden": true,
             focusable: false
           }
@@ -109,11 +90,14 @@ const LcoreNotConfiguredEmptyState = () => {
           {
             variant: "body1",
             component: "p",
-            className: classes.description,
+            sx: (theme) => ({
+              lineHeight: 1.5,
+              color: theme.palette.text.secondary
+            }),
             children: t("lcore.notConfigured.description")
           }
         ),
-        /* @__PURE__ */ jsxs(Box, { className: classes.actions, children: [
+        /* @__PURE__ */ jsxs(Box, { sx: actionsSx, children: [
           /* @__PURE__ */ jsxs(
             Button,
             {
@@ -133,8 +117,13 @@ const LcoreNotConfiguredEmptyState = () => {
           /* @__PURE__ */ jsxs(
             Link,
             {
-              className: classes.backendLink,
-              component: "a",
+              sx: (theme) => ({
+                display: "inline-flex",
+                alignItems: "center",
+                gap: theme.spacing(0.5),
+                fontSize: theme.typography.body1.fontSize,
+                fontWeight: 500
+              }),
               color: "primary",
               href: LIGHTSPEED_BACKEND_README_URL,
               target: "_blank",
@@ -153,19 +142,21 @@ const LcoreNotConfiguredEmptyState = () => {
 const ModelsLoadErrorEmptyState = ({
   onRetry
 }) => {
-  const classes = useStyles();
   const { t } = useTranslation();
-  return /* @__PURE__ */ jsx("div", { className: classes.root, "data-testid": "lightspeed-models-load-error", children: /* @__PURE__ */ jsxs(
+  return /* @__PURE__ */ jsx(Box, { sx: rootSx, "data-testid": "lightspeed-models-load-error", children: /* @__PURE__ */ jsxs(
     Box,
     {
-      className: classes.panel,
+      sx: panelSx,
       component: "section",
       "aria-labelledby": "lightspeed-models-error-title",
       children: [
         /* @__PURE__ */ jsx(
           ErrorOutlineIcon,
           {
-            className: classes.errorIcon,
+            sx: (theme) => ({
+              fontSize: 64,
+              color: theme.palette.warning.main
+            }),
             "aria-hidden": true,
             focusable: false
           }
@@ -184,11 +175,14 @@ const ModelsLoadErrorEmptyState = ({
           {
             variant: "body1",
             component: "p",
-            className: classes.description,
+            sx: (theme) => ({
+              lineHeight: 1.5,
+              color: theme.palette.text.secondary
+            }),
             children: t("lcore.loadError.description")
           }
         ),
-        /* @__PURE__ */ jsx(Box, { className: classes.actions, children: /* @__PURE__ */ jsx(Button, { variant: "contained", color: "primary", onClick: () => onRetry(), children: t("common.retry") }) })
+        /* @__PURE__ */ jsx(Box, { sx: actionsSx, children: /* @__PURE__ */ jsx(Button, { variant: "contained", color: "primary", onClick: () => onRetry(), children: t("common.retry") }) })
       ]
     }
   ) });

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

@@ -1 +1 @@
-{"version":3,"file":"LightspeedChatModelsState.esm.js","sources":["../../src/components/LightspeedChatModelsState.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  Box,\n  Button,\n  CircularProgress,\n  Link,\n  Typography,\n} from '@material-ui/core';\nimport { createStyles, makeStyles } from '@material-ui/core/styles';\nimport ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';\nimport OpenInNewIcon from '@mui/icons-material/OpenInNew';\nimport SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined';\n\nimport { useTranslation } from '../hooks/useTranslation';\n\nconst LLAMA_STACK_CONFIGURE_DOCS_URL =\n  'https://docs.redhat.com/en/documentation/red_hat_developer_hub/latest/html/interacting_with_red_hat_developer_lightspeed_for_red_hat_developer_hub/developer-lightspeed#proc-installing-and-configuring-lightspeed_developer-lightspeed';\nconst LIGHTSPEED_BACKEND_README_URL =\n  'https://github.com/redhat-developer/rhdh-plugins/blob/main/workspaces/intelligent-assistant/plugins/intelligent-assistant-backend/README.md';\n\nconst useStyles = makeStyles(theme =>\n  createStyles({\n    root: {\n      display: 'flex',\n      flexDirection: 'column',\n      boxSizing: 'border-box',\n      width: '100%',\n      maxWidth: '100%',\n      minWidth: 0,\n      minHeight: '100%',\n      height: '100%',\n      flex: '1 1 auto',\n      alignItems: 'center',\n      justifyContent: 'center',\n      padding: theme.spacing(4, 2),\n      backgroundColor: theme.palette.background.default,\n    },\n    panel: {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      textAlign: 'center',\n      width: '100%',\n      maxWidth: 440,\n      gap: theme.spacing(2),\n    },\n    emptyStateIcon: {\n      fontSize: 64,\n      color: theme.palette.text.secondary,\n    },\n    errorIcon: {\n      fontSize: 64,\n      color: theme.palette.warning.main,\n    },\n    description: {\n      lineHeight: 1.5,\n      color: theme.palette.text.secondary,\n    },\n    actions: {\n      display: 'flex',\n      flexDirection: 'column',\n      alignItems: 'center',\n      gap: theme.spacing(1.5),\n      marginTop: theme.spacing(1),\n    },\n    backendLink: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      gap: theme.spacing(0.5),\n      fontSize: theme.typography.body1.fontSize,\n      fontWeight: 500,\n    },\n  }),\n);\n\n/**\n * Shown while the models list is loading for an authorized user.\n */\nexport const LightspeedChatModelsLoading = () => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n  return (\n    <div\n      className={classes.root}\n      data-testid=\"lightspeed-models-loading\"\n      role=\"status\"\n      aria-busy=\"true\"\n      aria-label={t('common.loading')}\n    >\n      <CircularProgress aria-hidden />\n    </div>\n  );\n};\n\n/**\n * Shown when LCORE / Llama Stack is up but no LLM models are registered.\n */\nexport const LcoreNotConfiguredEmptyState = () => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n\n  return (\n    <div className={classes.root} data-testid=\"lightspeed-lcore-not-configured\">\n      <Box\n        className={classes.panel}\n        component=\"section\"\n        aria-labelledby=\"lightspeed-lcore-empty-title\"\n      >\n        <SmartToyOutlinedIcon\n          className={classes.emptyStateIcon}\n          aria-hidden\n          focusable={false}\n        />\n        <Typography\n          id=\"lightspeed-lcore-empty-title\"\n          variant=\"h5\"\n          component=\"h2\"\n        >\n          {t('lcore.notConfigured.title')}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          component=\"p\"\n          className={classes.description}\n        >\n          {t('lcore.notConfigured.description')}\n        </Typography>\n        <Box className={classes.actions}>\n          <Button\n            variant=\"contained\"\n            color=\"primary\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href={LLAMA_STACK_CONFIGURE_DOCS_URL}\n          >\n            {t('lcore.notConfigured.developerLightspeedDocs')} &nbsp;{' '}\n            <OpenInNewIcon fontSize=\"small\" aria-hidden />\n          </Button>\n          <Link\n            className={classes.backendLink}\n            component=\"a\"\n            color=\"primary\"\n            href={LIGHTSPEED_BACKEND_README_URL}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            {t('lcore.notConfigured.backendDocs')}\n            <OpenInNewIcon fontSize=\"small\" aria-hidden />\n          </Link>\n        </Box>\n      </Box>\n    </div>\n  );\n};\n\ntype ModelsLoadErrorEmptyStateProps = {\n  onRetry: () => void;\n};\n\n/**\n * Shown when the models API fails (distinct from “no models configured”).\n */\nexport const ModelsLoadErrorEmptyState = ({\n  onRetry,\n}: ModelsLoadErrorEmptyStateProps) => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n\n  return (\n    <div className={classes.root} data-testid=\"lightspeed-models-load-error\">\n      <Box\n        className={classes.panel}\n        component=\"section\"\n        aria-labelledby=\"lightspeed-models-error-title\"\n      >\n        <ErrorOutlineIcon\n          className={classes.errorIcon}\n          aria-hidden\n          focusable={false}\n        />\n        <Typography\n          id=\"lightspeed-models-error-title\"\n          variant=\"h5\"\n          component=\"h2\"\n        >\n          {t('lcore.loadError.title')}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          component=\"p\"\n          className={classes.description}\n        >\n          {t('lcore.loadError.description')}\n        </Typography>\n        <Box className={classes.actions}>\n          <Button variant=\"contained\" color=\"primary\" onClick={() => onRetry()}>\n            {t('common.retry')}\n          </Button>\n        </Box>\n      </Box>\n    </div>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"LightspeedChatModelsState.esm.js","sources":["../../src/components/LightspeedChatModelsState.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 ErrorOutlineIcon from '@mui/icons-material/ErrorOutline';\nimport OpenInNewIcon from '@mui/icons-material/OpenInNew';\nimport SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined';\nimport Box from '@mui/material/Box';\nimport Button from '@mui/material/Button';\nimport CircularProgress from '@mui/material/CircularProgress';\nimport Link from '@mui/material/Link';\nimport { type Theme } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nimport { useTranslation } from '../hooks/useTranslation';\n\nconst LLAMA_STACK_CONFIGURE_DOCS_URL =\n  'https://docs.redhat.com/en/documentation/red_hat_developer_hub/latest/html/interacting_with_red_hat_developer_lightspeed_for_red_hat_developer_hub/developer-lightspeed#proc-installing-and-configuring-lightspeed_developer-lightspeed';\nconst LIGHTSPEED_BACKEND_README_URL =\n  'https://github.com/redhat-developer/rhdh-plugins/blob/main/workspaces/intelligent-assistant/plugins/intelligent-assistant-backend/README.md';\n\nconst rootSx = (theme: Theme) => ({\n  display: 'flex',\n  flexDirection: 'column' as const,\n  boxSizing: 'border-box' as const,\n  width: '100%',\n  maxWidth: '100%',\n  minWidth: 0,\n  minHeight: '100%',\n  height: '100%',\n  flex: '1 1 auto',\n  alignItems: 'center',\n  justifyContent: 'center',\n  padding: theme.spacing(4, 2),\n  backgroundColor: theme.palette.background.default,\n});\n\nconst panelSx = (theme: Theme) => ({\n  display: 'flex',\n  flexDirection: 'column' as const,\n  alignItems: 'center',\n  textAlign: 'center' as const,\n  width: '100%',\n  maxWidth: 440,\n  gap: theme.spacing(2),\n});\n\nconst actionsSx = (theme: Theme) => ({\n  display: 'flex',\n  flexDirection: 'column' as const,\n  alignItems: 'center',\n  gap: theme.spacing(1.5),\n  marginTop: theme.spacing(1),\n});\n\n/**\n * Shown while the models list is loading for an authorized user.\n */\nexport const LightspeedChatModelsLoading = () => {\n  const { t } = useTranslation();\n  return (\n    <Box\n      sx={rootSx}\n      data-testid=\"lightspeed-models-loading\"\n      role=\"status\"\n      aria-busy=\"true\"\n      aria-label={t('common.loading')}\n    >\n      <CircularProgress aria-hidden />\n    </Box>\n  );\n};\n\n/**\n * Shown when LCORE / Llama Stack is up but no LLM models are registered.\n */\nexport const LcoreNotConfiguredEmptyState = () => {\n  const { t } = useTranslation();\n\n  return (\n    <Box sx={rootSx} data-testid=\"lightspeed-lcore-not-configured\">\n      <Box\n        sx={panelSx}\n        component=\"section\"\n        aria-labelledby=\"lightspeed-lcore-empty-title\"\n      >\n        <SmartToyOutlinedIcon\n          sx={theme => ({\n            fontSize: 64,\n            color: theme.palette.text.secondary,\n          })}\n          aria-hidden\n          focusable={false}\n        />\n        <Typography\n          id=\"lightspeed-lcore-empty-title\"\n          variant=\"h5\"\n          component=\"h2\"\n        >\n          {t('lcore.notConfigured.title')}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          component=\"p\"\n          sx={theme => ({\n            lineHeight: 1.5,\n            color: theme.palette.text.secondary,\n          })}\n        >\n          {t('lcore.notConfigured.description')}\n        </Typography>\n        <Box sx={actionsSx}>\n          <Button\n            variant=\"contained\"\n            color=\"primary\"\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            href={LLAMA_STACK_CONFIGURE_DOCS_URL}\n          >\n            {t('lcore.notConfigured.developerLightspeedDocs')} &nbsp;{' '}\n            <OpenInNewIcon fontSize=\"small\" aria-hidden />\n          </Button>\n          <Link\n            sx={theme => ({\n              display: 'inline-flex',\n              alignItems: 'center',\n              gap: theme.spacing(0.5),\n              fontSize: theme.typography.body1.fontSize,\n              fontWeight: 500,\n            })}\n            color=\"primary\"\n            href={LIGHTSPEED_BACKEND_README_URL}\n            target=\"_blank\"\n            rel=\"noopener noreferrer\"\n          >\n            {t('lcore.notConfigured.backendDocs')}\n            <OpenInNewIcon fontSize=\"small\" aria-hidden />\n          </Link>\n        </Box>\n      </Box>\n    </Box>\n  );\n};\n\ntype ModelsLoadErrorEmptyStateProps = {\n  onRetry: () => void;\n};\n\n/**\n * Shown when the models API fails (distinct from “no models configured”).\n */\nexport const ModelsLoadErrorEmptyState = ({\n  onRetry,\n}: ModelsLoadErrorEmptyStateProps) => {\n  const { t } = useTranslation();\n\n  return (\n    <Box sx={rootSx} data-testid=\"lightspeed-models-load-error\">\n      <Box\n        sx={panelSx}\n        component=\"section\"\n        aria-labelledby=\"lightspeed-models-error-title\"\n      >\n        <ErrorOutlineIcon\n          sx={theme => ({\n            fontSize: 64,\n            color: theme.palette.warning.main,\n          })}\n          aria-hidden\n          focusable={false}\n        />\n        <Typography\n          id=\"lightspeed-models-error-title\"\n          variant=\"h5\"\n          component=\"h2\"\n        >\n          {t('lcore.loadError.title')}\n        </Typography>\n        <Typography\n          variant=\"body1\"\n          component=\"p\"\n          sx={theme => ({\n            lineHeight: 1.5,\n            color: theme.palette.text.secondary,\n          })}\n        >\n          {t('lcore.loadError.description')}\n        </Typography>\n        <Box sx={actionsSx}>\n          <Button variant=\"contained\" color=\"primary\" onClick={() => onRetry()}>\n            {t('common.retry')}\n          </Button>\n        </Box>\n      </Box>\n    </Box>\n  );\n};\n"],"names":[],"mappings":"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"}

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

@@ -1 +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 React, { createContext } from 'react';\n\nimport { ChatbotDisplayMode } from '@patternfly/chatbot';\n\nimport { FileContent } from '../types';\n\n/**\n * When switching to fullscreen (embedded), open the notebooks list or a specific session.\n *\n * @public\n */\nexport type LightspeedEmbeddedNotebooksTarget =\n  'notebooks' | { notebookSessionId: string };\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   * When entering embedded mode, optional `embeddedNotebooks` navigates to\n   * `/lightspeed/notebooks` (or a session URL) instead of the chat route.\n   * Notebooks are available in all display modes; the shell tab and active\n   * notebook are preserved across mode switches.\n   */\n  setDisplayMode: (\n    mode: ChatbotDisplayMode,\n    conversationIdParam?: string,\n    embeddedNotebooks?: LightspeedEmbeddedNotebooksTarget,\n  ) => 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   * @internal After leaving fullscreen for overlay/docked, the next overlay/docked chat\n   * mount should seed the thread from currentConversationId (or TEMP) instead of storage\n   * lastOpened. Returns true at most once per handoff.\n   */\n  consumePendingOverlayThreadHandoff?: () => boolean;\n  /**\n   * Chat tab is 0, Notebooks tab is 1. Persisted across overlay/docked/fullscreen remounts\n   * (each display mode mounts its own `LightspeedChat` tree).\n   */\n  shellViewTab: number;\n  setShellViewTab: (tab: number) => void;\n  /**\n   * ID of the currently active notebook session, persisted across\n   * overlay/docked/fullscreen remounts so display-mode switches preserve\n   * the open notebook.\n   */\n  activeNotebookId: string | undefined;\n  setActiveNotebookId: (id: string | undefined) => void;\n}\n\nconst CONTEXT_KEY = '__lightspeed_drawer_context__' as keyof typeof globalThis;\n\nfunction getOrCreateContext() {\n  const existing = (globalThis as any)[CONTEXT_KEY];\n  if (existing)\n    return existing as React.Context<LightspeedDrawerContextType | undefined>;\n  const ctx = createContext<LightspeedDrawerContextType | undefined>(undefined);\n  (globalThis as any)[CONTEXT_KEY] = ctx;\n  return ctx;\n}\n\n/**\n * @public\n */\nexport const LightspeedDrawerContext = getOrCreateContext();\n"],"names":[],"mappings":";;AAoHA,MAAM,WAAA,GAAc,+BAAA;AAEpB,SAAS,kBAAA,GAAqB;AAC5B,EAAA,MAAM,QAAA,GAAY,WAAmB,WAAW,CAAA;AAChD,EAAA,IAAI,QAAA;AACF,IAAA,OAAO,QAAA;AACT,EAAA,MAAM,GAAA,GAAM,cAAuD,MAAS,CAAA;AAC5E,EAAC,UAAA,CAAmB,WAAW,CAAA,GAAI,GAAA;AACnC,EAAA,OAAO,GAAA;AACT;AAKO,MAAM,0BAA0B,kBAAA;;;;"}
+{"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 * When switching to fullscreen (embedded), open the notebooks list or a specific session.\n *\n * @public\n */\nexport type LightspeedEmbeddedNotebooksTarget =\n  'notebooks' | { notebookSessionId: string };\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   * When entering embedded mode, optional `embeddedNotebooks` navigates to\n   * `/lightspeed/notebooks` (or a session URL) instead of the chat route.\n   * Notebooks are available in all display modes; the shell tab and active\n   * notebook are preserved across mode switches.\n   */\n  setDisplayMode: (\n    mode: ChatbotDisplayMode,\n    conversationIdParam?: string,\n    embeddedNotebooks?: LightspeedEmbeddedNotebooksTarget,\n  ) => 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   * @internal After leaving fullscreen for overlay/docked, the next overlay/docked chat\n   * mount should seed the thread from currentConversationId (or TEMP) instead of storage\n   * lastOpened. Returns true at most once per handoff.\n   */\n  consumePendingOverlayThreadHandoff?: () => boolean;\n  /**\n   * Chat tab is 0, Notebooks tab is 1. Persisted across overlay/docked/fullscreen remounts\n   * (each display mode mounts its own `LightspeedChat` tree).\n   */\n  shellViewTab: number;\n  setShellViewTab: (tab: number) => void;\n  /**\n   * ID of the currently active notebook session, persisted across\n   * overlay/docked/fullscreen remounts so display-mode switches preserve\n   * the open notebook.\n   */\n  activeNotebookId: string | undefined;\n  setActiveNotebookId: (id: string | undefined) => void;\n}\n\nconst CONTEXT_KEY = '__lightspeed_drawer_context__' as keyof typeof globalThis;\n\nfunction getOrCreateContext() {\n  const existing = (globalThis as any)[CONTEXT_KEY];\n  if (existing)\n    return existing as React.Context<LightspeedDrawerContextType | undefined>;\n  const ctx = createContext<LightspeedDrawerContextType | undefined>(undefined);\n  (globalThis as any)[CONTEXT_KEY] = ctx;\n  return ctx;\n}\n\n/**\n * @public\n */\nexport const LightspeedDrawerContext = getOrCreateContext();\n"],"names":[],"mappings":";;AAoHA,MAAM,WAAA,GAAc,+BAAA;AAEpB,SAAS,kBAAA,GAAqB;AAC5B,EAAA,MAAM,QAAA,GAAY,WAAmB,WAAW,CAAA;AAChD,EAAA,IAAI,QAAA;AACF,IAAA,OAAO,QAAA;AACT,EAAA,MAAM,GAAA,GAAM,cAAuD,MAAS,CAAA;AAC5E,EAAC,UAAA,CAAmB,WAAW,CAAA,GAAI,GAAA;AACnC,EAAA,OAAO,GAAA;AACT;AAKO,MAAM,0BAA0B,kBAAA;;;;"}

package/dist/components/LightspeedDrawerProvider.esm.js

@@ -1,40 +1,37 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { makeStyles } from '@mui/styles';
+import { styled } from '@mui/material/styles';
 import { ChatbotModal } from '@patternfly/chatbot';
-import { DOCKED_CONTENT_OFFSET } from '../const.esm.js';
+import { DOCKED_CONTENT_OFFSET, LIGHTSPEED_OVERLAY_MAX_WIDTH, LIGHTSPEED_OVERLAY_RIGHT, LIGHTSPEED_OVERLAY_BOTTOM, LIGHTSPEED_OVERLAY_CHATBOT_MODAL_CLASS } from '../const.esm.js';
 import { useLightspeedProviderState } from '../hooks/useLightspeedProviderState.esm.js';
 import { LightspeedChatContainer } from './LightspeedChatContainer.esm.js';
 import { LightspeedDrawerContext } from './LightspeedDrawerContext.esm.js';
 import { NotebookStreamProvider } from './notebooks/NotebookStreamProvider.esm.js';
 
-const useStyles = makeStyles((theme) => ({
-  chatbotModal: {
-    boxShadow: "0 14px 20px -7px rgba(0, 0, 0, 0.22), 0 32px 50px 6px rgba(0, 0, 0, 0.16), 0 12px 60px 12px rgba(0, 0, 0, 0.14) !important",
-    bottom: `calc(${theme?.spacing?.(2) ?? "16px"} + 5em)`,
-    right: `calc(${theme?.spacing?.(2) ?? "16px"} + 1.5em)`,
-    maxWidth: "min(30rem, calc(100vw - 32px)) !important",
-    overflow: "hidden",
-    transition: "margin-right 0.3s ease",
-    "body.docked-drawer-open &": {
-      marginRight: DOCKED_CONTENT_OFFSET
-    }
+const StyledChatbotModal = styled(ChatbotModal)(() => ({
+  boxShadow: "0 14px 20px -7px rgba(0, 0, 0, 0.22), 0 32px 50px 6px rgba(0, 0, 0, 0.16), 0 12px 60px 12px rgba(0, 0, 0, 0.14) !important",
+  bottom: `${LIGHTSPEED_OVERLAY_BOTTOM} !important`,
+  right: `${LIGHTSPEED_OVERLAY_RIGHT} !important`,
+  maxWidth: `${LIGHTSPEED_OVERLAY_MAX_WIDTH} !important`,
+  overflow: "hidden",
+  transition: "margin-right 0.3s ease, bottom 0.3s ease, right 0.3s ease, inset-block-end 0.3s ease, inset-inline-end 0.3s ease",
+  "body.docked-drawer-open &": {
+    marginRight: DOCKED_CONTENT_OFFSET
   }
 }));
 const LightspeedDrawerProvider = ({ children }) => {
-  const classes = useStyles();
   const { contextValue, shouldRenderOverlayModal, closeChatbot } = useLightspeedProviderState();
   return /* @__PURE__ */ jsx(LightspeedDrawerContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxs(NotebookStreamProvider, { children: [
     children,
     shouldRenderOverlayModal && /* @__PURE__ */ jsx(
-      ChatbotModal,
+      StyledChatbotModal,
       {
         isOpen: true,
+        className: LIGHTSPEED_OVERLAY_CHATBOT_MODAL_CLASS,
         displayMode: contextValue.displayMode,
         disableFocusTrap: true,
         onEscapePress: () => closeChatbot(),
         ouiaId: "LightspeedChatbotModal",
         "aria-labelledby": "lightspeed-chatpopup-modal",
-        className: classes.chatbotModal,
         children: /* @__PURE__ */ jsx(LightspeedChatContainer, {})
       }
     )

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

@@ -1 +1 @@
-{"version":3,"file":"LightspeedDrawerProvider.esm.js","sources":["../../src/components/LightspeedDrawerProvider.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 { PropsWithChildren } from 'react';\n\nimport { makeStyles } from '@mui/styles';\nimport { ChatbotModal } from '@patternfly/chatbot';\n\nimport { DOCKED_CONTENT_OFFSET } from '../const';\nimport { useLightspeedProviderState } from '../hooks/useLightspeedProviderState';\nimport { LightspeedChatContainer } from './LightspeedChatContainer';\nimport { LightspeedDrawerContext } from './LightspeedDrawerContext';\nimport { NotebookStreamProvider } from './notebooks/NotebookStreamProvider';\n\nconst useStyles = makeStyles(theme => ({\n  chatbotModal: {\n    boxShadow:\n      '0 14px 20px -7px rgba(0, 0, 0, 0.22), 0 32px 50px 6px rgba(0, 0, 0, 0.16), 0 12px 60px 12px rgba(0, 0, 0, 0.14) !important',\n    bottom: `calc(${theme?.spacing?.(2) ?? '16px'} + 5em)`,\n    right: `calc(${theme?.spacing?.(2) ?? '16px'} + 1.5em)`,\n    maxWidth: 'min(30rem, calc(100vw - 32px)) !important',\n    overflow: 'hidden' as const,\n    transition: 'margin-right 0.3s ease',\n    'body.docked-drawer-open &': {\n      marginRight: DOCKED_CONTENT_OFFSET,\n    },\n  },\n}));\n\n/**\n * @public\n */\nexport const LightspeedDrawerProvider = ({ children }: PropsWithChildren) => {\n  const classes = useStyles();\n  const { contextValue, shouldRenderOverlayModal, closeChatbot } =\n    useLightspeedProviderState();\n\n  return (\n    <LightspeedDrawerContext.Provider value={contextValue}>\n      <NotebookStreamProvider>\n        {children}\n        {shouldRenderOverlayModal && (\n          <ChatbotModal\n            isOpen\n            displayMode={contextValue.displayMode}\n            disableFocusTrap\n            onEscapePress={() => closeChatbot()}\n            ouiaId=\"LightspeedChatbotModal\"\n            aria-labelledby=\"lightspeed-chatpopup-modal\"\n            className={classes.chatbotModal}\n          >\n            <LightspeedChatContainer />\n          </ChatbotModal>\n        )}\n      </NotebookStreamProvider>\n    </LightspeedDrawerContext.Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AA2BA,MAAM,SAAA,GAAY,WAAW,CAAA,KAAA,MAAU;AAAA,EACrC,YAAA,EAAc;AAAA,IACZ,SAAA,EACE,4HAAA;AAAA,IACF,QAAQ,CAAA,KAAA,EAAQ,KAAA,EAAO,OAAA,GAAU,CAAC,KAAK,MAAM,CAAA,OAAA,CAAA;AAAA,IAC7C,OAAO,CAAA,KAAA,EAAQ,KAAA,EAAO,OAAA,GAAU,CAAC,KAAK,MAAM,CAAA,SAAA,CAAA;AAAA,IAC5C,QAAA,EAAU,2CAAA;AAAA,IACV,QAAA,EAAU,QAAA;AAAA,IACV,UAAA,EAAY,wBAAA;AAAA,IACZ,2BAAA,EAA6B;AAAA,MAC3B,WAAA,EAAa;AAAA;AACf;AAEJ,CAAA,CAAE,CAAA;AAKK,MAAM,wBAAA,GAA2B,CAAC,EAAE,QAAA,EAAS,KAAyB;AAC3E,EAAA,MAAM,UAAU,SAAA,EAAU;AAC1B,EAAA,MAAM,EAAE,YAAA,EAAc,wBAAA,EAA0B,YAAA,KAC9C,0BAAA,EAA2B;AAE7B,EAAA,2BACG,uBAAA,CAAwB,QAAA,EAAxB,EAAiC,KAAA,EAAO,YAAA,EACvC,+BAAC,sBAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,wBAAA,oBACC,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAM,IAAA;AAAA,QACN,aAAa,YAAA,CAAa,WAAA;AAAA,QAC1B,gBAAA,EAAgB,IAAA;AAAA,QAChB,aAAA,EAAe,MAAM,YAAA,EAAa;AAAA,QAClC,MAAA,EAAO,wBAAA;AAAA,QACP,iBAAA,EAAgB,4BAAA;AAAA,QAChB,WAAW,OAAA,CAAQ,YAAA;AAAA,QAEnB,8BAAC,uBAAA,EAAA,EAAwB;AAAA;AAAA;AAC3B,GAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"LightspeedDrawerProvider.esm.js","sources":["../../src/components/LightspeedDrawerProvider.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 { PropsWithChildren } from 'react';\n\nimport { styled } from '@mui/material/styles';\nimport { ChatbotModal } from '@patternfly/chatbot';\n\nimport {\n  DOCKED_CONTENT_OFFSET,\n  LIGHTSPEED_OVERLAY_BOTTOM,\n  LIGHTSPEED_OVERLAY_CHATBOT_MODAL_CLASS,\n  LIGHTSPEED_OVERLAY_MAX_WIDTH,\n  LIGHTSPEED_OVERLAY_RIGHT,\n} from '../const';\nimport { useLightspeedProviderState } from '../hooks/useLightspeedProviderState';\nimport { LightspeedChatContainer } from './LightspeedChatContainer';\nimport { LightspeedDrawerContext } from './LightspeedDrawerContext';\nimport { NotebookStreamProvider } from './notebooks/NotebookStreamProvider';\n\nconst StyledChatbotModal = styled(ChatbotModal)(() => ({\n  boxShadow:\n    '0 14px 20px -7px rgba(0, 0, 0, 0.22), 0 32px 50px 6px rgba(0, 0, 0, 0.16), 0 12px 60px 12px rgba(0, 0, 0, 0.14) !important',\n  bottom: `${LIGHTSPEED_OVERLAY_BOTTOM} !important`,\n  right: `${LIGHTSPEED_OVERLAY_RIGHT} !important`,\n  maxWidth: `${LIGHTSPEED_OVERLAY_MAX_WIDTH} !important`,\n  overflow: 'hidden',\n  transition:\n    'margin-right 0.3s ease, bottom 0.3s ease, right 0.3s ease, inset-block-end 0.3s ease, inset-inline-end 0.3s ease',\n  'body.docked-drawer-open &': {\n    marginRight: DOCKED_CONTENT_OFFSET,\n  },\n}));\n\n/**\n * @public\n */\nexport const LightspeedDrawerProvider = ({ children }: PropsWithChildren) => {\n  const { contextValue, shouldRenderOverlayModal, closeChatbot } =\n    useLightspeedProviderState();\n\n  return (\n    <LightspeedDrawerContext.Provider value={contextValue}>\n      <NotebookStreamProvider>\n        {children}\n        {shouldRenderOverlayModal && (\n          <StyledChatbotModal\n            isOpen\n            className={LIGHTSPEED_OVERLAY_CHATBOT_MODAL_CLASS}\n            displayMode={contextValue.displayMode}\n            disableFocusTrap\n            onEscapePress={() => closeChatbot()}\n            ouiaId=\"LightspeedChatbotModal\"\n            aria-labelledby=\"lightspeed-chatpopup-modal\"\n          >\n            <LightspeedChatContainer />\n          </StyledChatbotModal>\n        )}\n      </NotebookStreamProvider>\n    </LightspeedDrawerContext.Provider>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAiCA,MAAM,kBAAA,GAAqB,MAAA,CAAO,YAAY,CAAA,CAAE,OAAO;AAAA,EACrD,SAAA,EACE,4HAAA;AAAA,EACF,MAAA,EAAQ,GAAG,yBAAyB,CAAA,WAAA,CAAA;AAAA,EACpC,KAAA,EAAO,GAAG,wBAAwB,CAAA,WAAA,CAAA;AAAA,EAClC,QAAA,EAAU,GAAG,4BAA4B,CAAA,WAAA,CAAA;AAAA,EACzC,QAAA,EAAU,QAAA;AAAA,EACV,UAAA,EACE,kHAAA;AAAA,EACF,2BAAA,EAA6B;AAAA,IAC3B,WAAA,EAAa;AAAA;AAEjB,CAAA,CAAE,CAAA;AAKK,MAAM,wBAAA,GAA2B,CAAC,EAAE,QAAA,EAAS,KAAyB;AAC3E,EAAA,MAAM,EAAE,YAAA,EAAc,wBAAA,EAA0B,YAAA,KAC9C,0BAAA,EAA2B;AAE7B,EAAA,2BACG,uBAAA,CAAwB,QAAA,EAAxB,EAAiC,KAAA,EAAO,YAAA,EACvC,+BAAC,sBAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,IACA,wBAAA,oBACC,GAAA;AAAA,MAAC,kBAAA;AAAA,MAAA;AAAA,QACC,MAAA,EAAM,IAAA;AAAA,QACN,SAAA,EAAW,sCAAA;AAAA,QACX,aAAa,YAAA,CAAa,WAAA;AAAA,QAC1B,gBAAA,EAAgB,IAAA;AAAA,QAChB,aAAA,EAAe,MAAM,YAAA,EAAa;AAAA,QAClC,MAAA,EAAO,wBAAA;AAAA,QACP,iBAAA,EAAgB,4BAAA;AAAA,QAEhB,8BAAC,uBAAA,EAAA,EAAwB;AAAA;AAAA;AAC3B,GAAA,EAEJ,CAAA,EACF,CAAA;AAEJ;;;;"}

package/dist/components/LightspeedFABContent.esm.js

@@ -1,35 +1,66 @@
 import { jsx } from 'react/jsx-runtime';
+import { useRef, useLayoutEffect } from 'react';
 import Box from '@mui/material/Box';
 import Fab from '@mui/material/Fab';
+import { useTheme } from '@mui/material/styles';
 import Tooltip from '@mui/material/Tooltip';
 import { ChatbotDisplayMode } from '@patternfly/chatbot';
-import { DOCKED_CONTENT_OFFSET } from '../const.esm.js';
+import { LIGHTSPEED_FAB_ELEMENT_ID, DOCKED_CONTENT_OFFSET } from '../const.esm.js';
 import { useLightspeedDrawerContext } from '../hooks/useLightspeedDrawerContext.esm.js';
 import { useTranslation } from '../hooks/useTranslation.esm.js';
+import { getLightspeedFabEdgeInset, clearLightspeedFabAnchorVars, publishLightspeedFabAnchorVars } from '../utils/fab-anchor-utils.esm.js';
 import { LightspeedFABOpenIcon, LightspeedFABIcon } from './LightspeedIcon.esm.js';
 
 const LightspeedFABContent = () => {
   const { t } = useTranslation();
+  const theme = useTheme();
   const { isChatbotActive, toggleChatbot, displayMode } = useLightspeedDrawerContext();
+  const fabRef = useRef(null);
+  const fabEdgeInset = getLightspeedFabEdgeInset(theme);
+  useLayoutEffect(() => {
+    const fab = fabRef.current;
+    if (!fab) {
+      return void 0;
+    }
+    const syncAnchor = () => publishLightspeedFabAnchorVars({ fabElement: fab, theme });
+    syncAnchor();
+    const resizeObserver = typeof ResizeObserver === "function" ? new ResizeObserver(syncAnchor) : void 0;
+    resizeObserver?.observe(fab);
+    window.addEventListener("resize", syncAnchor);
+    fab.addEventListener("transitionend", syncAnchor);
+    const mutationObserver = new MutationObserver(syncAnchor);
+    mutationObserver.observe(document.body, {
+      attributes: true,
+      attributeFilter: ["class"]
+    });
+    return () => {
+      resizeObserver?.disconnect();
+      window.removeEventListener("resize", syncAnchor);
+      fab.removeEventListener("transitionend", syncAnchor);
+      mutationObserver.disconnect();
+      clearLightspeedFabAnchorVars();
+    };
+  }, [displayMode, theme]);
   if (displayMode === ChatbotDisplayMode.embedded) {
     return null;
   }
   return /* @__PURE__ */ jsx(
     Box,
     {
-      sx: (theme) => ({
-        bottom: `calc(${theme.spacing(2)} + 1.5em)`,
-        right: `calc(${theme.spacing(2)} + 1.5em)`,
+      ref: fabRef,
+      sx: {
+        bottom: fabEdgeInset,
+        right: fabEdgeInset,
         alignItems: "end",
-        zIndex: 200,
+        zIndex: theme.zIndex.tooltip,
         display: "flex",
         position: "fixed",
         "body.docked-drawer-open &": {
           transition: "margin-right 0.3s ease",
           marginRight: DOCKED_CONTENT_OFFSET
         }
-      }),
-      id: "lightspeed-fab",
+      },
+      id: LIGHTSPEED_FAB_ELEMENT_ID,
       "data-testid": "lightspeed-fab",
       children: /* @__PURE__ */ jsx(
         Tooltip,
@@ -44,14 +75,14 @@ const LightspeedFABContent = () => {
               size: "large",
               onClick: toggleChatbot,
               "aria-label": isChatbotActive ? t("tooltip.fab.close") : t("tooltip.fab.open"),
-              sx: (theme) => ({
+              sx: {
                 backgroundColor: theme.palette.background.default,
                 color: theme.palette.text.primary,
                 border: `1px solid ${theme.palette.divider}`,
                 "&:hover": {
                   backgroundColor: theme.palette.background.paper
                 }
-              }),
+              },
               children: isChatbotActive ? /* @__PURE__ */ jsx(LightspeedFABOpenIcon, {}) : /* @__PURE__ */ jsx(LightspeedFABIcon, {})
             }
           )

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

@@ -1 +1 @@
-{"version":3,"file":"LightspeedFABContent.esm.js","sources":["../../src/components/LightspeedFABContent.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 Box from '@mui/material/Box';\nimport Fab from '@mui/material/Fab';\nimport Tooltip from '@mui/material/Tooltip';\nimport { ChatbotDisplayMode } from '@patternfly/chatbot';\n\nimport { DOCKED_CONTENT_OFFSET } from '../const';\nimport { useLightspeedDrawerContext } from '../hooks/useLightspeedDrawerContext';\nimport { useTranslation } from '../hooks/useTranslation';\nimport { LightspeedFABIcon, LightspeedFABOpenIcon } from './LightspeedIcon';\n\nexport const LightspeedFABContent = () => {\n  const { t } = useTranslation();\n  const { isChatbotActive, toggleChatbot, displayMode } =\n    useLightspeedDrawerContext();\n\n  if (displayMode === ChatbotDisplayMode.embedded) {\n    return null;\n  }\n\n  return (\n    <Box\n      sx={theme => ({\n        bottom: `calc(${theme.spacing(2)} + 1.5em)`,\n        right: `calc(${theme.spacing(2)} + 1.5em)`,\n        alignItems: 'end',\n        zIndex: 200,\n        display: 'flex',\n        position: 'fixed',\n        'body.docked-drawer-open &': {\n          transition: 'margin-right 0.3s ease',\n          marginRight: DOCKED_CONTENT_OFFSET,\n        },\n      })}\n      id=\"lightspeed-fab\"\n      data-testid=\"lightspeed-fab\"\n    >\n      <Tooltip\n        title={isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')}\n        placement=\"left\"\n      >\n        <Fab\n          color=\"inherit\"\n          variant=\"circular\"\n          size=\"large\"\n          onClick={toggleChatbot}\n          aria-label={\n            isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')\n          }\n          sx={theme => ({\n            backgroundColor: theme.palette.background.default,\n            color: theme.palette.text.primary,\n            border: `1px solid ${theme.palette.divider}`,\n            '&:hover': {\n              backgroundColor: theme.palette.background.paper,\n            },\n          })}\n        >\n          {isChatbotActive ? <LightspeedFABOpenIcon /> : <LightspeedFABIcon />}\n        </Fab>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AA0BO,MAAM,uBAAuB,MAAM;AACxC,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,cAAA,EAAe;AAC7B,EAAA,MAAM,EAAE,eAAA,EAAiB,aAAA,EAAe,WAAA,KACtC,0BAAA,EAA2B;AAE7B,EAAA,IAAI,WAAA,KAAgB,mBAAmB,QAAA,EAAU;AAC/C,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,IAAI,CAAA,KAAA,MAAU;AAAA,QACZ,MAAA,EAAQ,CAAA,KAAA,EAAQ,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAC,CAAA,SAAA,CAAA;AAAA,QAChC,KAAA,EAAO,CAAA,KAAA,EAAQ,KAAA,CAAM,OAAA,CAAQ,CAAC,CAAC,CAAA,SAAA,CAAA;AAAA,QAC/B,UAAA,EAAY,KAAA;AAAA,QACZ,MAAA,EAAQ,GAAA;AAAA,QACR,OAAA,EAAS,MAAA;AAAA,QACT,QAAA,EAAU,OAAA;AAAA,QACV,2BAAA,EAA6B;AAAA,UAC3B,UAAA,EAAY,wBAAA;AAAA,UACZ,WAAA,EAAa;AAAA;AACf,OACF,CAAA;AAAA,MACA,EAAA,EAAG,gBAAA;AAAA,MACH,aAAA,EAAY,gBAAA;AAAA,MAEZ,QAAA,kBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,OAAO,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,UACtE,SAAA,EAAU,MAAA;AAAA,UAEV,QAAA,kBAAA,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAM,SAAA;AAAA,cACN,OAAA,EAAQ,UAAA;AAAA,cACR,IAAA,EAAK,OAAA;AAAA,cACL,OAAA,EAAS,aAAA;AAAA,cACT,cACE,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,cAEjE,IAAI,CAAA,KAAA,MAAU;AAAA,gBACZ,eAAA,EAAiB,KAAA,CAAM,OAAA,CAAQ,UAAA,CAAW,OAAA;AAAA,gBAC1C,KAAA,EAAO,KAAA,CAAM,OAAA,CAAQ,IAAA,CAAK,OAAA;AAAA,gBAC1B,MAAA,EAAQ,CAAA,UAAA,EAAa,KAAA,CAAM,OAAA,CAAQ,OAAO,CAAA,CAAA;AAAA,gBAC1C,SAAA,EAAW;AAAA,kBACT,eAAA,EAAiB,KAAA,CAAM,OAAA,CAAQ,UAAA,CAAW;AAAA;AAC5C,eACF,CAAA;AAAA,cAEC,QAAA,EAAA,eAAA,mBAAkB,GAAA,CAAC,qBAAA,EAAA,EAAsB,CAAA,uBAAM,iBAAA,EAAA,EAAkB;AAAA;AAAA;AACpE;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"LightspeedFABContent.esm.js","sources":["../../src/components/LightspeedFABContent.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 { useLayoutEffect, useRef } from 'react';\n\nimport Box from '@mui/material/Box';\nimport Fab from '@mui/material/Fab';\nimport { useTheme } from '@mui/material/styles';\nimport Tooltip from '@mui/material/Tooltip';\nimport { ChatbotDisplayMode } from '@patternfly/chatbot';\n\nimport { DOCKED_CONTENT_OFFSET, LIGHTSPEED_FAB_ELEMENT_ID } from '../const';\nimport { useLightspeedDrawerContext } from '../hooks/useLightspeedDrawerContext';\nimport { useTranslation } from '../hooks/useTranslation';\nimport {\n  clearLightspeedFabAnchorVars,\n  getLightspeedFabEdgeInset,\n  publishLightspeedFabAnchorVars,\n} from '../utils/fab-anchor-utils';\nimport { LightspeedFABIcon, LightspeedFABOpenIcon } from './LightspeedIcon';\n\nexport const LightspeedFABContent = () => {\n  const { t } = useTranslation();\n  const theme = useTheme();\n  const { isChatbotActive, toggleChatbot, displayMode } =\n    useLightspeedDrawerContext();\n  const fabRef = useRef<HTMLDivElement>(null);\n  const fabEdgeInset = getLightspeedFabEdgeInset(theme);\n\n  useLayoutEffect(() => {\n    const fab = fabRef.current;\n    if (!fab) {\n      return undefined;\n    }\n\n    const syncAnchor = () =>\n      publishLightspeedFabAnchorVars({ fabElement: fab, theme });\n    syncAnchor();\n\n    const resizeObserver =\n      typeof ResizeObserver === 'function'\n        ? new ResizeObserver(syncAnchor)\n        : undefined;\n    resizeObserver?.observe(fab);\n\n    window.addEventListener('resize', syncAnchor);\n    fab.addEventListener('transitionend', syncAnchor);\n    const mutationObserver = new MutationObserver(syncAnchor);\n    mutationObserver.observe(document.body, {\n      attributes: true,\n      attributeFilter: ['class'],\n    });\n\n    return () => {\n      resizeObserver?.disconnect();\n      window.removeEventListener('resize', syncAnchor);\n      fab.removeEventListener('transitionend', syncAnchor);\n      mutationObserver.disconnect();\n      clearLightspeedFabAnchorVars();\n    };\n  }, [displayMode, theme]);\n\n  if (displayMode === ChatbotDisplayMode.embedded) {\n    return null;\n  }\n\n  return (\n    <Box\n      ref={fabRef}\n      sx={{\n        bottom: fabEdgeInset,\n        right: fabEdgeInset,\n        alignItems: 'end',\n        zIndex: theme.zIndex.tooltip,\n        display: 'flex',\n        position: 'fixed',\n        'body.docked-drawer-open &': {\n          transition: 'margin-right 0.3s ease',\n          marginRight: DOCKED_CONTENT_OFFSET,\n        },\n      }}\n      id={LIGHTSPEED_FAB_ELEMENT_ID}\n      data-testid=\"lightspeed-fab\"\n    >\n      <Tooltip\n        title={isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')}\n        placement=\"left\"\n      >\n        <Fab\n          color=\"inherit\"\n          variant=\"circular\"\n          size=\"large\"\n          onClick={toggleChatbot}\n          aria-label={\n            isChatbotActive ? t('tooltip.fab.close') : t('tooltip.fab.open')\n          }\n          sx={{\n            backgroundColor: theme.palette.background.default,\n            color: theme.palette.text.primary,\n            border: `1px solid ${theme.palette.divider}`,\n            '&:hover': {\n              backgroundColor: theme.palette.background.paper,\n            },\n          }}\n        >\n          {isChatbotActive ? <LightspeedFABOpenIcon /> : <LightspeedFABIcon />}\n        </Fab>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;AAkCO,MAAM,uBAAuB,MAAM;AACxC,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,cAAA,EAAe;AAC7B,EAAA,MAAM,QAAQ,QAAA,EAAS;AACvB,EAAA,MAAM,EAAE,eAAA,EAAiB,aAAA,EAAe,WAAA,KACtC,0BAAA,EAA2B;AAC7B,EAAA,MAAM,MAAA,GAAS,OAAuB,IAAI,CAAA;AAC1C,EAAA,MAAM,YAAA,GAAe,0BAA0B,KAAK,CAAA;AAEpD,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,MAAM,MAAM,MAAA,CAAO,OAAA;AACnB,IAAA,IAAI,CAAC,GAAA,EAAK;AACR,MAAA,OAAO,MAAA;AAAA,IACT;AAEA,IAAA,MAAM,aAAa,MACjB,8BAAA,CAA+B,EAAE,UAAA,EAAY,GAAA,EAAK,OAAO,CAAA;AAC3D,IAAA,UAAA,EAAW;AAEX,IAAA,MAAM,iBACJ,OAAO,cAAA,KAAmB,aACtB,IAAI,cAAA,CAAe,UAAU,CAAA,GAC7B,MAAA;AACN,IAAA,cAAA,EAAgB,QAAQ,GAAG,CAAA;AAE3B,IAAA,MAAA,CAAO,gBAAA,CAAiB,UAAU,UAAU,CAAA;AAC5C,IAAA,GAAA,CAAI,gBAAA,CAAiB,iBAAiB,UAAU,CAAA;AAChD,IAAA,MAAM,gBAAA,GAAmB,IAAI,gBAAA,CAAiB,UAAU,CAAA;AACxD,IAAA,gBAAA,CAAiB,OAAA,CAAQ,SAAS,IAAA,EAAM;AAAA,MACtC,UAAA,EAAY,IAAA;AAAA,MACZ,eAAA,EAAiB,CAAC,OAAO;AAAA,KAC1B,CAAA;AAED,IAAA,OAAO,MAAM;AACX,MAAA,cAAA,EAAgB,UAAA,EAAW;AAC3B,MAAA,MAAA,CAAO,mBAAA,CAAoB,UAAU,UAAU,CAAA;AAC/C,MAAA,GAAA,CAAI,mBAAA,CAAoB,iBAAiB,UAAU,CAAA;AACnD,MAAA,gBAAA,CAAiB,UAAA,EAAW;AAC5B,MAAA,4BAAA,EAA6B;AAAA,IAC/B,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,WAAA,EAAa,KAAK,CAAC,CAAA;AAEvB,EAAA,IAAI,WAAA,KAAgB,mBAAmB,QAAA,EAAU;AAC/C,IAAA,OAAO,IAAA;AAAA,EACT;AAEA,EAAA,uBACE,GAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,MAAA;AAAA,MACL,EAAA,EAAI;AAAA,QACF,MAAA,EAAQ,YAAA;AAAA,QACR,KAAA,EAAO,YAAA;AAAA,QACP,UAAA,EAAY,KAAA;AAAA,QACZ,MAAA,EAAQ,MAAM,MAAA,CAAO,OAAA;AAAA,QACrB,OAAA,EAAS,MAAA;AAAA,QACT,QAAA,EAAU,OAAA;AAAA,QACV,2BAAA,EAA6B;AAAA,UAC3B,UAAA,EAAY,wBAAA;AAAA,UACZ,WAAA,EAAa;AAAA;AACf,OACF;AAAA,MACA,EAAA,EAAI,yBAAA;AAAA,MACJ,aAAA,EAAY,gBAAA;AAAA,MAEZ,QAAA,kBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,OAAO,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,UACtE,SAAA,EAAU,MAAA;AAAA,UAEV,QAAA,kBAAA,GAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,KAAA,EAAM,SAAA;AAAA,cACN,OAAA,EAAQ,UAAA;AAAA,cACR,IAAA,EAAK,OAAA;AAAA,cACL,OAAA,EAAS,aAAA;AAAA,cACT,cACE,eAAA,GAAkB,CAAA,CAAE,mBAAmB,CAAA,GAAI,EAAE,kBAAkB,CAAA;AAAA,cAEjE,EAAA,EAAI;AAAA,gBACF,eAAA,EAAiB,KAAA,CAAM,OAAA,CAAQ,UAAA,CAAW,OAAA;AAAA,gBAC1C,KAAA,EAAO,KAAA,CAAM,OAAA,CAAQ,IAAA,CAAK,OAAA;AAAA,gBAC1B,MAAA,EAAQ,CAAA,UAAA,EAAa,KAAA,CAAM,OAAA,CAAQ,OAAO,CAAA,CAAA;AAAA,gBAC1C,SAAA,EAAW;AAAA,kBACT,eAAA,EAAiB,KAAA,CAAM,OAAA,CAAQ,UAAA,CAAW;AAAA;AAC5C,eACF;AAAA,cAEC,QAAA,EAAA,eAAA,mBAAkB,GAAA,CAAC,qBAAA,EAAA,EAAsB,CAAA,uBAAM,iBAAA,EAAA,EAAkB;AAAA;AAAA;AACpE;AAAA;AACF;AAAA,GACF;AAEJ;;;;"}

package/dist/components/LightspeedPage.esm.js

@@ -1,18 +1,9 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import { Page, Header, Content } from '@backstage/core-components';
-import { makeStyles, createStyles } from '@material-ui/core/styles';
 import { useTranslation } from '../hooks/useTranslation.esm.js';
 import { LightspeedChatContainer } from './LightspeedChatContainer.esm.js';
 
-const useStyles = makeStyles(
-  () => createStyles({
-    container: {
-      padding: "0px"
-    }
-  })
-);
 const LightspeedPage = () => {
-  const classes = useStyles();
   const { t } = useTranslation();
   return /* @__PURE__ */ jsxs(Page, { themeId: "tool", children: [
     /* @__PURE__ */ jsx(
@@ -23,7 +14,7 @@ const LightspeedPage = () => {
         pageTitleOverride: t("page.title")
       }
     ),
-    /* @__PURE__ */ jsx(Content, { className: classes.container, children: /* @__PURE__ */ jsx(LightspeedChatContainer, {}) })
+    /* @__PURE__ */ jsx(Content, { noPadding: true, children: /* @__PURE__ */ jsx(LightspeedChatContainer, {}) })
   ] });
 };
 

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

@@ -1 +1 @@
-{"version":3,"file":"LightspeedPage.esm.js","sources":["../../src/components/LightspeedPage.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 { Content, Header, Page } from '@backstage/core-components';\n\nimport { createStyles, makeStyles } from '@material-ui/core/styles';\n\nimport { useTranslation } from '../hooks/useTranslation';\nimport { LightspeedChatContainer } from './LightspeedChatContainer';\n\nconst useStyles = makeStyles(() =>\n  createStyles({\n    container: {\n      padding: '0px',\n    },\n  }),\n);\n\n/**\n * Lightspeed Page - Routable fullscreen/embedded mode\n * @public\n */\nexport const LightspeedPage = () => {\n  const classes = useStyles();\n  const { t } = useTranslation();\n\n  return (\n    <Page themeId=\"tool\">\n      <Header\n        title={t('page.title')}\n        style={{ display: 'none' }}\n        pageTitleOverride={t('page.title')}\n      />\n      <Content className={classes.container}>\n        <LightspeedChatContainer />\n      </Content>\n    </Page>\n  );\n};\n"],"names":[],"mappings":";;;;;;AAuBA,MAAM,SAAA,GAAY,UAAA;AAAA,EAAW,MAC3B,YAAA,CAAa;AAAA,IACX,SAAA,EAAW;AAAA,MACT,OAAA,EAAS;AAAA;AACX,GACD;AACH,CAAA;AAMO,MAAM,iBAAiB,MAAM;AAClC,EAAA,MAAM,UAAU,SAAA,EAAU;AAC1B,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,cAAA,EAAe;AAE7B,EAAA,uBACE,IAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,MAAA,EACZ,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,EAAE,YAAY,CAAA;AAAA,QACrB,KAAA,EAAO,EAAE,OAAA,EAAS,MAAA,EAAO;AAAA,QACzB,iBAAA,EAAmB,EAAE,YAAY;AAAA;AAAA,KACnC;AAAA,wBACC,OAAA,EAAA,EAAQ,SAAA,EAAW,QAAQ,SAAA,EAC1B,QAAA,kBAAA,GAAA,CAAC,2BAAwB,CAAA,EAC3B;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"LightspeedPage.esm.js","sources":["../../src/components/LightspeedPage.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 { Content, Header, Page } from '@backstage/core-components';\n\nimport { useTranslation } from '../hooks/useTranslation';\nimport { LightspeedChatContainer } from './LightspeedChatContainer';\n\n/**\n * Lightspeed Page - Routable fullscreen/embedded mode\n * @public\n */\nexport const LightspeedPage = () => {\n  const { t } = useTranslation();\n\n  return (\n    <Page themeId=\"tool\">\n      <Header\n        title={t('page.title')}\n        style={{ display: 'none' }}\n        pageTitleOverride={t('page.title')}\n      />\n      <Content noPadding>\n        <LightspeedChatContainer />\n      </Content>\n    </Page>\n  );\n};\n"],"names":[],"mappings":";;;;;AAyBO,MAAM,iBAAiB,MAAM;AAClC,EAAA,MAAM,EAAE,CAAA,EAAE,GAAI,cAAA,EAAe;AAE7B,EAAA,uBACE,IAAA,CAAC,IAAA,EAAA,EAAK,OAAA,EAAQ,MAAA,EACZ,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,KAAA,EAAO,EAAE,YAAY,CAAA;AAAA,QACrB,KAAA,EAAO,EAAE,OAAA,EAAS,MAAA,EAAO;AAAA,QACzB,iBAAA,EAAmB,EAAE,YAAY;AAAA;AAAA,KACnC;AAAA,wBACC,OAAA,EAAA,EAAQ,SAAA,EAAS,IAAA,EAChB,QAAA,kBAAA,GAAA,CAAC,2BAAwB,CAAA,EAC3B;AAAA,GAAA,EACF,CAAA;AAEJ;;;;"}