@pactor-app/ui 1.22.0 → 1.24.0

package/dist/index.cjs

@@ -13279,6 +13279,10 @@ function ChatPage({
   conversationTitle,
   conversationHeaderAction,
   onConversationHeaderAction,
+  conversationRailItems = [],
+  hideArtifactRailItem = false,
+  activeConversationRailKey,
+  onConversationRailChange,
   messages = [],
   sending,
   composerPlaceholder,
@@ -13319,6 +13323,51 @@ function ChatPage({
     if (!controlled) setInnerOpen(next);
     onArtifactOpenChange?.(next);
   };
+  const railControlled = activeConversationRailKey !== void 0;
+  const [activeRailInner, setActiveRailInner] = (0, import_react67.useState)(null);
+  const activeRailKey = railControlled ? activeConversationRailKey : activeRailInner;
+  const setActiveRailKey = (next) => {
+    if (!railControlled) setActiveRailInner(next);
+    onConversationRailChange?.(next);
+  };
+  const visibleRailItems = conversationRailItems.filter((item) => item.hidden !== true);
+  const activeRailItem = visibleRailItems.find(
+    (item) => item.key === activeRailKey
+  );
+  const activePanelItem = activeRailItem?.display === "panel" && activeRailItem.content !== void 0 ? activeRailItem : void 0;
+  const activePopoverItem = activeRailItem !== void 0 && activeRailItem.display !== "panel" && activeRailItem.content !== void 0 ? activeRailItem : void 0;
+  const toggleRailItem = (item) => {
+    const next = activeRailKey === item.key ? null : item.key;
+    if (next !== null && item.display === "panel") {
+      setOpen(false);
+    }
+    setActiveRailKey(next);
+  };
+  const toggleArtifact = () => {
+    if (!open && activePanelItem) {
+      setActiveRailKey(null);
+    }
+    setOpen(!open);
+  };
+  (0, import_react67.useEffect)(() => {
+    if (!activePopoverItem) return;
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") setActiveRailKey(null);
+    };
+    const onPointerDown = (event) => {
+      const target = event.target;
+      if (target.closest("[data-slot=chat-page-rail-popover]") || target.closest("[data-slot=chat-page-conv-rail]")) {
+        return;
+      }
+      setActiveRailKey(null);
+    };
+    document.addEventListener("keydown", onKeyDown);
+    document.addEventListener("mousedown", onPointerDown);
+    return () => {
+      document.removeEventListener("keydown", onKeyDown);
+      document.removeEventListener("mousedown", onPointerDown);
+    };
+  });
   const { renderChildren } = (0, import_runtime26.useRenderer)();
   const renderSlot = (slot) => (0, import_react67.isValidElement)(slot) || typeof slot !== "object" || slot === null ? slot : renderChildren([slot]);
   const convCollControlled = conversationSectionCollapsed !== void 0;
@@ -13350,10 +13399,58 @@ function ChatPage({
       onClick: () => onMenuSelect?.(item.key)
     }
   ) }, item.key);
+  const convRailButton = (item, active, onClick) => {
+    const button = /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+      Button2,
+      {
+        icon: item.icon,
+        variant: "text",
+        className: cn(active ? "bg-accent text-accent-foreground" : void 0, "px-2"),
+        onClick
+      }
+    );
+    return item.label !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(Tooltip2, { content: item.label, side: "left", children: button }, item.key) : /* @__PURE__ */ (0, import_jsx_runtime185.jsx)("span", { children: button }, item.key);
+  };
+  const convRailVisible = !hideArtifactRailItem || visibleRailItems.length > 0;
+  const convRail = convRailVisible ? /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)(
+    "div",
+    {
+      "data-slot": "chat-page-conv-rail",
+      className: "relative flex w-(--pactor-chat-rail-width) shrink-0 flex-col items-center gap-1 px-1 py-2",
+      children: [
+        !hideArtifactRailItem ? convRailButton(
+          {
+            key: "artifact",
+            icon: open ? "panel-right-close" : "package",
+            label: open ? "\u6536\u8D77\u4EA7\u7269\u533A" : artifactTitle
+          },
+          open,
+          toggleArtifact
+        ) : null,
+        visibleRailItems.map(
+          (item) => convRailButton(item, activeRailKey === item.key, () => toggleRailItem(item))
+        ),
+        activePopoverItem ? /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+          "div",
+          {
+            "data-slot": "chat-page-rail-popover",
+            className: "absolute right-full top-0 z-10 mr-2 overflow-auto rounded-lg border border-border bg-popover shadow-md",
+            style: {
+              width: "var(--pactor-chat-rail-popover-width)",
+              maxWidth: "calc(100cqw - 2rem)",
+              maxHeight: "calc(100% - 1rem)"
+            },
+            children: renderSlot(activePopoverItem.content)
+          }
+        ) : null
+      ]
+    }
+  ) : null;
   const chatArea = /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)("div", { "data-slot": "chat-page-conversation", className: "flex h-full min-w-0 flex-1 flex-col", children: [
     /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)(
       "div",
       {
+        "data-slot": "chat-page-conversation-header",
         className: "flex shrink-0 items-center justify-between border-b border-border px-4 py-2.5",
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(Text, { text: conversationTitle, strong: true }),
@@ -13365,66 +13462,62 @@ function ChatPage({
               variant: "text",
               onClick: () => onConversationHeaderAction?.()
             }
-          ) }) : /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(Tooltip2, { content: open ? "\u6536\u8D77\u4EA7\u7269\u533A" : artifactTitle, side: "bottom", children: /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
-            Button2,
-            {
-              icon: open ? "panel-right-close" : "panel-right-open",
-              variant: "text",
-              onClick: () => setOpen(!open)
-            }
-          ) })
+          ) }) : null
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)(
-      "div",
-      {
-        "data-slot": "chat-page-conversation-body",
-        className: "mx-auto flex min-h-0 w-[61.8cqw] max-w-full flex-1 flex-col",
-        children: [
-          messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
-            Welcome,
-            {
-              title: welcome?.title,
-              description: welcome?.description,
-              prompts: welcome?.prompts,
-              style: { flex: 1 },
-              onSelect: (value) => onSend?.(value)
-            }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
-            MessageList,
-            {
-              messages,
-              className: "scrollbar-subtle",
-              style: { flex: 1, minHeight: 0, padding: 16 },
-              onAction: onMessageAction,
-              onOpenArtifacts: () => setOpen(true)
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
-            Composer,
-            {
-              placeholder: composerPlaceholder,
-              loading: sending,
-              models,
-              model,
-              contexts,
-              contextItems,
-              attachments,
-              footer: composerFooter,
-              style: { padding: 16, paddingBottom: composerBottom ? 8 : 16, flexShrink: 0 },
-              onModelChange,
-              onContextItemsChange,
-              onAttachFiles,
-              onRemoveAttachment,
-              onRetryAttachment,
-              onSubmit: (text) => onSend?.(text)
-            }
-          ),
-          composerBottom ? /* @__PURE__ */ (0, import_jsx_runtime185.jsx)("div", { "data-slot": "chat-page-composer-bottom", className: "shrink-0 px-4 pb-2 text-center", children: renderSlot(composerBottom) }) : null
-        ]
-      }
-    )
+    /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)("div", { className: "flex min-h-0 flex-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)(
+        "div",
+        {
+          "data-slot": "chat-page-conversation-body",
+          className: "mx-auto flex min-h-0 w-[61.8cqw] max-w-full flex-col",
+          children: [
+            messages.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+              Welcome,
+              {
+                title: welcome?.title,
+                description: welcome?.description,
+                prompts: welcome?.prompts,
+                style: { flex: 1 },
+                onSelect: (value) => onSend?.(value)
+              }
+            ) : /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+              MessageList,
+              {
+                messages,
+                className: "scrollbar-subtle",
+                style: { flex: 1, minHeight: 0, padding: 16 },
+                onAction: onMessageAction,
+                onOpenArtifacts: () => setOpen(true)
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+              Composer,
+              {
+                placeholder: composerPlaceholder,
+                loading: sending,
+                models,
+                model,
+                contexts,
+                contextItems,
+                attachments,
+                footer: composerFooter,
+                style: { padding: 16, paddingBottom: composerBottom ? 8 : 16, flexShrink: 0 },
+                onModelChange,
+                onContextItemsChange,
+                onAttachFiles,
+                onRemoveAttachment,
+                onRetryAttachment,
+                onSubmit: (text) => onSend?.(text)
+              }
+            ),
+            composerBottom ? /* @__PURE__ */ (0, import_jsx_runtime185.jsx)("div", { "data-slot": "chat-page-composer-bottom", className: "shrink-0 px-4 pb-2 text-center", children: renderSlot(composerBottom) }) : null
+          ]
+        }
+      ),
+      convRail
+    ] })
   ] });
   const activeArtifact = artifacts.find((item) => item.id === activeArtifactId) ?? (activeArtifactId === void 0 || activeArtifactId === "" ? artifacts[artifacts.length - 1] : void 0);
   const artifactPanel = /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
@@ -13556,10 +13649,17 @@ function ChatPage({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime185.jsx)("div", { className: "@container h-full min-w-0 flex-1", children: open ? /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)(PanelGroup, { orientation: "horizontal", style: { width: "100%", height: "100%" }, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime185.jsx)("div", { className: "@container h-full min-w-0 flex-1", children: open || activePanelItem ? /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)(PanelGroup, { orientation: "horizontal", style: { width: "100%", height: "100%" }, children: [
           /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(Panel, { defaultSize: "62%", children: chatArea }),
           /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(ResizableHandle, { withHandle: true }),
-          /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(Panel, { defaultSize: "38%", minSize: "380px", maxSize: "760px", children: artifactPanel })
+          /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(Panel, { defaultSize: "38%", minSize: "380px", maxSize: "760px", children: activePanelItem ? /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+            "div",
+            {
+              "data-slot": "chat-page-rail-panel",
+              className: "flex h-full min-w-0 flex-col border-l border-border bg-muted",
+              children: renderSlot(activePanelItem.content)
+            }
+          ) : artifactPanel })
         ] }) : chatArea })
       ]
     }
@@ -13699,10 +13799,10 @@ function EChartBase({
         dataIndex: params.dataIndex
       });
     });
-    const observer = new ResizeObserver(() => chart?.resize());
-    observer.observe(host);
+    const observer2 = new ResizeObserver(() => chart?.resize());
+    observer2.observe(host);
     return () => {
-      observer.disconnect();
+      observer2.disconnect();
       chart?.dispose();
       chartRef.current = null;
     };
@@ -14163,6 +14263,9 @@ function buildComposedOption(input, theme) {
   };
 }
 
+// src/components/chart/lib/use-chart-theme.ts
+var import_react69 = require("react");
+
 // src/components/chart/lib/color.ts
 var LPAREN = String.fromCharCode(40);
 var RPAREN = String.fromCharCode(41);
@@ -14259,6 +14362,64 @@ function getChartTheme() {
     return FALLBACK_THEME;
   }
 }
+function resetChartTheme() {
+  cached = null;
+}
+var CHART_SKIN_CHANGE_EVENT = "pactor:skin-change";
+var listeners = /* @__PURE__ */ new Set();
+var observer = null;
+var scheduled = false;
+function scheduleNotify() {
+  if (scheduled) return;
+  scheduled = true;
+  const enqueue = typeof requestAnimationFrame === "function" ? requestAnimationFrame : (cb) => setTimeout(cb, 0);
+  enqueue(() => {
+    scheduled = false;
+    resetChartTheme();
+    for (const listener of [...listeners]) {
+      listener();
+    }
+  });
+}
+function handleResourceLoad(event) {
+  const target = event.target;
+  if (target instanceof HTMLLinkElement || target instanceof HTMLStyleElement) {
+    scheduleNotify();
+  }
+}
+function subscribeChartTheme(listener) {
+  if (typeof document === "undefined" || typeof MutationObserver === "undefined") {
+    return () => {
+    };
+  }
+  listeners.add(listener);
+  if (!observer) {
+    observer = new MutationObserver(scheduleNotify);
+    observer.observe(document.documentElement, { attributes: true });
+    observer.observe(document.head, {
+      attributes: true,
+      childList: true,
+      characterData: true,
+      subtree: true
+    });
+    document.addEventListener("load", handleResourceLoad, true);
+    window.addEventListener(CHART_SKIN_CHANGE_EVENT, scheduleNotify);
+  }
+  return () => {
+    listeners.delete(listener);
+    if (listeners.size === 0 && observer) {
+      observer.disconnect();
+      observer = null;
+      document.removeEventListener("load", handleResourceLoad, true);
+      window.removeEventListener(CHART_SKIN_CHANGE_EVENT, scheduleNotify);
+    }
+  };
+}
+
+// src/components/chart/lib/use-chart-theme.ts
+function useChartTheme() {
+  return (0, import_react69.useSyncExternalStore)(subscribeChartTheme, getChartTheme, getChartTheme);
+}
 
 // src/components/chart/AreaChart/index.tsx
 var import_jsx_runtime189 = require("react/jsx-runtime");
@@ -14277,7 +14438,7 @@ function AreaChart({
 }) {
   const option = buildAreaOption(
     { data, xKey, yKeys, stacked, fillOpacity, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(
     EChartBase,
@@ -14308,7 +14469,7 @@ function BarChart2({
 }) {
   const option = buildBarOption(
     { data, yKey, yKeys: xKeys, stacked, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(
     EChartBase,
@@ -14340,7 +14501,7 @@ function BubbleChart({
 }) {
   const option = buildBubbleOption(
     { data, xKey, yKey, sizeKey, seriesKey, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(
     EChartBase,
@@ -14371,7 +14532,7 @@ function ColumnChart({
 }) {
   const option = buildColumnOption(
     { data, xKey, yKeys, stacked, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
     EChartBase,
@@ -14401,7 +14562,7 @@ function ComposedChart({
 }) {
   const option = buildComposedOption(
     { data, xKey, series, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
     EChartBase,
@@ -14447,7 +14608,7 @@ function DonutChart({
       colors,
       title
     },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
     EChartBase,
@@ -14478,7 +14639,7 @@ function FunnelChart2({
 }) {
   const option = buildFunnelOption(
     { data, nameKey, valueKey, sort, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(
     EChartBase,
@@ -14509,7 +14670,7 @@ function GaugeChart2({
 }) {
   const option = buildGaugeOption(
     { value, min, max, thresholds, unit, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime196.jsx)(
     EChartBase,
@@ -14539,7 +14700,7 @@ function Heatmap({
 }) {
   const option = buildHeatmapOption(
     { data, xKey, yKey, valueKey, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime197.jsx)(
     EChartBase,
@@ -14572,7 +14733,7 @@ function LineChart2({
 }) {
   const option = buildLineOption(
     { data, xKey, yKeys, smooth, showArea, stacked, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime198.jsx)(
     EChartBase,
@@ -14588,7 +14749,7 @@ function LineChart2({
 }
 
 // src/components/chart/MapChart/index.tsx
-var import_react69 = require("react");
+var import_react70 = require("react");
 var import_jsx_runtime199 = require("react/jsx-runtime");
 var fetchedMaps = /* @__PURE__ */ new Set();
 function hasRegisteredMap(mapName) {
@@ -14611,7 +14772,8 @@ function MapChart2({
   className,
   style
 }) {
-  const [loadState, setLoadState] = (0, import_react69.useState)(
+  const theme = useChartTheme();
+  const [loadState, setLoadState] = (0, import_react70.useState)(
     () => geoJson || !geoJsonUrl || hasRegisteredMap(mapName) ? "idle" : "loading"
   );
   if (geoJson) {
@@ -14620,7 +14782,7 @@ function MapChart2({
     } catch {
     }
   }
-  (0, import_react69.useEffect)(() => {
+  (0, import_react70.useEffect)(() => {
     if (geoJson || !geoJsonUrl || hasRegisteredMap(mapName) || fetchedMaps.has(mapName)) {
       setLoadState("idle");
       return;
@@ -14677,7 +14839,7 @@ function MapChart2({
       }
     );
   }
-  const option = buildMapOption({ mapName, data, nameKey, valueKey, title }, getChartTheme());
+  const option = buildMapOption({ mapName, data, nameKey, valueKey, title }, theme);
   return /* @__PURE__ */ (0, import_jsx_runtime199.jsx)(
     EChartBase,
     {
@@ -14764,7 +14926,7 @@ function PieChart2({
 }) {
   const option = buildPieOption(
     { data, nameKey, valueKey, showLabel, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime201.jsx)(
     EChartBase,
@@ -14794,7 +14956,7 @@ function RadarChart2({
 }) {
   const option = buildRadarOption(
     { data, indicatorKey, yKeys, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime202.jsx)(
     EChartBase,
@@ -14820,7 +14982,7 @@ function SankeyChart2({
   className,
   style
 }) {
-  const option = buildSankeyOption({ nodes, links, title }, getChartTheme());
+  const option = buildSankeyOption({ nodes, links, title }, useChartTheme());
   return /* @__PURE__ */ (0, import_jsx_runtime203.jsx)(
     EChartBase,
     {
@@ -14850,7 +15012,7 @@ function ScatterChart2({
 }) {
   const option = buildScatterOption(
     { data, xKey, yKey, seriesKey, colors, title },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime204.jsx)(
     EChartBase,
@@ -14880,7 +15042,7 @@ function TreeChart2({
 }) {
   const option = buildTreeOption(
     { data, title, orient, edgeShape, initialTreeDepth },
-    getChartTheme()
+    useChartTheme()
   );
   return /* @__PURE__ */ (0, import_jsx_runtime205.jsx)(
     EChartBase,
@@ -15117,10 +15279,10 @@ function collectDefaultOpenKeys(registry, activeMenuId) {
 var import_permission = require("@pactor-app/permission");
 var import_router = require("@pactor-app/router");
 var import_runtime27 = require("@pactor-app/runtime");
-var import_react71 = require("react");
+var import_react72 = require("react");
 
 // src/layout/admin/use-media-query.ts
-var import_react70 = require("react");
+var import_react71 = require("react");
 var BREAKPOINT_PX = {
   xs: 480,
   sm: 576,
@@ -15130,10 +15292,10 @@ var BREAKPOINT_PX = {
   xxl: 1600
 };
 function useMediaQuery(query) {
-  const [matches, setMatches] = (0, import_react70.useState)(
+  const [matches, setMatches] = (0, import_react71.useState)(
     () => typeof window !== "undefined" && typeof window.matchMedia === "function" ? window.matchMedia(query).matches : false
   );
-  (0, import_react70.useEffect)(() => {
+  (0, import_react71.useEffect)(() => {
     if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
       return;
     }
@@ -15176,8 +15338,8 @@ function CollapsedGroupFlyout({
   activeMenuId,
   defaultOpenKeys
 }) {
-  const [open, setOpen] = (0, import_react71.useState)(false);
-  const closeTimer = (0, import_react71.useRef)(void 0);
+  const [open, setOpen] = (0, import_react72.useState)(false);
+  const closeTimer = (0, import_react72.useRef)(void 0);
   const openNow = () => {
     window.clearTimeout(closeTimer.current);
     setOpen(true);
@@ -15186,7 +15348,7 @@ function CollapsedGroupFlyout({
     window.clearTimeout(closeTimer.current);
     closeTimer.current = window.setTimeout(() => setOpen(false), 200);
   };
-  (0, import_react71.useEffect)(() => () => window.clearTimeout(closeTimer.current), []);
+  (0, import_react72.useEffect)(() => () => window.clearTimeout(closeTimer.current), []);
   return /* @__PURE__ */ (0, import_jsx_runtime206.jsxs)(Popover, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ (0, import_jsx_runtime206.jsx)(
       PopoverTrigger,
@@ -15370,16 +15532,16 @@ function AdminLayout({
   const showTabs = config.tabs ?? false;
   const showBreadcrumb = config.breadcrumb ?? false;
   const showFooter = config.footer ?? false;
-  const [collapsed, setCollapsed] = (0, import_react71.useState)(config.collapsed ?? false);
+  const [collapsed, setCollapsed] = (0, import_react72.useState)(config.collapsed ?? false);
   const broken = useBreakpointBelow(config.breakpoint);
   const effectiveCollapsed = collapsed || broken;
-  const [bridgeRoute, setBridgeRoute] = (0, import_react71.useState)(
+  const [bridgeRoute, setBridgeRoute] = (0, import_react72.useState)(
     () => (0, import_router.resolveRoute)(registry, bridge.getLocation())
   );
-  const [tabs, setTabs] = (0, import_react71.useState)([]);
-  const tabsRef = (0, import_react71.useRef)(tabs);
+  const [tabs, setTabs] = (0, import_react72.useState)([]);
+  const tabsRef = (0, import_react72.useRef)(tabs);
   tabsRef.current = tabs;
-  (0, import_react71.useEffect)(() => {
+  (0, import_react72.useEffect)(() => {
     const handleLocation = (location) => {
       const next = (0, import_router.resolveRoute)(registry, location);
       setBridgeRoute(next);
@@ -15400,16 +15562,16 @@ function AdminLayout({
   }, [registry, bridge]);
   const route = routeProp ?? bridgeRoute;
   const activeMenuId = route?.activeMenu;
-  const visibleMenus = (0, import_react71.useMemo)(
+  const visibleMenus = (0, import_react72.useMemo)(
     () => buildVisibleMenuTree(registry, permissionChecker),
     [registry, permissionChecker]
   );
-  const defaultOpenKeysRef = (0, import_react71.useRef)(null);
+  const defaultOpenKeysRef = (0, import_react72.useRef)(null);
   if (defaultOpenKeysRef.current === null) {
     defaultOpenKeysRef.current = collectDefaultOpenKeys(registry, activeMenuId);
   }
   const defaultOpenKeys = defaultOpenKeysRef.current;
-  const activeTopId = (0, import_react71.useMemo)(() => {
+  const activeTopId = (0, import_react72.useMemo)(() => {
     if (activeMenuId !== void 0) {
       const chain = findMenuChain(registry, activeMenuId);
       if (chain.length > 0) {
@@ -15418,11 +15580,11 @@ function AdminLayout({
     }
     return void 0;
   }, [registry, activeMenuId]);
-  const [selectedTopId, setSelectedTopId] = (0, import_react71.useState)();
+  const [selectedTopId, setSelectedTopId] = (0, import_react72.useState)();
   const secondaryTopId = selectedTopId ?? activeTopId ?? visibleMenus.find((m) => m.type === "group")?.id ?? visibleMenus[0]?.id;
   const secondaryTop = visibleMenus.find((m) => m.id === secondaryTopId);
   const hasSecondary = (secondaryTop?.children?.length ?? 0) > 0;
-  const breadcrumbItems = (0, import_react71.useMemo)(() => {
+  const breadcrumbItems = (0, import_react72.useMemo)(() => {
     if (!showBreadcrumb || activeMenuId === void 0) {
       return [];
     }
@@ -15675,7 +15837,7 @@ function BlankLayout({ children }) {
 
 // src/layout/chat/ChatLayout.tsx
 var import_permission2 = require("@pactor-app/permission");
-var import_react72 = require("react");
+var import_react73 = require("react");
 var import_jsx_runtime208 = require("react/jsx-runtime");
 function ChatLayout({
   brand,
@@ -15691,7 +15853,7 @@ function ChatLayout({
   sidebarFooter,
   children
 }) {
-  const registryMenus = (0, import_react72.useMemo)(() => {
+  const registryMenus = (0, import_react73.useMemo)(() => {
     if (menu !== void 0 || registry === void 0) {
       return [];
     }
@@ -15700,10 +15862,10 @@ function ChatLayout({
     return visible.flatMap((item) => menuItemToMenuData(item));
   }, [menu, registry, permissionChecker]);
   const menuItems = menu ?? registryMenus;
-  const [bridgePath, setBridgePath] = (0, import_react72.useState)(
+  const [bridgePath, setBridgePath] = (0, import_react73.useState)(
     () => bridge?.getLocation().pathname ?? "/"
   );
-  (0, import_react72.useEffect)(() => {
+  (0, import_react73.useEffect)(() => {
     if (bridge === void 0) {
       return;
     }
@@ -15711,7 +15873,7 @@ function ChatLayout({
       setBridgePath(location.pathname);
     });
   }, [bridge]);
-  const activeKey = (0, import_react72.useMemo)(() => {
+  const activeKey = (0, import_react73.useMemo)(() => {
     if (activeMenuKey !== void 0) {
       return activeMenuKey;
     }
@@ -16086,7 +16248,7 @@ function isRecord(value) {
 
 // src/interaction/provider.tsx
 var import_runtime29 = require("@pactor-app/runtime");
-var import_react73 = require("react");
+var import_react74 = require("react");
 var import_react_dom2 = require("react-dom");
 var import_jsx_runtime211 = require("react/jsx-runtime");
 var TOAST_DURATION = 3e3;
@@ -16100,11 +16262,11 @@ function InteractionProvider({
   bridge,
   children
 }) {
-  const [confirmState, setConfirmState] = (0, import_react73.useState)(null);
-  const [confirmOpen, setConfirmOpen] = (0, import_react73.useState)(false);
-  const [toasts, setToasts] = (0, import_react73.useState)([]);
+  const [confirmState, setConfirmState] = (0, import_react74.useState)(null);
+  const [confirmOpen, setConfirmOpen] = (0, import_react74.useState)(false);
+  const [toasts, setToasts] = (0, import_react74.useState)([]);
   const { t } = (0, import_runtime29.useI18n)();
-  const { modal, message } = (0, import_react73.useMemo)(() => {
+  const { modal, message } = (0, import_react74.useMemo)(() => {
     const pushToast = (type, content) => {
       const id = Date.now() + Math.random();
       setToasts((prev) => [...prev, { id, type, content }]);
@@ -16126,7 +16288,7 @@ function InteractionProvider({
     };
     return { modal: modalImpl, message: messageImpl };
   }, []);
-  (0, import_react73.useEffect)(() => {
+  (0, import_react74.useEffect)(() => {
     bridge.modal = modal;
     bridge.message = message;
     return () => {
@@ -16209,7 +16371,7 @@ function InteractionProvider({
 // src/interaction/host.tsx
 var import_lucide_react38 = require("lucide-react");
 var import_runtime30 = require("@pactor-app/runtime");
-var import_react74 = require("react");
+var import_react75 = require("react");
 var import_jsx_runtime212 = require("react/jsx-runtime");
 function toCssWidth(width) {
   if (width === void 0) {
@@ -16219,11 +16381,11 @@ function toCssWidth(width) {
 }
 function OverlayHost({ manager, resolvePage }) {
   const renderer = (0, import_runtime30.useRenderer)();
-  const stack = (0, import_react74.useSyncExternalStore)(
+  const stack = (0, import_react75.useSyncExternalStore)(
     (onChange) => manager.subscribe(onChange),
     () => manager.stack()
   );
-  (0, import_react74.useSyncExternalStore)(
+  (0, import_react75.useSyncExternalStore)(
     (onChange) => {
       const offState = renderer.context.state.subscribe(onChange);
       const offData = renderer.context.data.subscribe(onChange);
@@ -16370,9 +16532,9 @@ function PageOverlayBody({
   renderer,
   resolvePage
 }) {
-  const [child, setChild] = (0, import_react74.useState)(null);
-  const [error, setError] = (0, import_react74.useState)(null);
-  (0, import_react74.useEffect)(() => {
+  const [child, setChild] = (0, import_react75.useState)(null);
+  const [error, setError] = (0, import_react75.useState)(null);
+  (0, import_react75.useEffect)(() => {
     if (!resolvePage) {
       setError(
         new Error(