@axiom-lattice/react-sdk 2.1.19 → 2.1.20

package/dist/index.mjs

@@ -972,8 +972,8 @@ var useStyle = createStyles(({ token, css }) => {
       font-family: ${token.fontFamily}, sans-serif;
       position: relative;
       overflow: hidden;
-      padding: 16px;
-      gap: 16px;
+      padding: 8px;
+      gap: 8px;
 
       .ant-prompts {
         color: ${token.colorText};
@@ -994,14 +994,14 @@ var useStyle = createStyles(({ token, css }) => {
       &.open {
         background: transparent;
         box-shadow: none;
-        margin-left: -16px;
+        margin-left: -8px;
         height: 100%;
       }
 
       &.collapsed {
-        width: 16px;
+        width: 8px;
         height: 100%;
-        margin-right: -16px;
+        margin-right: -8px;
         .ant-conversations {
           width: 64px;
         }
@@ -3819,7 +3819,17 @@ var AgentHeader = (props) => {
         style: { padding: 8 },
         variant: "borderless",
         description: description ? /* @__PURE__ */ jsx29(Text10, { ellipsis: { tooltip: description }, children: description }) : void 0,
-        icon: avatar ? /* @__PURE__ */ jsx29(Avatar2, { src: avatar, size: 48 }) : /* @__PURE__ */ jsx29(Avatar2, { size: 48, children: name?.charAt(0).toUpperCase() }),
+        icon: /* @__PURE__ */ jsx29(
+          "div",
+          {
+            style: {
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            },
+            children: avatar ? /* @__PURE__ */ jsx29(Avatar2, { src: avatar, size: 48 }) : /* @__PURE__ */ jsx29(Avatar2, { size: 48, children: name?.charAt(0).toUpperCase() })
+          }
+        ),
         title: name ? name : void 0,
         extra: /* @__PURE__ */ jsxs16(Space12, { children: [
           extra,
@@ -4511,9 +4521,9 @@ var SideAppViewBrowser = () => {
 };
 
 // src/components/Chat/LatticeChat.tsx
-import { jsx as jsx34 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs20 } from "react/jsx-runtime";
 var LatticeChat = (props) => {
-  const { assistant_id, thread_id = "", menu, ...chatingProps } = props;
+  const { assistant_id, thread_id = "", menu, header, ...chatingProps } = props;
   return /* @__PURE__ */ jsx34(
     AgentThreadProvider,
     {
@@ -4524,12 +4534,26 @@ var LatticeChat = (props) => {
         enableReturnStateWhenStreamCompleted: true,
         enableResumeStream: true
       },
-      children: /* @__PURE__ */ jsx34(ChatUIContextProvider, { children: /* @__PURE__ */ jsx34(
-        ColumnLayout,
+      children: /* @__PURE__ */ jsx34(ChatUIContextProvider, { children: /* @__PURE__ */ jsxs20(
+        "div",
         {
-          menu,
-          left: thread_id ? /* @__PURE__ */ jsx34(Chating, { ...chatingProps }) : /* @__PURE__ */ jsx34("div", { children: "\u9700\u8981\u5148\u521B\u5EFA\u4F1A\u8BDD" }),
-          right: /* @__PURE__ */ jsx34(SideAppViewBrowser, {})
+          style: {
+            display: "flex",
+            flexDirection: "column",
+            width: "100%",
+            height: "100%"
+          },
+          children: [
+            header,
+            /* @__PURE__ */ jsx34(
+              ColumnLayout,
+              {
+                menu,
+                left: thread_id ? /* @__PURE__ */ jsx34(Chating, { ...chatingProps }) : /* @__PURE__ */ jsx34("div", { children: "\u9700\u8981\u5148\u521B\u5EFA\u4F1A\u8BDD" }),
+                right: /* @__PURE__ */ jsx34(SideAppViewBrowser, {})
+              }
+            )
+          ]
         }
       ) })
     }
@@ -5287,8 +5311,8 @@ var AgentConversations = () => {
 };
 
 // src/components/Chat/ChatSidebar.tsx
-import { useState as useState21 } from "react";
-import { Divider as Divider2 } from "antd";
+import { useState as useState21, useEffect as useEffect14, useRef as useRef11 } from "react";
+import { Divider as Divider2, Tooltip as Tooltip4 } from "antd";
 import {
   MenuFoldOutlined,
   MenuUnfoldOutlined,
@@ -5337,7 +5361,7 @@ var AssistantList = () => {
 
 // src/components/Chat/ChatSidebar.tsx
 import { createStyles as createStyles11 } from "antd-style";
-import { Fragment as Fragment5, jsx as jsx40, jsxs as jsxs20 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx40, jsxs as jsxs21 } from "react/jsx-runtime";
 var useStyles3 = createStyles11(({ token, css }) => ({
   sidebar: css`
     display: flex;
@@ -5348,6 +5372,11 @@ var useStyles3 = createStyles11(({ token, css }) => ({
     background: transparent;
     border-radius: ${token.borderRadiusLG}px;
     overflow: visible;
+
+    &.firstTimeHighlight {
+      border: 2px dashed ${token.colorPrimary};
+      background: ${token.colorPrimaryBg};
+    }
   `,
   content: css`
     flex: 1;
@@ -5506,8 +5535,34 @@ var useStyles3 = createStyles11(({ token, css }) => ({
   divider: css`
     margin: ${token.marginMD}px 0;
     border-color: ${token.colorBorderSecondary};
+  `,
+  hintTooltip: css`
+    position: absolute;
+    top: ${token.paddingMD}px;
+    left: ${token.paddingMD}px;
+    right: ${token.paddingMD}px;
+    padding: ${token.paddingSM}px ${token.paddingMD}px;
+    background: ${token.colorPrimary};
+    color: ${token.colorTextLightSolid};
+    border-radius: ${token.borderRadius}px;
+    font-size: ${token.fontSizeSM}px;
+    z-index: 1001;
+    animation: slideIn 0.3s ease-out;
+    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+
+    @keyframes slideIn {
+      from {
+        opacity: 0;
+        transform: translateY(-10px);
+      }
+      to {
+        opacity: 1;
+        transform: translateY(0);
+      }
+    }
   `
 }));
+var FIRST_COLLAPSE_KEY = "chat-sidebar-first-collapse-seen";
 var ChatSidebar = ({
   onSettingsClick,
   defaultCollapsed = false
@@ -5516,6 +5571,8 @@ var ChatSidebar = ({
   const { setMenuCollapsed, menuCollapsed, sideAppVisible } = useChatUIContext();
   const { setSettingsModalOpen } = useLatticeChatShellContext();
   const [isHovered, setIsHovered] = useState21(false);
+  const [isFirstCollapse, setIsFirstCollapse] = useState21(false);
+  const prevIsCollapsedRef = useRef11(false);
   const handleToggleCollapse = () => {
     setMenuCollapsed(!menuCollapsed);
   };
@@ -5524,77 +5581,109 @@ var ChatSidebar = ({
     onSettingsClick?.();
   };
   const isCollapsed = menuCollapsed || sideAppVisible;
+  useEffect14(() => {
+    const prevIsCollapsed = prevIsCollapsedRef.current;
+    if (isCollapsed) {
+      const hasSeenFirstCollapse = localStorage.getItem(FIRST_COLLAPSE_KEY);
+      if (!hasSeenFirstCollapse) {
+        setIsFirstCollapse(true);
+      }
+    } else if (prevIsCollapsed && !isCollapsed) {
+      setIsFirstCollapse((prev) => {
+        if (prev) {
+          return false;
+        }
+        return prev;
+      });
+    }
+    prevIsCollapsedRef.current = isCollapsed;
+  }, [isCollapsed]);
   const handleMouseEnter = () => {
     if (isCollapsed) {
       setIsHovered(true);
+      if (isFirstCollapse) {
+        localStorage.setItem(FIRST_COLLAPSE_KEY, "true");
+        setIsFirstCollapse(false);
+      }
     }
   };
   const handleMouseLeave = () => {
     setIsHovered(false);
   };
-  return /* @__PURE__ */ jsxs20(Fragment5, { children: [
-    /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsxs21(Fragment5, { children: [
+    /* @__PURE__ */ jsxs21(
       "div",
       {
-        className: styles.sidebar,
+        className: `${styles.sidebar} ${isFirstCollapse ? "firstTimeHighlight" : ""}`,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
-        children: !isCollapsed && /* @__PURE__ */ jsxs20(Fragment5, { children: [
-          /* @__PURE__ */ jsxs20("div", { className: styles.content, children: [
-            /* @__PURE__ */ jsxs20("div", { className: styles.section, children: [
-              /* @__PURE__ */ jsx40("div", { className: styles.sectionTitle, children: "Assistants" }),
-              /* @__PURE__ */ jsx40(AssistantList, {})
+        children: [
+          /* @__PURE__ */ jsx40(
+            Tooltip4,
+            {
+              title: "Move the mouse over the collapsed sidebar to see the assistants and threads",
+              open: isFirstCollapse,
+              placement: "right",
+              children: isFirstCollapse && /* @__PURE__ */ jsx40("div", { style: { marginTop: "400px" } })
+            }
+          ),
+          !isCollapsed && /* @__PURE__ */ jsxs21(Fragment5, { children: [
+            /* @__PURE__ */ jsxs21("div", { className: styles.content, children: [
+              /* @__PURE__ */ jsxs21("div", { className: styles.section, children: [
+                /* @__PURE__ */ jsx40("div", { className: styles.sectionTitle, children: "Assistants" }),
+                /* @__PURE__ */ jsx40(AssistantList, {})
+              ] }),
+              /* @__PURE__ */ jsx40(Divider2, { className: styles.divider }),
+              /* @__PURE__ */ jsxs21("div", { className: styles.section, children: [
+                /* @__PURE__ */ jsx40("div", { className: styles.sectionTitle, children: "Threads" }),
+                /* @__PURE__ */ jsx40(AgentConversations, {})
+              ] })
             ] }),
-            /* @__PURE__ */ jsx40(Divider2, { className: styles.divider }),
-            /* @__PURE__ */ jsxs20("div", { className: styles.section, children: [
-              /* @__PURE__ */ jsx40("div", { className: styles.sectionTitle, children: "Threads" }),
-              /* @__PURE__ */ jsx40(AgentConversations, {})
+            /* @__PURE__ */ jsxs21("div", { className: styles.footer, children: [
+              /* @__PURE__ */ jsx40(
+                "button",
+                {
+                  className: styles.actionButton,
+                  onClick: handleToggleCollapse,
+                  title: isCollapsed ? "Expand sidebar" : "Collapse sidebar",
+                  "aria-label": isCollapsed ? "Expand sidebar" : "Collapse sidebar",
+                  children: isCollapsed ? /* @__PURE__ */ jsx40(MenuUnfoldOutlined, {}) : /* @__PURE__ */ jsx40(MenuFoldOutlined, {})
+                }
+              ),
+              /* @__PURE__ */ jsx40(
+                "button",
+                {
+                  className: styles.actionButton,
+                  onClick: handleSettingsClick,
+                  title: "Settings",
+                  "aria-label": "Settings",
+                  children: /* @__PURE__ */ jsx40(SettingOutlined, {})
+                }
+              )
             ] })
-          ] }),
-          /* @__PURE__ */ jsxs20("div", { className: styles.footer, children: [
-            /* @__PURE__ */ jsx40(
-              "button",
-              {
-                className: styles.actionButton,
-                onClick: handleToggleCollapse,
-                title: isCollapsed ? "Expand sidebar" : "Collapse sidebar",
-                "aria-label": isCollapsed ? "Expand sidebar" : "Collapse sidebar",
-                children: isCollapsed ? /* @__PURE__ */ jsx40(MenuUnfoldOutlined, {}) : /* @__PURE__ */ jsx40(MenuFoldOutlined, {})
-              }
-            ),
-            /* @__PURE__ */ jsx40(
-              "button",
-              {
-                className: styles.actionButton,
-                onClick: handleSettingsClick,
-                title: "Settings",
-                "aria-label": "Settings",
-                children: /* @__PURE__ */ jsx40(SettingOutlined, {})
-              }
-            )
           ] })
-        ] })
+        ]
       }
     ),
-    isCollapsed && /* @__PURE__ */ jsxs20(
+    isCollapsed && /* @__PURE__ */ jsxs21(
       "div",
       {
         className: `${styles.hoverOverlay} ${isHovered ? "visible" : ""}`,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
         children: [
-          /* @__PURE__ */ jsxs20("div", { className: styles.hoverContent, children: [
-            /* @__PURE__ */ jsxs20("div", { className: styles.section, children: [
+          /* @__PURE__ */ jsxs21("div", { className: styles.hoverContent, children: [
+            /* @__PURE__ */ jsxs21("div", { className: styles.section, children: [
               /* @__PURE__ */ jsx40("div", { className: styles.sectionTitle, children: "Assistants" }),
               /* @__PURE__ */ jsx40(AssistantList, {})
             ] }),
             /* @__PURE__ */ jsx40(Divider2, { className: styles.divider }),
-            /* @__PURE__ */ jsxs20("div", { className: styles.section, children: [
+            /* @__PURE__ */ jsxs21("div", { className: styles.section, children: [
               /* @__PURE__ */ jsx40("div", { className: styles.sectionTitle, children: "Threads" }),
               /* @__PURE__ */ jsx40(AgentConversations, {})
             ] })
           ] }),
-          /* @__PURE__ */ jsxs20("div", { className: styles.footer, children: [
+          /* @__PURE__ */ jsxs21("div", { className: styles.footer, children: [
             /* @__PURE__ */ jsx40(
               "button",
               {
@@ -5654,7 +5743,7 @@ var LatticeChatView = (props) => {
 };
 
 // src/components/Chat/SettingsModal.tsx
-import { useState as useState22, useEffect as useEffect14, useRef as useRef11 } from "react";
+import { useState as useState22, useEffect as useEffect15, useRef as useRef12 } from "react";
 import {
   Modal,
   Input,
@@ -5680,7 +5769,7 @@ import {
   CloudServerOutlined
 } from "@ant-design/icons";
 import { createStyles as createStyles12 } from "antd-style";
-import { Fragment as Fragment6, jsx as jsx42, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx42, jsxs as jsxs22 } from "react/jsx-runtime";
 var { Text: Text13, Title: Title2 } = Typography15;
 var { TextArea } = Input;
 var useStyles4 = createStyles12(({ token, css }) => ({
@@ -6067,8 +6156,8 @@ var SettingsModal = ({
     return [];
   });
   const [serverConfigs, setServerConfigs] = useState22({});
-  const connectionsRef = useRef11(connections);
-  useEffect14(() => {
+  const connectionsRef = useRef12(connections);
+  useEffect15(() => {
     connectionsRef.current = connections;
   }, [connections]);
   const [activeTabKey, setActiveTabKey] = useState22(
@@ -6270,7 +6359,7 @@ var SettingsModal = ({
       console.error("Failed to load models configuration:", error);
     }
   };
-  useEffect14(() => {
+  useEffect15(() => {
     if (open && activeTabKey) {
       initializeServerConfig(activeTabKey);
       const connection = connections.find((c) => c.id === activeTabKey);
@@ -6279,7 +6368,7 @@ var SettingsModal = ({
       }
     }
   }, [open, activeTabKey]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (open && activeTabKey) {
       const connection = connections.find((c) => c.id === activeTabKey);
       if (connection?.connected) {
@@ -6480,13 +6569,13 @@ var SettingsModal = ({
         }
       }));
     };
-    return /* @__PURE__ */ jsxs21("div", { className: styles.formContainer, children: [
+    return /* @__PURE__ */ jsxs22("div", { className: styles.formContainer, children: [
       /* @__PURE__ */ jsx42(
         Alert3,
         {
           message: "Configuration Effect",
-          description: /* @__PURE__ */ jsxs21("div", { children: [
-            /* @__PURE__ */ jsxs21("div", { style: { marginBottom: 8 }, children: [
+          description: /* @__PURE__ */ jsxs22("div", { children: [
+            /* @__PURE__ */ jsxs22("div", { style: { marginBottom: 8 }, children: [
               /* @__PURE__ */ jsx42(
                 CheckCircleOutlined4,
                 {
@@ -6496,7 +6585,7 @@ var SettingsModal = ({
               /* @__PURE__ */ jsx42("strong", { children: "Immediately effective:" }),
               " QUEUE_SERVICE_TYPE, REDIS_URL, REDIS_PASSWORD, QUEUE_NAME"
             ] }),
-            /* @__PURE__ */ jsxs21("div", { children: [
+            /* @__PURE__ */ jsxs22("div", { children: [
               /* @__PURE__ */ jsx42(ReloadOutlined2, { style: { color: "#faad14", marginRight: 8 } }),
               /* @__PURE__ */ jsx42("strong", { children: "Requires restart:" }),
               " PORT (server must be restarted to change port)"
@@ -6585,10 +6674,10 @@ QUEUE_NAME=tasks`,
         }));
       }
     };
-    return /* @__PURE__ */ jsxs21("div", { className: styles.formContainer, children: [
+    return /* @__PURE__ */ jsxs22("div", { className: styles.formContainer, children: [
       /* @__PURE__ */ jsx42("div", { style: { marginBottom: 32 }, children: /* @__PURE__ */ jsx42(Text13, { type: "secondary", style: { fontSize: 14, lineHeight: 1.6 }, children: "Configure model lattices. Each model will be registered with the provided key and can be used by agents." }) }),
-      config.models.map((model, index) => /* @__PURE__ */ jsxs21("div", { className: styles.card, children: [
-        /* @__PURE__ */ jsxs21(
+      config.models.map((model, index) => /* @__PURE__ */ jsxs22("div", { className: styles.card, children: [
+        /* @__PURE__ */ jsxs22(
           "div",
           {
             style: {
@@ -6600,12 +6689,12 @@ QUEUE_NAME=tasks`,
               borderBottom: "1px solid rgba(0, 0, 0, 0.06)"
             },
             children: [
-              /* @__PURE__ */ jsxs21("div", { children: [
-                /* @__PURE__ */ jsxs21(Text13, { strong: true, style: { fontSize: 16 }, children: [
+              /* @__PURE__ */ jsxs22("div", { children: [
+                /* @__PURE__ */ jsxs22(Text13, { strong: true, style: { fontSize: 16 }, children: [
                   "Model ",
                   index + 1
                 ] }),
-                model.key && /* @__PURE__ */ jsxs21(
+                model.key && /* @__PURE__ */ jsxs22(
                   Text13,
                   {
                     type: "secondary",
@@ -6635,8 +6724,8 @@ QUEUE_NAME=tasks`,
             ]
           }
         ),
-        /* @__PURE__ */ jsxs21(Space14, { direction: "vertical", style: { width: "100%" }, size: "large", children: [
-          /* @__PURE__ */ jsxs21("div", { children: [
+        /* @__PURE__ */ jsxs22(Space14, { direction: "vertical", style: { width: "100%" }, size: "large", children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { className: styles.formLabel, children: "Key *" }),
             /* @__PURE__ */ jsx42(
               Input,
@@ -6649,7 +6738,7 @@ QUEUE_NAME=tasks`,
             ),
             /* @__PURE__ */ jsx42(Text13, { className: styles.formDescription, children: "Unique identifier for this model" })
           ] }),
-          /* @__PURE__ */ jsxs21("div", { children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { className: styles.formLabel, children: "Provider *" }),
             /* @__PURE__ */ jsx42(
               Select,
@@ -6667,7 +6756,7 @@ QUEUE_NAME=tasks`,
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs21("div", { children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { className: styles.formLabel, children: "Model Name *" }),
             /* @__PURE__ */ jsx42(
               Input,
@@ -6679,7 +6768,7 @@ QUEUE_NAME=tasks`,
               }
             )
           ] }),
-          /* @__PURE__ */ jsxs21("div", { children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { className: styles.formLabel, children: "API Key" }),
             /* @__PURE__ */ jsx42(
               Input.Password,
@@ -6692,7 +6781,7 @@ QUEUE_NAME=tasks`,
             ),
             /* @__PURE__ */ jsx42(Text13, { className: styles.formDescription, children: "API key for the model provider. Leave empty to use environment variable." })
           ] }),
-          /* @__PURE__ */ jsxs21("div", { children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { className: styles.formLabel, children: "Base URL" }),
             /* @__PURE__ */ jsx42(
               Input,
@@ -6705,7 +6794,7 @@ QUEUE_NAME=tasks`,
             ),
             /* @__PURE__ */ jsx42(Text13, { className: styles.formDescription, children: "Optional custom base URL for the API" })
           ] }),
-          /* @__PURE__ */ jsx42("div", { children: /* @__PURE__ */ jsxs21(Space14, { children: [
+          /* @__PURE__ */ jsx42("div", { children: /* @__PURE__ */ jsxs22(Space14, { children: [
             /* @__PURE__ */ jsx42(
               Switch,
               {
@@ -6715,8 +6804,8 @@ QUEUE_NAME=tasks`,
             ),
             /* @__PURE__ */ jsx42(Text13, { children: "Enable Streaming" })
           ] }) }),
-          /* @__PURE__ */ jsxs21("div", { style: { display: "flex", gap: 20 }, children: [
-            /* @__PURE__ */ jsxs21("div", { style: { flex: 1 }, children: [
+          /* @__PURE__ */ jsxs22("div", { style: { display: "flex", gap: 20 }, children: [
+            /* @__PURE__ */ jsxs22("div", { style: { flex: 1 }, children: [
               /* @__PURE__ */ jsx42(Text13, { className: styles.formLabel, children: "Max Tokens" }),
               /* @__PURE__ */ jsx42(
                 Input,
@@ -6733,7 +6822,7 @@ QUEUE_NAME=tasks`,
                 }
               )
             ] }),
-            /* @__PURE__ */ jsxs21("div", { style: { flex: 1 }, children: [
+            /* @__PURE__ */ jsxs22("div", { style: { flex: 1 }, children: [
               /* @__PURE__ */ jsx42(Text13, { className: styles.formLabel, children: "Temperature" }),
               /* @__PURE__ */ jsx42(
                 Input,
@@ -6782,7 +6871,7 @@ QUEUE_NAME=tasks`,
   );
   const currentConnection = connections.find((c) => c.id === activeTabKey);
   const renderTabLabel = (connection) => {
-    return /* @__PURE__ */ jsxs21("div", { style: { display: "flex", alignItems: "center" }, children: [
+    return /* @__PURE__ */ jsxs22("div", { style: { display: "flex", alignItems: "center" }, children: [
       /* @__PURE__ */ jsx42(
         CloudServerOutlined,
         {
@@ -6810,8 +6899,8 @@ QUEUE_NAME=tasks`,
   const tabItems = connections.map((connection) => ({
     key: connection.id,
     label: renderTabLabel(connection),
-    children: /* @__PURE__ */ jsx42("div", { className: styles.tabContent, children: connection.connected ? /* @__PURE__ */ jsx42(Fragment6, { children: /* @__PURE__ */ jsxs21("div", { style: { display: "flex", height: "100%" }, children: [
-      /* @__PURE__ */ jsx42("div", { className: styles.sidebar, children: SETTINGS_MENU_ITEMS.map((item) => /* @__PURE__ */ jsxs21(
+    children: /* @__PURE__ */ jsx42("div", { className: styles.tabContent, children: connection.connected ? /* @__PURE__ */ jsx42(Fragment6, { children: /* @__PURE__ */ jsxs22("div", { style: { display: "flex", height: "100%" }, children: [
+      /* @__PURE__ */ jsx42("div", { className: styles.sidebar, children: SETTINGS_MENU_ITEMS.map((item) => /* @__PURE__ */ jsxs22(
         "div",
         {
           className: `${styles.menuItem} ${activeMenu === item.key ? "active" : ""}`,
@@ -6823,16 +6912,16 @@ QUEUE_NAME=tasks`,
         },
         item.key
       )) }),
-      /* @__PURE__ */ jsxs21("div", { className: styles.content, children: [
-        /* @__PURE__ */ jsxs21("div", { className: styles.contentHeader, children: [
-          /* @__PURE__ */ jsxs21("div", { className: styles.contentHeaderLeft, children: [
+      /* @__PURE__ */ jsxs22("div", { className: styles.content, children: [
+        /* @__PURE__ */ jsxs22("div", { className: styles.contentHeader, children: [
+          /* @__PURE__ */ jsxs22("div", { className: styles.contentHeaderLeft, children: [
             /* @__PURE__ */ jsx42(Title2, { level: 3, className: styles.contentTitle, children: activeMenuItem?.label }),
-            /* @__PURE__ */ jsxs21(Text13, { className: styles.contentDescription, children: [
+            /* @__PURE__ */ jsxs22(Text13, { className: styles.contentDescription, children: [
               activeMenu === "environment" && "Manage environment variables for the gateway server",
               activeMenu === "models" && "Configure and register model lattices for use by agents"
             ] })
           ] }),
-          /* @__PURE__ */ jsxs21("div", { className: styles.contentHeaderRight, children: [
+          /* @__PURE__ */ jsxs22("div", { className: styles.contentHeaderRight, children: [
             /* @__PURE__ */ jsx42(Button14, { onClick: onClose, children: "Cancel" }),
             /* @__PURE__ */ jsx42(
               Button14,
@@ -6860,14 +6949,14 @@ QUEUE_NAME=tasks`,
           gap: 16,
           padding: 48
         },
-        children: connection.connecting ? /* @__PURE__ */ jsxs21(Fragment6, { children: [
+        children: connection.connecting ? /* @__PURE__ */ jsxs22(Fragment6, { children: [
           /* @__PURE__ */ jsx42(LinkOutlined, { style: { fontSize: 64, color: "#1890ff" }, spin: true }),
           /* @__PURE__ */ jsx42(Title2, { level: 4, children: "Connecting..." }),
-          /* @__PURE__ */ jsxs21(Text13, { type: "secondary", style: { textAlign: "center" }, children: [
+          /* @__PURE__ */ jsxs22(Text13, { type: "secondary", style: { textAlign: "center" }, children: [
             "Connecting to ",
             connection.url
           ] })
-        ] }) : /* @__PURE__ */ jsxs21(Fragment6, { children: [
+        ] }) : /* @__PURE__ */ jsxs22(Fragment6, { children: [
           /* @__PURE__ */ jsx42(LinkOutlined, { style: { fontSize: 64, color: "#d9d9d9" } }),
           /* @__PURE__ */ jsx42(Title2, { level: 4, type: "secondary", children: connection.error || "Not Connected" }),
           /* @__PURE__ */ jsx42(
@@ -6894,7 +6983,7 @@ QUEUE_NAME=tasks`,
     ) }),
     closable: connections.length > 1
   }));
-  return /* @__PURE__ */ jsxs21(Fragment6, { children: [
+  return /* @__PURE__ */ jsxs22(Fragment6, { children: [
     /* @__PURE__ */ jsx42(
       Modal,
       {
@@ -6918,7 +7007,7 @@ QUEUE_NAME=tasks`,
               }
             },
             items: tabItems,
-            addIcon: /* @__PURE__ */ jsxs21(
+            addIcon: /* @__PURE__ */ jsxs22(
               "div",
               {
                 style: {
@@ -6951,8 +7040,8 @@ QUEUE_NAME=tasks`,
         },
         confirmLoading: addingServer,
         className: styles.addServerModal,
-        children: /* @__PURE__ */ jsxs21(Space14, { direction: "vertical", style: { width: "100%" }, size: "large", children: [
-          /* @__PURE__ */ jsxs21("div", { children: [
+        children: /* @__PURE__ */ jsxs22(Space14, { direction: "vertical", style: { width: "100%" }, size: "large", children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { strong: true, style: { display: "block", marginBottom: 8 }, children: "Server Name" }),
             /* @__PURE__ */ jsx42(
               Input,
@@ -6965,7 +7054,7 @@ QUEUE_NAME=tasks`,
             ),
             /* @__PURE__ */ jsx42(Text13, { type: "secondary", style: { fontSize: 12, marginTop: 4 }, children: "Optional: Leave empty to use URL as name" })
           ] }),
-          /* @__PURE__ */ jsxs21("div", { children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { strong: true, style: { display: "block", marginBottom: 8 }, children: "Server URL *" }),
             /* @__PURE__ */ jsx42(
               Input,
@@ -6978,7 +7067,7 @@ QUEUE_NAME=tasks`,
             ),
             /* @__PURE__ */ jsx42(Text13, { type: "secondary", style: { fontSize: 12, marginTop: 4 }, children: "Enter the full URL of the gateway server" })
           ] }),
-          /* @__PURE__ */ jsxs21("div", { children: [
+          /* @__PURE__ */ jsxs22("div", { children: [
             /* @__PURE__ */ jsx42(Text13, { strong: true, style: { display: "block", marginBottom: 8 }, children: "API Key" }),
             /* @__PURE__ */ jsx42(
               Input.Password,
@@ -7011,9 +7100,9 @@ var AgentServerSetting = () => {
 };
 
 // src/components/Chat/LatticeChatShell.tsx
-import { jsx as jsx44, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs23 } from "react/jsx-runtime";
 var LatticeChatShell = (props) => {
-  return /* @__PURE__ */ jsxs22(LatticeChatShellContextProvider, { ...props, children: [
+  return /* @__PURE__ */ jsxs23(LatticeChatShellContextProvider, { ...props, children: [
     /* @__PURE__ */ jsx44(AssistantContextProvider, { autoLoad: true, children: /* @__PURE__ */ jsx44(ConversationContextProvider, { children: /* @__PURE__ */ jsx44(LatticeChatView, {}) }) }),
     /* @__PURE__ */ jsx44(AgentServerSetting, {})
   ] });