@ixo/ui 0.0.22 → 0.0.24

package/dist/{components-BNly6Y-x.cjs → components-Disquhlg.cjs}

@@ -24,7 +24,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 const jsxRuntime = require("@emotion/react/jsx-runtime");
 const radash = require("radash");
 const react = require("@emotion/react");
-const UsersSolid = require("./UsersSolid-3ru3TJi-.cjs");
+const UsersSolid = require("./UsersSolid-D60imcQv.cjs");
 const react$1 = require("react");
 const constants = require("./constants-DFJRYpE2.cjs");
 const core = require("@mantine/core");
@@ -797,8 +797,8 @@ function AccordionTable({
     }
   );
 }
-const Header$3 = react$1.lazy(() => Promise.resolve().then(() => require("./index-DkxiMwu0.cjs")));
-const Footer = react$1.lazy(() => Promise.resolve().then(() => require("./index-B-OdChcI.cjs")));
+const Header$3 = react$1.lazy(() => Promise.resolve().then(() => require("./index-CtdwAmSJ.cjs")));
+const Footer = react$1.lazy(() => Promise.resolve().then(() => require("./index-BTd7RekU.cjs")));
 function ActionCard({ header, content, footer, useHoverMode = false }) {
   const hasContent = !!content || !!footer;
   const initialVisibility = footer?.startHidden !== true;
@@ -882,7 +882,7 @@ function Loader({ size, color = "primary" }) {
 }
 const CARD_WIDTH$1 = 350;
 const CARD_HEADER_HEIGHT = 158;
-const Header$2 = react$1.lazy(() => Promise.resolve().then(() => require("./index-CyALadsH.cjs")));
+const Header$2 = react$1.lazy(() => Promise.resolve().then(() => require("./index-vjtTGg1m.cjs")));
 function Card({ children, className, contentClassName, roundedBottom, noPadding = false, fullWidth = false, header, wrapperSx, onClick }) {
   const wrapperRef = react$1.useRef(null);
   const handleOnClick = react$1.useCallback(
@@ -1317,7 +1317,7 @@ function ModalSheet({ isOpen, children, hideHandler, zIndex, onRequestHide, onRe
     document.body
   );
 }
-const Badge = react$1.lazy(() => Promise.resolve().then(() => require("./index-tbar1igU.cjs")));
+const Badge = react$1.lazy(() => Promise.resolve().then(() => require("./index-D03Y_bB5.cjs")));
 function ActionSheet({ children, isOpen, header, navMenu = void 0, onRequestHide, onRequestShow }) {
   const shadowScrollRef = react$1.useRef(null);
   const wrapperContentAreaRef = react$1.useRef(null);
@@ -1921,34 +1921,35 @@ const Flex = react$1.forwardRef(
     children,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        ref,
-        ...props,
-        style: {
-          display: "flex",
-          flexDirection: direction,
-          alignItems: align,
-          justifyContent: justify,
-          gap,
-          margin: m,
-          marginTop: mt || my,
-          marginBottom: mb || my,
-          marginLeft: ml || mx,
-          marginRight: mr || mx,
-          padding: p,
-          paddingTop: pt || py,
-          paddingBottom: pb || py,
-          paddingLeft: pl || px,
-          paddingRight: pr || px,
-          backgroundColor: bg,
-          borderRadius: radius,
-          ...props.style
-        },
-        children
-      }
-    );
+    const hasIndividualPadding = pt !== 0 || pb !== 0 || pl !== 0 || pr !== 0 || px !== 0 || py !== 0;
+    const hasIndividualMargin = mt !== 0 || mb !== 0 || ml !== 0 || mr !== 0 || mx !== 0 || my !== 0;
+    const style = {
+      display: "flex",
+      flexDirection: direction,
+      alignItems: align,
+      justifyContent: justify,
+      gap,
+      backgroundColor: bg,
+      borderRadius: radius,
+      ...props.style
+    };
+    if (hasIndividualMargin) {
+      if (mt !== 0 || my !== 0) style.marginTop = mt || my;
+      if (mb !== 0 || my !== 0) style.marginBottom = mb || my;
+      if (ml !== 0 || mx !== 0) style.marginLeft = ml || mx;
+      if (mr !== 0 || mx !== 0) style.marginRight = mr || mx;
+    } else if (m !== 0) {
+      style.margin = m;
+    }
+    if (hasIndividualPadding) {
+      if (pt !== 0 || py !== 0) style.paddingTop = pt || py;
+      if (pb !== 0 || py !== 0) style.paddingBottom = pb || py;
+      if (pl !== 0 || px !== 0) style.paddingLeft = pl || px;
+      if (pr !== 0 || px !== 0) style.paddingRight = pr || px;
+    } else if (p !== 0) {
+      style.padding = p;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { ref, ...props, style, children });
   }
 );
 Flex.displayName = "Flex";
@@ -2124,6 +2125,52 @@ function AIInputBar({ placeholder, icon, disabledInput, disabledButton, valueInp
     }
   );
 }
+function AIChatToolbar({ onClose, onHistoryClick, onPlusClick, onHistoryClose, isHistoryOpened, oracleModel, sessionTitle }) {
+  const theme = useUITheme.useUITheme();
+  return /* @__PURE__ */ jsxRuntime.jsxs(Flex, { bg: theme.bg.navScaled, py: 16, justify: "space-between", align: "center", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(Flex, { gap: 6, align: "center", children: [
+      sessionTitle && /* @__PURE__ */ jsxRuntime.jsx(Typography.Text, { color: "overPicture", size: "s", children: sessionTitle }),
+      oracleModel && /* @__PURE__ */ jsxRuntime.jsx(core.Badge, { fw: 300, size: "sm", fz: 12, bg: theme.neutral.transparent10, tt: "initial", children: oracleModel })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(Flex, { gap: 6, align: "center", justify: "flex-end", children: isHistoryOpened ? /* @__PURE__ */ jsxRuntime.jsx(
+      core.Center,
+      {
+        sx: {
+          cursor: "pointer",
+          borderRadius: 8,
+          transition: "background 0.15s",
+          background: theme.bg.navIconsBg,
+          "&:hover": {
+            background: theme.neutral.transparent30
+          }
+        },
+        p: 4,
+        onClick: onHistoryClose,
+        children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.ArrowLeftSolid, { size: 18 })
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer", borderRadius: 24 }, onClick: onPlusClick, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.PlusSolid, { size: 18 }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer", borderRadius: 24 }, onClick: onHistoryClick, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.HistorySolid, { size: 18 }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        core.Center,
+        {
+          sx: {
+            cursor: "pointer",
+            borderRadius: 8,
+            transition: "background 0.15s",
+            background: theme.bg.navIconsBg,
+            "&:hover": {
+              background: theme.neutral.transparent30
+            }
+          },
+          p: 4,
+          onClick: onClose,
+          children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.Close, { size: 18 })
+        }
+      )
+    ] }) })
+  ] });
+}
 function Avatar({ src, rounded = true, size = 62, did }) {
   const css2 = {
     width: size,
@@ -2254,46 +2301,115 @@ function AsideResizable({ children, asideCollapsed = false, onAsideToggle, width
     children
   ] });
 }
-function SelectedIndicator() {
+function NavigationItemSkeleton() {
   const theme = useUITheme.useUITheme();
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Flex,
     {
+      align: "center",
+      gap: 8,
+      pl: 12,
+      pr: 12,
+      py: 6,
       style: {
-        position: "absolute",
-        left: -8,
-        width: 4,
-        height: 30,
-        backgroundColor: theme.neutral.whiteFull,
-        borderRadius: 4
-      }
+        borderRadius: 8,
+        backgroundColor: theme.bg.navIconsBg
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Flex, { align: "center", gap: 4, style: { flex: 1 }, children: /* @__PURE__ */ jsxRuntime.jsx(
+          core.Skeleton,
+          {
+            height: "15px",
+            radius: "xl",
+            sx: {
+              "::before": { opacity: 0 },
+              "::after": { opacity: 1 }
+            },
+            style: { opacity: 0.2 }
+          }
+        ) }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.Skeleton,
+          {
+            height: 16,
+            width: 16,
+            radius: 4,
+            sx: {
+              "::before": { opacity: 0 },
+              "::after": { opacity: 1 }
+            },
+            style: { opacity: 0.3 }
+          }
+        )
+      ]
     }
   );
 }
-function SpaceItem({ icon, id, selectedSpace, onClick }) {
+function RoomItem({ room }) {
   const { hovered, ref } = hooks.useHover();
   const theme = useUITheme.useUITheme();
-  const isSelected = selectedSpace === id;
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    core.Center,
+    Flex,
     {
       ref,
-      sx: {
+      align: "center",
+      gap: 8,
+      px: 12,
+      py: 4,
+      ml: 16,
+      style: {
         cursor: "pointer",
-        borderRadius: 24
+        borderRadius: 6,
+        backgroundColor: room.isActive || hovered ? theme.neutral.transparent10 : "transparent",
+        transform: hovered ? "translateX(2px)" : "translateX(0px)",
+        transition: "all 0.15s ease"
       },
-      pos: "relative",
-      bg: hovered ? theme.neutral.transparent30 : theme.bg.navIconsBg,
-      mih: 40,
-      w: 40,
-      onClick: () => onClick(id),
+      onClick: () => room.onClick(room.id),
       children: [
-        typeof icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(core.Image, { radius: 24, src: icon, w: 32, h: 32 }) : icon,
-        isSelected && /* @__PURE__ */ jsxRuntime.jsx(SelectedIndicator, {})
+        /* @__PURE__ */ jsxRuntime.jsx(room.icon, { size: 16, color: "secondary" }),
+        /* @__PURE__ */ jsxRuntime.jsx(core.Text, { fz: 13, c: theme.text.secondary, children: room.name })
       ]
     }
   );
 }
+function RoomCategory({ category }) {
+  const { hovered, ref } = hooks.useHover();
+  const theme = useUITheme.useUITheme();
+  const { value, toggle } = useToggle(false);
+  return /* @__PURE__ */ jsxRuntime.jsxs(core.Stack, { gap: 2, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      Flex,
+      {
+        ref,
+        align: "center",
+        justify: "space-between",
+        px: 12,
+        py: 4,
+        style: {
+          cursor: "pointer",
+          borderRadius: 6,
+          backgroundColor: hovered ? theme.neutral.transparent50 : "transparent",
+          transition: "all 0.15s ease"
+        },
+        onClick: toggle,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(core.Text, { fz: 12, c: theme.neutral.lightGray, children: category.name }),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.Center,
+            {
+              sx: {
+                transform: value ? "rotate(-90deg)" : "rotate(0deg)",
+                transition: "transform 0.2s ease"
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.AngleLeftSolid, { size: 12, color: "secondary" })
+            }
+          )
+        ]
+      }
+    ),
+    !value && /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 1, children: category.rooms.map((room) => /* @__PURE__ */ jsxRuntime.jsx(RoomItem, { room }, room.id)) })
+  ] });
+}
 function MenuItem({ item, onMenuItemClick, depth = 0 }) {
   const { hovered, ref } = hooks.useHover();
   const theme = useUITheme.useUITheme();
@@ -2371,71 +2487,46 @@ function MenuItem({ item, onMenuItemClick, depth = 0 }) {
     hasChildren && isExpanded && /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 1, children: item.children?.map((childItem) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { item: childItem, onMenuItemClick, depth: depth + 1 }, childItem.id)) })
   ] });
 }
-function RoomItem({ room }) {
+function SelectedIndicator() {
+  const theme = useUITheme.useUITheme();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        left: -8,
+        width: 4,
+        height: 30,
+        backgroundColor: theme.neutral.whiteFull,
+        borderRadius: 4
+      }
+    }
+  );
+}
+function SpaceItem({ icon, id, selectedSpace, onClick }) {
   const { hovered, ref } = hooks.useHover();
   const theme = useUITheme.useUITheme();
+  const isSelected = selectedSpace === id;
   return /* @__PURE__ */ jsxRuntime.jsxs(
-    Flex,
+    core.Center,
     {
       ref,
-      align: "center",
-      gap: 8,
-      px: 12,
-      py: 4,
-      ml: 16,
-      style: {
+      sx: {
         cursor: "pointer",
-        borderRadius: 6,
-        backgroundColor: room.isActive || hovered ? theme.neutral.transparent10 : "transparent",
-        transform: hovered ? "translateX(2px)" : "translateX(0px)",
-        transition: "all 0.15s ease"
+        borderRadius: 24
       },
-      onClick: () => room.onClick(room.id),
+      pos: "relative",
+      bg: hovered ? theme.neutral.transparent30 : theme.bg.navIconsBg,
+      mih: 40,
+      w: 40,
+      onClick: () => onClick(id),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx(room.icon, { size: 16, color: "secondary" }),
-        /* @__PURE__ */ jsxRuntime.jsx(core.Text, { fz: 13, c: theme.text.secondary, children: room.name })
+        typeof icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx(core.Image, { radius: 24, src: icon, w: 32, h: 32 }) : icon,
+        isSelected && /* @__PURE__ */ jsxRuntime.jsx(SelectedIndicator, {})
       ]
     }
   );
 }
-function RoomCategory({ category }) {
-  const { hovered, ref } = hooks.useHover();
-  const theme = useUITheme.useUITheme();
-  const { value, toggle } = useToggle(false);
-  return /* @__PURE__ */ jsxRuntime.jsxs(core.Stack, { gap: 2, children: [
-    /* @__PURE__ */ jsxRuntime.jsxs(
-      Flex,
-      {
-        ref,
-        align: "center",
-        justify: "space-between",
-        px: 12,
-        py: 4,
-        style: {
-          cursor: "pointer",
-          borderRadius: 6,
-          backgroundColor: hovered ? theme.neutral.transparent50 : "transparent",
-          transition: "all 0.15s ease"
-        },
-        onClick: toggle,
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(core.Text, { fz: 12, c: theme.neutral.lightGray, children: category.name }),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            core.Center,
-            {
-              sx: {
-                transform: value ? "rotate(-90deg)" : "rotate(0deg)",
-                transition: "transform 0.2s ease"
-              },
-              children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.AngleLeftSolid, { size: 12, color: "secondary" })
-            }
-          )
-        ]
-      }
-    ),
-    !value && /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 1, children: category.rooms.map((room) => /* @__PURE__ */ jsxRuntime.jsx(RoomItem, { room }, room.id)) })
-  ] });
-}
 function AppShellNavigation({
   spaces,
   pageItem,
@@ -2456,9 +2547,14 @@ function AppShellNavigation({
   asideCollapsed = true,
   onAsideToggle,
   onMaxExpand,
-  children
+  onAiOpen,
+  isAiOpened,
+  isAiBtnVisible,
+  loading,
+  children,
+  aiNavbarContent
 }) {
-  const [navbarCollapsed, { toggle: toggleNavbar }] = hooks.useDisclosure(true);
+  const [isNavbarNotCollapsed, { toggle: toggleNavbar }] = hooks.useDisclosure(true);
   const [asideWidth, setAsideWidth] = react$1.useState(450);
   const theme = useUITheme.useUITheme();
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -2467,7 +2563,8 @@ function AppShellNavigation({
       withBorder: false,
       styles: {
         navbar: {
-          background: theme.bg.navScaled
+          background: theme.bg.navScaled,
+          transition: "width 0.3s ease"
         },
         aside: {
           background: theme.bg.navScaled
@@ -2475,7 +2572,7 @@ function AppShellNavigation({
       },
       bg: theme.bg.centralCanvasBg,
       navbar: {
-        width: navbarCollapsed ? 300 : 56,
+        width: isNavbarNotCollapsed ? isAiOpened ? 450 : 300 : 56,
         breakpoint: "sm"
       },
       aside: {
@@ -2534,23 +2631,39 @@ function AppShellNavigation({
             onMinusSpaceClick && /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer", borderRadius: 24 }, bg: theme.bg.navIconsBg, h: 40, w: 40, onClick: onMinusSpaceClick, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.MinusCircleSolid, { color: "secondary" }) }),
             /* @__PURE__ */ jsxRuntime.jsxs(core.Stack, { align: "center", gap: 8, children: [
               /* @__PURE__ */ jsxRuntime.jsx(core.Divider, { w: 40, mx: 10, color: theme.neutral.transparent10 }),
-              /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer", borderRadius: 24 }, bg: theme.bg.navIconsBg, h: 40, w: 40, onClick: onSettingsIconClick, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.SettingsBarSolid, { size: 22, color: "secondary" }) }),
-              !navbarCollapsed && /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer", borderRadius: 24 }, bg: theme.bg.navIconsBg, h: 40, w: 40, onClick: toggleNavbar, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.AngleRightSolid, { color: "secondary" }) })
+              /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer", borderRadius: 24 }, bg: theme.bg.navIconsBg, h: 40, w: 40, onClick: onSettingsIconClick, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.SettingsBarSolid, { size: 22, color: "secondary" }) })
             ] })
           ] }),
-          navbarCollapsed && /* @__PURE__ */ jsxRuntime.jsxs(core.Stack, { justify: "space-between", w: "100%", pt: 16, pb: 10, px: 12, children: [
+          isAiOpened && isNavbarNotCollapsed && aiNavbarContent,
+          isNavbarNotCollapsed && !isAiOpened && /* @__PURE__ */ jsxRuntime.jsxs(core.Stack, { justify: "space-between", w: "100%", pt: 16, pb: 10, px: 12, children: [
             /* @__PURE__ */ jsxRuntime.jsxs(core.Stack, { gap: 5, children: [
               /* @__PURE__ */ jsxRuntime.jsxs(Flex, { mb: 24, style: { width: "100%" }, justify: "space-between", align: "center", children: [
                 /* @__PURE__ */ jsxRuntime.jsxs(Flex, { align: "center", gap: "10px", children: [
                   isBackButtonVisible ? /* @__PURE__ */ jsxRuntime.jsx(core.Center, { onClick: onBackClick, sx: { borderRadius: 4, cursor: "pointer", padding: 2, background: theme.bg.navIconsBg }, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.ArrowLeftSolid, { size: 18 }) }) : /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { borderRadius: 4, padding: 2, background: theme.bg.navIconsBg }, children: pageItem.pageIcon ? /* @__PURE__ */ jsxRuntime.jsx(pageItem.pageIcon, { size: 18 }) : /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.Globe, { size: 18 }) }),
                   /* @__PURE__ */ jsxRuntime.jsx(core.Text, { lh: 1, c: theme.text.overPicture, children: pageItem.pageTitle || "Unknown" })
                 ] }),
-                /* @__PURE__ */ jsxRuntime.jsx(Flex, { gap: 12, align: "center", children: /* @__PURE__ */ jsxRuntime.jsx(core.Center, { sx: { cursor: "pointer" }, onClick: toggleNavbar, children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.PanelLeftSolid, { size: 22, color: "secondary" }) }) })
+                isAiBtnVisible && !isAiOpened && /* @__PURE__ */ jsxRuntime.jsx(
+                  core.Center,
+                  {
+                    sx: {
+                      cursor: "pointer",
+                      borderRadius: 8,
+                      transition: "background 0.15s",
+                      background: theme.bg.navIconsBg,
+                      "&:hover": {
+                        background: theme.neutral.transparent30
+                      }
+                    },
+                    p: 4,
+                    onClick: onAiOpen,
+                    children: /* @__PURE__ */ jsxRuntime.jsx(UsersSolid.Assistant, { size: 18, color: "primary" })
+                  }
+                )
               ] }),
-              menuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)),
+              loading ? /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 5, children: Array.from({ length: 6 }).map((_, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavigationItemSkeleton, {}, idx)) }) : menuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)),
               roomCategories && roomCategories.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 8, mt: 16, children: roomCategories.map((category) => /* @__PURE__ */ jsxRuntime.jsx(RoomCategory, { category }, category.id)) })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 5, children: footerMenuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)) })
+            /* @__PURE__ */ jsxRuntime.jsx(core.Stack, { gap: 5, children: loading ? Array.from({ length: 2 }).map((_, idx) => /* @__PURE__ */ jsxRuntime.jsx(NavigationItemSkeleton, {}, idx)) : footerMenuItems?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(MenuItem, { onMenuItemClick, item }, item.id)) })
           ] })
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsx(core.AppShell.Main, { children }),
@@ -3081,7 +3194,7 @@ function OracleMessage({ oracleName, message }) {
 }
 function UserMessage({ message, sender }) {
   const theme = useUITheme.useUITheme();
-  return /* @__PURE__ */ jsxRuntime.jsxs(core.Box, { w: "fit-content", bg: theme.colors.focusTransparent10, sx: { borderRadius: 16 }, py: 12, px: 16, mb: 32, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(core.Box, { w: "fit-content", bg: theme.bg.navIconsBg, sx: { borderRadius: 16 }, py: 12, px: 16, mb: 32, children: [
     /* @__PURE__ */ jsxRuntime.jsx(core.Text, { c: theme.text.overPicture, fz: 12, children: sender }),
     /* @__PURE__ */ jsxRuntime.jsx(core.Text, { c: theme.text.overPicture, mt: 10, sx: { wordBreak: "break-all" }, children: message }, message)
   ] });
@@ -4401,7 +4514,8 @@ function FloatingInput({
       className,
       css: () => ({
         backgroundColor: "transparent",
-        borderRadius: 24,
+        borderRadius: 20,
+        outline: `1px solid ${theme.colors.focus}`,
         paddingTop: 16,
         position: "relative",
         animation: `${fadeIn} 0.3s ease-out`,
@@ -4498,7 +4612,7 @@ function FloatingInput({
           core.Box,
           {
             p: 16,
-            bg: theme.bg.glassmorphics,
+            bg: theme.bg.navSpaces,
             w: 340,
             pos: "absolute",
             left: "50%",
@@ -5532,13 +5646,13 @@ function ActionButton({ onClick, left, right }) {
     }
   );
 }
-const MainAction = react$1.lazy(() => Promise.resolve().then(() => require("./index-DSQZMIiq.cjs")));
-const Header$1 = react$1.lazy(() => Promise.resolve().then(() => require("./index-CvlLzI5F.cjs")));
-const Content = react$1.lazy(() => Promise.resolve().then(() => require("./index-C6QZLB5t.cjs")));
+const MainAction = react$1.lazy(() => Promise.resolve().then(() => require("./index-CFEGoEU_.cjs")));
+const Header$1 = react$1.lazy(() => Promise.resolve().then(() => require("./index-C68z2dhs.cjs")));
+const Content = react$1.lazy(() => Promise.resolve().then(() => require("./index-OFqzHKxE.cjs")));
 const Map = react$1.lazy(() => Promise.resolve().then(() => require("./index-D4PsPquZ.cjs")));
 const CustomContent = react$1.lazy(() => Promise.resolve().then(() => require("./index-ByrCNpS2.cjs")));
-const Assets = react$1.lazy(() => Promise.resolve().then(() => require("./index-Dg7GVuRa.cjs")));
-const Actions = react$1.lazy(() => Promise.resolve().then(() => require("./index-BRD5ffg_.cjs")));
+const Assets = react$1.lazy(() => Promise.resolve().then(() => require("./index-0QYujsdV.cjs")));
+const Actions = react$1.lazy(() => Promise.resolve().then(() => require("./index-vMylc9wu.cjs")));
 const HOVER_BORDER_WIDTH = 1;
 function SodaCardCmp({ numSelected = 0, expanded = true, mainAction, header, content, map, customContent, customFooter, actions, assets, onClick }, ref) {
   const wrapperRef = react$1.useRef(null);
@@ -10759,6 +10873,7 @@ function NavigationBar({
     hoveredItem === "user" && user && /* @__PURE__ */ jsxRuntime.jsx(UserModal, { items: userModalItems, position: modalPosition, onMouseEnter: handleModalEnter, onMouseLeave: handleModalLeave })
   ] });
 }
+exports.AIChatToolbar = AIChatToolbar;
 exports.AIInputBar = AIInputBar;
 exports.AIResponse = AIResponse;
 exports.Accordion = Accordion;
@@ -10850,4 +10965,4 @@ exports.UserMessage = UserMessage;
 exports.WorkspaceModal = WorkspaceModal;
 exports.cutText = cutText;
 exports.isValidClick = isValidClick;
-//# sourceMappingURL=components-BNly6Y-x.cjs.map
+//# sourceMappingURL=components-Disquhlg.cjs.map