@flanksource/clicky-ui 0.3.17 → 0.3.18

package/dist/layout/AppShell.cjs

@@ -16,6 +16,34 @@ function readStored(key) {
   if (!key || typeof window === "undefined") return null;
   return window.localStorage.getItem(key);
 }
+const DEFAULT_GROUP_COLLAPSE_KEY = "clicky-ui:app-shell:groups";
+function readGroupState(storageKey) {
+  if (typeof window === "undefined") return {};
+  try {
+    const raw = window.localStorage.getItem(storageKey);
+    if (!raw) return {};
+    const parsed = JSON.parse(raw);
+    return parsed && typeof parsed === "object" ? parsed : {};
+  } catch {
+    return {};
+  }
+}
+function useGroupCollapsed(storageKey) {
+  const [state, setState] = react.useState(
+    () => readGroupState(storageKey)
+  );
+  react.useEffect(() => {
+    if (typeof window === "undefined") return;
+    try {
+      window.localStorage.setItem(storageKey, JSON.stringify(state));
+    } catch {
+    }
+  }, [state, storageKey]);
+  return {
+    isCollapsed: (key, fallback) => state[key] ?? fallback,
+    toggle: (key, fallback) => setState((prev) => ({ ...prev, [key]: !(prev[key] ?? fallback) }))
+  };
+}
 function AppShell(props) {
   const {
     brand,
@@ -32,6 +60,7 @@ function AppShell(props) {
     collapsible = true,
     defaultCollapsed = false,
     collapsedStorageKey,
+    groupCollapsedStorageKey,
     sidebarWidth = 240,
     collapsedWidth = 56,
     mobileSidebarLabel = "Navigation",
@@ -59,8 +88,10 @@ function AppShell(props) {
       window.localStorage.setItem(collapsedStorageKey, String(collapsed));
   }, [collapsed, collapsedStorageKey]);
   modalStack.useEscapeLayer(mobileSidebarOpen, () => setMobileSidebarOpen(false));
+  const groupState = useGroupCollapsed(
+    groupCollapsedStorageKey ?? DEFAULT_GROUP_COLLAPSE_KEY
+  );
   const railWidth = collapsed ? collapsedWidth : sidebarWidth;
-  const compactActions = mobileActions ?? actions;
   const hasTopBar = !hasSidebar && brand !== void 0 || nav !== void 0 || search !== void 0 || actions !== void 0 || mobileActions !== void 0 || toolbar !== void 0;
   const hasMobileHeader = hasSidebar;
   const hasBodyHeader = bodyHeader !== void 0 || bodyActions !== void 0;
@@ -70,6 +101,7 @@ function AppShell(props) {
     {
       sections: navSections,
       collapsed: collapsedValue,
+      groupState,
       ...onNavigate ? { onNavigate } : {}
     }
   );
@@ -145,56 +177,71 @@ function AppShell(props) {
                   "data-slot": "app-shell-header",
                   className: "shrink-0 border-b border-border bg-card",
                   children: [
-                    hasMobileHeader && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center gap-density-2 px-density-3 py-density-2 md:hidden", children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(
-                        "button",
-                        {
-                          type: "button",
-                          "aria-label": `Open ${mobileSidebarLabel}`,
-                          title: mobileSidebarLabel,
-                          className: "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-border bg-background text-foreground transition-colors hover:bg-accent",
-                          onClick: () => setMobileSidebarOpen(true),
-                          children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiMenu.UiMenu, className: "h-4 w-4" })
-                        }
-                      ),
-                      brand && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-w-0 flex-1 items-center gap-density-2", children: brand }),
-                      compactActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-auto flex min-w-0 shrink items-center justify-end gap-density-2", children: compactActions }),
-                      search !== void 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "basis-full min-w-0", children: search }),
-                      nav && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "basis-full min-w-0 overflow-x-auto", children: nav })
-                    ] }),
                     /* @__PURE__ */ jsxRuntime.jsxs(
                       "div",
                       {
                         className: utils.cn(
-                          "hidden h-14 items-center gap-density-3 px-density-4 md:flex",
-                          !hasSidebar && "flex",
+                          hasSidebar ? "flex flex-wrap items-center gap-density-2 px-density-3 py-density-2 md:h-14 md:flex-nowrap md:gap-density-3 md:px-density-4 md:py-0" : "flex h-14 items-center gap-density-3 px-density-4",
                           headerClassName
                         ),
                         children: [
-                          !hasSidebar && brand && /* @__PURE__ */ jsxRuntime.jsx(
+                          hasSidebar && /* @__PURE__ */ jsxRuntime.jsx(
+                            "button",
+                            {
+                              type: "button",
+                              "aria-label": `Open ${mobileSidebarLabel}`,
+                              title: mobileSidebarLabel,
+                              className: "inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-border bg-background text-foreground transition-colors hover:bg-accent md:hidden",
+                              onClick: () => setMobileSidebarOpen(true),
+                              children: /* @__PURE__ */ jsxRuntime.jsx(Icon.Icon, { icon: UiMenu.UiMenu, className: "h-4 w-4" })
+                            }
+                          ),
+                          brand && /* @__PURE__ */ jsxRuntime.jsx(
                             "div",
                             {
                               "data-slot": "app-shell-brand",
-                              className: "flex shrink-0 items-center gap-density-2",
+                              className: utils.cn(
+                                "min-w-0 items-center gap-density-2",
+                                hasSidebar ? "flex flex-1 md:hidden" : "flex shrink-0"
+                              ),
                               children: brand
                             }
                           ),
-                          nav && /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "app-shell-nav", className: "flex shrink-0 items-center", children: nav }),
+                          nav && /* @__PURE__ */ jsxRuntime.jsx(
+                            "div",
+                            {
+                              "data-slot": "app-shell-nav",
+                              className: utils.cn(
+                                "flex min-w-0 items-center",
+                                hasSidebar && "order-3 basis-full overflow-x-auto md:order-none md:basis-auto md:overflow-visible"
+                              ),
+                              children: nav
+                            }
+                          ),
                           search !== void 0 && /* @__PURE__ */ jsxRuntime.jsx(
                             "div",
                             {
                               "data-slot": "app-shell-search",
-                              className: "flex min-w-0 flex-1 justify-center",
+                              className: utils.cn(
+                                "flex min-w-0 flex-1 justify-center",
+                                hasSidebar && "order-2 basis-full md:order-none md:basis-auto md:flex-1"
+                              ),
                               children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-full", style: { maxWidth: searchMaxWidth }, children: search })
                             }
                           ),
-                          search === void 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1" }),
-                          actions && /* @__PURE__ */ jsxRuntime.jsx(
+                          search === void 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: utils.cn("flex-1", hasSidebar && "hidden md:block") }),
+                          (actions !== void 0 || hasSidebar && mobileActions !== void 0) && /* @__PURE__ */ jsxRuntime.jsx(
                             "div",
                             {
                               "data-slot": "app-shell-actions",
-                              className: "flex shrink-0 items-center gap-density-2",
-                              children: actions
+                              className: utils.cn(
+                                "flex shrink-0 items-center gap-density-2",
+                                hasSidebar && "order-1 ml-auto md:order-none md:ml-0"
+                              ),
+                              children: !hasSidebar || mobileActions === void 0 ? actions : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+                                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "hidden items-center gap-density-2 md:flex", children: actions }),
+                                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-density-2 md:hidden", children: mobileActions })
+                              ] })
                             }
                           )
                         ]
@@ -246,48 +293,37 @@ function AppShell(props) {
                   )
                 }
               ),
-              bodySidebar !== void 0 ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-h-0 flex-1 flex-col overflow-hidden md:hidden", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(
+              bodySidebar !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(
+                SplitPane.SplitPane,
+                {
+                  stackOnMobile: true,
+                  className: "min-h-0 flex-1",
+                  defaultSplit: bodySplit,
+                  minLeft: 12,
+                  minRight: 30,
+                  left: /* @__PURE__ */ jsxRuntime.jsx(
                     "div",
                     {
                       "data-slot": "app-shell-body-sidebar",
-                      className: "max-h-[40vh] shrink-0 overflow-y-auto border-b border-border bg-background",
+                      className: "h-full",
                       children: bodySidebar
                     }
                   ),
-                  /* @__PURE__ */ jsxRuntime.jsx(
+                  right: /* @__PURE__ */ jsxRuntime.jsx(
                     "main",
                     {
                       "data-slot": "app-shell-main",
                       className: utils.cn(
-                        "min-h-0 min-w-0 flex-1 overflow-auto",
+                        "h-full min-h-0 min-w-0 overflow-auto",
                         contentClassName
                       ),
                       children
                     }
-                  )
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  SplitPane.SplitPane,
-                  {
-                    className: "hidden min-h-0 flex-1 md:flex",
-                    defaultSplit: bodySplit,
-                    minLeft: 12,
-                    minRight: 30,
-                    left: /* @__PURE__ */ jsxRuntime.jsx("div", { "data-slot": "app-shell-body-sidebar", className: "h-full", children: bodySidebar }),
-                    right: /* @__PURE__ */ jsxRuntime.jsx(
-                      "div",
-                      {
-                        "data-slot": "app-shell-main",
-                        className: utils.cn("h-full min-w-0", contentClassName),
-                        children
-                      }
-                    ),
-                    rightClass: "overflow-y-auto"
-                  }
-                )
-              ] }) : /* @__PURE__ */ jsxRuntime.jsx(
+                  ),
+                  leftClass: "max-h-[40vh] shrink-0 border-b border-border md:max-h-none md:border-b-0",
+                  rightClass: "min-h-0 flex-1 md:flex-none"
+                }
+              ) : /* @__PURE__ */ jsxRuntime.jsx(
                 "main",
                 {
                   "data-slot": "app-shell-main",

package/dist/layout/AppShell.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.cjs","sources":["../../src/layout/AppShell.tsx"],"sourcesContent":["import { useEffect, useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiClose, UiMenu, UiSidebar } from \"../icons\";\nimport { useEscapeLayer } from \"../overlay/modalStack\";\nimport { SplitPane } from \"./SplitPane\";\nimport { AppShellSlotOutlines } from \"./AppShell.debug\";\nimport { NavSections } from \"./AppShell.nav\";\nimport {\n  contentWidthClassName,\n  type ContentWidth,\n} from \"./content-width\";\n\n// AppShell is a sidebar-first application shell. The full-height DARK nav rail\n// owns the brand + collapse toggle and renders grouped nav sections; the top bar\n// (search, actions) sits to the RIGHT of the rail — there is no full-width top\n// bar when a rail is present. With no rail, the top bar spans full width. The\n// body carries a fixed bodyHeader + bodyActions row over an optional\n// bodySidebar | body-main split (body-main scrolls; bodySidebar — e.g. a tree —\n// scrolls independently via a resizable SplitPane).\n\nexport type AppShellNavItem = {\n  /** Stable key; also the React key. */\n  key: string;\n  /** Visible label (hidden when the rail is collapsed). */\n  label: ReactNode;\n  /** Leading icon (icon name or component). */\n  icon?: string | StaticIconComponent;\n  /** Highlights the item as the current location. */\n  active?: boolean;\n  /** Routing destination; rendered as an anchor via the RouterAdapter. */\n  to: string;\n  /** Opens `to` in a new tab. */\n  external?: boolean;\n  /** Trailing adornment (count, status dot). */\n  badge?: ReactNode;\n};\n\nexport type AppShellNavSection = {\n  /** Section heading; collapses to a divider when the rail is collapsed. */\n  label?: string;\n  items: AppShellNavItem[];\n};\n\nexport type AppShellProps = {\n  // ── Top bar (right of the rail; full width when no rail) ─\n  /** Brand mark / wordmark. Shown in the rail header when a rail is present, else in the top bar. */\n  brand?: ReactNode;\n  /** Inline primary nav (e.g. tabs) shown after the brand in the top bar. */\n  nav?: ReactNode;\n  /** Centered search slot; grows to fill and is width-capped. */\n  search?: ReactNode;\n  /** Right-aligned cluster (icon buttons, settings/org picker, …). */\n  actions?: ReactNode;\n  /** Compact action cluster used in the mobile header. Defaults to `actions`. */\n  mobileActions?: ReactNode;\n  /** Optional second top-bar row for filters / bulk actions. */\n  toolbar?: ReactNode;\n  /** Max width of the centered search slot. Defaults to 28rem. */\n  searchMaxWidth?: string | number;\n\n  // ── Left nav rail (dark, collapsible, fixed width) ───────\n  /** Declarative nav sections rendered into the rail (collapse-aware). */\n  navSections?: AppShellNavSection[];\n  /** Custom sidebar content; receives the collapsed flag. Overrides navSections. */\n  sidebar?: ReactNode | ((collapsed: boolean) => ReactNode);\n  /** Pinned below the rail header (e.g. a context switcher). */\n  sidebarHeader?: ReactNode;\n  /** Pinned to the bottom of the rail (version, account). */\n  sidebarFooter?: ReactNode;\n  /** Show the collapse toggle. Defaults to true when a rail is present. */\n  collapsible?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultCollapsed?: boolean;\n  /** localStorage key persisting the collapsed state. */\n  collapsedStorageKey?: string;\n  /** Expanded rail width in px. Defaults to 240. */\n  sidebarWidth?: number;\n  /** Collapsed rail width in px. Defaults to 56. */\n  collapsedWidth?: number;\n  /** Accessible label for the mobile navigation drawer. Defaults to \"Navigation\". */\n  mobileSidebarLabel?: string;\n\n  // ── Body ─────────────────────────────────────────────────\n  /** Fixed header row, left side (breadcrumb, title, tabs). */\n  bodyHeader?: ReactNode;\n  /** Fixed header row, right side (entity actions) — same row as bodyHeader. */\n  bodyActions?: ReactNode;\n  /** Optional independent-scroll pane (e.g. a tree). Renders a SplitPane vs body-main. */\n  bodySidebar?: ReactNode;\n  /** bodySidebar width as a percent when present. Defaults to 24. */\n  bodySplit?: number;\n  /** Main content (body-main); fills the remaining space and scrolls. */\n  children: ReactNode;\n  /** Centers content at responsive wide breakpoints, or allows it to fill the workspace. */\n  contentWidth?: ContentWidth;\n\n  /**\n   * Outlines every slot in its own colour and labels it with its `data-slot`\n   * name — a layout-debugging aid for working out which region owns a given\n   * area or scrollbar. Uses `outline`, so enabling it does not shift layout.\n   */\n  debugSlots?: boolean;\n\n  className?: string;\n  headerClassName?: string;\n  toolbarClassName?: string;\n  sidebarClassName?: string;\n  bodyHeaderClassName?: string;\n  contentClassName?: string;\n};\n\nfunction readStored(key: string | undefined): string | null {\n  if (!key || typeof window === \"undefined\") return null;\n  return window.localStorage.getItem(key);\n}\n\nexport function AppShell(props: AppShellProps) {\n  const {\n    brand,\n    nav,\n    search,\n    actions,\n    mobileActions,\n    toolbar,\n    searchMaxWidth = \"28rem\",\n    navSections,\n    sidebar,\n    sidebarHeader,\n    sidebarFooter,\n    collapsible = true,\n    defaultCollapsed = false,\n    collapsedStorageKey,\n    sidebarWidth = 240,\n    collapsedWidth = 56,\n    mobileSidebarLabel = \"Navigation\",\n    bodyHeader,\n    bodyActions,\n    bodySidebar,\n    bodySplit = 24,\n    children,\n    contentWidth = \"contained\",\n    debugSlots = false,\n    className,\n    headerClassName,\n    toolbarClassName,\n    sidebarClassName,\n    bodyHeaderClassName,\n    contentClassName,\n  } = props;\n\n  const hasSidebar = sidebar !== undefined || (navSections?.length ?? 0) > 0;\n  const [mobileSidebarOpen, setMobileSidebarOpen] = useState(false);\n\n  const [collapsed, setCollapsed] = useState(\n    () =>\n      readStored(collapsedStorageKey) === \"true\" ||\n      (readStored(collapsedStorageKey) === null && defaultCollapsed),\n  );\n\n  useEffect(() => {\n    if (collapsedStorageKey && typeof window !== \"undefined\")\n      window.localStorage.setItem(collapsedStorageKey, String(collapsed));\n  }, [collapsed, collapsedStorageKey]);\n\n  useEscapeLayer(mobileSidebarOpen, () => setMobileSidebarOpen(false));\n\n  const railWidth = collapsed ? collapsedWidth : sidebarWidth;\n  const compactActions = mobileActions ?? actions;\n  const hasTopBar =\n    (!hasSidebar && brand !== undefined) ||\n    nav !== undefined ||\n    search !== undefined ||\n    actions !== undefined ||\n    mobileActions !== undefined ||\n    toolbar !== undefined;\n  const hasMobileHeader = hasSidebar;\n  const hasBodyHeader = bodyHeader !== undefined || bodyActions !== undefined;\n  const effectiveContentWidth =\n    bodySidebar === undefined ? contentWidth : \"full\";\n  const renderSidebarContent = (collapsedValue: boolean, onNavigate?: () => void) =>\n    typeof sidebar === \"function\"\n      ? sidebar(collapsedValue)\n      : sidebar !== undefined\n        ? sidebar\n        : navSections && (\n            <NavSections\n              sections={navSections}\n              collapsed={collapsedValue}\n              {...(onNavigate ? { onNavigate } : {})}\n            />\n          );\n\n  return (\n    <div\n      className={cn(\"flex h-full min-h-0 w-full bg-background\", className)}\n      {...(debugSlots ? { \"data-debug-slots\": \"true\" } : {})}\n    >\n      {debugSlots && <AppShellSlotOutlines />}\n      {hasSidebar && (\n        <aside\n          data-slot=\"app-shell-sidebar\"\n          style={{ width: railWidth }}\n          className={cn(\n            \"hidden shrink-0 flex-col overflow-hidden border-r border-sidebar-border bg-sidebar text-sidebar-foreground transition-[width] duration-200 md:flex\",\n            sidebarClassName,\n          )}\n        >\n          <div\n            className={cn(\n              \"flex h-14 shrink-0 items-center border-b border-sidebar-border\",\n              collapsed\n                ? \"justify-center px-2\"\n                : \"justify-between px-density-3\",\n            )}\n          >\n            {!collapsed && brand && (\n              <div data-slot=\"app-shell-brand\" className=\"flex min-w-0 items-center gap-2\">\n                {brand}\n              </div>\n            )}\n            {collapsible && (\n              <button\n                type=\"button\"\n                onClick={() => setCollapsed((c) => !c)}\n                aria-label={collapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n                title={collapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n                className=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n              >\n                <Icon icon={UiSidebar} className=\"h-4 w-4\" />\n              </button>\n            )}\n          </div>\n          {sidebarHeader && (\n            <div\n              data-slot=\"app-shell-sidebar-header\"\n              className=\"shrink-0 border-b border-sidebar-border px-density-3 py-density-2\"\n            >\n              {sidebarHeader}\n            </div>\n          )}\n          <div className=\"min-h-0 flex-1 overflow-y-auto py-density-2\">\n            {renderSidebarContent(collapsed)}\n          </div>\n          {sidebarFooter && (\n            <div\n              data-slot=\"app-shell-sidebar-footer\"\n              className=\"mt-auto shrink-0 border-t border-sidebar-border px-density-3 py-density-2\"\n            >\n              {sidebarFooter}\n            </div>\n          )}\n        </aside>\n      )}\n\n      <div\n        data-slot=\"app-shell-column\"\n        className=\"@container/app-content flex min-h-0 min-w-0 flex-1 flex-col\"\n      >\n        {(hasTopBar || hasMobileHeader) && (\n          <header\n            data-slot=\"app-shell-header\"\n            className=\"shrink-0 border-b border-border bg-card\"\n          >\n            {hasMobileHeader && (\n              <div className=\"flex flex-wrap items-center gap-density-2 px-density-3 py-density-2 md:hidden\">\n                <button\n                  type=\"button\"\n                  aria-label={`Open ${mobileSidebarLabel}`}\n                  title={mobileSidebarLabel}\n                  className=\"inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-border bg-background text-foreground transition-colors hover:bg-accent\"\n                  onClick={() => setMobileSidebarOpen(true)}\n                >\n                  <Icon icon={UiMenu} className=\"h-4 w-4\" />\n                </button>\n                {brand && (\n                  <div className=\"flex min-w-0 flex-1 items-center gap-density-2\">\n                    {brand}\n                  </div>\n                )}\n                {compactActions && (\n                  <div className=\"ml-auto flex min-w-0 shrink items-center justify-end gap-density-2\">\n                    {compactActions}\n                  </div>\n                )}\n                {search !== undefined && (\n                  <div className=\"basis-full min-w-0\">\n                    {search}\n                  </div>\n                )}\n                {nav && (\n                  <div className=\"basis-full min-w-0 overflow-x-auto\">\n                    {nav}\n                  </div>\n                )}\n              </div>\n            )}\n            <div\n              className={cn(\n                \"hidden h-14 items-center gap-density-3 px-density-4 md:flex\",\n                !hasSidebar && \"flex\",\n                headerClassName,\n              )}\n            >\n              {!hasSidebar && brand && (\n                <div\n                  data-slot=\"app-shell-brand\"\n                  className=\"flex shrink-0 items-center gap-density-2\"\n                >\n                  {brand}\n                </div>\n              )}\n              {nav && (\n                <div data-slot=\"app-shell-nav\" className=\"flex shrink-0 items-center\">\n                  {nav}\n                </div>\n              )}\n              {search !== undefined && (\n                <div\n                  data-slot=\"app-shell-search\"\n                  className=\"flex min-w-0 flex-1 justify-center\"\n                >\n                  <div className=\"w-full\" style={{ maxWidth: searchMaxWidth }}>\n                    {search}\n                  </div>\n                </div>\n              )}\n              {search === undefined && <div className=\"flex-1\" />}\n              {actions && (\n                <div\n                  data-slot=\"app-shell-actions\"\n                  className=\"flex shrink-0 items-center gap-density-2\"\n                >\n                  {actions}\n                </div>\n              )}\n            </div>\n            {toolbar && (\n              <div\n                data-slot=\"app-shell-toolbar\"\n                className={cn(\n                  \"flex flex-wrap items-center gap-density-2 border-t border-border bg-muted px-density-3 py-density-2 md:px-density-4\",\n                  toolbarClassName,\n                )}\n              >\n                {toolbar}\n              </div>\n            )}\n          </header>\n        )}\n\n        {hasBodyHeader && (\n          <div\n            data-slot=\"app-shell-body-header\"\n            className={cn(\n              \"shrink-0 border-b border-border bg-card\",\n              bodyHeaderClassName,\n            )}\n          >\n            <div\n              data-slot=\"app-shell-body-header-content\"\n              data-content-width={effectiveContentWidth}\n              className={cn(\n                \"flex flex-col items-stretch gap-density-2 px-density-3 py-density-2 md:flex-row md:items-start md:justify-between md:gap-density-3 md:px-density-4\",\n                contentWidthClassName(effectiveContentWidth),\n              )}\n            >\n              <div className=\"min-w-0 flex-1\">{bodyHeader}</div>\n              {bodyActions && (\n                <div\n                  data-slot=\"app-shell-body-actions\"\n                  className=\"flex shrink-0 flex-wrap items-center gap-density-2\"\n                >\n                  {bodyActions}\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n\n        {bodySidebar !== undefined ? (\n          <>\n            <div className=\"flex min-h-0 flex-1 flex-col overflow-hidden md:hidden\">\n              <div\n                data-slot=\"app-shell-body-sidebar\"\n                className=\"max-h-[40vh] shrink-0 overflow-y-auto border-b border-border bg-background\"\n              >\n                {bodySidebar}\n              </div>\n              <main\n                data-slot=\"app-shell-main\"\n                className={cn(\n                  \"min-h-0 min-w-0 flex-1 overflow-auto\",\n                  contentClassName,\n                )}\n              >\n                {children}\n              </main>\n            </div>\n            <SplitPane\n              className=\"hidden min-h-0 flex-1 md:flex\"\n              defaultSplit={bodySplit}\n              minLeft={12}\n              minRight={30}\n              left={<div data-slot=\"app-shell-body-sidebar\" className=\"h-full\">{bodySidebar}</div>}\n              right={\n                <div\n                  data-slot=\"app-shell-main\"\n                  className={cn(\"h-full min-w-0\", contentClassName)}\n                >\n                  {children}\n                </div>\n              }\n              rightClass=\"overflow-y-auto\"\n            />\n          </>\n        ) : (\n          <main\n            data-slot=\"app-shell-main\"\n            className={cn(\n              \"min-h-0 min-w-0 flex-1 overflow-auto\",\n              contentClassName,\n            )}\n          >\n            <div\n              data-slot=\"app-shell-content\"\n              data-content-width={contentWidth}\n              className={cn(contentWidthClassName(contentWidth), \"h-full\")}\n            >\n              {children}\n            </div>\n          </main>\n        )}\n      </div>\n      {hasSidebar && mobileSidebarOpen && (\n        <div\n          className=\"fixed inset-0 z-50 md:hidden\"\n          role=\"presentation\"\n          onClick={() => setMobileSidebarOpen(false)}\n        >\n          <div className=\"absolute inset-0 bg-black/40\" />\n          <aside\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={mobileSidebarLabel}\n            className={cn(\n              \"relative z-10 flex h-full w-[min(20rem,85vw)] flex-col overflow-hidden border-r border-sidebar-border bg-sidebar text-sidebar-foreground shadow-xl\",\n              sidebarClassName,\n            )}\n            onClick={(event) => event.stopPropagation()}\n          >\n            <div className=\"flex h-14 shrink-0 items-center justify-between border-b border-sidebar-border px-density-3\">\n              {brand && <div className=\"flex min-w-0 items-center gap-2\">{brand}</div>}\n              <button\n                type=\"button\"\n                aria-label={`Close ${mobileSidebarLabel}`}\n                title=\"Close\"\n                className=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n                onClick={() => setMobileSidebarOpen(false)}\n              >\n                <Icon icon={UiClose} className=\"h-4 w-4\" />\n              </button>\n            </div>\n            {sidebarHeader && (\n              <div className=\"shrink-0 border-b border-sidebar-border px-density-3 py-density-2\">\n                {sidebarHeader}\n              </div>\n            )}\n            <div className=\"min-h-0 flex-1 overflow-y-auto py-density-2\">\n              {renderSidebarContent(false, () => setMobileSidebarOpen(false))}\n            </div>\n            {sidebarFooter && (\n              <div className=\"mt-auto shrink-0 border-t border-sidebar-border px-density-3 py-density-2\">\n                {sidebarFooter}\n              </div>\n            )}\n          </aside>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["contentWidth","useState","useEffect","useEscapeLayer","jsx","NavSections","jsxs","cn","AppShellSlotOutlines","Icon","UiSidebar","UiMenu","contentWidthClassName","Fragment","SplitPane","UiClose"],"mappings":";;;;;;;;;;;;;;AAgHA,SAAS,WAAW,KAAwC;AAC1D,MAAI,CAAC,OAAO,OAAO,WAAW,YAAa,QAAO;AAClD,SAAO,OAAO,aAAa,QAAQ,GAAG;AACxC;AAEO,SAAS,SAAS,OAAsB;AAC7C,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IACjB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB;AAAA,IACA,eAAe;AAAA,IACf,iBAAiB;AAAA,IACjB,qBAAqB;AAAA,IACrB;AAAA,IACA;AAAA,IACA;AAAA,IACA,YAAY;AAAA,IACZ;AAAA,IAAA,cACAA,iBAAe;AAAA,IACf,aAAa;AAAA,IACb;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,IACE;AAEJ,QAAM,aAAa,YAAY,YAAc,2CAAa,WAAU,KAAK;AACzE,QAAM,CAAC,mBAAmB,oBAAoB,IAAIC,MAAAA,SAAS,KAAK;AAEhE,QAAM,CAAC,WAAW,YAAY,IAAIA,MAAAA;AAAAA,IAChC,MACE,WAAW,mBAAmB,MAAM,UACnC,WAAW,mBAAmB,MAAM,QAAQ;AAAA,EAAA;AAGjDC,QAAAA,UAAU,MAAM;AACd,QAAI,uBAAuB,OAAO,WAAW;AAC3C,aAAO,aAAa,QAAQ,qBAAqB,OAAO,SAAS,CAAC;AAAA,EACtE,GAAG,CAAC,WAAW,mBAAmB,CAAC;AAEnCC,aAAAA,eAAe,mBAAmB,MAAM,qBAAqB,KAAK,CAAC;AAEnE,QAAM,YAAY,YAAY,iBAAiB;AAC/C,QAAM,iBAAiB,iBAAiB;AACxC,QAAM,YACH,CAAC,cAAc,UAAU,UAC1B,QAAQ,UACR,WAAW,UACX,YAAY,UACZ,kBAAkB,UAClB,YAAY;AACd,QAAM,kBAAkB;AACxB,QAAM,gBAAgB,eAAe,UAAa,gBAAgB;AAClE,QAAM,wBACJ,gBAAgB,SAAYH,iBAAe;AAC7C,QAAM,uBAAuB,CAAC,gBAAyB,eACrD,OAAO,YAAY,aACf,QAAQ,cAAc,IACtB,YAAY,SACV,UACA,eACEI,2BAAAA;AAAAA,IAACC,aAAAA;AAAAA,IAAA;AAAA,MACC,UAAU;AAAA,MACV,WAAW;AAAA,MACV,GAAI,aAAa,EAAE,eAAe,CAAA;AAAA,IAAC;AAAA,EAAA;AAIhD,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,MAAAA,GAAG,4CAA4C,SAAS;AAAA,MAClE,GAAI,aAAa,EAAE,oBAAoB,OAAA,IAAW,CAAA;AAAA,MAElD,UAAA;AAAA,QAAA,6CAAeC,eAAAA,sBAAA,EAAqB;AAAA,QACpC,cACCF,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAU;AAAA,YACV,OAAO,EAAE,OAAO,UAAA;AAAA,YAChB,WAAWC,MAAAA;AAAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,YAGF,UAAA;AAAA,cAAAD,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAWC,MAAAA;AAAAA,oBACT;AAAA,oBACA,YACI,wBACA;AAAA,kBAAA;AAAA,kBAGL,UAAA;AAAA,oBAAA,CAAC,aAAa,SACbH,2BAAAA,IAAC,OAAA,EAAI,aAAU,mBAAkB,WAAU,mCACxC,UAAA,MAAA,CACH;AAAA,oBAED,eACCA,2BAAAA;AAAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,MAAK;AAAA,wBACL,SAAS,MAAM,aAAa,CAAC,MAAM,CAAC,CAAC;AAAA,wBACrC,cAAY,YAAY,mBAAmB;AAAA,wBAC3C,OAAO,YAAY,mBAAmB;AAAA,wBACtC,WAAU;AAAA,wBAEV,UAAAA,2BAAAA,IAACK,WAAA,EAAK,MAAMC,UAAAA,WAAW,WAAU,UAAA,CAAU;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBAC7C;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGH,iBACCN,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,aAAU;AAAA,kBACV,WAAU;AAAA,kBAET,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,6CAGJ,OAAA,EAAI,WAAU,+CACZ,UAAA,qBAAqB,SAAS,GACjC;AAAA,cACC,iBACCA,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,aAAU;AAAA,kBACV,WAAU;AAAA,kBAET,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YACH;AAAA,UAAA;AAAA,QAAA;AAAA,QAKNE,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,aAAU;AAAA,YACV,WAAU;AAAA,YAER,UAAA;AAAA,eAAA,aAAa,oBACbA,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,aAAU;AAAA,kBACV,WAAU;AAAA,kBAET,UAAA;AAAA,oBAAA,mBACCA,2BAAAA,KAAC,OAAA,EAAI,WAAU,iFACb,UAAA;AAAA,sBAAAF,2BAAAA;AAAAA,wBAAC;AAAA,wBAAA;AAAA,0BACC,MAAK;AAAA,0BACL,cAAY,QAAQ,kBAAkB;AAAA,0BACtC,OAAO;AAAA,0BACP,WAAU;AAAA,0BACV,SAAS,MAAM,qBAAqB,IAAI;AAAA,0BAExC,UAAAA,2BAAAA,IAACK,WAAA,EAAK,MAAME,OAAAA,QAAQ,WAAU,UAAA,CAAU;AAAA,wBAAA;AAAA,sBAAA;AAAA,sBAEzC,SACCP,2BAAAA,IAAC,OAAA,EAAI,WAAU,kDACZ,UAAA,OACH;AAAA,sBAED,kBACCA,2BAAAA,IAAC,OAAA,EAAI,WAAU,sEACZ,UAAA,gBACH;AAAA,sBAED,WAAW,UACVA,2BAAAA,IAAC,OAAA,EAAI,WAAU,sBACZ,UAAA,QACH;AAAA,sBAED,OACCA,2BAAAA,IAAC,OAAA,EAAI,WAAU,sCACZ,UAAA,IAAA,CACH;AAAA,oBAAA,GAEJ;AAAA,oBAEFE,2BAAAA;AAAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,WAAWC,MAAAA;AAAAA,0BACT;AAAA,0BACA,CAAC,cAAc;AAAA,0BACf;AAAA,wBAAA;AAAA,wBAGD,UAAA;AAAA,0BAAA,CAAC,cAAc,SACdH,2BAAAA;AAAAA,4BAAC;AAAA,4BAAA;AAAA,8BACC,aAAU;AAAA,8BACV,WAAU;AAAA,8BAET,UAAA;AAAA,4BAAA;AAAA,0BAAA;AAAA,0BAGJ,OACCA,2BAAAA,IAAC,OAAA,EAAI,aAAU,iBAAgB,WAAU,8BACtC,UAAA,KACH;AAAA,0BAED,WAAW,UACVA,2BAAAA;AAAAA,4BAAC;AAAA,4BAAA;AAAA,8BACC,aAAU;AAAA,8BACV,WAAU;AAAA,8BAEV,UAAAA,2BAAAA,IAAC,SAAI,WAAU,UAAS,OAAO,EAAE,UAAU,kBACxC,UAAA,OAAA,CACH;AAAA,4BAAA;AAAA,0BAAA;AAAA,0BAGH,WAAW,UAAaA,2BAAAA,IAAC,OAAA,EAAI,WAAU,UAAS;AAAA,0BAChD,WACCA,2BAAAA;AAAAA,4BAAC;AAAA,4BAAA;AAAA,8BACC,aAAU;AAAA,8BACV,WAAU;AAAA,8BAET,UAAA;AAAA,4BAAA;AAAA,0BAAA;AAAA,wBACH;AAAA,sBAAA;AAAA,oBAAA;AAAA,oBAGH,WACCA,2BAAAA;AAAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,aAAU;AAAA,wBACV,WAAWG,MAAAA;AAAAA,0BACT;AAAA,0BACA;AAAA,wBAAA;AAAA,wBAGD,UAAA;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACH;AAAA,gBAAA;AAAA,cAAA;AAAA,cAKL,iBACCH,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,aAAU;AAAA,kBACV,WAAWG,MAAAA;AAAAA,oBACT;AAAA,oBACA;AAAA,kBAAA;AAAA,kBAGF,UAAAD,2BAAAA;AAAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,aAAU;AAAA,sBACV,sBAAoB;AAAA,sBACpB,WAAWC,MAAAA;AAAAA,wBACT;AAAA,wBACAK,aAAAA,sBAAsB,qBAAqB;AAAA,sBAAA;AAAA,sBAG7C,UAAA;AAAA,wBAAAR,2BAAAA,IAAC,OAAA,EAAI,WAAU,kBAAkB,UAAA,YAAW;AAAA,wBAC3C,eACCA,2BAAAA;AAAAA,0BAAC;AAAA,0BAAA;AAAA,4BACC,aAAU;AAAA,4BACV,WAAU;AAAA,4BAET,UAAA;AAAA,0BAAA;AAAA,wBAAA;AAAA,sBACH;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBAEJ;AAAA,cAAA;AAAA,cAIH,gBAAgB,SACfE,2BAAAA,KAAAO,WAAAA,UAAA,EACE,UAAA;AAAA,gBAAAP,2BAAAA,KAAC,OAAA,EAAI,WAAU,0DACb,UAAA;AAAA,kBAAAF,2BAAAA;AAAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,aAAU;AAAA,sBACV,WAAU;AAAA,sBAET,UAAA;AAAA,oBAAA;AAAA,kBAAA;AAAA,kBAEHA,2BAAAA;AAAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,aAAU;AAAA,sBACV,WAAWG,MAAAA;AAAAA,wBACT;AAAA,wBACA;AAAA,sBAAA;AAAA,sBAGD;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACH,GACF;AAAA,gBACAH,2BAAAA;AAAAA,kBAACU,UAAAA;AAAAA,kBAAA;AAAA,oBACC,WAAU;AAAA,oBACV,cAAc;AAAA,oBACd,SAAS;AAAA,oBACT,UAAU;AAAA,oBACV,MAAMV,2BAAAA,IAAC,OAAA,EAAI,aAAU,0BAAyB,WAAU,UAAU,UAAA,aAAY;AAAA,oBAC9E,OACEA,2BAAAA;AAAAA,sBAAC;AAAA,sBAAA;AAAA,wBACC,aAAU;AAAA,wBACV,WAAWG,MAAAA,GAAG,kBAAkB,gBAAgB;AAAA,wBAE/C;AAAA,sBAAA;AAAA,oBAAA;AAAA,oBAGL,YAAW;AAAA,kBAAA;AAAA,gBAAA;AAAA,cACb,EAAA,CACF,IAEAH,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,aAAU;AAAA,kBACV,WAAWG,MAAAA;AAAAA,oBACT;AAAA,oBACA;AAAA,kBAAA;AAAA,kBAGF,UAAAH,2BAAAA;AAAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,aAAU;AAAA,sBACV,sBAAoBJ;AAAAA,sBACpB,WAAWO,MAAAA,GAAGK,aAAAA,sBAAsBZ,cAAY,GAAG,QAAQ;AAAA,sBAE1D;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACH;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,QAAA;AAAA,QAGH,cAAc,qBACbM,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAU;AAAA,YACV,MAAK;AAAA,YACL,SAAS,MAAM,qBAAqB,KAAK;AAAA,YAEzC,UAAA;AAAA,cAAAF,2BAAAA,IAAC,OAAA,EAAI,WAAU,+BAAA,CAA+B;AAAA,cAC9CE,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,cAAW;AAAA,kBACX,cAAY;AAAA,kBACZ,WAAWC,MAAAA;AAAAA,oBACT;AAAA,oBACA;AAAA,kBAAA;AAAA,kBAEF,SAAS,CAAC,UAAU,MAAM,gBAAA;AAAA,kBAE1B,UAAA;AAAA,oBAAAD,2BAAAA,KAAC,OAAA,EAAI,WAAU,+FACZ,UAAA;AAAA,sBAAA,SAASF,2BAAAA,IAAC,OAAA,EAAI,WAAU,mCAAmC,UAAA,OAAM;AAAA,sBAClEA,2BAAAA;AAAAA,wBAAC;AAAA,wBAAA;AAAA,0BACC,MAAK;AAAA,0BACL,cAAY,SAAS,kBAAkB;AAAA,0BACvC,OAAM;AAAA,0BACN,WAAU;AAAA,0BACV,SAAS,MAAM,qBAAqB,KAAK;AAAA,0BAEzC,UAAAA,2BAAAA,IAACK,WAAA,EAAK,MAAMM,QAAAA,SAAS,WAAU,UAAA,CAAU;AAAA,wBAAA;AAAA,sBAAA;AAAA,oBAC3C,GACF;AAAA,oBACC,iBACCX,2BAAAA,IAAC,OAAA,EAAI,WAAU,qEACZ,UAAA,eACH;AAAA,oBAEFA,2BAAAA,IAAC,OAAA,EAAI,WAAU,+CACZ,UAAA,qBAAqB,OAAO,MAAM,qBAAqB,KAAK,CAAC,EAAA,CAChE;AAAA,oBACC,iBACCA,2BAAAA,IAAC,OAAA,EAAI,WAAU,6EACZ,UAAA,cAAA,CACH;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YAEJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA;AAIR;;"}
+{"version":3,"file":"AppShell.cjs","sources":["../../src/layout/AppShell.tsx"],"sourcesContent":["import { useEffect, useState, type ReactNode } from \"react\";\nimport { cn } from \"../lib/utils\";\nimport { Icon, type StaticIconComponent } from \"../data/Icon\";\nimport { UiClose, UiMenu, UiSidebar } from \"../icons\";\nimport { useEscapeLayer } from \"../overlay/modalStack\";\nimport { SplitPane } from \"./SplitPane\";\nimport { AppShellSlotOutlines } from \"./AppShell.debug\";\nimport { NavSections, type GroupState } from \"./AppShell.nav\";\nimport {\n  contentWidthClassName,\n  type ContentWidth,\n} from \"./content-width\";\n\n// AppShell is a sidebar-first application shell. The full-height DARK nav rail\n// owns the brand + collapse toggle and renders grouped nav sections; the top bar\n// (search, actions) sits to the RIGHT of the rail — there is no full-width top\n// bar when a rail is present. With no rail, the top bar spans full width. The\n// body carries a fixed bodyHeader + bodyActions row over an optional\n// bodySidebar | body-main split (body-main scrolls; bodySidebar — e.g. a tree —\n// scrolls independently via a resizable SplitPane).\n\nexport type AppShellNavItem = {\n  /** Stable key; also the React key. */\n  key: string;\n  /** Visible label (hidden when the rail is collapsed). */\n  label: ReactNode;\n  /** Leading icon (icon name or component). */\n  icon?: string | StaticIconComponent;\n  /** Highlights the item as the current location. */\n  active?: boolean;\n  /** Routing destination; rendered as an anchor via the RouterAdapter. */\n  to: string;\n  /** Opens `to` in a new tab. */\n  external?: boolean;\n  /** Trailing adornment (count, status dot). */\n  badge?: ReactNode;\n};\n\nexport type AppShellNavGroup = {\n  /** Stable key; also the key its collapsed state persists under. */\n  key: string;\n  /** Group heading rendered on the toggle row. */\n  label: string;\n  /** Leading icon (icon name or component). */\n  icon?: string | StaticIconComponent;\n  /** Folded on first render until the user toggles it. */\n  defaultCollapsed?: boolean;\n  /**\n   * Keeps the group open regardless of stored state, so a deep-linked\n   * destination can never hide under a folder the user collapsed earlier.\n   * Mirrors `Tree.revealSelected`: set it on the active item's ancestors.\n   */\n  forceExpanded?: boolean;\n  items: AppShellNavItem[];\n  /**\n   * Nested sub-groups, rendered after `items` at one further indent. Groups\n   * nest arbitrarily, so a backend hierarchy deeper than two levels does not\n   * have to be flattened to fit the rail.\n   */\n  groups?: AppShellNavGroup[];\n  /**\n   * Makes the group's own heading row a destination as well as a disclosure:\n   * the label becomes a nav link and the chevron sits beside it as a separate\n   * control. Needed wherever a node is both a folder and a leaf — e.g. a\n   * profile named `jms` that is runnable *and* the parent of `jms.incoming`.\n   */\n  item?: AppShellNavItem;\n};\n\nexport type AppShellNavSection = {\n  /** Section heading; collapses to a divider when the rail is collapsed. */\n  label?: string;\n  items?: AppShellNavItem[];\n  /** Collapsible groups rendered after the flat items. High-cardinality\n   *  clusters (provider surfaces, per-ledger journals) belong here so they can\n   *  be folded away; a collapsed rail flattens them back to plain items. */\n  groups?: AppShellNavGroup[];\n  /**\n   * How the groups read.\n   *\n   * `\"list\"` (the default) styles each group heading as a small uppercase\n   * cluster label — right for a handful of named clusters under one section.\n   *\n   * `\"tree\"` styles headings as ordinary nav rows, because in a tree a folder\n   * sits at the same level as its sibling destinations: a group carrying an\n   * `item` renders as a link either way, so an uppercase heading beside it\n   * would make two nodes of the same kind look like different things.\n   */\n  variant?: \"list\" | \"tree\";\n};\n\nexport type AppShellProps = {\n  // ── Top bar (right of the rail; full width when no rail) ─\n  /** Brand mark / wordmark. Shown in the rail header when a rail is present, else in the top bar. */\n  brand?: ReactNode;\n  /** Inline primary nav (e.g. tabs) shown after the brand in the top bar. */\n  nav?: ReactNode;\n  /** Centered search slot; grows to fill and is width-capped. */\n  search?: ReactNode;\n  /** Right-aligned cluster (icon buttons, settings/org picker, …). */\n  actions?: ReactNode;\n  /** Compact action cluster used in the mobile header. Defaults to `actions`. */\n  mobileActions?: ReactNode;\n  /** Optional second top-bar row for filters / bulk actions. */\n  toolbar?: ReactNode;\n  /** Max width of the centered search slot. Defaults to 28rem. */\n  searchMaxWidth?: string | number;\n\n  // ── Left nav rail (dark, collapsible, fixed width) ───────\n  /** Declarative nav sections rendered into the rail (collapse-aware). */\n  navSections?: AppShellNavSection[];\n  /** Custom sidebar content; receives the collapsed flag. Overrides navSections. */\n  sidebar?: ReactNode | ((collapsed: boolean) => ReactNode);\n  /** Pinned below the rail header (e.g. a context switcher). */\n  sidebarHeader?: ReactNode;\n  /** Pinned to the bottom of the rail (version, account). */\n  sidebarFooter?: ReactNode;\n  /** Show the collapse toggle. Defaults to true when a rail is present. */\n  collapsible?: boolean;\n  /** Initial collapsed state (uncontrolled). */\n  defaultCollapsed?: boolean;\n  /** localStorage key persisting the collapsed state. */\n  collapsedStorageKey?: string;\n  /** localStorage key persisting per-group collapsed state. */\n  groupCollapsedStorageKey?: string;\n  /** Expanded rail width in px. Defaults to 240. */\n  sidebarWidth?: number;\n  /** Collapsed rail width in px. Defaults to 56. */\n  collapsedWidth?: number;\n  /** Accessible label for the mobile navigation drawer. Defaults to \"Navigation\". */\n  mobileSidebarLabel?: string;\n\n  // ── Body ─────────────────────────────────────────────────\n  /** Fixed header row, left side (breadcrumb, title, tabs). */\n  bodyHeader?: ReactNode;\n  /** Fixed header row, right side (entity actions) — same row as bodyHeader. */\n  bodyActions?: ReactNode;\n  /** Optional independent-scroll pane (e.g. a tree). Renders a SplitPane vs body-main. */\n  bodySidebar?: ReactNode;\n  /** bodySidebar width as a percent when present. Defaults to 24. */\n  bodySplit?: number;\n  /** Main content (body-main); fills the remaining space and scrolls. */\n  children: ReactNode;\n  /** Centers content at responsive wide breakpoints, or allows it to fill the workspace. */\n  contentWidth?: ContentWidth;\n\n  /**\n   * Outlines every slot in its own colour and labels it with its `data-slot`\n   * name — a layout-debugging aid for working out which region owns a given\n   * area or scrollbar. Uses `outline`, so enabling it does not shift layout.\n   */\n  debugSlots?: boolean;\n\n  className?: string;\n  headerClassName?: string;\n  toolbarClassName?: string;\n  sidebarClassName?: string;\n  bodyHeaderClassName?: string;\n  contentClassName?: string;\n};\n\nfunction readStored(key: string | undefined): string | null {\n  if (!key || typeof window === \"undefined\") return null;\n  return window.localStorage.getItem(key);\n}\n\nconst DEFAULT_GROUP_COLLAPSE_KEY = \"clicky-ui:app-shell:groups\";\n\nfunction readGroupState(storageKey: string): Record<string, boolean> {\n  if (typeof window === \"undefined\") return {};\n  try {\n    const raw = window.localStorage.getItem(storageKey);\n    if (!raw) return {};\n    const parsed = JSON.parse(raw);\n    return parsed && typeof parsed === \"object\"\n      ? (parsed as Record<string, boolean>)\n      : {};\n  } catch {\n    return {};\n  }\n}\n\n// Lives here rather than in AppShell.nav so a single instance can be shared by\n// both NavSections renders (rail + mobile drawer).\nfunction useGroupCollapsed(storageKey: string): GroupState {\n  const [state, setState] = useState<Record<string, boolean>>(() =>\n    readGroupState(storageKey),\n  );\n  useEffect(() => {\n    if (typeof window === \"undefined\") return;\n    try {\n      window.localStorage.setItem(storageKey, JSON.stringify(state));\n    } catch {\n      // Rail state is a UX nicety; private-mode storage failures are safe to swallow.\n    }\n  }, [state, storageKey]);\n  return {\n    isCollapsed: (key, fallback) => state[key] ?? fallback,\n    toggle: (key, fallback) =>\n      setState((prev) => ({ ...prev, [key]: !(prev[key] ?? fallback) })),\n  };\n}\n\nexport function AppShell(props: AppShellProps) {\n  const {\n    brand,\n    nav,\n    search,\n    actions,\n    mobileActions,\n    toolbar,\n    searchMaxWidth = \"28rem\",\n    navSections,\n    sidebar,\n    sidebarHeader,\n    sidebarFooter,\n    collapsible = true,\n    defaultCollapsed = false,\n    collapsedStorageKey,\n    groupCollapsedStorageKey,\n    sidebarWidth = 240,\n    collapsedWidth = 56,\n    mobileSidebarLabel = \"Navigation\",\n    bodyHeader,\n    bodyActions,\n    bodySidebar,\n    bodySplit = 24,\n    children,\n    contentWidth = \"contained\",\n    debugSlots = false,\n    className,\n    headerClassName,\n    toolbarClassName,\n    sidebarClassName,\n    bodyHeaderClassName,\n    contentClassName,\n  } = props;\n\n  const hasSidebar = sidebar !== undefined || (navSections?.length ?? 0) > 0;\n  const [mobileSidebarOpen, setMobileSidebarOpen] = useState(false);\n\n  const [collapsed, setCollapsed] = useState(\n    () =>\n      readStored(collapsedStorageKey) === \"true\" ||\n      (readStored(collapsedStorageKey) === null && defaultCollapsed),\n  );\n\n  useEffect(() => {\n    if (collapsedStorageKey && typeof window !== \"undefined\")\n      window.localStorage.setItem(collapsedStorageKey, String(collapsed));\n  }, [collapsed, collapsedStorageKey]);\n\n  useEscapeLayer(mobileSidebarOpen, () => setMobileSidebarOpen(false));\n\n  // One instance for the rail AND the mobile drawer: both render NavSections,\n  // and per-render state behind a shared storage key would desync.\n  const groupState = useGroupCollapsed(\n    groupCollapsedStorageKey ?? DEFAULT_GROUP_COLLAPSE_KEY,\n  );\n\n  const railWidth = collapsed ? collapsedWidth : sidebarWidth;\n  const hasTopBar =\n    (!hasSidebar && brand !== undefined) ||\n    nav !== undefined ||\n    search !== undefined ||\n    actions !== undefined ||\n    mobileActions !== undefined ||\n    toolbar !== undefined;\n  const hasMobileHeader = hasSidebar;\n  const hasBodyHeader = bodyHeader !== undefined || bodyActions !== undefined;\n  const effectiveContentWidth =\n    bodySidebar === undefined ? contentWidth : \"full\";\n  const renderSidebarContent = (collapsedValue: boolean, onNavigate?: () => void) =>\n    typeof sidebar === \"function\"\n      ? sidebar(collapsedValue)\n      : sidebar !== undefined\n        ? sidebar\n        : navSections && (\n            <NavSections\n              sections={navSections}\n              collapsed={collapsedValue}\n              groupState={groupState}\n              {...(onNavigate ? { onNavigate } : {})}\n            />\n          );\n\n  return (\n    <div\n      className={cn(\"flex h-full min-h-0 w-full bg-background\", className)}\n      {...(debugSlots ? { \"data-debug-slots\": \"true\" } : {})}\n    >\n      {debugSlots && <AppShellSlotOutlines />}\n      {hasSidebar && (\n        <aside\n          data-slot=\"app-shell-sidebar\"\n          style={{ width: railWidth }}\n          className={cn(\n            \"hidden shrink-0 flex-col overflow-hidden border-r border-sidebar-border bg-sidebar text-sidebar-foreground transition-[width] duration-200 md:flex\",\n            sidebarClassName,\n          )}\n        >\n          <div\n            className={cn(\n              \"flex h-14 shrink-0 items-center border-b border-sidebar-border\",\n              collapsed\n                ? \"justify-center px-2\"\n                : \"justify-between px-density-3\",\n            )}\n          >\n            {!collapsed && brand && (\n              <div data-slot=\"app-shell-brand\" className=\"flex min-w-0 items-center gap-2\">\n                {brand}\n              </div>\n            )}\n            {collapsible && (\n              <button\n                type=\"button\"\n                onClick={() => setCollapsed((c) => !c)}\n                aria-label={collapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n                title={collapsed ? \"Expand sidebar\" : \"Collapse sidebar\"}\n                className=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n              >\n                <Icon icon={UiSidebar} className=\"h-4 w-4\" />\n              </button>\n            )}\n          </div>\n          {sidebarHeader && (\n            <div\n              data-slot=\"app-shell-sidebar-header\"\n              className=\"shrink-0 border-b border-sidebar-border px-density-3 py-density-2\"\n            >\n              {sidebarHeader}\n            </div>\n          )}\n          <div className=\"min-h-0 flex-1 overflow-y-auto py-density-2\">\n            {renderSidebarContent(collapsed)}\n          </div>\n          {sidebarFooter && (\n            <div\n              data-slot=\"app-shell-sidebar-footer\"\n              className=\"mt-auto shrink-0 border-t border-sidebar-border px-density-3 py-density-2\"\n            >\n              {sidebarFooter}\n            </div>\n          )}\n        </aside>\n      )}\n\n      <div\n        data-slot=\"app-shell-column\"\n        className=\"@container/app-content flex min-h-0 min-w-0 flex-1 flex-col\"\n      >\n        {(hasTopBar || hasMobileHeader) && (\n          <header\n            data-slot=\"app-shell-header\"\n            className=\"shrink-0 border-b border-border bg-card\"\n          >\n            <div\n              className={cn(\n                hasSidebar\n                  ? \"flex flex-wrap items-center gap-density-2 px-density-3 py-density-2 md:h-14 md:flex-nowrap md:gap-density-3 md:px-density-4 md:py-0\"\n                  : \"flex h-14 items-center gap-density-3 px-density-4\",\n                headerClassName,\n              )}\n            >\n              {hasSidebar && (\n                <button\n                  type=\"button\"\n                  aria-label={`Open ${mobileSidebarLabel}`}\n                  title={mobileSidebarLabel}\n                  className=\"inline-flex h-9 w-9 shrink-0 items-center justify-center rounded-md border border-border bg-background text-foreground transition-colors hover:bg-accent md:hidden\"\n                  onClick={() => setMobileSidebarOpen(true)}\n                >\n                  <Icon icon={UiMenu} className=\"h-4 w-4\" />\n                </button>\n              )}\n              {brand && (\n                <div\n                  data-slot=\"app-shell-brand\"\n                  className={cn(\n                    \"min-w-0 items-center gap-density-2\",\n                    hasSidebar ? \"flex flex-1 md:hidden\" : \"flex shrink-0\",\n                  )}\n                >\n                  {brand}\n                </div>\n              )}\n              {nav && (\n                <div\n                  data-slot=\"app-shell-nav\"\n                  className={cn(\n                    \"flex min-w-0 items-center\",\n                    hasSidebar &&\n                      \"order-3 basis-full overflow-x-auto md:order-none md:basis-auto md:overflow-visible\",\n                  )}\n                >\n                  {nav}\n                </div>\n              )}\n              {search !== undefined && (\n                <div\n                  data-slot=\"app-shell-search\"\n                  className={cn(\n                    \"flex min-w-0 flex-1 justify-center\",\n                    hasSidebar &&\n                      \"order-2 basis-full md:order-none md:basis-auto md:flex-1\",\n                  )}\n                >\n                  <div className=\"w-full\" style={{ maxWidth: searchMaxWidth }}>\n                    {search}\n                  </div>\n                </div>\n              )}\n              {search === undefined && (\n                <div className={cn(\"flex-1\", hasSidebar && \"hidden md:block\")} />\n              )}\n              {(actions !== undefined || (hasSidebar && mobileActions !== undefined)) && (\n                <div\n                  data-slot=\"app-shell-actions\"\n                  className={cn(\n                    \"flex shrink-0 items-center gap-density-2\",\n                    hasSidebar && \"order-1 ml-auto md:order-none md:ml-0\",\n                  )}\n                >\n                  {!hasSidebar || mobileActions === undefined ? (\n                    actions\n                  ) : (\n                    <>\n                      <div className=\"hidden items-center gap-density-2 md:flex\">\n                        {actions}\n                      </div>\n                      <div className=\"flex items-center gap-density-2 md:hidden\">\n                        {mobileActions}\n                      </div>\n                    </>\n                  )}\n                </div>\n              )}\n            </div>\n            {toolbar && (\n              <div\n                data-slot=\"app-shell-toolbar\"\n                className={cn(\n                  \"flex flex-wrap items-center gap-density-2 border-t border-border bg-muted px-density-3 py-density-2 md:px-density-4\",\n                  toolbarClassName,\n                )}\n              >\n                {toolbar}\n              </div>\n            )}\n          </header>\n        )}\n\n        {hasBodyHeader && (\n          <div\n            data-slot=\"app-shell-body-header\"\n            className={cn(\n              \"shrink-0 border-b border-border bg-card\",\n              bodyHeaderClassName,\n            )}\n          >\n            <div\n              data-slot=\"app-shell-body-header-content\"\n              data-content-width={effectiveContentWidth}\n              className={cn(\n                \"flex flex-col items-stretch gap-density-2 px-density-3 py-density-2 md:flex-row md:items-start md:justify-between md:gap-density-3 md:px-density-4\",\n                contentWidthClassName(effectiveContentWidth),\n              )}\n            >\n              <div className=\"min-w-0 flex-1\">{bodyHeader}</div>\n              {bodyActions && (\n                <div\n                  data-slot=\"app-shell-body-actions\"\n                  className=\"flex shrink-0 flex-wrap items-center gap-density-2\"\n                >\n                  {bodyActions}\n                </div>\n              )}\n            </div>\n          </div>\n        )}\n\n        {bodySidebar !== undefined ? (\n          <SplitPane\n            stackOnMobile\n            className=\"min-h-0 flex-1\"\n            defaultSplit={bodySplit}\n            minLeft={12}\n            minRight={30}\n            left={\n              <div\n                data-slot=\"app-shell-body-sidebar\"\n                className=\"h-full\"\n              >\n                {bodySidebar}\n              </div>\n            }\n            right={\n              <main\n                data-slot=\"app-shell-main\"\n                className={cn(\n                  \"h-full min-h-0 min-w-0 overflow-auto\",\n                  contentClassName,\n                )}\n              >\n                {children}\n              </main>\n            }\n            leftClass=\"max-h-[40vh] shrink-0 border-b border-border md:max-h-none md:border-b-0\"\n            rightClass=\"min-h-0 flex-1 md:flex-none\"\n          />\n        ) : (\n          <main\n            data-slot=\"app-shell-main\"\n            className={cn(\n              \"min-h-0 min-w-0 flex-1 overflow-auto\",\n              contentClassName,\n            )}\n          >\n            <div\n              data-slot=\"app-shell-content\"\n              data-content-width={contentWidth}\n              className={cn(contentWidthClassName(contentWidth), \"h-full\")}\n            >\n              {children}\n            </div>\n          </main>\n        )}\n      </div>\n      {hasSidebar && mobileSidebarOpen && (\n        <div\n          className=\"fixed inset-0 z-50 md:hidden\"\n          role=\"presentation\"\n          onClick={() => setMobileSidebarOpen(false)}\n        >\n          <div className=\"absolute inset-0 bg-black/40\" />\n          <aside\n            role=\"dialog\"\n            aria-modal=\"true\"\n            aria-label={mobileSidebarLabel}\n            className={cn(\n              \"relative z-10 flex h-full w-[min(20rem,85vw)] flex-col overflow-hidden border-r border-sidebar-border bg-sidebar text-sidebar-foreground shadow-xl\",\n              sidebarClassName,\n            )}\n            onClick={(event) => event.stopPropagation()}\n          >\n            <div className=\"flex h-14 shrink-0 items-center justify-between border-b border-sidebar-border px-density-3\">\n              {brand && <div className=\"flex min-w-0 items-center gap-2\">{brand}</div>}\n              <button\n                type=\"button\"\n                aria-label={`Close ${mobileSidebarLabel}`}\n                title=\"Close\"\n                className=\"flex h-8 w-8 shrink-0 items-center justify-center rounded-md text-sidebar-foreground/70 transition-colors hover:bg-sidebar-accent hover:text-sidebar-accent-foreground\"\n                onClick={() => setMobileSidebarOpen(false)}\n              >\n                <Icon icon={UiClose} className=\"h-4 w-4\" />\n              </button>\n            </div>\n            {sidebarHeader && (\n              <div className=\"shrink-0 border-b border-sidebar-border px-density-3 py-density-2\">\n                {sidebarHeader}\n              </div>\n            )}\n            <div className=\"min-h-0 flex-1 overflow-y-auto py-density-2\">\n              {renderSidebarContent(false, () => setMobileSidebarOpen(false))}\n            </div>\n            {sidebarFooter && (\n              <div className=\"mt-auto shrink-0 border-t border-sidebar-border px-density-3 py-density-2\">\n                {sidebarFooter}\n              </div>\n            )}\n          </aside>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"names":["useState","useEffect","contentWidth","useEscapeLayer","jsx","NavSections","jsxs","cn","AppShellSlotOutlines","Icon","UiSidebar","UiMenu","Fragment","contentWidthClassName","SplitPane","UiClose"],"mappings":"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"}

package/dist/layout/AppShell.d.ts

@@ -17,10 +17,56 @@ export type AppShellNavItem = {
     /** Trailing adornment (count, status dot). */
     badge?: ReactNode;
 };
+export type AppShellNavGroup = {
+    /** Stable key; also the key its collapsed state persists under. */
+    key: string;
+    /** Group heading rendered on the toggle row. */
+    label: string;
+    /** Leading icon (icon name or component). */
+    icon?: string | StaticIconComponent;
+    /** Folded on first render until the user toggles it. */
+    defaultCollapsed?: boolean;
+    /**
+     * Keeps the group open regardless of stored state, so a deep-linked
+     * destination can never hide under a folder the user collapsed earlier.
+     * Mirrors `Tree.revealSelected`: set it on the active item's ancestors.
+     */
+    forceExpanded?: boolean;
+    items: AppShellNavItem[];
+    /**
+     * Nested sub-groups, rendered after `items` at one further indent. Groups
+     * nest arbitrarily, so a backend hierarchy deeper than two levels does not
+     * have to be flattened to fit the rail.
+     */
+    groups?: AppShellNavGroup[];
+    /**
+     * Makes the group's own heading row a destination as well as a disclosure:
+     * the label becomes a nav link and the chevron sits beside it as a separate
+     * control. Needed wherever a node is both a folder and a leaf — e.g. a
+     * profile named `jms` that is runnable *and* the parent of `jms.incoming`.
+     */
+    item?: AppShellNavItem;
+};
 export type AppShellNavSection = {
     /** Section heading; collapses to a divider when the rail is collapsed. */
     label?: string;
-    items: AppShellNavItem[];
+    items?: AppShellNavItem[];
+    /** Collapsible groups rendered after the flat items. High-cardinality
+     *  clusters (provider surfaces, per-ledger journals) belong here so they can
+     *  be folded away; a collapsed rail flattens them back to plain items. */
+    groups?: AppShellNavGroup[];
+    /**
+     * How the groups read.
+     *
+     * `"list"` (the default) styles each group heading as a small uppercase
+     * cluster label — right for a handful of named clusters under one section.
+     *
+     * `"tree"` styles headings as ordinary nav rows, because in a tree a folder
+     * sits at the same level as its sibling destinations: a group carrying an
+     * `item` renders as a link either way, so an uppercase heading beside it
+     * would make two nodes of the same kind look like different things.
+     */
+    variant?: "list" | "tree";
 };
 export type AppShellProps = {
     /** Brand mark / wordmark. Shown in the rail header when a rail is present, else in the top bar. */
@@ -51,6 +97,8 @@ export type AppShellProps = {
     defaultCollapsed?: boolean;
     /** localStorage key persisting the collapsed state. */
     collapsedStorageKey?: string;
+    /** localStorage key persisting per-group collapsed state. */
+    groupCollapsedStorageKey?: string;
     /** Expanded rail width in px. Defaults to 240. */
     sidebarWidth?: number;
     /** Collapsed rail width in px. Defaults to 56. */

package/dist/layout/AppShell.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/layout/AppShell.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAuB,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE5D,OAAO,EAAQ,KAAK,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAM9D,OAAO,EAEL,KAAK,YAAY,EAClB,MAAM,iBAAiB,CAAC;AAUzB,MAAM,MAAM,eAAe,GAAG;IAC5B,sCAAsC;IACtC,GAAG,EAAE,MAAM,CAAC;IACZ,yDAAyD;IACzD,KAAK,EAAE,SAAS,CAAC;IACjB,6CAA6C;IAC7C,IAAI,CAAC,EAAE,MAAM,GAAG,mBAAmB,CAAC;IACpC,mDAAmD;IACnD,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,wEAAwE;IACxE,EAAE,EAAE,MAAM,CAAC;IACX,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,8CAA8C;IAC9C,KAAK,CAAC,EAAE,SAAS,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG;IAC/B,0EAA0E;IAC1E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,eAAe,EAAE,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,aAAa,GAAG;IAE1B,mGAAmG;IACnG,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,2EAA2E;IAC3E,GAAG,CAAC,EAAE,SAAS,CAAC;IAChB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,oEAAoE;IACpE,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,+EAA+E;IAC/E,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,gEAAgE;IAChE,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAGjC,wEAAwE;IACxE,WAAW,CAAC,EAAE,kBAAkB,EAAE,CAAC;IACnC,kFAAkF;IAClF,OAAO,CAAC,EAAE,SAAS,GAAG,CAAC,CAAC,SAAS,EAAE,OAAO,KAAK,SAAS,CAAC,CAAC;IAC1D,8DAA8D;IAC9D,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,2DAA2D;IAC3D,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,yEAAyE;IACzE,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,8CAA8C;IAC9C,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,uDAAuD;IACvD,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,kDAAkD;IAClD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,kDAAkD;IAClD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,mFAAmF;IACnF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAG5B,6DAA6D;IAC7D,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,8EAA8E;IAC9E,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,wFAAwF;IACxF,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,mEAAmE;IACnE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uEAAuE;IACvE,QAAQ,EAAE,SAAS,CAAC;IACpB,0FAA0F;IAC1F,YAAY,CAAC,EAAE,YAAY,CAAC;IAE5B;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAOF,wBAAgB,QAAQ,CAAC,KAAK,EAAE,aAAa,2CA4W5C"}
+{"version":3,"file":"AppShell.d.ts","sourceRoot":"","sources":["../../src/layout/AppShell.tsx"],"names":[],"mappings":"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"}