@pactor-app/ui 1.1.0 → 1.2.0

package/dist/layout/index.cjs

@@ -20,14 +20,15 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/layout/index.ts
 var layout_exports = {};
 __export(layout_exports, {
-  ShadcnAdminLayout: () => ShadcnAdminLayout,
-  ShadcnBlankLayout: () => ShadcnBlankLayout,
-  ShadcnLandingLayout: () => ShadcnLandingLayout,
-  ShadcnLoginLayout: () => ShadcnLoginLayout,
+  AdminLayout: () => AdminLayout,
+  BlankLayout: () => BlankLayout,
+  ChatLayout: () => ChatLayout,
+  LandingLayout: () => LandingLayout,
+  LoginLayout: () => LoginLayout,
   collectDefaultOpenKeys: () => collectDefaultOpenKeys,
-  createShadcnLayoutRegistry: () => createShadcnLayoutRegistry,
+  createLayoutRegistry: () => createLayoutRegistry,
   findMenuChain: () => findMenuChain,
-  registerShadcnLayouts: () => registerShadcnLayouts,
+  registerBuiltinLayouts: () => registerBuiltinLayouts,
   resolveLayout: () => resolveLayout
 });
 module.exports = __toCommonJS(layout_exports);
@@ -76,7 +77,7 @@ function collectDefaultOpenKeys(registry, activeMenuId) {
   return keys;
 }
 
-// src/layout/admin/ShadcnAdminLayout.tsx
+// src/layout/admin/AdminLayout.tsx
 var import_permission = require("@pactor-app/permission");
 var import_router = require("@pactor-app/router");
 var import_runtime = require("@pactor-app/runtime");
@@ -397,7 +398,7 @@ function useBreakpointBelow(breakpoint) {
   return breakpoint !== void 0 && matches;
 }
 
-// src/layout/admin/ShadcnAdminLayout.tsx
+// src/layout/admin/AdminLayout.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function buildVisibleMenuTree(registry, permissionChecker) {
   const tree = registry.tree();
@@ -598,7 +599,7 @@ function MenuTree({
     }
   );
 }
-function ShadcnAdminLayout({
+function AdminLayout({
   config = {},
   brand,
   registry,
@@ -905,9 +906,9 @@ function ShadcnAdminLayout({
   );
 }
 
-// src/layout/basic/ShadcnBlankLayout.tsx
+// src/layout/basic/BlankLayout.tsx
 var import_jsx_runtime5 = require("react/jsx-runtime");
-function ShadcnBlankLayout({ children }) {
+function BlankLayout({ children }) {
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
     "div",
     {
@@ -918,10 +919,598 @@ function ShadcnBlankLayout({ children }) {
   );
 }
 
-// src/ui/card.tsx
+// src/layout/chat/ChatLayout.tsx
+var import_permission2 = require("@pactor-app/permission");
+var import_react4 = require("react");
+
+// src/ui/tooltip.tsx
+var import_tooltip = require("@base-ui/react/tooltip");
 var import_jsx_runtime6 = require("react/jsx-runtime");
-function Card({ className, ...props }) {
+function TooltipProvider({
+  delay = 0,
+  ...props
+}) {
   return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    import_tooltip.Tooltip.Provider,
+    {
+      "data-slot": "tooltip-provider",
+      delay,
+      ...props
+    }
+  );
+}
+function Tooltip({
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_tooltip.Tooltip.Root, { "data-slot": "tooltip", ...props }) });
+}
+function TooltipTrigger({
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_tooltip.Tooltip.Trigger, { "data-slot": "tooltip-trigger", ...props });
+}
+function TooltipContent({
+  className,
+  side = "top",
+  sideOffset = 4,
+  align = "center",
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_tooltip.Tooltip.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+    import_tooltip.Tooltip.Positioner,
+    {
+      align,
+      side,
+      sideOffset,
+      className: "isolate z-50",
+      children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
+        import_tooltip.Tooltip.Popup,
+        {
+          "data-slot": "tooltip-content",
+          className: cn(
+            "z-50 w-fit origin-(--transform-origin) rounded-md bg-primary px-3 py-1.5 text-xs text-balance text-primary-foreground duration-200 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
+            className
+          ),
+          ...props,
+          children: [
+            children,
+            /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_tooltip.Tooltip.Arrow, { className: "z-50 size-2.5 rotate-45 rounded-[2px] bg-primary fill-primary data-[side=top]:-bottom-1 data-[side=bottom]:-top-1 data-[side=left]:-right-1 data-[side=right]:-left-1" })
+          ]
+        }
+      )
+    }
+  ) });
+}
+
+// src/components/components/Sidebar/rail-tooltip.tsx
+var import_jsx_runtime7 = require("react/jsx-runtime");
+function RailTooltip({
+  label,
+  children
+}) {
+  return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Tooltip, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TooltipTrigger, { render: children }),
+    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(TooltipContent, { side: "right", sideOffset: 8, children: label })
+  ] });
+}
+
+// src/components/components/Sidebar/index.tsx
+var import_runtime2 = require("@pactor-app/runtime");
+var import_lucide_react3 = require("lucide-react");
+var import_react3 = require("react");
+var import_jsx_runtime8 = require("react/jsx-runtime");
+var SidebarDrawerContext = (0, import_react3.createContext)(null);
+function useSidebarDrawer() {
+  return (0, import_react3.useContext)(SidebarDrawerContext);
+}
+var MOBILE_MEDIA_QUERY = "(max-width: 767px)";
+function useIsMobileViewport() {
+  const [isMobile, setIsMobile] = (0, import_react3.useState)(
+    () => typeof window !== "undefined" && typeof window.matchMedia === "function" && window.matchMedia(MOBILE_MEDIA_QUERY).matches
+  );
+  (0, import_react3.useEffect)(() => {
+    if (typeof window.matchMedia !== "function") {
+      return;
+    }
+    const media = window.matchMedia(MOBILE_MEDIA_QUERY);
+    const onChange = (event) => {
+      setIsMobile(event.matches);
+    };
+    setIsMobile(media.matches);
+    media.addEventListener("change", onChange);
+    return () => media.removeEventListener("change", onChange);
+  }, []);
+  return isMobile;
+}
+function useOptionalRenderer() {
+  try {
+    return (0, import_runtime2.useRenderer)();
+  } catch {
+    return null;
+  }
+}
+function SidebarContent({ content }) {
+  const renderer = useOptionalRenderer();
+  if (renderer !== null && typeof content === "object" && content !== null && !("$$typeof" in content) && "type" in content) {
+    return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { children: renderer.renderChildren([content]) });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_jsx_runtime8.Fragment, { children: content });
+}
+function isBrandObject(brand) {
+  return typeof brand === "object" && brand !== null && !("$$typeof" in brand) && "title" in brand;
+}
+function Sidebar({
+  brand,
+  items = [],
+  content,
+  sidebarFooter,
+  collapsible,
+  onCollapse,
+  locationKey,
+  drawer = true,
+  className,
+  style,
+  children
+}) {
+  const { t } = (0, import_runtime2.useI18n)();
+  const isMobile = useIsMobileViewport();
+  const [drawerOpen, setDrawerOpen] = (0, import_react3.useState)(false);
+  const [collapsed, setCollapsed] = (0, import_react3.useState)(false);
+  const collapsedEffective = collapsible === true && collapsed && !isMobile;
+  const close = (0, import_react3.useCallback)(() => setDrawerOpen(false), []);
+  const toggleCollapsed = () => {
+    const next = !collapsed;
+    setCollapsed(next);
+    onCollapse?.(next);
+  };
+  const [trackedLocationKey, setTrackedLocationKey] = (0, import_react3.useState)(locationKey);
+  if (trackedLocationKey !== locationKey) {
+    setTrackedLocationKey(locationKey);
+    setDrawerOpen(false);
+  }
+  (0, import_react3.useEffect)(() => {
+    if (!drawerOpen) {
+      return;
+    }
+    const onKeyDown = (event) => {
+      if (event.key === "Escape") {
+        setDrawerOpen(false);
+      }
+    };
+    window.addEventListener("keydown", onKeyDown);
+    return () => window.removeEventListener("keydown", onKeyDown);
+  }, [drawerOpen]);
+  const brandNode = isBrandObject(brand) ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
+    brand.logo ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      "img",
+      {
+        "data-slot": "sidebar-brand-logo",
+        src: brand.logo,
+        alt: brand.title,
+        className: "size-6 shrink-0"
+      }
+    ) : null,
+    collapsedEffective ? null : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { className: "truncate text-sm font-semibold", children: brand.title })
+  ] }) : brand;
+  const collapseTrigger = collapsible && !isMobile ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    "button",
+    {
+      type: "button",
+      "data-slot": "sidebar-collapse-trigger",
+      "aria-label": collapsedEffective ? t("pactor.layout.expandSidebar") : t("pactor.layout.collapseSidebar"),
+      "aria-expanded": !collapsedEffective,
+      title: collapsedEffective ? t("pactor.layout.expandSidebar") : t("pactor.layout.collapseSidebar"),
+      className: cn(
+        "cursor-pointer flex size-8 shrink-0 items-center justify-center rounded-md text-sidebar-foreground/60 transition-colors hover:bg-sidebar-accent hover:text-sidebar-foreground"
+      ),
+      onClick: toggleCollapsed,
+      children: collapsedEffective ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react3.ChevronRight, { "aria-hidden": true, className: "size-4" }) : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react3.ChevronLeft, { "aria-hidden": true, className: "size-4" })
+    }
+  ) : null;
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+    SidebarDrawerContext.Provider,
+    {
+      value: { close, collapsed: collapsedEffective },
+      children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+        "div",
+        {
+          "data-slot": "sidebar-layout",
+          className: cn("flex min-h-screen w-full", className),
+          style,
+          children: [
+            drawer && drawerOpen ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+              "div",
+              {
+                "data-slot": "sidebar-scrim",
+                "aria-hidden": true,
+                className: "fixed inset-0 z-40 bg-black/40 md:hidden",
+                onClick: close
+              }
+            ) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+              "aside",
+              {
+                "data-slot": "sidebar",
+                "data-collapsed": collapsedEffective || void 0,
+                "data-open": drawerOpen ? "true" : "false",
+                inert: drawer && isMobile && !drawerOpen ? true : void 0,
+                className: cn(
+                  "flex shrink-0 flex-col border-r border-sidebar-border bg-sidebar text-sidebar-foreground transition-[width,transform]",
+                  collapsedEffective ? "w-16" : "w-60",
+                  // 移动端覆盖抽屉：退出文档流，关闭时移出屏幕
+                  drawer && "max-md:fixed max-md:inset-y-0 max-md:left-0 max-md:z-50 max-md:w-60 max-md:-translate-x-full max-md:data-[open=true]:translate-x-0"
+                ),
+                children: [
+                  brand !== void 0 || collapseTrigger !== null ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                    "div",
+                    {
+                      "data-slot": "sidebar-brand",
+                      className: cn(
+                        "flex h-14 shrink-0 items-center gap-2 border-b border-sidebar-border px-4",
+                        // 移动端品牌维持顶栏现状：抽屉内不重复渲染品牌行
+                        "max-md:hidden",
+                        collapsedEffective && "justify-center px-2"
+                      ),
+                      children: [
+                        collapsedEffective ? null : /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "flex min-w-0 flex-1 items-center gap-2", children: brandNode }),
+                        collapseTrigger
+                      ]
+                    }
+                  ) : null,
+                  /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                    "nav",
+                    {
+                      "data-slot": "sidebar-nav",
+                      className: "min-h-0 flex-1 overflow-auto p-2",
+                      children: content !== void 0 && content !== null ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(SidebarContent, { content }) : items.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                        SidebarEntry,
+                        {
+                          item,
+                          depth: 0,
+                          collapsed: collapsedEffective
+                        },
+                        item.href ?? item.label ?? index
+                      ))
+                    }
+                  ),
+                  sidebarFooter !== void 0 && sidebarFooter !== null && !collapsedEffective ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                    "div",
+                    {
+                      "data-slot": "sidebar-footer",
+                      className: "shrink-0 border-t border-sidebar-border p-2",
+                      children: sidebarFooter
+                    }
+                  ) : null
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+              "main",
+              {
+                "data-slot": "sidebar-content",
+                className: "flex min-w-0 flex-1 flex-col",
+                children: [
+                  drawer ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+                    "div",
+                    {
+                      "data-slot": "sidebar-topbar",
+                      className: "flex h-14 items-center gap-2 border-b border-sidebar-border bg-sidebar px-3 md:hidden",
+                      children: [
+                        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+                          "button",
+                          {
+                            type: "button",
+                            "data-slot": "sidebar-menu-trigger",
+                            "aria-label": t("pactor.layout.openNavigation"),
+                            "aria-expanded": drawerOpen,
+                            className: "flex size-8 items-center justify-center rounded-md text-sidebar-foreground/60 transition-colors hover:bg-sidebar-accent hover:text-sidebar-foreground",
+                            onClick: () => setDrawerOpen(true),
+                            children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Icon, { name: "menu", size: 18 })
+                          }
+                        ),
+                        brandNode
+                      ]
+                    }
+                  ) : null,
+                  children
+                ]
+              }
+            )
+          ]
+        }
+      )
+    }
+  );
+}
+function SidebarEntry({
+  item,
+  depth,
+  collapsed
+}) {
+  const entryClass = cn(
+    "flex w-full items-center gap-2 rounded-md px-3 py-2 text-left text-sm transition-colors",
+    "text-sidebar-foreground/70 hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
+    collapsed && "justify-center px-0"
+  );
+  const indentStyle = !collapsed && depth > 0 ? { paddingLeft: 12 + depth * 16 } : void 0;
+  const labelNode = collapsed ? null : item.label;
+  const iconNode = item.icon ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Icon, { name: item.icon, size: "sm" }) : null;
+  const entry = item.href ? /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+    "a",
+    {
+      "data-slot": "sidebar-item",
+      href: item.href,
+      className: entryClass,
+      style: indentStyle,
+      children: [
+        iconNode,
+        labelNode
+      ]
+    }
+  ) : /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { "data-slot": "sidebar-item", className: entryClass, style: indentStyle, children: [
+    iconNode,
+    labelNode
+  ] });
+  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { "data-slot": "sidebar-entry", children: [
+    collapsed ? /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(RailTooltip, { label: item.label, children: entry }) : entry,
+    item.children?.map((child, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+      SidebarEntry,
+      {
+        item: child,
+        depth: depth + 1,
+        collapsed
+      },
+      child.href ?? child.label ?? index
+    ))
+  ] });
+}
+
+// src/components/components/Menu/index.tsx
+var import_jsx_runtime9 = require("react/jsx-runtime");
+function Menu2({
+  items = [],
+  mode = "inline",
+  selectedKey,
+  onSelect,
+  className,
+  style
+}) {
+  const drawer = useSidebarDrawer();
+  const collapsed = mode === "inline" && drawer?.collapsed === true;
+  let previousGroup;
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+    "nav",
+    {
+      "data-slot": "menu",
+      "data-mode": mode,
+      "data-collapsed": collapsed || void 0,
+      className: cn(
+        mode === "horizontal" ? "flex items-center gap-1" : "flex flex-col gap-0.5 p-2",
+        className
+      ),
+      style,
+      children: items.map((item) => {
+        let groupLabel;
+        if (!collapsed && mode === "inline" && item.group !== void 0 && item.group !== previousGroup) {
+          groupLabel = item.group;
+        }
+        previousGroup = item.group;
+        return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { "data-slot": "menu-group-entry", children: [
+          groupLabel !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            "div",
+            {
+              "data-slot": "menu-group",
+              className: "px-3 pb-1 pt-3 text-xs font-medium text-muted-foreground first:pt-1",
+              children: groupLabel
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+            MenuEntry,
+            {
+              item,
+              mode,
+              depth: 0,
+              selectedKey,
+              onSelect,
+              collapsed
+            }
+          )
+        ] }, item.key);
+      })
+    }
+  );
+}
+function MenuEntry({
+  item,
+  mode,
+  depth,
+  selectedKey,
+  onSelect,
+  collapsed = false
+}) {
+  const selected = item.key === selectedKey;
+  const button = /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
+    "button",
+    {
+      type: "button",
+      "data-slot": "menu-item",
+      "aria-current": selected ? "page" : void 0,
+      disabled: item.disabled,
+      className: cn(
+        "flex w-full items-center gap-2 rounded-md text-sm transition-colors",
+        mode === "horizontal" ? "px-3 py-2" : "px-3 py-2 text-left",
+        collapsed && "justify-center px-0",
+        selected ? "bg-accent font-medium text-accent-foreground" : "cursor-pointer text-muted-foreground hover:bg-accent/50 hover:text-foreground",
+        item.disabled && "cursor-not-allowed opacity-50 hover:bg-transparent hover:text-muted-foreground"
+      ),
+      style: mode === "inline" && depth > 0 && !collapsed ? { paddingLeft: 12 + depth * 16 } : void 0,
+      onClick: () => {
+        if (!item.disabled) {
+          onSelect?.(item.key);
+        }
+      },
+      children: [
+        item.icon ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Icon, { name: item.icon, size: "sm" }) : null,
+        collapsed ? null : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { className: "min-w-0 flex-1 truncate text-left", children: item.label }),
+        item.dot && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { "data-slot": "menu-item-dot", className: "size-1.5 shrink-0 rounded-full bg-destructive" }) : null,
+        item.badge !== void 0 && !collapsed ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+          "span",
+          {
+            "data-slot": "menu-item-badge",
+            className: "shrink-0 rounded-full bg-muted px-1.5 py-0.5 text-xs text-muted-foreground",
+            children: item.badge
+          }
+        ) : null
+      ]
+    }
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { "data-slot": "menu-entry", "data-key": item.key, children: [
+    collapsed ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(RailTooltip, { label: item.label, children: button }) : button,
+    item.children?.map((child) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      MenuEntry,
+      {
+        item: child,
+        mode,
+        depth: depth + 1,
+        selectedKey,
+        onSelect,
+        collapsed
+      },
+      child.key
+    ))
+  ] });
+}
+
+// src/layout/chat/ChatLayout.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
+function ChatLayout({
+  brand,
+  menu,
+  registry,
+  bridge,
+  route: routeProp,
+  permissionChecker,
+  activeMenuKey,
+  onMenuSelect,
+  collapsible,
+  sidebar,
+  sidebarFooter,
+  children
+}) {
+  const registryMenus = (0, import_react4.useMemo)(() => {
+    if (menu !== void 0 || registry === void 0) {
+      return [];
+    }
+    const tree = registry.tree();
+    const visible = permissionChecker !== void 0 ? (0, import_permission2.filterMenusByPermission)(tree, permissionChecker) : tree;
+    return visible.flatMap((item) => menuItemToMenuData(item));
+  }, [menu, registry, permissionChecker]);
+  const menuItems = menu ?? registryMenus;
+  const [bridgePath, setBridgePath] = (0, import_react4.useState)(
+    () => bridge?.getLocation().pathname ?? "/"
+  );
+  (0, import_react4.useEffect)(() => {
+    if (bridge === void 0) {
+      return;
+    }
+    return bridge.subscribe((location) => {
+      setBridgePath(location.pathname);
+    });
+  }, [bridge]);
+  const activeKey = (0, import_react4.useMemo)(() => {
+    if (activeMenuKey !== void 0) {
+      return activeMenuKey;
+    }
+    const path = routeProp?.path ?? bridgePath;
+    return menuItems.find((item) => item.path === path)?.key;
+  }, [activeMenuKey, routeProp, bridgePath, menuItems]);
+  const handleSelect = (key) => {
+    const item = menuItems.find((m) => m.key === key);
+    if (item === void 0 || item.disabled === true) {
+      return;
+    }
+    if (onMenuSelect !== void 0) {
+      onMenuSelect(key, item);
+      return;
+    }
+    if (bridge !== void 0 && item.path !== void 0) {
+      bridge.push(item.path);
+    }
+  };
+  const sidebarContent = sidebar !== void 0 && sidebar !== null ? sidebar : menuItems.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    Menu2,
+    {
+      items: menuItems.map((item) => chatMenuItemToUiMenuItem(item)),
+      selectedKey: activeKey,
+      onSelect: handleSelect
+    }
+  ) : void 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+    Sidebar,
+    {
+      brand,
+      content: sidebarContent,
+      sidebarFooter,
+      collapsible,
+      locationKey: routeProp?.path ?? bridgePath,
+      children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+        "div",
+        {
+          "data-slot": "chat-layout-content",
+          className: "flex min-h-0 flex-1 flex-col",
+          children
+        }
+      )
+    }
+  );
+}
+function chatMenuItemToUiMenuItem(item) {
+  return {
+    key: item.key,
+    label: item.label,
+    icon: item.icon,
+    badge: item.badge,
+    dot: item.dot,
+    group: item.group,
+    disabled: item.disabled
+  };
+}
+function menuItemToMenuData(item) {
+  if (item.type === "group") {
+    const children = (item.children ?? []).flatMap(
+      (child) => menuItemToMenuData(child)
+    );
+    if (children.length === 0) {
+      return [];
+    }
+    return children.map((child, index) => ({
+      ...child,
+      group: index === 0 ? item.title : void 0
+    }));
+  }
+  if (item.hidden === true) {
+    return [];
+  }
+  const ext = item;
+  return [
+    {
+      key: item.id,
+      label: item.title,
+      icon: item.icon,
+      path: item.path,
+      badge: item.badge,
+      dot: ext.dot,
+      group: ext.group,
+      disabled: item.disabled
+    }
+  ];
+}
+
+// src/ui/card.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
+function Card({ className, ...props }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "div",
     {
       "data-slot": "card",
@@ -934,7 +1523,7 @@ function Card({ className, ...props }) {
   );
 }
 function CardHeader({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "div",
     {
       "data-slot": "card-header",
@@ -947,7 +1536,7 @@ function CardHeader({ className, ...props }) {
   );
 }
 function CardTitle({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "div",
     {
       "data-slot": "card-title",
@@ -957,7 +1546,7 @@ function CardTitle({ className, ...props }) {
   );
 }
 function CardContent({ className, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
     "div",
     {
       "data-slot": "card-content",
@@ -967,27 +1556,27 @@ function CardContent({ className, ...props }) {
   );
 }
 
-// src/layout/basic/ShadcnLoginLayout.tsx
-var import_jsx_runtime7 = require("react/jsx-runtime");
-function ShadcnLoginLayout({
+// src/layout/basic/LoginLayout.tsx
+var import_jsx_runtime12 = require("react/jsx-runtime");
+function LoginLayout({
   variant = "center",
   brand,
   children
 }) {
-  const brandBlock = /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("div", { "data-slot": "login-brand", className: "flex flex-col items-center gap-2", children: [
+  const brandBlock = /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("div", { "data-slot": "login-brand", className: "flex flex-col items-center gap-2", children: [
     brand.logo,
-    /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("h1", { className: "text-xl font-semibold", children: brand.title }),
-    brand.description !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("div", { className: "text-sm text-muted-foreground", children: brand.description })
+    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("h1", { className: "text-xl font-semibold", children: brand.title }),
+    brand.description !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { className: "text-sm text-muted-foreground", children: brand.description })
   ] });
   if (variant === "split") {
-    return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
       "div",
       {
         "data-slot": "login-layout",
         "data-variant": "split",
         className: "grid min-h-screen grid-cols-2 bg-background text-foreground",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
             "div",
             {
               "data-slot": "login-brand-panel",
@@ -995,7 +1584,7 @@ function ShadcnLoginLayout({
               children: brandBlock
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
             "div",
             {
               "data-slot": "login-form-panel",
@@ -1007,37 +1596,37 @@ function ShadcnLoginLayout({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
     "div",
     {
       "data-slot": "login-layout",
       "data-variant": "center",
       className: "flex min-h-screen items-center justify-center bg-muted/40 text-foreground",
-      children: /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(Card, { "data-slot": "login-card", className: "w-full max-w-sm gap-4 py-6", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(CardHeader, { className: "px-6", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardTitle, { className: "sr-only", children: brand.title }),
+      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(Card, { "data-slot": "login-card", className: "w-full max-w-sm gap-4 py-6", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(CardHeader, { className: "px-6", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CardTitle, { className: "sr-only", children: brand.title }),
           brandBlock
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(CardContent, { className: "flex flex-col gap-4 px-6", children })
+        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(CardContent, { className: "flex flex-col gap-4 px-6", children })
       ] })
     }
   );
 }
 
-// src/layout/basic/ShadcnLandingLayout.tsx
-var import_jsx_runtime8 = require("react/jsx-runtime");
-function ShadcnLandingLayout({
+// src/layout/basic/LandingLayout.tsx
+var import_jsx_runtime13 = require("react/jsx-runtime");
+function LandingLayout({
   navbar,
   footer,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
     "div",
     {
       "data-slot": "landing-layout",
       className: "flex min-h-screen flex-col bg-background text-foreground",
       children: [
-        navbar !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        navbar !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           "header",
           {
             "data-slot": "landing-navbar",
@@ -1045,8 +1634,8 @@ function ShadcnLandingLayout({
             children: navbar
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("main", { "data-slot": "landing-content", className: "flex-1", children }),
-        footer !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("main", { "data-slot": "landing-content", className: "flex-1", children }),
+        footer !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
           "footer",
           {
             "data-slot": "landing-footer",
@@ -1061,15 +1650,16 @@ function ShadcnLandingLayout({
 
 // src/layout/registry.ts
 var import_core = require("@pactor-app/core");
-function registerShadcnLayouts(registry) {
-  registry.register("admin", ShadcnAdminLayout);
-  registry.register("blank", ShadcnBlankLayout);
-  registry.register("login", ShadcnLoginLayout);
-  registry.register("landing", ShadcnLandingLayout);
+function registerBuiltinLayouts(registry) {
+  registry.register("admin", AdminLayout);
+  registry.register("blank", BlankLayout);
+  registry.register("login", LoginLayout);
+  registry.register("landing", LandingLayout);
+  registry.register("chat", ChatLayout);
 }
-function createShadcnLayoutRegistry() {
+function createLayoutRegistry() {
   const registry = new import_core.Registry("LayoutRegistry");
-  registerShadcnLayouts(registry);
+  registerBuiltinLayouts(registry);
   return registry;
 }
 function resolveLayout(registry, type) {
@@ -1078,19 +1668,20 @@ function resolveLayout(registry, type) {
     console.warn(
       `[pactor-layout] unknown layout type "${type}", fallback to BlankLayout`
     );
-    return ShadcnBlankLayout;
+    return BlankLayout;
   }
   return component;
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  ShadcnAdminLayout,
-  ShadcnBlankLayout,
-  ShadcnLandingLayout,
-  ShadcnLoginLayout,
+  AdminLayout,
+  BlankLayout,
+  ChatLayout,
+  LandingLayout,
+  LoginLayout,
   collectDefaultOpenKeys,
-  createShadcnLayoutRegistry,
+  createLayoutRegistry,
   findMenuChain,
-  registerShadcnLayouts,
+  registerBuiltinLayouts,
   resolveLayout
 });