@iota-uz/sdk 0.4.10 → 0.4.12

package/dist/bichat/index.mjs

@@ -2,12 +2,12 @@ import React, { createContext, lazy, memo, forwardRef, useState, useRef, useMemo
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import ReactApexChart from 'react-apexcharts';
 import ApexCharts from 'apexcharts';
-import { X, Bug, ArrowUp, ArrowDown, Stack, Paperclip, PaperPlaneRight, CircleNotch, ArrowUUpLeft, PencilSimple, Check, Bookmark, ArrowsClockwise, Archive, Trash, DotsThree, Warning, ArrowClockwise, Image, ImageBroken, CaretLeft, CaretRight, MagnifyingGlass, WarningCircle, CaretDown, Info, CheckCircle, XCircle, Spinner, Copy, FilePdf, FileXls, FileCsv, FileDoc, FileCode, FileText, File, ChartBar, DownloadSimple, Download, ChatCircleDots, PencilSimpleLine, ArrowLeft, PaperPlaneTilt, ArrowRight, Timer, Lightning, Database, Wrench, ClockCounterClockwise, Lightbulb, Package, Plus, ArrowsCounterClockwise, Code, ArrowSquareOut, SpinnerGap, FloppyDisk, Sidebar } from '@phosphor-icons/react';
+import { X, Bug, ArrowUp, ArrowDown, Stack, Paperclip, PaperPlaneRight, CircleNotch, ArrowUUpLeft, PencilSimple, Check, Bookmark, ArrowsClockwise, Archive, Trash, DotsThree, Warning, ArrowClockwise, Image, ImageBroken, CaretLeft, CaretRight, MagnifyingGlass, WarningCircle, CaretDown, Info, CheckCircle, XCircle, Spinner, Copy, FilePdf, FileXls, FileCsv, FileDoc, FileCode, FileText, File, ChartBar, DownloadSimple, Download, ChatCircleDots, PencilSimpleLine, ArrowLeft, PaperPlaneTilt, ArrowRight, Timer, Lightning, Database, Wrench, ClockCounterClockwise, Lightbulb, Package, Plus, Gear, Users, List, CaretLineLeft, CaretLineRight, ArrowsCounterClockwise, Code, ArrowSquareOut, SpinnerGap, FloppyDisk, Sidebar } from '@phosphor-icons/react';
 import { Prism } from 'react-syntax-highlighter';
 import { vscDarkPlus, vs } from 'react-syntax-highlighter/dist/esm/styles/prism';
 import ReactMarkdown from 'react-markdown';
 import remarkGfm from 'remark-gfm';
-import { motion, AnimatePresence, useReducedMotion } from 'framer-motion';
+import { useMotionValue, useTransform, motion, AnimatePresence, useReducedMotion } from 'framer-motion';
 import { formatDistanceToNow, startOfDay, differenceInDays } from 'date-fns';
 import { Menu, MenuButton, MenuItems, MenuItem, Dialog, DialogBackdrop, DialogPanel, DialogTitle, Description, Disclosure, DisclosureButton, DisclosurePanel } from '@headlessui/react';
 import { createPortal } from 'react-dom';
@@ -7079,6 +7079,19 @@ var SessionItem = memo(
     const [menuAnchor, setMenuAnchor] = useState(null);
     const [isTouch, setIsTouch] = useState(false);
     const { t } = useTranslation();
+    const isDraggingRef = useRef(false);
+    const dragX = useMotionValue(0);
+    const archiveOpacity = useTransform(dragX, [-80, -40, 0], [1, 0.5, 0]);
+    const archiveScale = useTransform(dragX, [-80, -40, 0], [1, 0.8, 0.6]);
+    const canDragArchive = !!onArchive;
+    const handleDragEnd = (_, info) => {
+      if (info.offset.x < -80 && onArchive) {
+        onArchive();
+      }
+      requestAnimationFrame(() => {
+        isDraggingRef.current = false;
+      });
+    };
     useEffect(() => {
       setIsTouch("ontouchend" in document);
     }, []);
@@ -7097,17 +7110,15 @@ var SessionItem = memo(
       const element = itemRef.current;
       if (!element) return;
       const isIPad = /iPad|Macintosh/i.test(navigator.userAgent) && "ontouchend" in document;
-      if (isIPad) {
-        const handleContextMenu = (e) => {
-          e.preventDefault();
-          const target = e.currentTarget;
-          setMenuAnchor(target.getBoundingClientRect());
-          setMenuOpen(true);
-        };
-        element.addEventListener("contextmenu", handleContextMenu);
-        return () => element.removeEventListener("contextmenu", handleContextMenu);
-      }
-      return void 0;
+      if (!isIPad) return;
+      const handleContextMenu = (e) => {
+        e.preventDefault();
+        const target = e.currentTarget;
+        setMenuAnchor(target.getBoundingClientRect());
+        setMenuOpen(true);
+      };
+      element.addEventListener("contextmenu", handleContextMenu);
+      return () => element.removeEventListener("contextmenu", handleContextMenu);
     }, [itemRef]);
     const contextMenuItems = mode === "archived" ? [
       ...onRestore ? [{
@@ -7158,7 +7169,7 @@ var SessionItem = memo(
     ];
     const hasContextMenu = contextMenuItems.length > 0;
     return /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(
+      /* @__PURE__ */ jsxs(
         motion.div,
         {
           variants: sessionItemVariants,
@@ -7166,165 +7177,196 @@ var SessionItem = memo(
           animate: "animate",
           whileHover: "hover",
           exit: "exit",
-          children: /* @__PURE__ */ jsx(
-            "div",
-            {
-              role: "button",
-              tabIndex: 0,
-              ref: itemRef,
-              onClick: () => onSelect(session.id),
-              onKeyDown: (e) => {
-                if (e.key === "Enter" || e.key === " ") {
-                  e.preventDefault();
-                  onSelect(session.id);
-                }
-              },
-              className: `block w-full text-left px-3 py-2 rounded-lg transition-smooth group relative touch-tap cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50 ${isActive ? "bg-primary-50/50 dark:bg-primary-900/30 text-primary-700 dark:text-primary-400 border-l-4 border-primary-400 dark:border-primary-600" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 border-l-4 border-transparent"} ${className}`,
-              "aria-current": isActive ? "page" : void 0,
-              "data-session-item": true,
-              "data-testid": `${testIdPrefix}-session-${session.id}`,
-              ...longPressHandlers,
-              children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
-                /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: /* @__PURE__ */ jsx(
-                  MemoizedEditableText,
+          className: "relative overflow-hidden rounded-lg",
+          children: [
+            canDragArchive && /* @__PURE__ */ jsx(
+              motion.div,
+              {
+                className: "absolute inset-y-0 right-0 w-20 flex items-center justify-center bg-gray-500 dark:bg-gray-600 rounded-r-lg",
+                style: { opacity: archiveOpacity, scale: archiveScale },
+                "aria-hidden": "true",
+                children: /* @__PURE__ */ jsx(Archive, { size: 20, className: "text-white" })
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              motion.div,
+              {
+                drag: canDragArchive ? "x" : false,
+                dragDirectionLock: true,
+                dragConstraints: { left: -100, right: 0 },
+                dragElastic: { left: 0.2, right: 0.5 },
+                dragSnapToOrigin: true,
+                style: { x: canDragArchive ? dragX : void 0 },
+                onDragStart: () => {
+                  isDraggingRef.current = true;
+                },
+                onDragEnd: canDragArchive ? handleDragEnd : void 0,
+                className: "relative",
+                children: /* @__PURE__ */ jsx(
+                  "div",
                   {
-                    ref: editableTitleRef,
-                    value: displayTitle,
-                    onSave: (newTitle) => onRename?.(newTitle),
-                    isLoading: isTitleGenerating
-                  }
-                ) }),
-                !isTouch && hasContextMenu && /* @__PURE__ */ jsxs(Menu, { children: [
-                  /* @__PURE__ */ jsx(
-                    MenuButton,
-                    {
-                      onClick: (e) => {
+                    role: "button",
+                    tabIndex: 0,
+                    ref: itemRef,
+                    onClick: () => {
+                      if (isDraggingRef.current) return;
+                      onSelect(session.id);
+                    },
+                    onKeyDown: (e) => {
+                      if (e.key === "Enter" || e.key === " ") {
                         e.preventDefault();
-                        e.stopPropagation();
-                      },
-                      className: "opacity-0 group-hover:opacity-100 p-1.5 rounded hover:bg-gray-200 dark:hover:bg-gray-700 transition-smooth flex-shrink-0 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50",
-                      "aria-label": t("BiChat.Sidebar.ChatOptions"),
-                      "data-testid": `${testIdPrefix}-session-options-${session.id}`,
-                      children: /* @__PURE__ */ jsx(DotsThree, { size: 16, className: "w-4 h-4", weight: "bold" })
-                    }
-                  ),
-                  /* @__PURE__ */ jsxs(
-                    MenuItems,
-                    {
-                      anchor: "bottom start",
-                      className: "w-52 bg-white/95 dark:bg-gray-900/95 backdrop-blur rounded-xl shadow-xl border border-gray-200 dark:border-gray-700 z-30 [--anchor-gap:8px] mt-1 p-2 space-y-1",
-                      children: [
-                        mode !== "archived" && onPin && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
-                          "button",
-                          {
-                            onClick: (e) => {
-                              e.preventDefault();
-                              e.stopPropagation();
-                              onPin();
-                            },
-                            className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-200 transition-smooth ${focus ? "bg-gray-100 dark:bg-gray-800/70 ring-1 ring-gray-200/80 dark:ring-gray-700/80" : "hover:bg-gray-50 dark:hover:bg-gray-800"}`,
-                            "aria-label": session.pinned ? t("BiChat.Sidebar.UnpinChat") : t("BiChat.Sidebar.PinChat"),
-                            "data-testid": `${testIdPrefix}-session-pin-${session.id}`,
-                            children: [
-                              session.pinned ? /* @__PURE__ */ jsx(Check, { size: 16, className: "w-4 h-4" }) : /* @__PURE__ */ jsx(Bookmark, { size: 16, className: "w-4 h-4" }),
-                              session.pinned ? t("BiChat.Sidebar.UnpinChat") : t("BiChat.Sidebar.PinChat")
-                            ]
-                          }
-                        ) }),
-                        onRename && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus, close }) => /* @__PURE__ */ jsxs(
-                          "button",
-                          {
-                            onClick: (e) => {
-                              e.preventDefault();
-                              e.stopPropagation();
-                              editableTitleRef.current?.startEditing();
-                              close();
-                            },
-                            className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-200 transition-smooth ${focus ? "bg-gray-100 dark:bg-gray-800/70 ring-1 ring-gray-200/80 dark:ring-gray-700/80" : "hover:bg-gray-50 dark:hover:bg-gray-800"}`,
-                            "aria-label": t("BiChat.Sidebar.RenameChat"),
-                            "data-testid": `${testIdPrefix}-session-rename-${session.id}`,
-                            children: [
-                              /* @__PURE__ */ jsx(PencilSimple, { size: 16, className: "w-4 h-4" }),
-                              t("BiChat.Sidebar.RenameChat")
-                            ]
-                          }
-                        ) }),
-                        mode !== "archived" && onRegenerateTitle && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus, close }) => /* @__PURE__ */ jsxs(
-                          "button",
-                          {
-                            onClick: (e) => {
-                              e.preventDefault();
-                              e.stopPropagation();
-                              onRegenerateTitle();
-                              close();
-                            },
-                            className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-200 transition-smooth ${focus ? "bg-gray-100 dark:bg-gray-800/70 ring-1 ring-gray-200/80 dark:ring-gray-700/80" : "hover:bg-gray-50 dark:hover:bg-gray-800"}`,
-                            "aria-label": t("BiChat.Sidebar.RegenerateTitle"),
-                            "data-testid": `${testIdPrefix}-session-regenerate-${session.id}`,
-                            children: [
-                              /* @__PURE__ */ jsx(ArrowsClockwise, { size: 16, className: "w-4 h-4" }),
-                              t("BiChat.Sidebar.RegenerateTitle")
-                            ]
-                          }
-                        ) }),
-                        mode === "archived" && onRestore && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
-                          "button",
-                          {
-                            onClick: (e) => {
-                              e.preventDefault();
-                              e.stopPropagation();
-                              onRestore();
-                            },
-                            className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium transition-smooth ${focus ? "text-green-700 dark:text-green-300 bg-green-50 dark:bg-green-900/20 ring-1 ring-green-200/70 dark:ring-green-500/30" : "text-green-700 dark:text-green-300 hover:bg-green-50/70 dark:hover:bg-green-900/10"}`,
-                            "aria-label": t("BiChat.Archived.RestoreButton"),
-                            "data-testid": `${testIdPrefix}-session-restore-${session.id}`,
-                            children: [
-                              /* @__PURE__ */ jsx(ArrowUUpLeft, { size: 16, className: "w-4 h-4" }),
-                              t("BiChat.Archived.RestoreButton")
-                            ]
-                          }
-                        ) }),
-                        mode !== "archived" && onArchive && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
-                          "button",
+                        onSelect(session.id);
+                      }
+                    },
+                    className: `block w-full text-left px-3 py-2 rounded-lg transition-smooth group relative touch-tap cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50 ${isActive ? "bg-primary-50/50 dark:bg-primary-900/30 text-primary-700 dark:text-primary-400 border-l-4 border-primary-400 dark:border-primary-600" : "text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 border-l-4 border-transparent"} ${className}`,
+                    "aria-current": isActive ? "page" : void 0,
+                    "data-session-item": true,
+                    "data-testid": `${testIdPrefix}-session-${session.id}`,
+                    ...longPressHandlers,
+                    children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
+                      /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 min-w-0 flex-1", children: /* @__PURE__ */ jsx(
+                        MemoizedEditableText,
+                        {
+                          ref: editableTitleRef,
+                          value: displayTitle,
+                          onSave: (newTitle) => onRename?.(newTitle),
+                          isLoading: isTitleGenerating
+                        }
+                      ) }),
+                      !isTouch && hasContextMenu && /* @__PURE__ */ jsxs(Menu, { children: [
+                        /* @__PURE__ */ jsx(
+                          MenuButton,
                           {
                             onClick: (e) => {
                               e.preventDefault();
                               e.stopPropagation();
-                              onArchive();
                             },
-                            className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium transition-smooth ${focus ? "text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 ring-1 ring-amber-200/70 dark:ring-amber-500/30" : "text-amber-600 dark:text-amber-400 hover:bg-amber-50/70 dark:hover:bg-amber-900/10"}`,
-                            "aria-label": t("BiChat.Sidebar.ArchiveChat"),
-                            "data-testid": `${testIdPrefix}-session-archive-${session.id}`,
-                            children: [
-                              /* @__PURE__ */ jsx(Archive, { size: 16, className: "w-4 h-4" }),
-                              t("BiChat.Sidebar.ArchiveChat")
-                            ]
+                            className: "opacity-0 group-hover:opacity-100 p-1.5 rounded hover:bg-gray-200 dark:hover:bg-gray-700 transition-smooth flex-shrink-0 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50",
+                            "aria-label": t("BiChat.Sidebar.ChatOptions"),
+                            "data-testid": `${testIdPrefix}-session-options-${session.id}`,
+                            children: /* @__PURE__ */ jsx(DotsThree, { size: 16, className: "w-4 h-4", weight: "bold" })
                           }
-                        ) }),
-                        onDelete && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
-                          "button",
+                        ),
+                        /* @__PURE__ */ jsxs(
+                          MenuItems,
                           {
-                            onClick: (e) => {
-                              e.preventDefault();
-                              e.stopPropagation();
-                              onDelete();
-                            },
-                            className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium transition-smooth ${focus ? "text-red-600 dark:text-red-400 bg-red-50 dark:bg-red-900/20 ring-1 ring-red-200/70 dark:ring-red-500/30" : "text-red-600 dark:text-red-400 hover:bg-red-50/70 dark:hover:bg-red-900/10"}`,
-                            "aria-label": t("BiChat.Sidebar.DeleteChat"),
-                            "data-testid": `${testIdPrefix}-session-delete-${session.id}`,
+                            anchor: "bottom start",
+                            className: "w-52 bg-white/95 dark:bg-gray-900/95 backdrop-blur rounded-xl shadow-xl border border-gray-200 dark:border-gray-700 z-30 [--anchor-gap:8px] mt-1 p-2 space-y-1",
                             children: [
-                              /* @__PURE__ */ jsx(Trash, { size: 16, className: "w-4 h-4" }),
-                              t("BiChat.Sidebar.DeleteChat")
+                              mode !== "archived" && onPin && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
+                                "button",
+                                {
+                                  onClick: (e) => {
+                                    e.preventDefault();
+                                    e.stopPropagation();
+                                    onPin();
+                                  },
+                                  className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-200 transition-smooth ${focus ? "bg-gray-100 dark:bg-gray-800/70 ring-1 ring-gray-200/80 dark:ring-gray-700/80" : "hover:bg-gray-50 dark:hover:bg-gray-800"}`,
+                                  "aria-label": session.pinned ? t("BiChat.Sidebar.UnpinChat") : t("BiChat.Sidebar.PinChat"),
+                                  "data-testid": `${testIdPrefix}-session-pin-${session.id}`,
+                                  children: [
+                                    session.pinned ? /* @__PURE__ */ jsx(Check, { size: 16, className: "w-4 h-4" }) : /* @__PURE__ */ jsx(Bookmark, { size: 16, className: "w-4 h-4" }),
+                                    session.pinned ? t("BiChat.Sidebar.UnpinChat") : t("BiChat.Sidebar.PinChat")
+                                  ]
+                                }
+                              ) }),
+                              onRename && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus, close }) => /* @__PURE__ */ jsxs(
+                                "button",
+                                {
+                                  onClick: (e) => {
+                                    e.preventDefault();
+                                    e.stopPropagation();
+                                    editableTitleRef.current?.startEditing();
+                                    close();
+                                  },
+                                  className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-200 transition-smooth ${focus ? "bg-gray-100 dark:bg-gray-800/70 ring-1 ring-gray-200/80 dark:ring-gray-700/80" : "hover:bg-gray-50 dark:hover:bg-gray-800"}`,
+                                  "aria-label": t("BiChat.Sidebar.RenameChat"),
+                                  "data-testid": `${testIdPrefix}-session-rename-${session.id}`,
+                                  children: [
+                                    /* @__PURE__ */ jsx(PencilSimple, { size: 16, className: "w-4 h-4" }),
+                                    t("BiChat.Sidebar.RenameChat")
+                                  ]
+                                }
+                              ) }),
+                              mode !== "archived" && onRegenerateTitle && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus, close }) => /* @__PURE__ */ jsxs(
+                                "button",
+                                {
+                                  onClick: (e) => {
+                                    e.preventDefault();
+                                    e.stopPropagation();
+                                    onRegenerateTitle();
+                                    close();
+                                  },
+                                  className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium text-gray-700 dark:text-gray-200 transition-smooth ${focus ? "bg-gray-100 dark:bg-gray-800/70 ring-1 ring-gray-200/80 dark:ring-gray-700/80" : "hover:bg-gray-50 dark:hover:bg-gray-800"}`,
+                                  "aria-label": t("BiChat.Sidebar.RegenerateTitle"),
+                                  "data-testid": `${testIdPrefix}-session-regenerate-${session.id}`,
+                                  children: [
+                                    /* @__PURE__ */ jsx(ArrowsClockwise, { size: 16, className: "w-4 h-4" }),
+                                    t("BiChat.Sidebar.RegenerateTitle")
+                                  ]
+                                }
+                              ) }),
+                              mode === "archived" && onRestore && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
+                                "button",
+                                {
+                                  onClick: (e) => {
+                                    e.preventDefault();
+                                    e.stopPropagation();
+                                    onRestore();
+                                  },
+                                  className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium transition-smooth ${focus ? "text-green-700 dark:text-green-300 bg-green-50 dark:bg-green-900/20 ring-1 ring-green-200/70 dark:ring-green-500/30" : "text-green-700 dark:text-green-300 hover:bg-green-50/70 dark:hover:bg-green-900/10"}`,
+                                  "aria-label": t("BiChat.Archived.RestoreButton"),
+                                  "data-testid": `${testIdPrefix}-session-restore-${session.id}`,
+                                  children: [
+                                    /* @__PURE__ */ jsx(ArrowUUpLeft, { size: 16, className: "w-4 h-4" }),
+                                    t("BiChat.Archived.RestoreButton")
+                                  ]
+                                }
+                              ) }),
+                              mode !== "archived" && onArchive && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
+                                "button",
+                                {
+                                  onClick: (e) => {
+                                    e.preventDefault();
+                                    e.stopPropagation();
+                                    onArchive();
+                                  },
+                                  className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium transition-smooth ${focus ? "text-amber-600 dark:text-amber-400 bg-amber-50 dark:bg-amber-900/20 ring-1 ring-amber-200/70 dark:ring-amber-500/30" : "text-amber-600 dark:text-amber-400 hover:bg-amber-50/70 dark:hover:bg-amber-900/10"}`,
+                                  "aria-label": t("BiChat.Sidebar.ArchiveChat"),
+                                  "data-testid": `${testIdPrefix}-session-archive-${session.id}`,
+                                  children: [
+                                    /* @__PURE__ */ jsx(Archive, { size: 16, className: "w-4 h-4" }),
+                                    t("BiChat.Sidebar.ArchiveChat")
+                                  ]
+                                }
+                              ) }),
+                              onDelete && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
+                                "button",
+                                {
+                                  onClick: (e) => {
+                                    e.preventDefault();
+                                    e.stopPropagation();
+                                    onDelete();
+                                  },
+                                  className: `cursor-pointer flex w-full items-center gap-2 rounded-lg px-3 py-2 text-sm font-medium transition-smooth ${focus ? "text-red-600 dark:text-red-400 bg-red-50 dark:bg-red-900/20 ring-1 ring-red-200/70 dark:ring-red-500/30" : "text-red-600 dark:text-red-400 hover:bg-red-50/70 dark:hover:bg-red-900/10"}`,
+                                  "aria-label": t("BiChat.Sidebar.DeleteChat"),
+                                  "data-testid": `${testIdPrefix}-session-delete-${session.id}`,
+                                  children: [
+                                    /* @__PURE__ */ jsx(Trash, { size: 16, className: "w-4 h-4" }),
+                                    t("BiChat.Sidebar.DeleteChat")
+                                  ]
+                                }
+                              ) })
                             ]
                           }
-                        ) })
-                      ]
-                    }
-                  )
-                ] })
-              ] })
-            }
-          )
+                        )
+                      ] })
+                    ] })
+                  }
+                )
+              }
+            )
+          ]
         }
       ),
       /* @__PURE__ */ jsx(
@@ -7844,6 +7886,113 @@ function groupSessionsByDate(sessions, t) {
   });
   return groups;
 }
+
+// ui/src/bichat/utils/errorDisplay.ts
+function isPermissionDeniedError(error) {
+  if (!error) return false;
+  if (error instanceof Error) {
+    const msg = error.message.toLowerCase();
+    if (msg.includes("forbidden") || msg.includes("permission denied")) return true;
+  }
+  if (typeof error === "object" && error !== null) {
+    const obj = error;
+    if (obj.code === "forbidden" || obj.code === 403) return true;
+    if (obj.status === 403) return true;
+    if (obj.statusCode === 403) return true;
+    if (typeof obj.response === "object" && obj.response !== null) {
+      const resp = obj.response;
+      if (resp.status === 403) return true;
+    }
+  }
+  if (typeof error === "string") {
+    const lower = error.toLowerCase();
+    if (lower.includes("forbidden") || lower.includes("permission denied")) return true;
+  }
+  return false;
+}
+function toErrorDisplay(error, fallbackTitle) {
+  const permDenied = isPermissionDeniedError(error);
+  let title = fallbackTitle;
+  let description = "";
+  if (error instanceof Error) {
+    description = error.message;
+  } else if (typeof error === "object" && error !== null) {
+    const obj = error;
+    if (typeof obj.message === "string" && obj.message) description = obj.message;
+    if (typeof obj.title === "string" && obj.title) title = obj.title;
+    if (typeof obj.detail === "string" && obj.detail) description = obj.detail;
+  } else if (typeof error === "string") {
+    description = error;
+  }
+  if (permDenied && !description) {
+    description = "Your account does not have permission for this action.";
+  }
+  return { title, description, isPermissionDenied: permDenied };
+}
+function ErrorAlert({ error }) {
+  const amber = error.isPermissionDenied;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `mx-2 mt-4 p-3 border rounded-xl cursor-default ${amber ? "bg-amber-50 dark:bg-amber-900/20 border-amber-200 dark:border-amber-800" : "bg-red-50 dark:bg-red-900/20 border-red-200 dark:border-red-800"}`,
+      children: [
+        /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: `text-xs font-medium ${amber ? "text-amber-700 dark:text-amber-300" : "text-red-600 dark:text-red-400"}`,
+            children: error.title
+          }
+        ),
+        error.description && /* @__PURE__ */ jsx(
+          "p",
+          {
+            className: `mt-1 text-xs ${amber ? "text-amber-600 dark:text-amber-400" : "text-red-500 dark:text-red-300"}`,
+            children: error.description
+          }
+        )
+      ]
+    }
+  );
+}
+var COLLAPSE_STORAGE_KEY = "bichat-sidebar-collapsed";
+function useSidebarCollapse() {
+  const [isCollapsed, setIsCollapsed] = useState(() => {
+    try {
+      return localStorage.getItem(COLLAPSE_STORAGE_KEY) === "true";
+    } catch {
+      return false;
+    }
+  });
+  const isCollapsedRef = useRef(isCollapsed);
+  useEffect(() => {
+    isCollapsedRef.current = isCollapsed;
+  }, [isCollapsed]);
+  const toggle = useCallback(() => {
+    setIsCollapsed((prev) => {
+      const next = !prev;
+      try {
+        localStorage.setItem(COLLAPSE_STORAGE_KEY, String(next));
+      } catch {
+      }
+      return next;
+    });
+  }, []);
+  const expand = useCallback(() => {
+    setIsCollapsed(false);
+    try {
+      localStorage.setItem(COLLAPSE_STORAGE_KEY, "false");
+    } catch {
+    }
+  }, []);
+  const collapse = useCallback(() => {
+    setIsCollapsed(true);
+    try {
+      localStorage.setItem(COLLAPSE_STORAGE_KEY, "true");
+    } catch {
+    }
+  }, []);
+  return { isCollapsed, isCollapsedRef, toggle, expand, collapse };
+}
 function Sidebar2({
   dataSource,
   onSessionSelect,
@@ -7862,11 +8011,64 @@ function Sidebar2({
   const toast = useToast();
   const shouldReduceMotion = useReducedMotion();
   const sessionListRef = useRef(null);
+  const searchContainerRef = useRef(null);
+  const { isCollapsed, isCollapsedRef, toggle, expand, collapse } = useSidebarCollapse();
+  const collapsible = !onClose;
+  const handleSidebarClick = useCallback(
+    (e) => {
+      if (!collapsible) return;
+      const interactive = 'a, button, input, summary, [role="button"]';
+      if (e.target.closest(interactive)) return;
+      toggle();
+    },
+    [collapsible, toggle]
+  );
+  const focusSearch = useCallback(() => {
+    if (!collapsible) return;
+    if (isCollapsedRef.current) {
+      expand();
+      setTimeout(() => {
+        searchContainerRef.current?.querySelector("input")?.focus();
+      }, 250);
+    } else {
+      searchContainerRef.current?.querySelector("input")?.focus();
+    }
+  }, [collapsible, expand, isCollapsedRef]);
+  useEffect(() => {
+    if (!collapsible) return;
+    const handleKeyDown = (e) => {
+      const isMod = e.metaKey || e.ctrlKey;
+      if (isMod && e.key === "b") {
+        e.preventDefault();
+        toggle();
+      }
+      if (isMod && e.key === "k") {
+        e.preventDefault();
+        focusSearch();
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [collapsible, toggle, focusSearch]);
+  useEffect(() => {
+    if (!collapsible) return;
+    const handler = (e) => {
+      const detail = e.detail;
+      if (detail?.expanded) {
+        collapse();
+      }
+    };
+    window.addEventListener("bichat:artifacts-panel-expanded", handler);
+    return () => window.removeEventListener("bichat:artifacts-panel-expanded", handler);
+  }, [collapsible, collapse]);
+  const showCollapsed = collapsible && isCollapsed;
   const [activeTab, setActiveTab] = useState("my-chats");
   const [searchQuery, setSearchQuery] = useState("");
   const [sessions, setSessions] = useState([]);
   const [loading, setLoading] = useState(true);
-  const [error, setError] = useState(null);
+  const [loadError, setLoadError] = useState(null);
+  const [actionError, setActionError] = useState(null);
+  const accessDenied = loadError?.isPermissionDenied === true;
   const [refreshKey, setRefreshKey] = useState(0);
   const [showConfirm, setShowConfirm] = useState(false);
   const [sessionToArchive, setSessionToArchive] = useState(null);
@@ -7880,12 +8082,13 @@ function Sidebar2({
   const fetchSessions = useCallback(async () => {
     try {
       setLoading(true);
-      setError(null);
+      setLoadError(null);
+      setActionError(null);
       const result = await dataSource.listSessions({ limit: 50 });
       setSessions(result.sessions);
     } catch (err) {
       console.error("Failed to load sessions:", err);
-      setError(t("BiChat.Sidebar.FailedToLoadSessions"));
+      setLoadError(toErrorDisplay(err, t("BiChat.Sidebar.FailedToLoadSessions")));
     } finally {
       setLoading(false);
     }
@@ -7930,7 +8133,9 @@ function Sidebar2({
       }
     } catch (err) {
       console.error("Failed to archive session:", err);
-      toast.error(t("BiChat.Sidebar.FailedToArchiveChat"));
+      const display = toErrorDisplay(err, t("BiChat.Sidebar.FailedToArchiveChat"));
+      setActionError(display);
+      toast.error(display.title);
     } finally {
       setShowConfirm(false);
       setSessionToArchive(null);
@@ -7946,7 +8151,9 @@ function Sidebar2({
       setRefreshKey((k) => k + 1);
     } catch (err) {
       console.error("Failed to toggle pin:", err);
-      toast.error(t("BiChat.Sidebar.FailedToTogglePin"));
+      const display = toErrorDisplay(err, t("BiChat.Sidebar.FailedToTogglePin"));
+      setActionError(display);
+      toast.error(display.title);
     }
   };
   const handleRenameSession = async (sessionId, newTitle) => {
@@ -7956,7 +8163,9 @@ function Sidebar2({
       setRefreshKey((k) => k + 1);
     } catch (err) {
       console.error("Failed to update session title:", err);
-      toast.error(t("BiChat.Sidebar.FailedToRenameChat"));
+      const display = toErrorDisplay(err, t("BiChat.Sidebar.FailedToRenameChat"));
+      setActionError(display);
+      toast.error(display.title);
     }
   };
   const handleRegenerateTitle = async (sessionId) => {
@@ -7966,7 +8175,9 @@ function Sidebar2({
       setRefreshKey((k) => k + 1);
     } catch (err) {
       console.error("Failed to regenerate title:", err);
-      toast.error(t("BiChat.Sidebar.FailedToRegenerateTitle"));
+      const display = toErrorDisplay(err, t("BiChat.Sidebar.FailedToRegenerateTitle"));
+      setActionError(display);
+      toast.error(display.title);
     }
   };
   const filteredSessions = useMemo(() => {
@@ -8029,176 +8240,311 @@ function Sidebar2({
     /* @__PURE__ */ jsxs(
       "aside",
       {
-        className: `w-64 bg-surface-300 dark:bg-gray-900 border-r border-gray-200 dark:border-gray-700 h-full min-h-0 flex flex-col overflow-hidden ${className}`,
+        onClick: collapsible ? handleSidebarClick : void 0,
+        className: `relative bg-surface-300 dark:bg-gray-900 border-r border-gray-200 dark:border-gray-700 h-full min-h-0 flex flex-col overflow-hidden transition-[width] duration-300 ease-in-out ${showCollapsed ? "w-16 cursor-e-resize" : collapsible ? "w-64 cursor-w-resize" : "w-64"} ${className}`,
+        style: { willChange: "width" },
         role: "navigation",
         "aria-label": t("BiChat.Sidebar.ChatSessions"),
         children: [
-          (headerSlot || onClose) && /* @__PURE__ */ jsxs("div", { className: "p-4 border-b border-gray-200 dark:border-gray-700 flex items-center justify-between", children: [
-            headerSlot,
-            onClose && /* @__PURE__ */ jsx(
-              motion.button,
-              {
-                onClick: onClose,
-                className: "cursor-pointer p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-smooth text-gray-600 dark:text-gray-400",
-                title: t("BiChat.Sidebar.CloseSidebar"),
-                "aria-label": t("BiChat.Sidebar.CloseSidebar"),
-                whileHover: "hover",
-                whileTap: "tap",
-                variants: buttonVariants,
-                children: /* @__PURE__ */ jsx(X, { size: 20, className: "w-5 h-5" })
-              }
-            )
-          ] }),
-          showAllChatsTab && /* @__PURE__ */ jsx(
-            TabBar_default,
+          collapsible && /* @__PURE__ */ jsx(
+            "div",
             {
-              tabs,
-              activeTab,
-              onTabChange: (id) => setActiveTab(id)
+              className: `absolute inset-x-0 top-0 bottom-0 z-10 flex flex-col items-center pt-3 gap-3 transition-opacity ${showCollapsed ? "opacity-100 duration-150 delay-100" : "opacity-0 pointer-events-none duration-100"}`,
+              children: /* @__PURE__ */ jsxs("div", { className: "group/tooltip relative", children: [
+                /* @__PURE__ */ jsx(
+                  motion.button,
+                  {
+                    onClick: (e) => {
+                      e.stopPropagation();
+                      onNewChat();
+                    },
+                    disabled: creating || loading || accessDenied,
+                    className: "w-10 h-10 rounded-lg bg-primary-600 hover:bg-primary-700 active:bg-primary-800 text-white shadow-sm flex items-center justify-center disabled:opacity-40 disabled:cursor-not-allowed cursor-pointer transition-colors focus-visible:ring-2 focus-visible:ring-primary-400/50",
+                    title: t("BiChat.Chat.NewChat"),
+                    "aria-label": t("BiChat.Sidebar.CreateNewChat"),
+                    whileTap: { scale: 0.95 },
+                    children: creating ? /* @__PURE__ */ jsx("div", { className: "w-4 h-4 border-2 border-white/50 border-t-transparent rounded-full animate-spin" }) : /* @__PURE__ */ jsx(Plus, { size: 18, weight: "bold" })
+                  }
+                ),
+                /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute left-full ml-2 top-1/2 -translate-y-1/2 rounded-md bg-gray-900 dark:bg-gray-100 px-2 py-1 text-xs font-medium text-white dark:text-gray-900 opacity-0 group-hover/tooltip:opacity-100 transition-opacity whitespace-nowrap shadow-lg", children: t("BiChat.Chat.NewChat") })
+              ] })
             }
           ),
-          activeTab === "all-chats" && showAllChatsTab ? /* @__PURE__ */ jsx(
-            AllChatsList,
+          /* @__PURE__ */ jsxs(
+            "div",
             {
-              dataSource,
-              onSessionSelect,
-              activeSessionId
-            }
-          ) : /* @__PURE__ */ jsxs(Fragment, { children: [
-            /* @__PURE__ */ jsx("div", { className: "mt-3 px-4", children: /* @__PURE__ */ jsx(
-              SearchInput_default,
-              {
-                value: searchQuery,
-                onChange: setSearchQuery,
-                placeholder: t("BiChat.Sidebar.SearchChats")
-              }
-            ) }),
-            /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsx(
-              motion.button,
-              {
-                onClick: onNewChat,
-                disabled: creating || loading,
-                className: "cursor-pointer w-full px-4 py-3 bg-primary-600 dark:bg-primary-700 text-white rounded-lg hover:bg-primary-700 dark:hover:bg-primary-800 transition-smooth font-medium disabled:opacity-50 disabled:cursor-not-allowed flex items-center justify-center",
-                title: t("BiChat.Chat.NewChat"),
-                "aria-label": t("BiChat.Sidebar.CreateNewChat"),
-                whileHover: shouldReduceMotion ? {} : { scale: 1.02 },
-                whileTap: shouldReduceMotion ? {} : { scale: 0.95 },
-                children: creating ? /* @__PURE__ */ jsx(LoadingSpinner_default, { variant: "spinner", size: "sm" }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                  /* @__PURE__ */ jsx(Plus, { size: 20, className: "w-5 h-5" }),
-                  /* @__PURE__ */ jsx("span", { className: "ml-2", children: t("BiChat.Chat.NewChat") })
-                ] })
-              }
-            ) }),
-            onArchivedView && /* @__PURE__ */ jsx("div", { className: "px-4 pb-2", children: /* @__PURE__ */ jsxs(
-              "button",
-              {
-                onClick: onArchivedView,
-                className: "cursor-pointer flex items-center gap-2 px-3 py-2 rounded-lg text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800 transition-smooth text-sm font-medium w-full",
-                title: t("BiChat.Sidebar.ArchivedChats"),
-                children: [
-                  /* @__PURE__ */ jsx(Archive, { size: 18, className: "w-4.5 h-4.5" }),
-                  /* @__PURE__ */ jsx("span", { children: t("BiChat.Sidebar.ArchivedChats") })
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ jsxs(
-              "nav",
-              {
-                ref: sessionListRef,
-                className: "flex-1 overflow-y-auto px-2 pb-4 hide-scrollbar",
-                "aria-label": t("BiChat.Sidebar.ChatHistory"),
-                onKeyDown: handleSessionListKeyDown,
-                children: [
-                  loading && sessions.length === 0 ? /* @__PURE__ */ jsx(SessionSkeleton, { count: 5 }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                    pinnedSessions.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
-                      /* @__PURE__ */ jsx(
-                        DateGroupHeader,
-                        {
-                          groupName: t("BiChat.Common.Pinned"),
-                          count: pinnedSessions.length
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        motion.div,
-                        {
-                          className: "space-y-1 mt-2",
-                          variants: staggerContainerVariants,
-                          initial: "hidden",
-                          animate: "visible",
-                          role: "list",
-                          "aria-label": t("BiChat.Sidebar.PinnedChats"),
-                          children: pinnedSessions.map((session) => /* @__PURE__ */ jsx(
-                            SessionItem_default,
-                            {
-                              session,
-                              isActive: session.id === activeSessionId,
-                              onSelect: () => onSessionSelect(session.id),
-                              onArchive: () => handleArchiveRequest(session.id),
-                              onPin: () => handleTogglePin(session.id, session.pinned),
-                              onRename: (newTitle) => handleRenameSession(session.id, newTitle),
-                              onRegenerateTitle: () => handleRegenerateTitle(session.id)
-                            },
-                            session.id
-                          ))
-                        }
-                      ),
-                      /* @__PURE__ */ jsx("div", { className: "border-b border-gray-200 dark:border-gray-700 my-3" })
-                    ] }),
-                    sessionGroups.map((group) => /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
-                      /* @__PURE__ */ jsx(
-                        DateGroupHeader,
-                        {
-                          groupName: group.name,
-                          count: group.sessions.length
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        motion.div,
-                        {
-                          className: "space-y-1 mt-2",
-                          variants: staggerContainerVariants,
-                          initial: "hidden",
-                          animate: "visible",
-                          role: "list",
-                          "aria-label": `${group.name} chats`,
-                          children: group.sessions.map((session) => /* @__PURE__ */ jsx(
-                            SessionItem_default,
+              className: `flex flex-col flex-1 min-h-0 w-64 shrink-0 transition-opacity ${showCollapsed ? "opacity-0 pointer-events-none duration-100" : collapsible ? "opacity-100 duration-150 delay-[200ms]" : ""}`,
+              children: [
+                (headerSlot || onClose) && /* @__PURE__ */ jsxs("div", { className: "p-4 border-b border-gray-200 dark:border-gray-700 flex items-center justify-between", children: [
+                  headerSlot,
+                  onClose && /* @__PURE__ */ jsx(
+                    motion.button,
+                    {
+                      onClick: onClose,
+                      className: "cursor-pointer p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 transition-smooth text-gray-600 dark:text-gray-400",
+                      title: t("BiChat.Sidebar.CloseSidebar"),
+                      "aria-label": t("BiChat.Sidebar.CloseSidebar"),
+                      whileHover: "hover",
+                      whileTap: "tap",
+                      variants: buttonVariants,
+                      children: /* @__PURE__ */ jsx(X, { size: 20, className: "w-5 h-5" })
+                    }
+                  )
+                ] }),
+                showAllChatsTab && /* @__PURE__ */ jsx(
+                  TabBar_default,
+                  {
+                    tabs,
+                    activeTab,
+                    onTabChange: (id) => setActiveTab(id)
+                  }
+                ),
+                activeTab === "all-chats" && showAllChatsTab ? /* @__PURE__ */ jsx(
+                  AllChatsList,
+                  {
+                    dataSource,
+                    onSessionSelect,
+                    activeSessionId
+                  }
+                ) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                  /* @__PURE__ */ jsx("div", { ref: searchContainerRef, className: "mt-3 px-4", children: /* @__PURE__ */ jsx(
+                    SearchInput_default,
+                    {
+                      value: searchQuery,
+                      onChange: setSearchQuery,
+                      placeholder: t("BiChat.Sidebar.SearchChats")
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx("div", { className: "p-4", children: /* @__PURE__ */ jsx(
+                    motion.button,
+                    {
+                      onClick: (e) => {
+                        e.stopPropagation();
+                        onNewChat();
+                      },
+                      disabled: creating || loading || accessDenied,
+                      className: "cursor-pointer w-full px-4 py-2.5 bg-primary-600 dark:bg-primary-700 text-white rounded-lg hover:bg-primary-700 hover:-translate-y-0.5 active:bg-primary-800 transition-all duration-150 font-medium shadow-sm disabled:opacity-40 disabled:cursor-not-allowed flex items-center justify-center gap-2 focus-visible:ring-2 focus-visible:ring-primary-400/50 focus-visible:ring-offset-2 dark:focus-visible:ring-offset-gray-900",
+                      title: accessDenied ? t("BiChat.Sidebar.MissingPermission") : t("BiChat.Chat.NewChat"),
+                      "aria-label": t("BiChat.Sidebar.CreateNewChat"),
+                      whileHover: shouldReduceMotion ? {} : { y: -1 },
+                      whileTap: shouldReduceMotion ? {} : { scale: 0.98 },
+                      children: creating ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                        /* @__PURE__ */ jsx(LoadingSpinner_default, { variant: "spinner", size: "sm" }),
+                        /* @__PURE__ */ jsx("span", { children: t("BiChat.Common.Creating") })
+                      ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                        /* @__PURE__ */ jsx(Plus, { size: 16, weight: "bold" }),
+                        /* @__PURE__ */ jsx("span", { children: t("BiChat.Chat.NewChat") })
+                      ] })
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsxs(
+                    "nav",
+                    {
+                      ref: sessionListRef,
+                      className: "flex-1 overflow-y-auto px-2 pb-4 hide-scrollbar",
+                      "aria-label": t("BiChat.Sidebar.ChatHistory"),
+                      onKeyDown: handleSessionListKeyDown,
+                      children: [
+                        loading && sessions.length === 0 ? /* @__PURE__ */ jsx(SessionSkeleton, { count: 5 }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                          pinnedSessions.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
+                            /* @__PURE__ */ jsx(
+                              DateGroupHeader,
+                              {
+                                groupName: t("BiChat.Common.Pinned"),
+                                count: pinnedSessions.length
+                              }
+                            ),
+                            /* @__PURE__ */ jsx(
+                              motion.div,
+                              {
+                                className: "space-y-1 mt-2",
+                                variants: staggerContainerVariants,
+                                initial: "hidden",
+                                animate: "visible",
+                                role: "list",
+                                "aria-label": t("BiChat.Sidebar.PinnedChats"),
+                                children: pinnedSessions.map((session) => /* @__PURE__ */ jsx(
+                                  SessionItem_default,
+                                  {
+                                    session,
+                                    isActive: session.id === activeSessionId,
+                                    onSelect: () => onSessionSelect(session.id),
+                                    onArchive: () => handleArchiveRequest(session.id),
+                                    onPin: () => handleTogglePin(session.id, session.pinned),
+                                    onRename: (newTitle) => handleRenameSession(session.id, newTitle),
+                                    onRegenerateTitle: () => handleRegenerateTitle(session.id)
+                                  },
+                                  session.id
+                                ))
+                              }
+                            ),
+                            /* @__PURE__ */ jsx("div", { className: "border-b border-gray-200 dark:border-gray-700 my-3" })
+                          ] }),
+                          sessionGroups.map((group) => /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
+                            /* @__PURE__ */ jsx(
+                              DateGroupHeader,
+                              {
+                                groupName: group.name,
+                                count: group.sessions.length
+                              }
+                            ),
+                            /* @__PURE__ */ jsx(
+                              motion.div,
+                              {
+                                className: "space-y-1 mt-2",
+                                variants: staggerContainerVariants,
+                                initial: "hidden",
+                                animate: "visible",
+                                role: "list",
+                                "aria-label": `${group.name} chats`,
+                                children: group.sessions.map((session) => /* @__PURE__ */ jsx(
+                                  SessionItem_default,
+                                  {
+                                    session,
+                                    isActive: session.id === activeSessionId,
+                                    onSelect: () => onSessionSelect(session.id),
+                                    onArchive: () => handleArchiveRequest(session.id),
+                                    onPin: () => handleTogglePin(session.id, session.pinned),
+                                    onRename: (newTitle) => handleRenameSession(session.id, newTitle),
+                                    onRegenerateTitle: () => handleRegenerateTitle(session.id)
+                                  },
+                                  session.id
+                                ))
+                              }
+                            )
+                          ] }, group.name)),
+                          filteredSessions.length === 0 && !loading && /* @__PURE__ */ jsx(
+                            MemoizedEmptyState,
                             {
-                              session,
-                              isActive: session.id === activeSessionId,
-                              onSelect: () => onSessionSelect(session.id),
-                              onArchive: () => handleArchiveRequest(session.id),
-                              onPin: () => handleTogglePin(session.id, session.pinned),
-                              onRename: (newTitle) => handleRenameSession(session.id, newTitle),
-                              onRegenerateTitle: () => handleRegenerateTitle(session.id)
-                            },
-                            session.id
-                          ))
-                        }
-                      )
-                    ] }, group.name)),
-                    filteredSessions.length === 0 && !loading && /* @__PURE__ */ jsx(
-                      MemoizedEmptyState,
+                              title: searchQuery ? t("BiChat.Sidebar.NoChatsFound", { query: searchQuery }) : t("BiChat.Sidebar.NoChatsYet"),
+                              description: searchQuery ? void 0 : t("BiChat.Sidebar.CreateOneToGetStarted"),
+                              action: searchQuery ? /* @__PURE__ */ jsx(
+                                "button",
+                                {
+                                  onClick: () => setSearchQuery(""),
+                                  className: "cursor-pointer text-sm text-primary-600 dark:text-primary-400 hover:underline",
+                                  children: t("BiChat.Common.Clear")
+                                }
+                              ) : void 0
+                            }
+                          )
+                        ] }),
+                        loadError && /* @__PURE__ */ jsx(ErrorAlert, { error: loadError }),
+                        actionError && !loadError && /* @__PURE__ */ jsx(ErrorAlert, { error: actionError })
+                      ]
+                    }
+                  ),
+                  footerSlot
+                ] }),
+                collapsible && /* @__PURE__ */ jsxs("div", { className: "mt-auto border-t border-gray-100 dark:border-gray-800/80 px-4 py-3 flex items-center justify-between", children: [
+                  onArchivedView || showAllChatsTab ? /* @__PURE__ */ jsxs(Menu, { children: [
+                    /* @__PURE__ */ jsx(
+                      MenuButton,
                       {
-                        title: searchQuery ? t("BiChat.Sidebar.NoChatsFound", { query: searchQuery }) : t("BiChat.Sidebar.NoChatsYet"),
-                        description: searchQuery ? void 0 : t("BiChat.Sidebar.CreateOneToGetStarted"),
-                        action: searchQuery ? /* @__PURE__ */ jsx(
-                          "button",
-                          {
-                            onClick: () => setSearchQuery(""),
-                            className: "cursor-pointer text-sm text-primary-600 dark:text-primary-400 hover:underline",
-                            children: t("BiChat.Common.Clear")
-                          }
-                        ) : void 0
+                        onClick: (e) => {
+                          e.stopPropagation();
+                        },
+                        disabled: loading || accessDenied,
+                        className: "flex items-center justify-center rounded-lg text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors disabled:opacity-40 disabled:cursor-not-allowed cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50 p-2",
+                        "aria-label": t("BiChat.Sidebar.Settings"),
+                        title: t("BiChat.Sidebar.Settings"),
+                        children: /* @__PURE__ */ jsx(Gear, { size: 20 })
+                      }
+                    ),
+                    /* @__PURE__ */ jsxs(
+                      MenuItems,
+                      {
+                        anchor: "top start",
+                        className: "w-48 bg-white/95 dark:bg-gray-900/95 backdrop-blur-lg rounded-xl shadow-lg border border-gray-200/80 dark:border-gray-700/60 z-30 [--anchor-gap:8px] mb-1 p-1.5",
+                        children: [
+                          onArchivedView && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
+                            "button",
+                            {
+                              onClick: (e) => {
+                                e.preventDefault();
+                                e.stopPropagation();
+                                onArchivedView();
+                              },
+                              className: `cursor-pointer flex w-full items-center gap-2.5 rounded-lg px-2.5 py-1.5 text-[13px] text-gray-600 dark:text-gray-300 transition-colors ${focus ? "bg-gray-100 dark:bg-gray-800/70" : ""}`,
+                              "aria-label": t("BiChat.Sidebar.ArchivedChats"),
+                              children: [
+                                /* @__PURE__ */ jsx(Archive, { size: 16, className: "text-gray-400 dark:text-gray-500" }),
+                                t("BiChat.Sidebar.ArchivedChats")
+                              ]
+                            }
+                          ) }),
+                          showAllChatsTab && activeTab !== "all-chats" && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
+                            "button",
+                            {
+                              onClick: (e) => {
+                                e.preventDefault();
+                                e.stopPropagation();
+                                setActiveTab("all-chats");
+                              },
+                              className: `cursor-pointer flex w-full items-center gap-2.5 rounded-lg px-2.5 py-1.5 text-[13px] text-gray-600 dark:text-gray-300 transition-colors ${focus ? "bg-gray-100 dark:bg-gray-800/70" : ""}`,
+                              "aria-label": t("BiChat.Sidebar.AllChats"),
+                              children: [
+                                /* @__PURE__ */ jsx(Users, { size: 16, className: "text-gray-400 dark:text-gray-500" }),
+                                t("BiChat.Sidebar.AllChats")
+                              ]
+                            }
+                          ) }),
+                          showAllChatsTab && activeTab === "all-chats" && /* @__PURE__ */ jsx(MenuItem, { children: ({ focus }) => /* @__PURE__ */ jsxs(
+                            "button",
+                            {
+                              onClick: (e) => {
+                                e.preventDefault();
+                                e.stopPropagation();
+                                setActiveTab("my-chats");
+                              },
+                              className: `cursor-pointer flex w-full items-center gap-2.5 rounded-lg px-2.5 py-1.5 text-[13px] text-gray-600 dark:text-gray-300 transition-colors ${focus ? "bg-gray-100 dark:bg-gray-800/70" : ""}`,
+                              "aria-label": t("BiChat.Sidebar.MyChats"),
+                              children: [
+                                /* @__PURE__ */ jsx(List, { size: 16, className: "text-gray-400 dark:text-gray-500" }),
+                                t("BiChat.Sidebar.MyChats")
+                              ]
+                            }
+                          ) })
+                        ]
                       }
                     )
-                  ] }),
-                  error && /* @__PURE__ */ jsx("div", { className: "mx-2 mt-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-lg", children: /* @__PURE__ */ jsx("p", { className: "text-xs text-red-600 dark:text-red-400", children: error }) })
-                ]
+                  ] }) : /* @__PURE__ */ jsx("div", {}),
+                  /* @__PURE__ */ jsxs(
+                    "button",
+                    {
+                      onClick: (e) => {
+                        e.stopPropagation();
+                        toggle();
+                      },
+                      className: "flex items-center gap-2 rounded-lg px-3 py-2 text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50",
+                      title: t("BiChat.Sidebar.CollapseSidebar"),
+                      "aria-label": t("BiChat.Sidebar.CollapseSidebar"),
+                      children: [
+                        /* @__PURE__ */ jsx(CaretLineLeft, { size: 16 }),
+                        /* @__PURE__ */ jsx("span", { className: "text-xs font-medium", children: t("BiChat.Sidebar.Collapse") })
+                      ]
+                    }
+                  )
+                ] })
+              ]
+            }
+          ),
+          collapsible && showCollapsed && /* @__PURE__ */ jsx("div", { className: "absolute bottom-0 inset-x-0 z-10 border-t border-gray-100 dark:border-gray-800/80 py-3 flex justify-center", children: /* @__PURE__ */ jsxs("div", { className: "group/tooltip relative", children: [
+            /* @__PURE__ */ jsx(
+              "button",
+              {
+                onClick: (e) => {
+                  e.stopPropagation();
+                  toggle();
+                },
+                className: "w-10 h-10 flex items-center justify-center rounded-lg text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-800 transition-colors cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary-500/50",
+                title: t("BiChat.Sidebar.ExpandSidebar"),
+                "aria-label": t("BiChat.Sidebar.ExpandSidebar"),
+                children: /* @__PURE__ */ jsx(CaretLineRight, { size: 16 })
               }
             ),
-            footerSlot
-          ] })
+            /* @__PURE__ */ jsx("span", { className: "pointer-events-none absolute left-full ml-2 top-1/2 -translate-y-1/2 rounded-md bg-gray-900 dark:bg-gray-100 px-2 py-1 text-xs font-medium text-white dark:text-gray-900 opacity-0 group-hover/tooltip:opacity-100 transition-opacity whitespace-nowrap shadow-lg", children: t("BiChat.Sidebar.Expand") })
+          ] }) })
         ]
       }
     ),
@@ -8415,6 +8761,231 @@ function ArchivedChatList({
     }
   );
 }
+
+// ui/src/bichat/components/SkipLink.tsx
+init_useTranslation();
+function SkipLink() {
+  const { t } = useTranslation();
+  return /* @__PURE__ */ jsx(
+    "a",
+    {
+      href: "#main-content",
+      className: "sr-only focus-visible:not-sr-only focus-visible:absolute focus-visible:top-4 focus-visible:left-4 focus-visible:z-50 focus-visible:bg-primary-600 focus-visible:text-white focus-visible:px-4 focus-visible:py-2 focus-visible:rounded-lg focus-visible:shadow-lg",
+      children: t("BiChat.SkipLink.Label")
+    }
+  );
+}
+var MOBILE_QUERY = "(max-width: 767px)";
+function getIsMobile() {
+  if (typeof window === "undefined") return false;
+  return window.matchMedia(MOBILE_QUERY).matches;
+}
+function useSidebarState() {
+  const [isMobile, setIsMobile] = useState(getIsMobile);
+  const [isMobileOpen, setIsMobileOpen] = useState(false);
+  useEffect(() => {
+    if (typeof window === "undefined") return;
+    const mql = window.matchMedia(MOBILE_QUERY);
+    const handler = (e) => {
+      setIsMobile(e.matches);
+      if (!e.matches) setIsMobileOpen(false);
+    };
+    if (mql.addEventListener) {
+      mql.addEventListener("change", handler);
+    } else if (mql.addListener) {
+      mql.addListener(handler);
+    }
+    return () => {
+      if (mql.removeEventListener) {
+        mql.removeEventListener("change", handler);
+      } else if (mql.removeListener) {
+        mql.removeListener(handler);
+      }
+    };
+  }, []);
+  const openMobile = useCallback(() => setIsMobileOpen(true), []);
+  const closeMobile = useCallback(() => setIsMobileOpen(false), []);
+  const toggleMobile = useCallback(() => setIsMobileOpen((v) => !v), []);
+  return { isMobile, isMobileOpen, openMobile, closeMobile, toggleMobile };
+}
+function useFocusTrap(containerRef, isActive, restoreFocusOnDeactivate) {
+  useEffect(() => {
+    if (!isActive || !containerRef.current) return;
+    const container = containerRef.current;
+    const previouslyFocused = document.activeElement;
+    const getFocusableElements = () => {
+      const selector = [
+        "button:not([disabled])",
+        "[href]",
+        "input:not([disabled])",
+        "select:not([disabled])",
+        "textarea:not([disabled])",
+        '[tabindex]:not([tabindex="-1"])'
+      ].join(", ");
+      return Array.from(container.querySelectorAll(selector));
+    };
+    const focusableElements = getFocusableElements();
+    if (focusableElements.length > 0) {
+      focusableElements[0].focus();
+    }
+    const handleTabKey = (e) => {
+      if (e.key !== "Tab") return;
+      const focusableElements2 = getFocusableElements();
+      if (focusableElements2.length === 0) return;
+      const firstElement = focusableElements2[0];
+      const lastElement = focusableElements2[focusableElements2.length - 1];
+      if (e.shiftKey) {
+        if (document.activeElement === firstElement) {
+          e.preventDefault();
+          lastElement.focus();
+        }
+      } else {
+        if (document.activeElement === lastElement) {
+          e.preventDefault();
+          firstElement.focus();
+        }
+      }
+    };
+    container.addEventListener("keydown", handleTabKey);
+    return () => {
+      container.removeEventListener("keydown", handleTabKey);
+      if (restoreFocusOnDeactivate) {
+        restoreFocusOnDeactivate.focus();
+      } else if (previouslyFocused instanceof HTMLElement) {
+        previouslyFocused.focus();
+      }
+    };
+  }, [containerRef, isActive, restoreFocusOnDeactivate]);
+}
+function useKeyboardShortcuts(shortcuts) {
+  useEffect(() => {
+    const handleKeyDown = (e) => {
+      const target = e.target;
+      if (target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement || target.isContentEditable) {
+        const allowInInput = shortcuts.find(
+          (s) => s.key.toLowerCase() === e.key.toLowerCase() && s.key.toLowerCase() === "escape"
+        );
+        if (!allowInInput) {
+          return;
+        }
+      }
+      const matchingShortcut = shortcuts.find((s) => {
+        const keyMatches = e.key.toLowerCase() === s.key.toLowerCase();
+        const modMatches = s.meta ? e.metaKey && !e.ctrlKey : s.ctrl ? e.ctrlKey || e.metaKey : !e.ctrlKey && !e.metaKey;
+        const shiftMatches = s.shift ? e.shiftKey : !e.shiftKey;
+        const altMatches = s.alt ? e.altKey : !e.altKey;
+        return keyMatches && modMatches && shiftMatches && altMatches;
+      });
+      if (matchingShortcut) {
+        if (matchingShortcut.preventDefault !== false) {
+          e.preventDefault();
+        }
+        matchingShortcut.callback();
+      }
+    };
+    document.addEventListener("keydown", handleKeyDown);
+    return () => document.removeEventListener("keydown", handleKeyDown);
+  }, [shortcuts]);
+}
+
+// ui/src/bichat/components/BiChatLayout.tsx
+init_useTranslation();
+function BiChatLayout({
+  renderSidebar,
+  children,
+  onNewChat,
+  routeKey,
+  className = ""
+}) {
+  const { t } = useTranslation();
+  const { isMobile, isMobileOpen, openMobile, closeMobile } = useSidebarState();
+  const drawerRef = useRef(null);
+  const menuButtonRef = useRef(null);
+  useFocusTrap(drawerRef, isMobile && isMobileOpen, menuButtonRef.current);
+  const shortcuts = useMemo(() => {
+    if (!onNewChat) return [];
+    return [{ key: "n", ctrl: true, callback: onNewChat, description: "New chat" }];
+  }, [onNewChat]);
+  useKeyboardShortcuts(shortcuts);
+  useEffect(() => {
+    if (!isMobile || !isMobileOpen) return;
+    const onKeyDown = (e) => {
+      if (e.key === "Escape") {
+        e.preventDefault();
+        closeMobile();
+      }
+    };
+    document.addEventListener("keydown", onKeyDown);
+    return () => document.removeEventListener("keydown", onKeyDown);
+  }, [closeMobile, isMobile, isMobileOpen]);
+  const handleDrawerDragEnd = (_, info) => {
+    if (info.offset.x < -80) {
+      closeMobile();
+    }
+  };
+  const content = routeKey ? /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", initial: false, children: /* @__PURE__ */ jsx(
+    motion.div,
+    {
+      className: "flex flex-1 min-h-0",
+      initial: { opacity: 0, y: 4 },
+      animate: { opacity: 1, y: 0 },
+      exit: { opacity: 0, y: -4 },
+      transition: { duration: 0.15, ease: "easeOut" },
+      children
+    },
+    routeKey
+  ) }) : /* @__PURE__ */ jsx("div", { className: "flex flex-1 min-h-0", children });
+  return /* @__PURE__ */ jsxs("div", { className: `relative flex flex-1 w-full h-full min-h-0 overflow-hidden ${className}`, children: [
+    /* @__PURE__ */ jsx(SkipLink, {}),
+    /* @__PURE__ */ jsx("div", { className: "hidden md:block", children: renderSidebar({}) }),
+    /* @__PURE__ */ jsx(AnimatePresence, { children: isMobile && isMobileOpen && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        motion.div,
+        {
+          className: "fixed inset-0 z-40 bg-black/40",
+          initial: { opacity: 0 },
+          animate: { opacity: 1 },
+          exit: { opacity: 0 },
+          onClick: closeMobile,
+          "aria-hidden": "true"
+        },
+        "sidebar-backdrop"
+      ),
+      /* @__PURE__ */ jsx(
+        motion.div,
+        {
+          className: "fixed inset-y-0 left-0 z-50 w-[18rem] max-w-[85vw] shadow-2xl",
+          initial: { x: "-100%" },
+          animate: { x: 0 },
+          exit: { x: "-100%" },
+          transition: { type: "spring", stiffness: 320, damping: 32 },
+          drag: "x",
+          dragDirectionLock: true,
+          dragConstraints: { left: -120, right: 0 },
+          dragElastic: { left: 0.2, right: 0 },
+          onDragEnd: handleDrawerDragEnd,
+          onClick: (e) => e.stopPropagation(),
+          children: /* @__PURE__ */ jsx("div", { ref: drawerRef, className: "h-full bg-white dark:bg-gray-900", children: renderSidebar({ onClose: closeMobile }) })
+        },
+        "sidebar-drawer"
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxs("main", { id: "main-content", className: "relative flex-1 flex flex-col min-h-0 overflow-hidden", children: [
+      isMobile && !isMobileOpen && /* @__PURE__ */ jsx(
+        "button",
+        {
+          ref: menuButtonRef,
+          onClick: openMobile,
+          className: "md:hidden absolute top-3 left-3 z-30 w-10 h-10 rounded-xl bg-white/90 dark:bg-gray-900/90 text-gray-700 dark:text-gray-200 border border-gray-200/60 dark:border-gray-800/80 shadow-sm flex items-center justify-center hover:bg-white dark:hover:bg-gray-900 transition-colors cursor-pointer focus-visible:ring-2 focus-visible:ring-primary-400/50",
+          "aria-label": t("BiChat.Layout.OpenSidebar"),
+          title: t("BiChat.Layout.OpenSidebar"),
+          children: /* @__PURE__ */ jsx(List, { size: 20, weight: "bold" })
+        }
+      ),
+      content
+    ] })
+  ] });
+}
 init_useTranslation();
 var variantStyles = {
   error: {
@@ -8968,20 +9539,6 @@ function ScreenReaderAnnouncer({
   );
 }
 
-// ui/src/bichat/components/SkipLink.tsx
-init_useTranslation();
-function SkipLink() {
-  const { t } = useTranslation();
-  return /* @__PURE__ */ jsx(
-    "a",
-    {
-      href: "#main-content",
-      className: "sr-only focus-visible:not-sr-only focus-visible:absolute focus-visible:top-4 focus-visible:left-4 focus-visible:z-50 focus-visible:bg-primary-600 focus-visible:text-white focus-visible:px-4 focus-visible:py-2 focus-visible:rounded-lg focus-visible:shadow-lg",
-      children: t("BiChat.SkipLink.Label")
-    }
-  );
-}
-
 // ui/src/bichat/components/QuestionForm.tsx
 init_useTranslation();
 
@@ -9680,55 +10237,6 @@ function useModalLock(isOpen) {
     };
   }, [isOpen]);
 }
-function useFocusTrap(containerRef, isActive, restoreFocusOnDeactivate) {
-  useEffect(() => {
-    if (!isActive || !containerRef.current) return;
-    const container = containerRef.current;
-    const previouslyFocused = document.activeElement;
-    const getFocusableElements = () => {
-      const selector = [
-        "button:not([disabled])",
-        "[href]",
-        "input:not([disabled])",
-        "select:not([disabled])",
-        "textarea:not([disabled])",
-        '[tabindex]:not([tabindex="-1"])'
-      ].join(", ");
-      return Array.from(container.querySelectorAll(selector));
-    };
-    const focusableElements = getFocusableElements();
-    if (focusableElements.length > 0) {
-      focusableElements[0].focus();
-    }
-    const handleTabKey = (e) => {
-      if (e.key !== "Tab") return;
-      const focusableElements2 = getFocusableElements();
-      if (focusableElements2.length === 0) return;
-      const firstElement = focusableElements2[0];
-      const lastElement = focusableElements2[focusableElements2.length - 1];
-      if (e.shiftKey) {
-        if (document.activeElement === firstElement) {
-          e.preventDefault();
-          lastElement.focus();
-        }
-      } else {
-        if (document.activeElement === lastElement) {
-          e.preventDefault();
-          firstElement.focus();
-        }
-      }
-    };
-    container.addEventListener("keydown", handleTabKey);
-    return () => {
-      container.removeEventListener("keydown", handleTabKey);
-      if (restoreFocusOnDeactivate) {
-        restoreFocusOnDeactivate.focus();
-      } else if (previouslyFocused instanceof HTMLElement) {
-        previouslyFocused.focus();
-      }
-    };
-  }, [containerRef, isActive, restoreFocusOnDeactivate]);
-}
 function useImageGallery(options = {}) {
   const { images: initialImages = [], wrap = false, onOpen, onClose, onNavigate } = options;
   const [isOpen, setIsOpen] = useState(false);
@@ -10264,36 +10772,6 @@ function useScrollToBottom(items) {
     scrollToBottom
   };
 }
-function useKeyboardShortcuts(shortcuts) {
-  useEffect(() => {
-    const handleKeyDown = (e) => {
-      const target = e.target;
-      if (target instanceof HTMLInputElement || target instanceof HTMLTextAreaElement || target.isContentEditable) {
-        const allowInInput = shortcuts.find(
-          (s) => s.key.toLowerCase() === e.key.toLowerCase() && s.key.toLowerCase() === "escape"
-        );
-        if (!allowInInput) {
-          return;
-        }
-      }
-      const matchingShortcut = shortcuts.find((s) => {
-        const keyMatches = e.key.toLowerCase() === s.key.toLowerCase();
-        const modMatches = s.meta ? e.metaKey && !e.ctrlKey : s.ctrl ? e.ctrlKey || e.metaKey : !e.ctrlKey && !e.metaKey;
-        const shiftMatches = s.shift ? e.shiftKey : !e.shiftKey;
-        const altMatches = s.alt ? e.altKey : !e.altKey;
-        return keyMatches && modMatches && shiftMatches && altMatches;
-      });
-      if (matchingShortcut) {
-        if (matchingShortcut.preventDefault !== false) {
-          e.preventDefault();
-        }
-        matchingShortcut.callback();
-      }
-    };
-    document.addEventListener("keydown", handleKeyDown);
-    return () => document.removeEventListener("keydown", handleKeyDown);
-  }, [shortcuts]);
-}
 
 // ui/src/bichat/index.ts
 init_IotaContext();
@@ -11203,6 +11681,6 @@ function createHttpDataSource(config) {
   return new HttpDataSource(config);
 }
 
-export { ATTACHMENT_ACCEPT_ATTRIBUTE, ActionButton, Alert_default as Alert, AllChatsList, ArchiveBanner_default as ArchiveBanner, ArchivedChatList, AssistantMessage, AssistantTurnView, MemoizedAttachmentGrid as AttachmentGrid, AttachmentPreview_default as AttachmentPreview, AttachmentUpload_default as AttachmentUpload, Avatar, Bubble, CHART_VISUAL, ChartCard, ChatHeader, ChatSession, ChatSessionProvider, MemoizedCodeBlock as CodeBlock, CodeOutputsPanel, CompactionDoodle, ConfigProvider, ConfirmModal, ConfirmationStep, DateGroupHeader, DebugPanel, DefaultErrorContent, DownloadCard, MemoizedEditableText as EditableText, MemoizedEmptyState as EmptyState, ErrorBoundary, HttpDataSource, ImageModal, InlineQuestionForm, IotaContextProvider, ListItemSkeleton, MemoizedLoadingSpinner as LoadingSpinner, MemoizedMarkdownRenderer as MarkdownRenderer, MessageActions, MessageInput, MessageList, MessageRole, PermissionGuard, QuestionForm, QuestionStep, RateLimiter, RetryActionArea, ScreenReaderAnnouncer, ScrollToBottomButton, MemoizedSearchInput as SearchInput, SessionArtifactList, SessionArtifactPreview, SessionArtifactsPanel, SessionItem_default as SessionItem, SessionSkeleton, Sidebar2 as Sidebar, MemoizedSkeleton as Skeleton, SkeletonAvatar, SkeletonCard, SkeletonGroup, SkeletonText, SkipLink, Slot, SourcesPanel, StreamError, StreamingCursor, SystemMessage, MemoizedTabBar as TabBar, TableExportButton, TableWithExport, ThemeProvider, Toast, ToastContainer, TouchContextMenu, Turn, TurnBubble, MemoizedTypingIndicator as TypingIndicator, MemoizedUserAvatar as UserAvatar, MemoizedUserFilter as UserFilter, UserMessage, UserTurnView, WelcomeContent, addCSRFHeader, backdropVariants, buttonVariants, convertToBase64, createDataUrl, createHeadersWithCSRF, createHttpDataSource, darkTheme, dropdownVariants, errorMessageVariants, fadeInUpVariants, fadeInVariants, floatingButtonVariants, formatFileSize, getCSRFToken, getFileVisual, getValidChildren, groupSessionsByDate, hasPermission, isImageMimeType, lightTheme, listItemVariants, messageContainerVariants, messageVariants, scaleFadeVariants, sessionItemVariants, staggerContainerVariants, toastVariants, typingDotVariants, useActionButtonContext, useAttachments, useAutoScroll, useAvatarContext, useBubbleContext, useChatInput, useChatMessaging, useChatSession, useConfig, useFocusTrap, useImageGallery, useIotaContext, useKeyboardShortcuts, useLongPress, useMarkdownCopy, useMessageActions, useModalLock, useOptionalChatMessaging, useRequiredConfig, useScrollToBottom, useStreaming, useTheme, useToast, useTranslation, useTurnContext, validateAttachmentFile, validateFileCount, validateImageFile, verbTransitionVariants };
+export { ATTACHMENT_ACCEPT_ATTRIBUTE, ActionButton, Alert_default as Alert, AllChatsList, ArchiveBanner_default as ArchiveBanner, ArchivedChatList, AssistantMessage, AssistantTurnView, MemoizedAttachmentGrid as AttachmentGrid, AttachmentPreview_default as AttachmentPreview, AttachmentUpload_default as AttachmentUpload, Avatar, BiChatLayout, Bubble, CHART_VISUAL, ChartCard, ChatHeader, ChatSession, ChatSessionProvider, MemoizedCodeBlock as CodeBlock, CodeOutputsPanel, CompactionDoodle, ConfigProvider, ConfirmModal, ConfirmationStep, DateGroupHeader, DebugPanel, DefaultErrorContent, DownloadCard, MemoizedEditableText as EditableText, MemoizedEmptyState as EmptyState, ErrorBoundary, HttpDataSource, ImageModal, InlineQuestionForm, IotaContextProvider, ListItemSkeleton, MemoizedLoadingSpinner as LoadingSpinner, MemoizedMarkdownRenderer as MarkdownRenderer, MessageActions, MessageInput, MessageList, MessageRole, PermissionGuard, QuestionForm, QuestionStep, RateLimiter, RetryActionArea, ScreenReaderAnnouncer, ScrollToBottomButton, MemoizedSearchInput as SearchInput, SessionArtifactList, SessionArtifactPreview, SessionArtifactsPanel, SessionItem_default as SessionItem, SessionSkeleton, Sidebar2 as Sidebar, MemoizedSkeleton as Skeleton, SkeletonAvatar, SkeletonCard, SkeletonGroup, SkeletonText, SkipLink, Slot, SourcesPanel, StreamError, StreamingCursor, SystemMessage, MemoizedTabBar as TabBar, TableExportButton, TableWithExport, ThemeProvider, Toast, ToastContainer, TouchContextMenu, Turn, TurnBubble, MemoizedTypingIndicator as TypingIndicator, MemoizedUserAvatar as UserAvatar, MemoizedUserFilter as UserFilter, UserMessage, UserTurnView, WelcomeContent, addCSRFHeader, backdropVariants, buttonVariants, convertToBase64, createDataUrl, createHeadersWithCSRF, createHttpDataSource, darkTheme, dropdownVariants, errorMessageVariants, fadeInUpVariants, fadeInVariants, floatingButtonVariants, formatFileSize, getCSRFToken, getFileVisual, getValidChildren, groupSessionsByDate, hasPermission, isImageMimeType, isPermissionDeniedError, lightTheme, listItemVariants, messageContainerVariants, messageVariants, scaleFadeVariants, sessionItemVariants, staggerContainerVariants, toErrorDisplay, toastVariants, typingDotVariants, useActionButtonContext, useAttachments, useAutoScroll, useAvatarContext, useBubbleContext, useChatInput, useChatMessaging, useChatSession, useConfig, useFocusTrap, useImageGallery, useIotaContext, useKeyboardShortcuts, useLongPress, useMarkdownCopy, useMessageActions, useModalLock, useOptionalChatMessaging, useRequiredConfig, useScrollToBottom, useSidebarState, useStreaming, useTheme, useToast, useTranslation, useTurnContext, validateAttachmentFile, validateFileCount, validateImageFile, verbTransitionVariants };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map