@fayz-ai/ui 0.6.6 → 0.7.0

package/dist/chunk-H6OULCHF.cjs

@@ -0,0 +1,81 @@
+'use strict';
+
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var React = require('react');
+var reactSlot = require('@radix-ui/react-slot');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var buttonVariants = classVarianceAuthority.cva(
+  "inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-button text-sm font-semibold ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  {
+    variants: {
+      variant: {
+        // Polaris primary — near-black brand with the stronger primary bevel
+        default: "bg-primary text-primary-foreground border border-primary shadow-button-primary hover:bg-primary/90 active:shadow-button-inset",
+        destructive: "bg-destructive text-destructive-foreground border border-destructive shadow-button-primary hover:bg-destructive/90 active:shadow-button-inset",
+        // Default/secondary surface — white with hairline + bevel
+        outline: "border border-border bg-card text-foreground shadow-button hover:bg-muted active:shadow-button-inset",
+        secondary: "border border-border bg-card text-foreground shadow-button hover:bg-muted active:shadow-button-inset",
+        ghost: "hover:bg-muted hover:text-foreground",
+        link: "text-info underline-offset-4 hover:underline"
+      },
+      size: {
+        // Polaris button sizes: md 30px, sm 26px, lg 36px
+        default: "h-[30px] px-3 py-1",
+        sm: "h-[26px] rounded-button px-2.5 text-xs",
+        lg: "h-9 rounded-button px-4 text-sm",
+        icon: "h-[30px] w-[30px]"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+);
+var Button = React__namespace.forwardRef(
+  ({ className, variant, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? reactSlot.Slot : "button";
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Comp,
+      {
+        className: cn(buttonVariants({ variant, size, className })),
+        ref,
+        ...props
+      }
+    );
+  }
+);
+Button.displayName = "Button";
+
+exports.Button = Button;
+exports.buttonVariants = buttonVariants;
+exports.cn = cn;
+//# sourceMappingURL=chunk-H6OULCHF.cjs.map
+//# sourceMappingURL=chunk-H6OULCHF.cjs.map

package/dist/chunk-H6OULCHF.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/utils/cn.ts","../src/primitives/button.tsx"],"names":["twMerge","clsx","cva","React","Slot","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAOA,qBAAA,CAAQC,SAAA,CAAK,MAAM,CAAC,CAAA;AAC7B;ACCA,IAAM,cAAA,GAAiBC,0BAAA;AAAA,EACrB,sSAAA;AAAA,EACA;AAAA,IACE,QAAA,EAAU;AAAA,MACR,OAAA,EAAS;AAAA;AAAA,QAEP,OAAA,EACE,+HAAA;AAAA,QACF,WAAA,EACE,+IAAA;AAAA;AAAA,QAEF,OAAA,EACE,sGAAA;AAAA,QACF,SAAA,EACE,sGAAA;AAAA,QACF,KAAA,EAAO,sCAAA;AAAA,QACP,IAAA,EAAM;AAAA,OACR;AAAA,MACA,IAAA,EAAM;AAAA;AAAA,QAEJ,OAAA,EAAS,oBAAA;AAAA,QACT,EAAA,EAAI,wCAAA;AAAA,QACJ,EAAA,EAAI,iCAAA;AAAA,QACJ,IAAA,EAAM;AAAA;AACR,KACF;AAAA,IACA,eAAA,EAAiB;AAAA,MACf,OAAA,EAAS,SAAA;AAAA,MACT,IAAA,EAAM;AAAA;AACR;AAEJ;AAQA,IAAM,MAAA,GAAeC,gBAAA,CAAA,UAAA;AAAA,EACnB,CAAC,EAAE,SAAA,EAAW,OAAA,EAAS,IAAA,EAAM,UAAU,KAAA,EAAO,GAAG,KAAA,EAAM,EAAG,GAAA,KAAQ;AAChE,IAAA,MAAM,IAAA,GAAO,UAAUC,cAAA,GAAO,QAAA;AAC9B,IAAA,uBACEC,cAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,cAAA,CAAe,EAAE,SAAS,IAAA,EAAM,SAAA,EAAW,CAAC,CAAA;AAAA,QAC1D,GAAA;AAAA,QACC,GAAG;AAAA;AAAA,KACN;AAAA,EAEJ;AACF;AACA,MAAA,CAAO,WAAA,GAAc,QAAA","file":"chunk-H6OULCHF.cjs","sourcesContent":["import { clsx, type ClassValue } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs))\n}\n","import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nimport { cn } from '../utils/cn'\n\nconst buttonVariants = cva(\n  'inline-flex items-center justify-center gap-1.5 whitespace-nowrap rounded-button text-sm font-semibold ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50',\n  {\n    variants: {\n      variant: {\n        // Polaris primary — near-black brand with the stronger primary bevel\n        default:\n          'bg-primary text-primary-foreground border border-primary shadow-button-primary hover:bg-primary/90 active:shadow-button-inset',\n        destructive:\n          'bg-destructive text-destructive-foreground border border-destructive shadow-button-primary hover:bg-destructive/90 active:shadow-button-inset',\n        // Default/secondary surface — white with hairline + bevel\n        outline:\n          'border border-border bg-card text-foreground shadow-button hover:bg-muted active:shadow-button-inset',\n        secondary:\n          'border border-border bg-card text-foreground shadow-button hover:bg-muted active:shadow-button-inset',\n        ghost: 'hover:bg-muted hover:text-foreground',\n        link: 'text-info underline-offset-4 hover:underline',\n      },\n      size: {\n        // Polaris button sizes: md 30px, sm 26px, lg 36px\n        default: 'h-[30px] px-3 py-1',\n        sm: 'h-[26px] rounded-button px-2.5 text-xs',\n        lg: 'h-9 rounded-button px-4 text-sm',\n        icon: 'h-[30px] w-[30px]',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n      size: 'default',\n    },\n  }\n)\n\nexport interface ButtonProps\n  extends React.ButtonHTMLAttributes<HTMLButtonElement>,\n    VariantProps<typeof buttonVariants> {\n  asChild?: boolean\n}\n\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n  ({ className, variant, size, asChild = false, ...props }, ref) => {\n    const Comp = asChild ? Slot : 'button'\n    return (\n      <Comp\n        className={cn(buttonVariants({ variant, size, className }))}\n        ref={ref}\n        {...props}\n      />\n    )\n  }\n)\nButton.displayName = 'Button'\n\nexport { Button, buttonVariants }\n"]}

package/dist/{chunk-DJHS2XRW.cjs → chunk-HG5RH3B3.cjs}

@@ -1,7 +1,7 @@
 'use strict';
 
-var chunkW4XXXJRW_cjs = require('./chunk-W4XXXJRW.cjs');
-var chunkVVVZO2LE_cjs = require('./chunk-VVVZO2LE.cjs');
+var chunkOW73RZOU_cjs = require('./chunk-OW73RZOU.cjs');
+var chunkH6OULCHF_cjs = require('./chunk-H6OULCHF.cjs');
 var React3 = require('react');
 var lucideReact = require('lucide-react');
 var Tooltip = require('@radix-ui/react-tooltip');
@@ -144,7 +144,7 @@ function NavItem({
     "button",
     {
       onClick: () => onNavigate(item.route),
-      className: chunkVVVZO2LE_cjs.cn(
+      className: chunkH6OULCHF_cjs.cn(
         "flex w-full items-center gap-3 rounded-md px-2.5 py-1.5 text-[13px] font-medium transition-colors",
         "hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground",
         isActive ? "bg-sidebar-accent font-semibold text-sidebar-accent-foreground shadow-sm" : "text-sidebar-foreground/80",
@@ -179,26 +179,44 @@ function NavItem({
   }
   return content;
 }
+function routeMatchScore(route, path) {
+  if (path === route) return route.length + 1;
+  if (route !== "/" && path.startsWith(route + "/")) return route.length;
+  return -1;
+}
+function resolveActiveRoute(navigation, path) {
+  let best = null;
+  let bestScore = 0;
+  const consider = (route) => {
+    if (!route) return;
+    const score = routeMatchScore(route, path);
+    if (score > bestScore) {
+      bestScore = score;
+      best = route;
+    }
+  };
+  for (const item of navigation) {
+    consider(item.route);
+    for (const child of item.children ?? []) consider(child.route);
+  }
+  return best;
+}
 function NavGroup({
   item,
   collapsed,
-  currentPath,
+  activeRoute,
   onNavigate
 }) {
-  const [open, setOpen] = React3__namespace.useState(
-    () => item.children?.some((c) => currentPath === c.route || currentPath.startsWith(c.route + "/")) ?? false
-  );
+  const isChildActive = item.children?.some((c) => c.route === activeRoute);
+  const [open, setOpen] = React3__namespace.useState(() => isChildActive ?? false);
   const Icon = getIcon(item.icon);
-  const isChildActive = item.children?.some(
-    (c) => currentPath === c.route || currentPath.startsWith(c.route + "/")
-  );
   if (collapsed) {
     return /* @__PURE__ */ jsxRuntime.jsxs(Tooltip__namespace.Root, { delayDuration: 0, children: [
       /* @__PURE__ */ jsxRuntime.jsx(Tooltip__namespace.Trigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
           onClick: () => onNavigate(item.route),
-          className: chunkVVVZO2LE_cjs.cn(
+          className: chunkH6OULCHF_cjs.cn(
             "flex w-full items-center justify-center rounded-md px-2 py-2 text-sm font-medium transition-colors",
             "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
             isChildActive ? "bg-sidebar-accent text-sidebar-accent-foreground" : "text-sidebar-muted"
@@ -217,7 +235,7 @@ function NavGroup({
       "button",
       {
         onClick: () => setOpen(!open),
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "flex w-full items-center gap-3 rounded-md px-3 py-2 text-sm font-medium transition-colors",
           "hover:bg-sidebar-accent hover:text-sidebar-accent-foreground",
           isChildActive ? "text-sidebar-accent-foreground" : "text-sidebar-muted"
@@ -225,18 +243,18 @@ function NavGroup({
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4 shrink-0" }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 truncate text-left", children: item.label }),
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: chunkVVVZO2LE_cjs.cn("h-3.5 w-3.5 shrink-0 transition-transform", open && "rotate-180") })
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: chunkH6OULCHF_cjs.cn("h-3.5 w-3.5 shrink-0 transition-transform", open && "rotate-180") })
         ]
       }
     ),
     open && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-4 mt-0.5 space-y-0.5 border-l border-sidebar-border/50 pl-3", children: item.children?.map((child) => {
       const ChildIcon = getIcon(child.icon);
-      const isActive = currentPath === child.route || currentPath.startsWith(child.route + "/");
+      const isActive = child.route === activeRoute;
       return /* @__PURE__ */ jsxRuntime.jsxs(
         "button",
         {
           onClick: () => onNavigate(child.route),
-          className: chunkVVVZO2LE_cjs.cn(
+          className: chunkH6OULCHF_cjs.cn(
             "flex w-full items-center gap-2.5 rounded-md px-2 py-1.5 text-sm transition-colors",
             isActive ? "font-medium text-sidebar-accent-foreground" : "text-sidebar-muted hover:text-sidebar-accent-foreground"
           ),
@@ -268,6 +286,7 @@ function Sidebar({
 }) {
   const currentPath = currentPathProp;
   const setCommandPaletteOpen = useLayoutStore((s) => s.setCommandPaletteOpen);
+  const activeRoute = resolveActiveRoute(navigation, currentPath);
   const mainItems = navigation.filter((item) => item.section === "main");
   const secondaryItems = navigation.filter((item) => item.section === "secondary");
   const settingsItems = navigation.filter((item) => item.section === "settings");
@@ -278,7 +297,7 @@ function Sidebar({
     "aside",
     {
       "data-print": "hide",
-      className: chunkVVVZO2LE_cjs.cn(
+      className: chunkH6OULCHF_cjs.cn(
         "flex h-full flex-col bg-sidebar text-sidebar-foreground transition-all duration-200",
         !borderless && "border-r border-sidebar-border",
         collapsed ? "w-16" : "w-64"
@@ -287,7 +306,7 @@ function Sidebar({
         /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
-            className: chunkVVVZO2LE_cjs.cn(
+            className: chunkH6OULCHF_cjs.cn(
               "flex h-14 items-center justify-between px-4",
               !borderless && "border-b border-sidebar-border",
               collapsed && "justify-center px-2"
@@ -320,43 +339,43 @@ function Sidebar({
         /* @__PURE__ */ jsxRuntime.jsxs("nav", { className: "flex-1 space-y-1 overflow-y-auto p-2", children: [
           topContent && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 space-y-2", children: topContent }),
           mainItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: mainItems.map(
-            (item) => item.children && item.children.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(NavGroup, { item, collapsed, currentPath, onNavigate: handleNavigate }, item.id) : /* @__PURE__ */ jsxRuntime.jsx(
+            (item) => item.children && item.children.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(NavGroup, { item, collapsed, activeRoute, onNavigate: handleNavigate }, item.id) : /* @__PURE__ */ jsxRuntime.jsx(
               NavItem,
               {
                 item,
                 collapsed,
-                isActive: currentPath === item.route || currentPath.startsWith(item.route + "/"),
+                isActive: item.route === activeRoute,
                 onNavigate: handleNavigate
               },
               item.id
             )
           ) }),
           secondaryItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-6 space-y-1", children: secondaryItems.map(
-            (item) => item.children && item.children.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(NavGroup, { item, collapsed, currentPath, onNavigate: handleNavigate }, item.id) : /* @__PURE__ */ jsxRuntime.jsx(
+            (item) => item.children && item.children.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(NavGroup, { item, collapsed, activeRoute, onNavigate: handleNavigate }, item.id) : /* @__PURE__ */ jsxRuntime.jsx(
               NavItem,
               {
                 item,
                 collapsed,
-                isActive: currentPath === item.route || currentPath.startsWith(item.route + "/"),
+                isActive: item.route === activeRoute,
                 onNavigate: handleNavigate
               },
               item.id
             )
           ) })
         ] }),
-        settingsItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkVVVZO2LE_cjs.cn("p-2 space-y-1", !borderless && "border-t border-sidebar-border"), children: settingsItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
+        settingsItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkH6OULCHF_cjs.cn("p-2 space-y-1", !borderless && "border-t border-sidebar-border"), children: settingsItems.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
           NavItem,
           {
             item,
             collapsed,
-            isActive: currentPath === item.route || currentPath.startsWith(item.route + "/"),
+            isActive: item.route === activeRoute,
             onNavigate: handleNavigate
           },
           item.id
         )) }),
-        footerContent && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkVVVZO2LE_cjs.cn("p-2", !borderless && "border-t border-sidebar-border"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: footerContent }) }),
+        footerContent && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkH6OULCHF_cjs.cn("p-2", !borderless && "border-t border-sidebar-border"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: footerContent }) }),
         orgSwitcher && React3__namespace.isValidElement(orgSwitcher) ? React3__namespace.cloneElement(orgSwitcher, { collapsed }) : orgSwitcher,
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkVVVZO2LE_cjs.cn("p-2", !borderless && "border-t border-sidebar-border"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkVVVZO2LE_cjs.cn(
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkH6OULCHF_cjs.cn("p-2", !borderless && "border-t border-sidebar-border"), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkH6OULCHF_cjs.cn(
           "flex items-center rounded-md",
           collapsed ? "flex-col gap-1" : "gap-1 px-1"
         ), children: [
@@ -549,7 +568,8 @@ var ICON_MAP2 = {
   Inbox: lucideReact.Inbox,
   UserCheck: lucideReact.UserCheck,
   Star: lucideReact.Star,
-  Zap: lucideReact.Zap
+  Zap: lucideReact.Zap,
+  Clapperboard: lucideReact.Clapperboard
 };
 function getIcon2(name) {
   return ICON_MAP2[name] ?? lucideReact.Home;
@@ -565,14 +585,14 @@ function NavDropdown({ item, currentPath, onNavigate }) {
       "button",
       {
         "data-nav-active": isChildActive || void 0,
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "flex items-center gap-1.5 whitespace-nowrap border-b-2 px-3 py-2 text-sm transition-colors",
           isChildActive ? "border-sidebar-accent-foreground font-semibold text-sidebar-foreground" : "border-transparent text-sidebar-muted hover:text-sidebar-foreground"
         ),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-4 w-4" }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.label }),
-          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: chunkVVVZO2LE_cjs.cn("h-3 w-3 transition-transform", open && "rotate-180") })
+          /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: chunkH6OULCHF_cjs.cn("h-3 w-3 transition-transform", open && "rotate-180") })
         ]
       }
     ) }),
@@ -592,7 +612,7 @@ function NavDropdown({ item, currentPath, onNavigate }) {
                 onNavigate(child.route);
                 setOpen(false);
               },
-              className: chunkVVVZO2LE_cjs.cn(
+              className: chunkH6OULCHF_cjs.cn(
                 "flex w-full items-center gap-2.5 rounded-lg px-3 py-2 text-sm transition-colors",
                 isActive ? "bg-muted font-medium text-foreground" : "text-popover-foreground hover:bg-muted/70"
               ),
@@ -699,7 +719,7 @@ function Topbar({
         {
           "data-nav-active": isActive || void 0,
           onClick: () => handleNavigate(item.route),
-          className: chunkVVVZO2LE_cjs.cn(
+          className: chunkH6OULCHF_cjs.cn(
             "flex items-center gap-1.5 whitespace-nowrap border-b-2 px-3 py-2 text-sm transition-colors",
             isActive ? "border-primary font-semibold text-sidebar-foreground" : "border-transparent text-sidebar-muted hover:text-sidebar-foreground"
           ),
@@ -752,7 +772,7 @@ function SidebarLayout({
   const [mobileMenuOpen, setMobileMenuOpen] = React3__namespace.useState(false);
   const [headerSlot, setHeaderSlot] = React3__namespace.useState(null);
   const [actionsSlot, setActionsSlot] = React3__namespace.useState(null);
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkW4XXXJRW_cjs.SaveBarProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(ModuleHeaderSlotContext.Provider, { value: headerSlot, children: /* @__PURE__ */ jsxRuntime.jsx(ModuleHeaderActionsSlotContext.Provider, { value: actionsSlot, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkVVVZO2LE_cjs.cn(
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.SaveBarProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(ModuleHeaderSlotContext.Provider, { value: headerSlot, children: /* @__PURE__ */ jsxRuntime.jsx(ModuleHeaderActionsSlotContext.Provider, { value: actionsSlot, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkH6OULCHF_cjs.cn(
     "flex h-screen overflow-hidden bg-background",
     // Frame mode: the inset gap around the framed card takes the sidebar (menu)
     // color, so the white card reads as a panel floating on the same tone as the
@@ -782,11 +802,11 @@ function SidebarLayout({
         unreadCount
       }
     ) }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkVVVZO2LE_cjs.cn(
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkH6OULCHF_cjs.cn(
       "relative flex flex-1 flex-col overflow-hidden",
       frame && "md:m-2 md:rounded-xl md:border md:border-border md:bg-card"
     ), children: [
-      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkVVVZO2LE_cjs.cn(
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkH6OULCHF_cjs.cn(
         "flex min-h-14 shrink-0 items-center justify-between gap-3 border-b border-border bg-card px-4 py-2",
         mobileHeader !== "minimal" && "hidden md:flex"
       ), children: [
@@ -810,7 +830,7 @@ function SidebarLayout({
         ] })
       ] }),
       /* @__PURE__ */ jsxRuntime.jsx("main", { className: "flex-1 overflow-y-auto pb-16 md:pb-0", children }),
-      /* @__PURE__ */ jsxRuntime.jsx(chunkW4XXXJRW_cjs.SaveBar, {})
+      /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.SaveBar, {})
     ] }),
     mobileMenuOpen && /* @__PURE__ */ jsxRuntime.jsx(
       MobileOverlay,
@@ -853,7 +873,7 @@ function TopbarLayout({
   hasBottomNav = false
 }) {
   const [mobileMenuOpen, setMobileMenuOpen] = React3__namespace.useState(false);
-  return /* @__PURE__ */ jsxRuntime.jsx(chunkW4XXXJRW_cjs.SaveBarProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex h-screen flex-col overflow-hidden bg-background", children: [
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.SaveBarProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex h-screen flex-col overflow-hidden bg-background", children: [
     /* @__PURE__ */ jsxRuntime.jsx(
       Topbar,
       {
@@ -872,8 +892,8 @@ function TopbarLayout({
         onMenuClick: hasBottomNav ? void 0 : () => setMobileMenuOpen(true)
       }
     ),
-    /* @__PURE__ */ jsxRuntime.jsx("main", { className: chunkVVVZO2LE_cjs.cn("flex-1 overflow-y-auto pb-16 md:pb-0", frame && "md:bg-sidebar md:p-2"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkVVVZO2LE_cjs.cn("min-h-full", frame && "md:rounded-xl md:border md:border-border md:bg-card"), children }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(chunkW4XXXJRW_cjs.SaveBar, {}),
+    /* @__PURE__ */ jsxRuntime.jsx("main", { className: chunkH6OULCHF_cjs.cn("flex-1 overflow-y-auto pb-16 md:pb-0", frame && "md:bg-sidebar md:p-2"), children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkH6OULCHF_cjs.cn("min-h-full", frame && "md:rounded-xl md:border md:border-border md:bg-card"), children }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.SaveBar, {}),
     mobileMenuOpen && /* @__PURE__ */ jsxRuntime.jsx(
       MobileOverlay,
       {
@@ -941,7 +961,7 @@ function MobileOverlay({ onClose, onNavigate, ...sidebarProps }) {
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "absolute inset-0 bg-black/50 transition-opacity duration-300 ease-out",
           visible ? "opacity-100" : "opacity-0"
         ),
@@ -951,7 +971,7 @@ function MobileOverlay({ onClose, onNavigate, ...sidebarProps }) {
     /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "absolute inset-y-0 left-0 shadow-2xl transition-transform duration-300 ease-out will-change-transform",
           visible ? "translate-x-0" : "-translate-x-full"
         ),
@@ -1034,7 +1054,7 @@ function MobileBottomNav({
       {
         type: "button",
         onClick: () => onNavigate?.(item.route),
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "flex flex-1 flex-col items-center justify-center gap-0.5 px-1 py-1 transition-colors",
           isActive ? "text-primary" : "text-muted-foreground"
         ),
@@ -1175,7 +1195,7 @@ function PageTransition({
 }) {
   const transition = useNavTransition();
   const animClass = resolveTransitionClass(transition, direction);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkVVVZO2LE_cjs.cn(animClass, className), children }, transitionKey);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkH6OULCHF_cjs.cn(animClass, className), children }, transitionKey);
 }
 function PageHeaderActions({ children }) {
   const slot = useModuleHeaderActionsSlot();
@@ -1201,7 +1221,7 @@ function NavItem2({ item }) {
       {
         type: "button",
         onClick: () => hasChildren ? setExpanded(!expanded) : item.onClick?.(),
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "flex items-center gap-2 w-full rounded-md px-2.5 py-1.5 text-sm transition-colors",
           isActive ? "bg-primary/10 text-primary font-medium" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
         ),
@@ -1217,7 +1237,7 @@ function NavItem2({ item }) {
       {
         type: "button",
         onClick: child.onClick,
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "flex items-center w-full rounded-md px-2.5 py-1 text-xs transition-colors",
           child.active ? "text-primary font-medium bg-primary/5" : "text-muted-foreground hover:text-foreground hover:bg-muted/50"
         ),
@@ -1258,14 +1278,14 @@ function MobileTabs({ nav }) {
               setExpandedId(null);
             }
           },
-          className: chunkVVVZO2LE_cjs.cn(
+          className: chunkH6OULCHF_cjs.cn(
             "flex items-center gap-1.5 whitespace-nowrap rounded-full px-3 py-1.5 text-xs font-medium transition-colors shrink-0",
             isActive ? "bg-primary text-primary-foreground" : "bg-muted text-muted-foreground hover:text-foreground"
           ),
           children: [
             Icon && /* @__PURE__ */ jsxRuntime.jsx(Icon, { className: "h-3 w-3" }),
             item.label,
-            hasChildren && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: chunkVVVZO2LE_cjs.cn("h-2.5 w-2.5 transition-transform", isExpanded && "rotate-180") })
+            hasChildren && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: chunkH6OULCHF_cjs.cn("h-2.5 w-2.5 transition-transform", isExpanded && "rotate-180") })
           ]
         },
         item.id
@@ -1282,7 +1302,7 @@ function MobileTabs({ nav }) {
             child.onClick?.();
             setExpandedId(null);
           },
-          className: chunkVVVZO2LE_cjs.cn(
+          className: chunkH6OULCHF_cjs.cn(
             "whitespace-nowrap rounded-full px-2.5 py-1 text-[11px] font-medium transition-colors shrink-0",
             child.active ? "bg-foreground/10 text-foreground" : "text-muted-foreground hover:text-foreground"
           ),
@@ -1303,8 +1323,8 @@ function useBackStyle() {
 function SubpageHeader({ title, subtitle, icon, onBack, parentLabel, actions, backStyle }) {
   const t = core.useTranslation();
   const appStyle = useBackStyle();
-  const { onBack: effectiveOnBack, parentLabel: effectiveParentLabel } = chunkW4XXXJRW_cjs.useCrossModuleBack(onBack, parentLabel);
-  chunkW4XXXJRW_cjs.useBackHandler(effectiveOnBack);
+  const { onBack: effectiveOnBack, parentLabel: effectiveParentLabel } = chunkOW73RZOU_cjs.useCrossModuleBack(onBack, parentLabel);
+  chunkOW73RZOU_cjs.useBackHandler(effectiveOnBack);
   const Icon = icon ? ICON_MAP2[icon] ?? null : null;
   const style = !effectiveOnBack ? "icon" : backStyle ?? appStyle;
   const effectiveStyle = style !== "icon" && !effectiveParentLabel ? "icon" : style;
@@ -1372,7 +1392,7 @@ function ModuleHeader({ nav }) {
       {
         type: "button",
         onClick: () => hasChildren ? defaultChild(item)?.onClick?.() : item.onClick?.(),
-        className: chunkVVVZO2LE_cjs.cn(
+        className: chunkH6OULCHF_cjs.cn(
           "flex shrink-0 items-center gap-1.5 whitespace-nowrap border-b-2 px-2.5 py-1.5 text-sm font-medium transition-colors",
           isActive ? "border-primary text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"
         ),
@@ -1395,11 +1415,11 @@ function ModulePage({ title, subtitle, nav, children, className, headerAction, s
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(ModuleHeader, { nav }),
       showHeader && headerAction && /* @__PURE__ */ jsxRuntime.jsx(PageHeaderActions, { children: headerAction }),
-      /* @__PURE__ */ jsxRuntime.jsx(PageTransition, { transitionKey, direction, className: chunkVVVZO2LE_cjs.cn("min-w-0", className), children })
+      /* @__PURE__ */ jsxRuntime.jsx(PageTransition, { transitionKey, direction, className: chunkH6OULCHF_cjs.cn("min-w-0", className), children })
     ] });
   }
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkVVVZO2LE_cjs.cn("flex gap-6 -mt-2", className), children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-48 shrink-0 hidden md:block no-print", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkVVVZO2LE_cjs.cn(sidebarFooter && "sticky top-4 flex flex-col"), style: sidebarFooter ? { height: "calc(100vh - 8rem)" } : void 0, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkH6OULCHF_cjs.cn("flex gap-6 -mt-2", className), children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-48 shrink-0 hidden md:block no-print", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkH6OULCHF_cjs.cn(sidebarFooter && "sticky top-4 flex flex-col"), style: sidebarFooter ? { height: "calc(100vh - 8rem)" } : void 0, children: [
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold text-muted-foreground uppercase tracking-wider px-2.5 mb-2", children: title }),
         /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "space-y-0.5", children: nav.map((item) => /* @__PURE__ */ jsxRuntime.jsx(NavItem2, { item }, item.id)) })
@@ -1419,9 +1439,96 @@ function ModulePage({ title, subtitle, nav, children, className, headerAction, s
     ] })
   ] });
 }
+var ContentSplitContext = React3__namespace.createContext(null);
+function ContentSplit({
+  children,
+  aside,
+  asideTitle,
+  asideDescription,
+  asideWidth = "20rem",
+  asideOpen,
+  onAsideOpenChange,
+  collapsible = false,
+  defaultCollapsed = false,
+  className
+}) {
+  const [internalOpen, setInternalOpen] = React3__namespace.useState(false);
+  const open = asideOpen ?? internalOpen;
+  const setOpen = onAsideOpenChange ?? setInternalOpen;
+  const [collapsed, setCollapsed] = React3__namespace.useState(collapsible && defaultCollapsed);
+  return /* @__PURE__ */ jsxRuntime.jsxs(ContentSplitContext.Provider, { value: { open, setOpen }, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: chunkH6OULCHF_cjs.cn("lg:grid lg:items-start lg:gap-6", className),
+        style: { gridTemplateColumns: `minmax(0, 1fr) ${collapsed ? "auto" : asideWidth}` },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "min-w-0", children }),
+          /* @__PURE__ */ jsxRuntime.jsx("aside", { className: "hidden lg:block lg:sticky lg:top-4", children: collapsed ? /* @__PURE__ */ jsxRuntime.jsx(
+            chunkH6OULCHF_cjs.Button,
+            {
+              variant: "outline",
+              size: "sm",
+              onClick: () => setCollapsed(false),
+              className: "h-9 w-9 p-0",
+              "aria-label": typeof asideTitle === "string" ? asideTitle : void 0,
+              title: typeof asideTitle === "string" ? asideTitle : void 0,
+              children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PanelRightOpen, { className: "h-4 w-4" })
+            }
+          ) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-card border border-border bg-card", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start justify-between gap-2 border-b border-border px-4 py-3", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm font-semibold text-foreground", children: asideTitle }),
+                asideDescription && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-0.5 text-xs text-muted-foreground", children: asideDescription })
+              ] }),
+              collapsible && /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => setCollapsed(true),
+                  className: "rounded p-1 text-muted-foreground transition-colors hover:bg-muted/60 hover:text-foreground",
+                  "aria-label": "collapse",
+                  children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PanelRightClose, { className: "h-4 w-4" })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-4", children: aside })
+          ] }) })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.Sheet, { open, onOpenChange: setOpen, children: /* @__PURE__ */ jsxRuntime.jsxs(chunkOW73RZOU_cjs.SheetContent, { width: "max-w-sm", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(chunkOW73RZOU_cjs.SheetHeader, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.SheetTitle, { children: asideTitle }),
+        asideDescription && /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.SheetDescription, { children: asideDescription })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsx(chunkOW73RZOU_cjs.SheetBody, { children: aside })
+    ] }) }) })
+  ] });
+}
+function ContentSplitTrigger({ label, iconOnly, className }) {
+  const ctx = React3__namespace.useContext(ContentSplitContext);
+  if (!ctx) return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    chunkH6OULCHF_cjs.Button,
+    {
+      variant: "outline",
+      size: "sm",
+      onClick: () => ctx.setOpen(true),
+      className: chunkH6OULCHF_cjs.cn("lg:hidden", className),
+      "aria-label": typeof label === "string" ? label : void 0,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PanelRight, { className: chunkH6OULCHF_cjs.cn("h-4 w-4", !iconOnly && "mr-1.5") }),
+        !iconOnly && label
+      ]
+    }
+  );
+}
 
 exports.AppShell = AppShell;
 exports.BackStyleProvider = BackStyleProvider;
+exports.ContentSplit = ContentSplit;
+exports.ContentSplitTrigger = ContentSplitTrigger;
 exports.ICON_MAP = ICON_MAP;
 exports.ModuleLayoutProvider = ModuleLayoutProvider;
 exports.ModulePage = ModulePage;
@@ -1437,5 +1544,5 @@ exports.useModuleHeaderActionsSlot = useModuleHeaderActionsSlot;
 exports.useModuleHeaderSlot = useModuleHeaderSlot;
 exports.useModuleLayout = useModuleLayout;
 exports.useNavTransition = useNavTransition;
-//# sourceMappingURL=chunk-DJHS2XRW.cjs.map
-//# sourceMappingURL=chunk-DJHS2XRW.cjs.map
+//# sourceMappingURL=chunk-HG5RH3B3.cjs.map
+//# sourceMappingURL=chunk-HG5RH3B3.cjs.map