@hoardodile/ui 0.1.6 → 0.1.8

package/dist/components/meta-chip.js

@@ -1,26 +1,7 @@
-import { clsx } from 'clsx';
-import { extendTailwindMerge } from 'tailwind-merge';
+import { cn } from '../chunk-M5OJN54O.js';
+import '../chunk-2HWSCY4T.js';
 import { jsx } from 'react/jsx-runtime';
 
-// src/lib/utils.ts
-var mergeTheme = {
-  text: ["tiny", "ui", "doc", "doc-title", "doc-heading", "quote"],
-  spacing: ["chip", "control", "nav", "sidebar", "panel"],
-  tracking: ["label"],
-  shadow: ["card", "dialog"],
-  container: ["reading", "medium", "content"],
-  font: ["doc", "heading"],
-  ease: ["standard"],
-  animate: ["skel", "pop"]
-};
-var twMerge = extendTailwindMerge({
-  extend: { theme: mergeTheme }
-});
-
-// src/lib/utils.ts
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
 function MetaChip(props) {
   return /* @__PURE__ */ jsx(
     "span",

package/dist/components/meta-chip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lib/merge-config.ts","../../src/lib/utils.ts","../../src/components/meta-chip.tsx"],"names":[],"mappings":";;;;;AAQO,IAAM,UAAA,GAAa;AAAA,EACzB,MAAM,CAAC,MAAA,EAAQ,MAAM,KAAA,EAAO,WAAA,EAAa,eAAe,OAAO,CAAA;AAAA,EAC/D,SAAS,CAAC,MAAA,EAAQ,SAAA,EAAW,KAAA,EAAO,WAAW,OAAO,CAAA;AAAA,EACtD,QAAA,EAAU,CAAC,OAAO,CAAA;AAAA,EAClB,MAAA,EAAQ,CAAC,MAAA,EAAQ,QAAQ,CAAA;AAAA,EACzB,SAAA,EAAW,CAAC,SAAA,EAAW,QAAA,EAAU,SAAS,CAAA;AAAA,EAC1C,IAAA,EAAM,CAAC,KAAA,EAAO,SAAS,CAAA;AAAA,EACvB,IAAA,EAAM,CAAC,UAAU,CAAA;AAAA,EACjB,OAAA,EAAS,CAAC,MAAA,EAAQ,KAAK;AACxB,CAAA;AAEO,IAAM,UAAU,mBAAA,CAAoB;AAAA,EAC1C,MAAA,EAAQ,EAAE,KAAA,EAAO,UAAA;AAClB,CAAC,CAAA;;;AClBM,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;ACUO,SAAS,SAAS,KAAA,EAAsB;AAC9C,EAAA,uBACC,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACV,0DAAA;AAAA,QACA,iBAAA,CAAkB,MAAM,IAAI,CAAA;AAAA,QAC5B,KAAA,CAAM;AAAA,OACP;AAAA,MAEC,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,GACR;AAEF;AAEA,SAAS,kBAAkB,IAAA,EAA6B;AACvD,EAAA,IAAI,SAAS,SAAA,EAAW;AACvB,IAAA,OAAO,+BAAA;AAAA,EACR;AAEA,EAAA,IAAI,SAAS,UAAA,EAAY;AACxB,IAAA,OAAO,mDAAA;AAAA,EACR;AAEA,EAAA,OAAO,oCAAA;AACR","file":"meta-chip.js","sourcesContent":["import { extendTailwindMerge } from \"tailwind-merge\"\n\n// The app's `@theme inline` tokens (theme.css) generate utility names\n// tailwind-merge doesn't know, so it misclassifies them — e.g. `text-ui` is\n// parsed as a text color and dropped next to any `text-*` color. The default\n// class groups are theme-backed, so extending the theme (keys mirror the v4\n// token namespaces one-to-one) registers every custom utility with correct\n// conflict semantics. merge-config.test.ts pins this list against theme.css.\nexport const mergeTheme = {\n\ttext: [\"tiny\", \"ui\", \"doc\", \"doc-title\", \"doc-heading\", \"quote\"],\n\tspacing: [\"chip\", \"control\", \"nav\", \"sidebar\", \"panel\"],\n\ttracking: [\"label\"],\n\tshadow: [\"card\", \"dialog\"],\n\tcontainer: [\"reading\", \"medium\", \"content\"],\n\tfont: [\"doc\", \"heading\"],\n\tease: [\"standard\"],\n\tanimate: [\"skel\", \"pop\"],\n} as const\n\nexport const twMerge = extendTailwindMerge({\n\textend: { theme: mergeTheme },\n})\n","import { type ClassValue, clsx } from \"clsx\"\nimport { twMerge } from \"./merge-config\"\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs))\n}\n","import { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\n\nexport type MetaChipProps = {\n\t/** muted: quiet gray chip (default); inverse: foreground on background;\n\t    bordered: outline-only state marker. */\n\treadonly tone?: \"muted\" | \"inverse\" | \"bordered\"\n\treadonly className?: string\n\treadonly children: ReactNode\n}\n\n/**\n * Meta chip — the tiny rounded-sm text-tiny state marker worn next to\n * names, versions, deltas and list rows across the app.\n */\nexport function MetaChip(props: MetaChipProps) {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(\n\t\t\t\t\"shrink-0 rounded-sm px-1.5 py-0.5 text-tiny leading-none\",\n\t\t\t\tchipToneClassName(props.tone),\n\t\t\t\tprops.className,\n\t\t\t)}\n\t\t>\n\t\t\t{props.children}\n\t\t</span>\n\t)\n}\n\nfunction chipToneClassName(tone: MetaChipProps[\"tone\"]) {\n\tif (tone === \"inverse\") {\n\t\treturn \"bg-foreground text-background\"\n\t}\n\n\tif (tone === \"bordered\") {\n\t\treturn \"border border-border-strong text-muted-foreground\"\n\t}\n\n\treturn \"bg-muted text-secondary-foreground\"\n}\n"]}
+{"version":3,"sources":["../../src/components/meta-chip.tsx"],"names":[],"mappings":";;;;AAeO,SAAS,SAAS,KAAA,EAAsB;AAC9C,EAAA,uBACC,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACV,0DAAA;AAAA,QACA,iBAAA,CAAkB,MAAM,IAAI,CAAA;AAAA,QAC5B,KAAA,CAAM;AAAA,OACP;AAAA,MAEC,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,GACR;AAEF;AAEA,SAAS,kBAAkB,IAAA,EAA6B;AACvD,EAAA,IAAI,SAAS,SAAA,EAAW;AACvB,IAAA,OAAO,+BAAA;AAAA,EACR;AAEA,EAAA,IAAI,SAAS,UAAA,EAAY;AACxB,IAAA,OAAO,mDAAA;AAAA,EACR;AAEA,EAAA,OAAO,oCAAA;AACR","file":"meta-chip.js","sourcesContent":["import { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\n\nexport type MetaChipProps = {\n\t/** muted: quiet gray chip (default); inverse: foreground on background;\n\t    bordered: outline-only state marker. */\n\treadonly tone?: \"muted\" | \"inverse\" | \"bordered\"\n\treadonly className?: string\n\treadonly children: ReactNode\n}\n\n/**\n * Meta chip — the tiny rounded-sm text-tiny state marker worn next to\n * names, versions, deltas and list rows across the app.\n */\nexport function MetaChip(props: MetaChipProps) {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(\n\t\t\t\t\"shrink-0 rounded-sm px-1.5 py-0.5 text-tiny leading-none\",\n\t\t\t\tchipToneClassName(props.tone),\n\t\t\t\tprops.className,\n\t\t\t)}\n\t\t>\n\t\t\t{props.children}\n\t\t</span>\n\t)\n}\n\nfunction chipToneClassName(tone: MetaChipProps[\"tone\"]) {\n\tif (tone === \"inverse\") {\n\t\treturn \"bg-foreground text-background\"\n\t}\n\n\tif (tone === \"bordered\") {\n\t\treturn \"border border-border-strong text-muted-foreground\"\n\t}\n\n\treturn \"bg-muted text-secondary-foreground\"\n}\n"]}

package/dist/components/mobile-drawer.js

@@ -1,273 +1,12 @@
-import 'react-use';
-import { useState, useEffect, useRef } from 'react';
+import { useMobileBackToClose } from '../chunk-TDDHQZ62.js';
+import '../chunk-QGMDWGJT.js';
+import { Cross } from '../chunk-XBPQEZES.js';
+import '../chunk-KNPRUZ4H.js';
+import { cn } from '../chunk-M5OJN54O.js';
+import '../chunk-2HWSCY4T.js';
+import { useState, useEffect } from 'react';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { clsx } from 'clsx';
-import { extendTailwindMerge } from 'tailwind-merge';
 
-// src/viewport.ts
-var MOBILE_BREAKPOINT_PX = 768;
-var MOBILE_QUERY = `(max-width: ${MOBILE_BREAKPOINT_PX - 1}px)`;
-function isBelowMd() {
-  if (typeof window === "undefined") return false;
-  return window.matchMedia(MOBILE_QUERY).matches;
-}
-var HISTORY_KEY = "__appMobileOverlay";
-var overlayStack = [];
-var popListenerInstalled = false;
-var historyPatched = false;
-var nextOverlayId = 0;
-var suppressPopCount = 0;
-var seenSyntheticIds = /* @__PURE__ */ new Set();
-function patchHistory() {
-  if (historyPatched) return;
-  if (typeof window === "undefined") return;
-  historyPatched = true;
-  const origPush = window.history.pushState.bind(window.history);
-  window.history.pushState = (data, unused, url) => {
-    const state = data;
-    if (state !== null && typeof state === "object" && HISTORY_KEY in state) {
-      origPush(data, unused, url);
-      return;
-    }
-    if (overlayStack.length > 0) {
-      closeAllOverlays();
-    }
-    origPush(data, unused, url);
-  };
-}
-function closeAllOverlays() {
-  while (overlayStack.length > 0) {
-    const entry = overlayStack.pop();
-    if (entry?.close !== void 0) {
-      const fn = entry.close;
-      entry.close = void 0;
-      fn();
-    }
-  }
-}
-function ensurePopListener() {
-  if (popListenerInstalled) return;
-  if (typeof window === "undefined") return;
-  popListenerInstalled = true;
-  window.addEventListener(
-    "popstate",
-    (e) => {
-      if (suppressPopCount > 0) return;
-      const state = e.state;
-      if (state !== null && typeof state === "object" && HISTORY_KEY in state) {
-        const id = state[HISTORY_KEY];
-        if (typeof id === "number" && overlayStack.some((entry) => entry.id === id)) {
-          closeTopOverlay();
-          e.stopImmediatePropagation();
-          return;
-        }
-        e.stopImmediatePropagation();
-        if (typeof id === "number" && seenSyntheticIds.has(id)) {
-          window.history.back();
-        }
-      }
-    },
-    true
-    // capture phase
-  );
-  window.addEventListener("popstate", handlePop);
-  patchHistory();
-}
-function closeTopOverlay() {
-  const top = overlayStack.pop();
-  if (top === void 0) return;
-  if (top.close === void 0) return;
-  const closeFn = top.close;
-  top.close = void 0;
-  closeFn();
-}
-function handlePop() {
-  if (suppressPopCount > 0) {
-    suppressPopCount--;
-    return;
-  }
-  closeTopOverlay();
-}
-function removeFromStack(id) {
-  const idx = overlayStack.findIndex((e) => e.id === id);
-  if (idx === -1) return { removed: false, parkedBelow: 0 };
-  const wasTop = idx === overlayStack.length - 1;
-  if (!wasTop) {
-    const entry = overlayStack[idx];
-    if (entry !== void 0) entry.close = void 0;
-    return { removed: true, parkedBelow: 0 };
-  }
-  overlayStack.pop();
-  const remaining = overlayStack.splice(0, overlayStack.length);
-  const active = remaining.filter((e) => e.close !== void 0);
-  const parkedBelow = remaining.length - active.length;
-  overlayStack.push(...active);
-  return { removed: true, parkedBelow };
-}
-function scheduleStateRestore(id, baseState, parkedBelow) {
-  function check() {
-    const currentState = window.history.state;
-    if (currentState === null || typeof currentState !== "object" || !(HISTORY_KEY in currentState) || currentState[HISTORY_KEY] !== id) {
-      sweepParkedEntries();
-      return;
-    }
-    const totalBacks = 1 + parkedBelow;
-    let done = false;
-    function restore() {
-      if (done) return;
-      done = true;
-      window.removeEventListener("popstate", onPop);
-      window.history.replaceState(baseState, "");
-      const sweptIds = sweepParkedEntries();
-      cleanupSeenIds(sweptIds);
-    }
-    function onPop() {
-      if (suppressPopCount > 0) {
-        suppressPopCount--;
-        return;
-      }
-      restore();
-    }
-    window.addEventListener("popstate", onPop);
-    suppressPopCount += totalBacks;
-    for (let i = 0; i < totalBacks; i++) {
-      window.history.back();
-    }
-  }
-  let disposed = false;
-  let rafId;
-  function run() {
-    if (disposed) return;
-    disposed = true;
-    if (rafId !== void 0) {
-      cancelAnimationFrame(rafId);
-    }
-    check();
-  }
-  rafId = requestAnimationFrame(run);
-}
-function sweepParkedEntries() {
-  const sweptIds = [];
-  for (let i = overlayStack.length - 1; i >= 0; i--) {
-    const entry = overlayStack[i];
-    if (entry !== void 0 && entry.close === void 0) {
-      sweptIds.push(entry.id);
-      overlayStack.splice(i, 1);
-    }
-  }
-  return sweptIds;
-}
-function cleanupSeenIds(sweptIds) {
-  const activeIds = new Set(overlayStack.map((e) => e.id));
-  for (const id of sweptIds) {
-    if (!activeIds.has(id)) {
-      seenSyntheticIds.delete(id);
-    }
-  }
-}
-function useMobileBackToClose(open, onOpenChange) {
-  const idRef = useRef(void 0);
-  const onChangeRef = useRef(onOpenChange);
-  onChangeRef.current = onOpenChange;
-  useEffect(() => {
-    if (typeof window === "undefined") return;
-    if (onChangeRef.current === void 0) return;
-    if (!isBelowMd()) return;
-    ensurePopListener();
-    if (open === true && idRef.current === void 0) {
-      const id = ++nextOverlayId;
-      idRef.current = id;
-      seenSyntheticIds.add(id);
-      const baseState = window.history.state ?? null;
-      window.history.pushState(
-        {
-          ...baseState ?? {},
-          [HISTORY_KEY]: id
-        },
-        ""
-      );
-      overlayStack.push({
-        id,
-        baseState,
-        close() {
-          idRef.current = void 0;
-          onChangeRef.current?.(false);
-        }
-      });
-      return;
-    }
-    if (open !== true && idRef.current !== void 0) {
-      const id = idRef.current;
-      idRef.current = void 0;
-      const entryIdx = overlayStack.findIndex((e) => e.id === id);
-      const entry = entryIdx !== -1 ? overlayStack[entryIdx] : void 0;
-      const { removed, parkedBelow } = removeFromStack(id);
-      if (removed && entry !== void 0) {
-        scheduleStateRestore(id, entry.baseState, parkedBelow);
-      }
-    }
-  }, [open]);
-  useEffect(() => {
-    return () => {
-      if (idRef.current !== void 0) {
-        const id = idRef.current;
-        idRef.current = void 0;
-        const entryIdx = overlayStack.findIndex((e) => e.id === id);
-        const entry = entryIdx !== -1 ? overlayStack[entryIdx] : void 0;
-        const { removed, parkedBelow } = removeFromStack(id);
-        if (removed && entry !== void 0) {
-          scheduleStateRestore(id, entry.baseState, parkedBelow);
-        }
-      }
-    };
-  }, []);
-}
-function Mark({
-  d,
-  filled,
-  className
-}) {
-  return /* @__PURE__ */ jsx(
-    "svg",
-    {
-      xmlns: "http://www.w3.org/2000/svg",
-      viewBox: "0 0 24 24",
-      fill: "none",
-      className,
-      children: filled ? /* @__PURE__ */ jsx("path", { d, fill: "currentColor" }) : /* @__PURE__ */ jsx(
-        "path",
-        {
-          d,
-          stroke: "currentColor",
-          strokeWidth: "2",
-          strokeLinecap: "round",
-          strokeLinejoin: "round"
-        }
-      )
-    }
-  );
-}
-function Cross(props) {
-  return /* @__PURE__ */ jsx(Mark, { ...props, d: "M6 6l12 12M18 6L6 18" });
-}
-var mergeTheme = {
-  text: ["tiny", "ui", "doc", "doc-title", "doc-heading", "quote"],
-  spacing: ["chip", "control", "nav", "sidebar", "panel"],
-  tracking: ["label"],
-  shadow: ["card", "dialog"],
-  container: ["reading", "medium", "content"],
-  font: ["doc", "heading"],
-  ease: ["standard"],
-  animate: ["skel", "pop"]
-};
-var twMerge = extendTailwindMerge({
-  extend: { theme: mergeTheme }
-});
-
-// src/lib/utils.ts
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
 function MobileDrawer(props) {
   const {
     open,

package/dist/components/mobile-drawer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/viewport.ts","../../src/hooks/use-mobile.ts","../../src/hooks/useMobileBackToClose.ts","../../src/icons/marks.tsx","../../src/lib/merge-config.ts","../../src/lib/utils.ts","../../src/components/mobile-drawer.tsx"],"names":["useEffect","jsx"],"mappings":"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","file":"mobile-drawer.js","sourcesContent":["/**\n * Mobile viewport initial-scale factor used across the app shell and\n * plugin iframe previews. Kept in one place so it can be changed\n * without hunting through HTML templates and CSS rules.\n */\nexport const MOBILE_INITIAL_SCALE = 0.8\n\n/**\n * Width in pixels at which the app switches from below-md to md+ layouts.\n *\n * This value is intentionally aligned with Tailwind's `md` breakpoint\n * (768 px) so that JS detection and CSS responsive prefixes stay in sync.\n * Components that need to know whether they are in the \"below md\" viewport\n * should use {@link isBelowMd} or {@link useBelowMd} from @hoardodile/ui/hooks/use-mobile.\n */\nexport const MOBILE_BREAKPOINT_PX = 768\n\n/**\n * Same breakpoint expressed in rems, matching Tailwind's default theme\n * (`--breakpoint-md: 48rem`). Useful for CSS media queries and comments.\n */\nexport const MOBILE_BREAKPOINT_REM = MOBILE_BREAKPOINT_PX / 16\n\n/**\n * Media query string that matches viewports below the `md` breakpoint\n * (< 768 px). Shared between JS hooks and anywhere else that needs to detect\n * a below-md viewport.\n *\n * Keep this in sync with the CSS/Tailwind breakpoint so JS and CSS never\n * disagree about the viewport size.\n */\nexport const MOBILE_QUERY = `(max-width: ${MOBILE_BREAKPOINT_PX - 1}px)`\n\n/**\n * Width in pixels at which the app switches from a drawer to a fixed left\n * sidebar (the \"app shell\"). Raised above `md` so mid-size viewports keep\n * the whole width for their content column — below this the sidebar hides\n * behind the hamburger drawer.\n *\n * Use the CSS `sidebar:` / `max-sidebar:` variants (`--breakpoint-sidebar`)\n * at call sites — this value is the single source of truth for both.\n */\nexport const SIDEBAR_BREAKPOINT_PX = 1150\n\n/**\n * Media query string that matches viewports below the sidebar breakpoint\n * (`max-sidebar`), i.e. where the shell shows the drawer instead of the fixed\n * sidebar. Shared between JS hooks and anywhere else that needs the\n * below-sidebar viewport.\n */\nexport const SIDEBAR_QUERY = `(max-width: ${SIDEBAR_BREAKPOINT_PX - 1}px)`\n\n/**\n * Width in pixels at which the right filter rail switches from a fixed\n * column to a drawer (DESIGN.md — Layout: \"the panel becomes an\n * overlay below 1440px\"). Below this the sidebar + panel + content no\n * longer fit comfortably, so the rail hides behind a Filters button.\n *\n * Use the CSS `panel:` / `max-panel:` variants (`--breakpoint-panel`)\n * at call sites — this value is the single source of truth for both.\n */\nexport const PANEL_BREAKPOINT_PX = 1440\n\n/**\n * Media query string that matches viewports below the panel breakpoint\n * (< 1440 px), i.e. where the filter rail lives in a drawer. Shared\n * between JS hooks and anywhere else that needs the below-panel viewport.\n */\nexport const PANEL_QUERY = `(max-width: ${PANEL_BREAKPOINT_PX - 1}px)`\n","import {\n\tMOBILE_QUERY,\n\tPANEL_QUERY,\n\tSIDEBAR_QUERY,\n} from \"@hoardodile/ui/viewport\"\nimport { useMedia } from \"react-use\"\n\n/**\n * One-shot check for viewports below the `md` breakpoint (< 768 px).\n *\n * Prefer {@link useBelowMd} in React components so they re-render when the\n * viewport crosses the breakpoint. Use this helper only in event handlers,\n * utility functions, or effects where a reactive hook is not appropriate.\n */\nexport function isBelowMd(): boolean {\n\tif (typeof window === \"undefined\") return false\n\treturn window.matchMedia(MOBILE_QUERY).matches\n}\n\nexport function useBelowMd(): boolean {\n\treturn useMedia(MOBILE_QUERY, false)\n}\n\n/**\n * Reactive check for viewports below the app-shell sidebar breakpoint\n * (`max-sidebar`), where the fixed sidebar is replaced by the hamburger\n * drawer. Keep in sync with `SIDEBAR_BREAKPOINT_PX` and the\n * `sidebar:` / `max-sidebar:` CSS variants. The shell alone decides its own chrome;\n * compact-UI consumers keep using {@link useBelowMd}.\n */\nexport function useBelowSidebar(): boolean {\n\treturn useMedia(SIDEBAR_QUERY, false)\n}\n\n/**\n * Reactive check for viewports below the filter-rail breakpoint\n * (< 1440 px), where the rail becomes a drawer instead of a fixed right\n * column. Keep in sync with `PANEL_BREAKPOINT_PX` and the\n * `panel:` / `max-panel:` CSS variants.\n */\nexport function useBelowPanel(): boolean {\n\treturn useMedia(PANEL_QUERY, false)\n}\n\n/**\n * Compatibility alias for official shadcn-generated components (e.g.\n * `sidebar.tsx`), which import `useIsMobile` from this module. Mobile\n * detection rules are owned by THIS file for the whole repo (apps and\n * plugins alike) — never let the registry version of `use-mobile.ts`\n * replace it; restore after every `shadcn add`.\n */\nexport function useIsMobile(): boolean {\n\treturn useBelowMd()\n}\n","import { isBelowMd } from \"@hoardodile/ui/hooks/use-mobile\"\nimport { useEffect, useRef } from \"react\"\n\nconst HISTORY_KEY = \"__appMobileOverlay\"\n\n/**\n * LIFO stack of currently-open overlays registered via\n * {@link useMobileBackToClose}. Each entry knows how to close its own\n * overlay. The browser back gesture only closes the top entry, so\n * stacking dialogs/popovers/sheets unwind in reverse opening order\n * instead of all collapsing on the first back press.\n *\n * State is module-level so multiple component instances share a\n * single popstate listener and a single ordering source of truth.\n */\ntype OverlayEntry = {\n\treadonly id: number\n\t/** Original history state captured at push time for later restore. */\n\treadonly baseState: unknown\n\tclose: (() => void) | undefined\n}\n\nconst overlayStack: OverlayEntry[] = []\nlet popListenerInstalled = false\nlet historyPatched = false\nlet nextOverlayId = 0\n// Counts consecutive popstate events to suppress. When we call\n// `history.back()` N times (e.g. to unwind an active entry plus\n// parked entries), the next N popstate events must be swallowed so\n// they don't cascade-close deeper overlays.\nlet suppressPopCount = 0\n/**\n * Tracks every synthetic entry ID ever pushed. Used by the\n * capture-phase popstate listener to identify \"phantom\" entries —\n * synthetic history slots that remain in forward/back history after\n * the overlay was closed via route navigation. The listener auto-skips\n * these to prevent dead back-presses and router confusion.\n */\nconst seenSyntheticIds = new Set<number>()\n\n/**\n * Optional navigation-resolver registration injected by the host app.\n *\n * When set (via {@link setNavigationResolver}), `scheduleStateRestore`\n * uses it to receive a deterministic \"navigation complete\" signal from\n * the router instead of guessing timing via `requestAnimationFrame`.\n *\n * The registered function accepts a one-shot callback and returns an\n * unsubscribe function. The hook calls it, inspects `history.state`\n * inside the callback, then unsubscribes.\n */\ntype NavigationResolver = (onResolved: () => void) => () => void\nlet navigationResolver: NavigationResolver | undefined\n\n/**\n * Registers a navigation-resolver factory so that\n * {@link useMobileBackToClose} can wait for the router to finish\n * flushing its history mutations before inspecting `history.state`.\n *\n * Call this once at app startup, after the router is created:\n *\n * ```ts\n * import { setNavigationResolver } from \"@hoardodile/ui\"\n * import { router } from \"./router\"\n *\n * setNavigationResolver((fn) => router.subscribe(\"onResolved\", fn))\n * ```\n *\n * When no resolver is registered, the hook falls back to\n * `requestAnimationFrame` (correct for microtask-based routers but\n * less deterministic).\n */\nexport function setNavigationResolver(resolver: NavigationResolver): void {\n\tnavigationResolver = resolver\n}\n\n/**\n * Patches `history.pushState` once (idempotent) so that every call\n * from a router (or any other non-overlay code) is intercepted.\n *\n * When a pushState is detected that does NOT carry our\n * {@link HISTORY_KEY} marker, all open overlay entries are closed\n * and the stack is cleared. The synthetic entry's marker is\n * intentionally NOT stripped — the capture-phase popstate listener\n * uses it to identify and auto-skip the stranded entry when the\n * user later navigates past it.\n */\nfunction patchHistory(): void {\n\tif (historyPatched) return\n\tif (typeof window === \"undefined\") return\n\thistoryPatched = true\n\tconst origPush = window.history.pushState.bind(window.history)\n\twindow.history.pushState = (\n\t\tdata: unknown,\n\t\tunused: string,\n\t\turl?: string | URL | null,\n\t): void => {\n\t\tconst state = data as Record<string, unknown> | null\n\t\tif (state !== null && typeof state === \"object\" && HISTORY_KEY in state) {\n\t\t\t// Our own synthetic push — pass through.\n\t\t\torigPush(data, unused, url)\n\t\t\treturn\n\t\t}\n\t\t// Real navigation — close all overlays so the stack is\n\t\t// cleared synchronously (before React's async effects).\n\t\t// The synthetic entry remains in history with its marker\n\t\t// intact; the capture-phase popstate listener will\n\t\t// auto-skip it later.\n\t\tif (overlayStack.length > 0) {\n\t\t\tcloseAllOverlays()\n\t\t}\n\t\torigPush(data, unused, url)\n\t}\n}\n\n/**\n * Closes every active overlay in the stack (top-down) and clears\n * the stack. Called when a real navigation is detected so that\n * overlay state doesn't leak across route boundaries.\n */\nfunction closeAllOverlays(): void {\n\twhile (overlayStack.length > 0) {\n\t\tconst entry = overlayStack.pop()\n\t\tif (entry?.close !== undefined) {\n\t\t\tconst fn = entry.close\n\t\t\tentry.close = undefined\n\t\t\tfn()\n\t\t}\n\t}\n}\n\n/**\n * Installs popstate listeners and patches history.pushState.\n *\n * Two listeners are installed:\n *\n * 1. **Capture-phase** — runs BEFORE any bubbling-phase listeners\n *    (including TanStack Router's popstate handler). Inspects the\n *    state at the history pointer:\n *\n *    - **Active entry** (id found in overlayStack): the back\n *      gesture landed on a synthetic entry that belongs to an\n *      overlay still below the top of the stack. Pop and close the\n *      top overlay (the one the user is actually dismissing) and\n *      block the event from reaching the router via\n *      `stopImmediatePropagation()`.\n *\n *    - **Phantom entry** (id in `seenSyntheticIds` but NOT in\n *      overlayStack): a synthetic history slot that remains after\n *      the overlay was closed via route navigation. Blocks the\n *      event AND auto-skips by calling `history.back()` to advance\n *      the pointer past the phantom, so the router never sees its\n *      stale URL.\n *\n * 2. **Bubbling-phase** — closes the top overlay when the back\n *    gesture returns to the base route state (no synthetic marker),\n *    which happens for the last open overlay.\n */\nfunction ensurePopListener(): void {\n\tif (popListenerInstalled) return\n\tif (typeof window === \"undefined\") return\n\tpopListenerInstalled = true\n\n\t// Capture-phase gate: block synthetic popstate from reaching\n\t// the router (or any other bubbling-phase listener on window).\n\twindow.addEventListener(\n\t\t\"popstate\",\n\t\t(e: PopStateEvent) => {\n\t\t\tif (suppressPopCount > 0) return // let the counter handle it\n\t\t\tconst state = e.state as Record<string, unknown> | null\n\t\t\tif (state !== null && typeof state === \"object\" && HISTORY_KEY in state) {\n\t\t\t\tconst id = state[HISTORY_KEY]\n\t\t\t\t// Active entry still in the stack → the back gesture\n\t\t\t\t// landed on a synthetic entry of an overlay below the\n\t\t\t\t// top. Close the top overlay and hide the event from\n\t\t\t\t// the router.\n\t\t\t\tif (\n\t\t\t\t\ttypeof id === \"number\" &&\n\t\t\t\t\toverlayStack.some((entry) => entry.id === id)\n\t\t\t\t) {\n\t\t\t\t\tcloseTopOverlay()\n\t\t\t\t\te.stopImmediatePropagation()\n\t\t\t\t\treturn\n\t\t\t\t}\n\t\t\t\t// Phantom entry: a synthetic history slot that\n\t\t\t\t// remains after the overlay was closed via\n\t\t\t\t// route navigation. Block the event from the\n\t\t\t\t// router AND auto-skip by calling history.back()\n\t\t\t\t// to move the pointer past the phantom.\n\t\t\t\te.stopImmediatePropagation()\n\t\t\t\tif (typeof id === \"number\" && seenSyntheticIds.has(id)) {\n\t\t\t\t\twindow.history.back()\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\ttrue, // capture phase\n\t)\n\n\twindow.addEventListener(\"popstate\", handlePop)\n\tpatchHistory()\n}\n\nfunction closeTopOverlay(): void {\n\tconst top = overlayStack.pop()\n\tif (top === undefined) return\n\t// `close` may be cleared if this entry was dismissed via UI from a\n\t// non-top position; the popstate then just unwinds a stale\n\t// synthetic history slot and there is nothing to close.\n\tif (top.close === undefined) return\n\t// Clear close before calling it so the resulting effect sees\n\t// idRef as undefined (back-gesture close) and skips the\n\t// back() + replaceState() UI-close path.\n\tconst closeFn = top.close\n\ttop.close = undefined\n\tcloseFn()\n}\n\nfunction handlePop(): void {\n\tif (suppressPopCount > 0) {\n\t\tsuppressPopCount--\n\t\treturn\n\t}\n\tcloseTopOverlay()\n}\n\n/**\n * Removes the entry with the given `id` from the overlay stack.\n *\n * When the entry is **not** the top of the stack, it is \"parked\"\n * (left in place with its close callback cleared) so the synthetic\n * history slot survives until swept.\n *\n * @returns An object describing what was removed:\n *   - `removed`: whether the entry was found.\n *   - `parkedBelow`: how many parked (close=undefined) entries were\n *     found below the removed entry. These must be unwound alongside\n *     the active entry to prevent dead back-presses.\n */\nfunction removeFromStack(id: number): {\n\treadonly removed: boolean\n\treadonly parkedBelow: number\n} {\n\tconst idx = overlayStack.findIndex((e) => e.id === id)\n\tif (idx === -1) return { removed: false, parkedBelow: 0 }\n\tconst wasTop = idx === overlayStack.length - 1\n\tif (!wasTop) {\n\t\t// Park: keep the history slot but neutralise the callback.\n\t\tconst entry = overlayStack[idx]\n\t\tif (entry !== undefined) entry.close = undefined\n\t\treturn { removed: true, parkedBelow: 0 }\n\t}\n\t// Top entry — remove it and count ALL parked entries below so\n\t// their orphaned synthetic history slots are unwound in the same\n\t// batch as the active entry's slot.\n\toverlayStack.pop()\n\tconst remaining = overlayStack.splice(0, overlayStack.length)\n\tconst active = remaining.filter((e) => e.close !== undefined)\n\tconst parkedBelow = remaining.length - active.length\n\toverlayStack.push(...active)\n\treturn { removed: true, parkedBelow }\n}\n\n/**\n * Cleans up the synthetic history entry after an overlay closes via\n * UI (not back gesture, not route navigation).\n *\n * `history.back()` is asynchronous — it queues a history traversal\n * task. The popstate event fires only after the traversal completes\n * (pointer has moved to the target entry). By replacing the state\n * inside the popstate handler, we ensure:\n *\n * 1. The pointer is at the base entry (not the synthetic one).\n * 2. `replaceState` truncates forward history, eliminating the\n *    phantom synthetic entry that `back()` alone would leave behind.\n *\n * **Route-change safety**: When a navigation-resolver is registered\n * (via {@link setNavigationResolver}), `scheduleStateRestore` uses\n * the router's deterministic \"navigation resolved\" signal to know\n * when `history.state` reflects the new route. When no resolver is\n * available (e.g. tests), it falls back to `requestAnimationFrame`,\n * which runs after the microtask queue where the router flushes its\n * pending `pushState` calls.\n *\n * - If `history.state` still carries our marker → normal UI close,\n *   proceed with the `back()` + `replaceState()` cleanup.\n * - If `history.state` no longer carries our marker → a route\n *   change has pushed a real entry on top. Skip the `back()` call\n *   to avoid racing with the router's push. The capture-phase\n *   popstate listener will auto-skip the stranded phantom entry.\n */\nfunction scheduleStateRestore(\n\tid: number,\n\tbaseState: unknown,\n\tparkedBelow: number,\n): void {\n\tfunction check(): void {\n\t\tconst currentState = window.history.state as Record<string, unknown> | null\n\n\t\t// The history pointer is no longer on this overlay's own\n\t\t// synthetic entry (route change, or another overlay has\n\t\t// already pushed/popped on top). Do NOT call history.back()\n\t\t// — it would race with the current top entry and navigate\n\t\t// to the wrong place. Just sweep parked entries from the\n\t\t// stack but do NOT prune `seenSyntheticIds`; any stranded\n\t\t// synthetic entries will be auto-skipped by the capture-phase\n\t\t// listener when the user navigates past them.\n\t\tif (\n\t\t\tcurrentState === null ||\n\t\t\ttypeof currentState !== \"object\" ||\n\t\t\t!(HISTORY_KEY in currentState) ||\n\t\t\tcurrentState[HISTORY_KEY] !== id\n\t\t) {\n\t\t\tsweepParkedEntries()\n\t\t\treturn\n\t\t}\n\n\t\tconst totalBacks = 1 + parkedBelow\n\t\tlet done = false\n\n\t\tfunction restore(): void {\n\t\t\tif (done) return\n\t\t\tdone = true\n\t\t\twindow.removeEventListener(\"popstate\", onPop)\n\t\t\twindow.history.replaceState(baseState, \"\")\n\t\t\t// replaceState truncates forward history, eliminating\n\t\t\t// phantom entries. Safe to prune their IDs from\n\t\t\t// `seenSyntheticIds` (excluding IDs still in the\n\t\t\t// active stack).\n\t\t\tconst sweptIds = sweepParkedEntries()\n\t\t\tcleanupSeenIds(sweptIds)\n\t\t}\n\n\t\tfunction onPop(): void {\n\t\t\tif (suppressPopCount > 0) {\n\t\t\t\tsuppressPopCount--\n\t\t\t\treturn\n\t\t\t}\n\t\t\trestore()\n\t\t}\n\n\t\twindow.addEventListener(\"popstate\", onPop)\n\n\t\tsuppressPopCount += totalBacks\n\t\tfor (let i = 0; i < totalBacks; i++) {\n\t\t\twindow.history.back()\n\t\t}\n\t}\n\n\t// Use both the router's deterministic \"navigation resolved\" signal\n\t// and a requestAnimationFrame fallback. In the common UI-close case\n\t// (e.g. clicking outside a dropdown) there is no route change, so\n\t// the resolver never fires. Without the fallback the synthetic\n\t// history entry would be left behind as a phantom.\n\tlet disposed = false\n\tlet rafId: number | undefined\n\tlet unsub: (() => void) | undefined\n\n\tfunction run(): void {\n\t\tif (disposed) return\n\t\tdisposed = true\n\t\tunsub?.()\n\t\tif (rafId !== undefined) {\n\t\t\tcancelAnimationFrame(rafId)\n\t\t}\n\t\tcheck()\n\t}\n\n\tif (navigationResolver !== undefined) {\n\t\tunsub = navigationResolver(run)\n\t}\n\n\trafId = requestAnimationFrame(run)\n}\n\n/**\n * Sweeps all parked entries (those with no close callback) from the\n * overlay stack. Called after `replaceState` truncates forward\n * history, since parked entries no longer have corresponding history\n * entries and would cause dead back-presses.\n *\n * @returns The IDs of entries that were removed, used by the caller\n *   to prune `seenSyntheticIds`.\n */\nfunction sweepParkedEntries(): readonly number[] {\n\tconst sweptIds: number[] = []\n\tfor (let i = overlayStack.length - 1; i >= 0; i--) {\n\t\tconst entry = overlayStack[i]\n\t\tif (entry !== undefined && entry.close === undefined) {\n\t\t\tsweptIds.push(entry.id)\n\t\t\toverlayStack.splice(i, 1)\n\t\t}\n\t}\n\treturn sweptIds\n}\n\n/**\n * Removes swept IDs from `seenSyntheticIds` to prevent unbounded\n * growth over the lifetime of the SPA session.\n *\n * After `replaceState` truncates forward history, phantom entries\n * for swept parked overlays are eliminated. Their IDs can safely\n * be removed from `seenSyntheticIds` — unless the same ID belongs\n * to an entry still active in the stack (which happens when a\n * lower-ID entry is parked but a higher-ID entry above it is still\n * open and not swept).\n */\nfunction cleanupSeenIds(sweptIds: readonly number[]): void {\n\tconst activeIds = new Set(overlayStack.map((e) => e.id))\n\tfor (const id of sweptIds) {\n\t\tif (!activeIds.has(id)) {\n\t\t\tseenSyntheticIds.delete(id)\n\t\t}\n\t}\n}\n\n/**\n * On mobile (< sm), when an overlay (dialog/sheet/popover) opens we push a\n * synthetic history entry so the device back gesture closes it instead of\n * navigating away from the page.\n *\n * **Closing via UI** calls `history.back()` to navigate past the\n * synthetic entry, then uses `replaceState` (inside the resulting\n * popstate handler) to restore the original history state.\n *\n * **Closing via back gesture** is handled by the popstate listener,\n * which pops the stack entry and calls the close callback.\n *\n * **Closing via route navigation**: the `pushState` interceptor\n * closes all overlays synchronously but does NOT strip the synthetic\n * marker. The React effect's `scheduleStateRestore` waits for the\n * router's navigation-resolved signal (or falls back to\n * `requestAnimationFrame`); by then the router's push has completed\n * and the marker is gone from `history.state`, so `back()` is\n * skipped. The stranded synthetic entry is later auto-skipped by the\n * capture-phase popstate listener when the user navigates past it.\n *\n * Multiple overlays open at once stack: pressing back closes the most\n * recently opened one first, matching the visual stacking order.\n *\n * No-op on non-mobile viewports and when no `onOpenChange` is provided\n * (uncontrolled overlays cannot be closed externally).\n */\nexport function useMobileBackToClose(\n\topen: boolean | undefined,\n\tonOpenChange: ((open: boolean) => void) | undefined,\n): void {\n\tconst idRef = useRef<number | undefined>(undefined)\n\tconst onChangeRef = useRef(onOpenChange)\n\tonChangeRef.current = onOpenChange\n\n\tuseEffect(() => {\n\t\tif (typeof window === \"undefined\") return\n\t\tif (onChangeRef.current === undefined) return\n\t\tif (!isBelowMd()) return\n\t\tensurePopListener()\n\n\t\tif (open === true && idRef.current === undefined) {\n\t\t\tconst id = ++nextOverlayId\n\t\t\tidRef.current = id\n\t\t\tseenSyntheticIds.add(id)\n\t\t\t// Capture the base state BEFORE pushing so we can restore\n\t\t\t// it on close (via replaceState) to eliminate phantoms.\n\t\t\tconst baseState = window.history.state ?? null\n\t\t\twindow.history.pushState(\n\t\t\t\t{\n\t\t\t\t\t...((baseState as Record<string, unknown>) ?? {}),\n\t\t\t\t\t[HISTORY_KEY]: id,\n\t\t\t\t},\n\t\t\t\t\"\",\n\t\t\t)\n\t\t\toverlayStack.push({\n\t\t\t\tid,\n\t\t\t\tbaseState,\n\t\t\t\tclose() {\n\t\t\t\t\tidRef.current = undefined\n\t\t\t\t\tonChangeRef.current?.(false)\n\t\t\t\t},\n\t\t\t})\n\t\t\treturn\n\t\t}\n\n\t\tif (open !== true && idRef.current !== undefined) {\n\t\t\tconst id = idRef.current\n\t\t\tidRef.current = undefined\n\t\t\tconst entryIdx = overlayStack.findIndex((e) => e.id === id)\n\t\t\tconst entry = entryIdx !== -1 ? overlayStack[entryIdx] : undefined\n\t\t\tconst { removed, parkedBelow } = removeFromStack(id)\n\t\t\tif (removed && entry !== undefined) {\n\t\t\t\tscheduleStateRestore(id, entry.baseState, parkedBelow)\n\t\t\t}\n\t\t}\n\t}, [open])\n\n\tuseEffect(() => {\n\t\treturn () => {\n\t\t\tif (idRef.current !== undefined) {\n\t\t\t\tconst id = idRef.current\n\t\t\t\tidRef.current = undefined\n\t\t\t\tconst entryIdx = overlayStack.findIndex((e) => e.id === id)\n\t\t\t\tconst entry = entryIdx !== -1 ? overlayStack[entryIdx] : undefined\n\t\t\t\tconst { removed, parkedBelow } = removeFromStack(id)\n\t\t\t\tif (removed && entry !== undefined) {\n\t\t\t\t\tscheduleStateRestore(id, entry.baseState, parkedBelow)\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}, [])\n}\n","/**\n * Local utility marks — the three plain glyphs Solar's vocabulary lacks\n * (its ✓/×/+ only exist inside Circle/Square containers, whose marks occupy\n * barely a third of the box and go muddy below 16px). These are drawn\n * in-house for the spots where a bare mark is the whole meaning: checkbox\n * ticks, selected badges, pill clears, add affordances.\n *\n * Check and Cross are strokes in Solar's language (24 viewBox, round caps)\n * at 2 units — diagonals anti-alias gracefully at any tier. Plus is a\n * filled cross instead: its pure orthogonal edges land on integer pixels\n * at the md tier (3-unit arms render as a crisp 2px bar at 16px), where a\n * 1.33px stroke would straddle pixel boundaries and blur. Weight-insensitive:\n * no tone layer, no weight variants. Original geometry — not derived\n * from Solar assets.\n *\n * Marks ride the same `mode` channel as registry icons (declared, ignored):\n * a check is a check in every weight.\n */\nimport type { IconMode } from \"./icon-style.ts\"\n\ntype MarkProps = {\n\tclassName?: string\n\tmode?: IconMode\n}\n\nfunction Mark({\n\td,\n\tfilled,\n\tclassName,\n}: MarkProps & { d: string; filled?: boolean }) {\n\treturn (\n\t\t<svg\n\t\t\txmlns=\"http://www.w3.org/2000/svg\"\n\t\t\tviewBox=\"0 0 24 24\"\n\t\t\tfill=\"none\"\n\t\t\tclassName={className}\n\t\t>\n\t\t\t{filled ? (\n\t\t\t\t<path d={d} fill=\"currentColor\" />\n\t\t\t) : (\n\t\t\t\t<path\n\t\t\t\t\td={d}\n\t\t\t\t\tstroke=\"currentColor\"\n\t\t\t\t\tstrokeWidth=\"2\"\n\t\t\t\t\tstrokeLinecap=\"round\"\n\t\t\t\t\tstrokeLinejoin=\"round\"\n\t\t\t\t/>\n\t\t\t)}\n\t\t</svg>\n\t)\n}\n\n/** Plain ✓ — checkbox ticks, selected badges. */\nexport function Check(props: MarkProps) {\n\treturn <Mark {...props} d=\"M5 12.8l4.7 4.7L19 7.2\" />\n}\n\n/** Plain × — pill and chip clears. */\nexport function Cross(props: MarkProps) {\n\treturn <Mark {...props} d=\"M6 6l12 12M18 6L6 18\" />\n}\n\n/** Plain + — add affordances. Filled cross, 3-unit arms spanning 5–19. */\nexport function Plus(props: MarkProps) {\n\treturn (\n\t\t<Mark\n\t\t\t{...props}\n\t\t\tfilled\n\t\t\td=\"M10.5 5h3v5.5H19v3h-5.5V19h-3v-5.5H5v-3h5.5V5Z\"\n\t\t/>\n\t)\n}\n","import { extendTailwindMerge } from \"tailwind-merge\"\n\n// The app's `@theme inline` tokens (theme.css) generate utility names\n// tailwind-merge doesn't know, so it misclassifies them — e.g. `text-ui` is\n// parsed as a text color and dropped next to any `text-*` color. The default\n// class groups are theme-backed, so extending the theme (keys mirror the v4\n// token namespaces one-to-one) registers every custom utility with correct\n// conflict semantics. merge-config.test.ts pins this list against theme.css.\nexport const mergeTheme = {\n\ttext: [\"tiny\", \"ui\", \"doc\", \"doc-title\", \"doc-heading\", \"quote\"],\n\tspacing: [\"chip\", \"control\", \"nav\", \"sidebar\", \"panel\"],\n\ttracking: [\"label\"],\n\tshadow: [\"card\", \"dialog\"],\n\tcontainer: [\"reading\", \"medium\", \"content\"],\n\tfont: [\"doc\", \"heading\"],\n\tease: [\"standard\"],\n\tanimate: [\"skel\", \"pop\"],\n} as const\n\nexport const twMerge = extendTailwindMerge({\n\textend: { theme: mergeTheme },\n})\n","import { type ClassValue, clsx } from \"clsx\"\nimport { twMerge } from \"./merge-config\"\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs))\n}\n","import { useMobileBackToClose } from \"@hoardodile/ui/hooks/useMobileBackToClose\"\nimport { Cross } from \"@hoardodile/ui/icons/marks\"\nimport { cn } from \"@hoardodile/ui/lib/utils\"\nimport { type ReactNode, useEffect, useState } from \"react\"\n\nexport type MobileDrawerProps = {\n\treadonly open: boolean\n\treadonly onOpenChange: (open: boolean) => void\n\treadonly side?: \"left\" | \"right\"\n\treadonly width?: string\n\t/**\n\t * Viewport variant at and above which the drawer is hidden. Must be a\n\t * literal class at the call site (e.g. \"min-[1440px]:hidden\") so\n\t * Tailwind can scan it. Defaults to \"md:hidden\".\n\t */\n\treadonly hideAbove?: string\n\treadonly title?: ReactNode\n\treadonly children: ReactNode\n\treadonly className?: string\n}\n\n/**\n * Mobile-only slide-in drawer with backdrop, close header and\n * {@link useMobileBackToClose} integration.\n *\n * Renders nothing at and above the {@link MobileDrawerProps.hideAbove}\n * breakpoint (\"md\" by default) — the caller is expected to provide its\n * own desktop layout independently.\n */\nexport function MobileDrawer(props: MobileDrawerProps) {\n\tconst {\n\t\topen,\n\t\tonOpenChange,\n\t\tside = \"left\",\n\t\twidth = \"w-72\",\n\t\thideAbove = \"md:hidden\",\n\t\ttitle,\n\t} = props\n\tconst isLeft = side === \"left\"\n\t// Mount children only once the drawer has been opened, so closed drawers\n\t// (which stay in the tree for the slide transition) do not pay for\n\t// rendering their content. Once mounted they stay mounted so the close\n\t// animation and any inner state survive.\n\tconst [hasOpened, setHasOpened] = useState(open)\n\n\tuseEffect(() => {\n\t\tif (open) setHasOpened(true)\n\t}, [open])\n\n\tuseMobileBackToClose(open, onOpenChange)\n\n\treturn (\n\t\t<>\n\t\t\t{open && (\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"fixed inset-0 z-30 bg-background/60 backdrop-blur-sm\",\n\t\t\t\t\t\thideAbove,\n\t\t\t\t\t)}\n\t\t\t\t\tonClick={() => onOpenChange(false)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<aside\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"fixed top-0 z-40 flex h-svh flex-col bg-card transition-transform duration-200\",\n\t\t\t\t\thideAbove,\n\t\t\t\t\tisLeft ? \"left-0 border-r\" : \"right-0 border-l\",\n\t\t\t\t\twidth,\n\t\t\t\t\tisLeft\n\t\t\t\t\t\t? open\n\t\t\t\t\t\t\t? \"translate-x-0 shadow-xl\"\n\t\t\t\t\t\t\t: \"-translate-x-full\"\n\t\t\t\t\t\t: open\n\t\t\t\t\t\t\t? \"translate-x-0 shadow-xl\"\n\t\t\t\t\t\t\t: \"translate-x-full\",\n\t\t\t\t\tprops.className,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{title !== undefined && (\n\t\t\t\t\t<div className=\"flex items-center justify-between border-b px-3 py-3\">\n\t\t\t\t\t\t<span className=\"text-sm font-medium\">{title}</span>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclassName=\"flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent\"\n\t\t\t\t\t\t\tonClick={() => onOpenChange(false)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Cross className=\"size-4\" />\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div className=\"flex min-h-0 flex-1 flex-col overflow-hidden\">\n\t\t\t\t\t{hasOpened ? props.children : null}\n\t\t\t\t</div>\n\t\t\t</aside>\n\t\t</>\n\t)\n}\n"]}
+{"version":3,"sources":["../../src/components/mobile-drawer.tsx"],"names":[],"mappings":";;;;;;;;;AA6BO,SAAS,aAAa,KAAA,EAA0B;AACtD,EAAA,MAAM;AAAA,IACL,IAAA;AAAA,IACA,YAAA;AAAA,IACA,IAAA,GAAO,MAAA;AAAA,IACP,KAAA,GAAQ,MAAA;AAAA,IACR,SAAA,GAAY,WAAA;AAAA,IACZ;AAAA,GACD,GAAI,KAAA;AACJ,EAAA,MAAM,SAAS,IAAA,KAAS,MAAA;AAKxB,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAS,IAAI,CAAA;AAE/C,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,IAAI,IAAA,eAAmB,IAAI,CAAA;AAAA,EAC5B,CAAA,EAAG,CAAC,IAAI,CAAC,CAAA;AAET,EAAA,oBAAA,CAAqB,MAAM,YAAY,CAAA;AAEvC,EAAA,uBACC,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,IAAA,oBACA,GAAA;AAAA,MAAC,QAAA;AAAA,MAAA;AAAA,QACA,IAAA,EAAK,QAAA;AAAA,QACL,SAAA,EAAW,EAAA;AAAA,UACV,sDAAA;AAAA,UACA;AAAA,SACD;AAAA,QACA,OAAA,EAAS,MAAM,YAAA,CAAa,KAAK;AAAA;AAAA,KAClC;AAAA,oBAED,IAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACA,SAAA,EAAW,EAAA;AAAA,UACV,gFAAA;AAAA,UACA,SAAA;AAAA,UACA,SAAS,iBAAA,GAAoB,kBAAA;AAAA,UAC7B,KAAA;AAAA,UACA,MAAA,GACG,IAAA,GACC,yBAAA,GACA,mBAAA,GACD,OACC,yBAAA,GACA,kBAAA;AAAA,UACJ,KAAA,CAAM;AAAA,SACP;AAAA,QAEC,QAAA,EAAA;AAAA,UAAA,KAAA,KAAU,MAAA,oBACV,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,sDAAA,EACd,QAAA,EAAA;AAAA,4BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,qBAAA,EAAuB,QAAA,EAAA,KAAA,EAAM,CAAA;AAAA,4BAC7C,GAAA;AAAA,cAAC,QAAA;AAAA,cAAA;AAAA,gBACA,IAAA,EAAK,QAAA;AAAA,gBACL,SAAA,EAAU,0FAAA;AAAA,gBACV,OAAA,EAAS,MAAM,YAAA,CAAa,KAAK,CAAA;AAAA,gBAEjC,QAAA,kBAAA,GAAA,CAAC,KAAA,EAAA,EAAM,SAAA,EAAU,QAAA,EAAS;AAAA;AAAA;AAC3B,WAAA,EACD,CAAA;AAAA,8BAEA,KAAA,EAAA,EAAI,SAAA,EAAU,gDACb,QAAA,EAAA,SAAA,GAAY,KAAA,CAAM,WAAW,IAAA,EAC/B;AAAA;AAAA;AAAA;AACD,GAAA,EACD,CAAA;AAEF","file":"mobile-drawer.js","sourcesContent":["import { useMobileBackToClose } from \"@hoardodile/ui/hooks/useMobileBackToClose\"\nimport { Cross } from \"@hoardodile/ui/icons/marks\"\nimport { cn } from \"@hoardodile/ui/lib/utils\"\nimport { type ReactNode, useEffect, useState } from \"react\"\n\nexport type MobileDrawerProps = {\n\treadonly open: boolean\n\treadonly onOpenChange: (open: boolean) => void\n\treadonly side?: \"left\" | \"right\"\n\treadonly width?: string\n\t/**\n\t * Viewport variant at and above which the drawer is hidden. Must be a\n\t * literal class at the call site (e.g. \"min-[1440px]:hidden\") so\n\t * Tailwind can scan it. Defaults to \"md:hidden\".\n\t */\n\treadonly hideAbove?: string\n\treadonly title?: ReactNode\n\treadonly children: ReactNode\n\treadonly className?: string\n}\n\n/**\n * Mobile-only slide-in drawer with backdrop, close header and\n * {@link useMobileBackToClose} integration.\n *\n * Renders nothing at and above the {@link MobileDrawerProps.hideAbove}\n * breakpoint (\"md\" by default) — the caller is expected to provide its\n * own desktop layout independently.\n */\nexport function MobileDrawer(props: MobileDrawerProps) {\n\tconst {\n\t\topen,\n\t\tonOpenChange,\n\t\tside = \"left\",\n\t\twidth = \"w-72\",\n\t\thideAbove = \"md:hidden\",\n\t\ttitle,\n\t} = props\n\tconst isLeft = side === \"left\"\n\t// Mount children only once the drawer has been opened, so closed drawers\n\t// (which stay in the tree for the slide transition) do not pay for\n\t// rendering their content. Once mounted they stay mounted so the close\n\t// animation and any inner state survive.\n\tconst [hasOpened, setHasOpened] = useState(open)\n\n\tuseEffect(() => {\n\t\tif (open) setHasOpened(true)\n\t}, [open])\n\n\tuseMobileBackToClose(open, onOpenChange)\n\n\treturn (\n\t\t<>\n\t\t\t{open && (\n\t\t\t\t<button\n\t\t\t\t\ttype=\"button\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"fixed inset-0 z-30 bg-background/60 backdrop-blur-sm\",\n\t\t\t\t\t\thideAbove,\n\t\t\t\t\t)}\n\t\t\t\t\tonClick={() => onOpenChange(false)}\n\t\t\t\t/>\n\t\t\t)}\n\t\t\t<aside\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"fixed top-0 z-40 flex h-svh flex-col bg-card transition-transform duration-200\",\n\t\t\t\t\thideAbove,\n\t\t\t\t\tisLeft ? \"left-0 border-r\" : \"right-0 border-l\",\n\t\t\t\t\twidth,\n\t\t\t\t\tisLeft\n\t\t\t\t\t\t? open\n\t\t\t\t\t\t\t? \"translate-x-0 shadow-xl\"\n\t\t\t\t\t\t\t: \"-translate-x-full\"\n\t\t\t\t\t\t: open\n\t\t\t\t\t\t\t? \"translate-x-0 shadow-xl\"\n\t\t\t\t\t\t\t: \"translate-x-full\",\n\t\t\t\t\tprops.className,\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{title !== undefined && (\n\t\t\t\t\t<div className=\"flex items-center justify-between border-b px-3 py-3\">\n\t\t\t\t\t\t<span className=\"text-sm font-medium\">{title}</span>\n\t\t\t\t\t\t<button\n\t\t\t\t\t\t\ttype=\"button\"\n\t\t\t\t\t\t\tclassName=\"flex size-7 items-center justify-center rounded-md text-muted-foreground hover:bg-accent\"\n\t\t\t\t\t\t\tonClick={() => onOpenChange(false)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Cross className=\"size-4\" />\n\t\t\t\t\t\t</button>\n\t\t\t\t\t</div>\n\t\t\t\t)}\n\t\t\t\t<div className=\"flex min-h-0 flex-1 flex-col overflow-hidden\">\n\t\t\t\t\t{hasOpened ? props.children : null}\n\t\t\t\t</div>\n\t\t\t</aside>\n\t\t</>\n\t)\n}\n"]}

package/dist/components/page-header.js

@@ -1,44 +1,5 @@
-import { clsx } from 'clsx';
-import { extendTailwindMerge } from 'tailwind-merge';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-// src/lib/utils.ts
-var mergeTheme = {
-  text: ["tiny", "ui", "doc", "doc-title", "doc-heading", "quote"],
-  spacing: ["chip", "control", "nav", "sidebar", "panel"],
-  tracking: ["label"],
-  shadow: ["card", "dialog"],
-  container: ["reading", "medium", "content"],
-  font: ["doc", "heading"],
-  ease: ["standard"],
-  animate: ["skel", "pop"]
-};
-var twMerge = extendTailwindMerge({
-  extend: { theme: mergeTheme }
-});
-
-// src/lib/utils.ts
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-function PageHeader(props) {
-  const { title, count, description, actions, className } = props;
-  return /* @__PURE__ */ jsxs("header", { className: cn("mb-6", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-end justify-between gap-x-6 gap-y-3", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-baseline gap-3", children: [
-        title !== void 0 ? /* @__PURE__ */ jsx("h1", { className: "text-doc-heading font-bold text-foreground", children: title }) : null,
-        count !== void 0 ? /* @__PURE__ */ jsx("span", { className: "text-ui text-muted-foreground", children: count }) : null
-      ] }),
-      actions !== void 0 ? (
-        // `ml-auto` keeps a wrapped actions line right-aligned on
-        // narrow viewports, matching the same-line justify-between.
-        /* @__PURE__ */ jsx("div", { className: "ml-auto flex shrink-0 flex-wrap items-center gap-4 pb-1", children: actions })
-      ) : null
-    ] }),
-    description !== void 0 ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-ui text-muted-foreground", children: description }) : null
-  ] });
-}
-
-export { PageHeader };
+export { PageHeader } from '../chunk-F7RHDRRJ.js';
+import '../chunk-M5OJN54O.js';
+import '../chunk-2HWSCY4T.js';
 //# sourceMappingURL=page-header.js.map
 //# sourceMappingURL=page-header.js.map

package/dist/components/page-header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lib/merge-config.ts","../../src/lib/utils.ts","../../src/components/page-header.tsx"],"names":[],"mappings":";;;;;AAQO,IAAM,UAAA,GAAa;AAAA,EACzB,MAAM,CAAC,MAAA,EAAQ,MAAM,KAAA,EAAO,WAAA,EAAa,eAAe,OAAO,CAAA;AAAA,EAC/D,SAAS,CAAC,MAAA,EAAQ,SAAA,EAAW,KAAA,EAAO,WAAW,OAAO,CAAA;AAAA,EACtD,QAAA,EAAU,CAAC,OAAO,CAAA;AAAA,EAClB,MAAA,EAAQ,CAAC,MAAA,EAAQ,QAAQ,CAAA;AAAA,EACzB,SAAA,EAAW,CAAC,SAAA,EAAW,QAAA,EAAU,SAAS,CAAA;AAAA,EAC1C,IAAA,EAAM,CAAC,KAAA,EAAO,SAAS,CAAA;AAAA,EACvB,IAAA,EAAM,CAAC,UAAU,CAAA;AAAA,EACjB,OAAA,EAAS,CAAC,MAAA,EAAQ,KAAK;AACxB,CAAA;AAEO,IAAM,UAAU,mBAAA,CAAoB;AAAA,EAC1C,MAAA,EAAQ,EAAE,KAAA,EAAO,UAAA;AAClB,CAAC,CAAA;;;AClBM,SAAS,MAAM,MAAA,EAAsB;AAC3C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC5B;ACaO,SAAS,WAAW,KAAA,EAAwB;AAClD,EAAA,MAAM,EAAE,KAAA,EAAO,KAAA,EAAO,WAAA,EAAa,OAAA,EAAS,WAAU,GAAI,KAAA;AAC1D,EAAA,4BACE,QAAA,EAAA,EAAO,SAAA,EAAW,EAAA,CAAG,MAAA,EAAQ,SAAS,CAAA,EACtC,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,0DAAA,EACd,QAAA,EAAA;AAAA,sBAAA,IAAA,CAAC,KAAA,EAAA,EAAI,WAAU,mCAAA,EACb,QAAA,EAAA;AAAA,QAAA,KAAA,KAAU,yBACV,GAAA,CAAC,IAAA,EAAA,EAAG,SAAA,EAAU,4CAAA,EACZ,iBACF,CAAA,GACG,IAAA;AAAA,QACH,UAAU,MAAA,mBACV,GAAA,CAAC,UAAK,SAAA,EAAU,+BAAA,EAAiC,iBAAM,CAAA,GACpD;AAAA,OAAA,EACL,CAAA;AAAA,MACC,OAAA,KAAY,MAAA;AAAA;AAAA;AAAA,wBAGZ,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,yDAAA,EACb,QAAA,EAAA,OAAA,EACF;AAAA,UACG;AAAA,KAAA,EACL,CAAA;AAAA,IACC,gBAAgB,MAAA,mBAChB,GAAA,CAAC,OAAE,SAAA,EAAU,oCAAA,EAAsC,uBAAY,CAAA,GAC5D;AAAA,GAAA,EACL,CAAA;AAEF","file":"page-header.js","sourcesContent":["import { extendTailwindMerge } from \"tailwind-merge\"\n\n// The app's `@theme inline` tokens (theme.css) generate utility names\n// tailwind-merge doesn't know, so it misclassifies them — e.g. `text-ui` is\n// parsed as a text color and dropped next to any `text-*` color. The default\n// class groups are theme-backed, so extending the theme (keys mirror the v4\n// token namespaces one-to-one) registers every custom utility with correct\n// conflict semantics. merge-config.test.ts pins this list against theme.css.\nexport const mergeTheme = {\n\ttext: [\"tiny\", \"ui\", \"doc\", \"doc-title\", \"doc-heading\", \"quote\"],\n\tspacing: [\"chip\", \"control\", \"nav\", \"sidebar\", \"panel\"],\n\ttracking: [\"label\"],\n\tshadow: [\"card\", \"dialog\"],\n\tcontainer: [\"reading\", \"medium\", \"content\"],\n\tfont: [\"doc\", \"heading\"],\n\tease: [\"standard\"],\n\tanimate: [\"skel\", \"pop\"],\n} as const\n\nexport const twMerge = extendTailwindMerge({\n\textend: { theme: mergeTheme },\n})\n","import { type ClassValue, clsx } from \"clsx\"\nimport { twMerge } from \"./merge-config\"\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs))\n}\n","import { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\n\ntype PageHeaderProps = {\n\treadonly title?: ReactNode\n\t/** Muted total on the title baseline (e.g. the item count). */\n\treadonly count?: string\n\treadonly description?: ReactNode\n\treadonly actions?: ReactNode\n\treadonly className?: string\n}\n\n/**\n * Page header — 28px bold title with the total count muted on its baseline,\n * optional muted description below, page actions on the right. The literary\n * serif (font-doc) is scoped to the documents section; chrome and index\n * pages speak in the app sans.\n */\nexport function PageHeader(props: PageHeaderProps) {\n\tconst { title, count, description, actions, className } = props\n\treturn (\n\t\t<header className={cn(\"mb-6\", className)}>\n\t\t\t<div className=\"flex flex-wrap items-end justify-between gap-x-6 gap-y-3\">\n\t\t\t\t<div className=\"flex min-w-0 items-baseline gap-3\">\n\t\t\t\t\t{title !== undefined ? (\n\t\t\t\t\t\t<h1 className=\"text-doc-heading font-bold text-foreground\">\n\t\t\t\t\t\t\t{title}\n\t\t\t\t\t\t</h1>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{count !== undefined ? (\n\t\t\t\t\t\t<span className=\"text-ui text-muted-foreground\">{count}</span>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t{actions !== undefined ? (\n\t\t\t\t\t// `ml-auto` keeps a wrapped actions line right-aligned on\n\t\t\t\t\t// narrow viewports, matching the same-line justify-between.\n\t\t\t\t\t<div className=\"ml-auto flex shrink-0 flex-wrap items-center gap-4 pb-1\">\n\t\t\t\t\t\t{actions}\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t\t{description !== undefined ? (\n\t\t\t\t<p className=\"mt-2 text-ui text-muted-foreground\">{description}</p>\n\t\t\t) : null}\n\t\t</header>\n\t)\n}\n"]}
+{"version":3,"sources":[],"names":[],"mappings":"","file":"page-header.js"}

package/dist/components/page-scaffold.js

@@ -1,81 +1,10 @@
-import { clsx } from 'clsx';
-import { extendTailwindMerge } from 'tailwind-merge';
+import { Surface } from '../chunk-4UITFLIN.js';
+import { Skeleton } from '../chunk-WVEK3WCX.js';
+import { PageHeader } from '../chunk-F7RHDRRJ.js';
+import { cn } from '../chunk-M5OJN54O.js';
+import '../chunk-2HWSCY4T.js';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
-// src/lib/utils.ts
-var mergeTheme = {
-  text: ["tiny", "ui", "doc", "doc-title", "doc-heading", "quote"],
-  spacing: ["chip", "control", "nav", "sidebar", "panel"],
-  tracking: ["label"],
-  shadow: ["card", "dialog"],
-  container: ["reading", "medium", "content"],
-  font: ["doc", "heading"],
-  ease: ["standard"],
-  animate: ["skel", "pop"]
-};
-var twMerge = extendTailwindMerge({
-  extend: { theme: mergeTheme }
-});
-
-// src/lib/utils.ts
-function cn(...inputs) {
-  return twMerge(clsx(inputs));
-}
-function Skeleton({
-  className,
-  element: Element = "div",
-  ...props
-}) {
-  return /* @__PURE__ */ jsx(
-    Element,
-    {
-      "data-slot": "skeleton",
-      className: cn("animate-pulse rounded-md bg-muted", className),
-      ...props
-    }
-  );
-}
-function Surface({
-  as,
-  size = "default",
-  tone = "flat",
-  className,
-  ...props
-}) {
-  const Component = as || "div";
-  return /* @__PURE__ */ jsx(
-    Component,
-    {
-      "data-slot": "surface",
-      "data-size": size,
-      "data-tone": tone,
-      className: cn(
-        "rounded-md border bg-card text-card-foreground",
-        size === "default" && "p-4",
-        size === "compact" && "p-2",
-        className
-      ),
-      ...props
-    }
-  );
-}
-function PageHeader(props) {
-  const { title, count, description, actions, className } = props;
-  return /* @__PURE__ */ jsxs("header", { className: cn("mb-6", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-end justify-between gap-x-6 gap-y-3", children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 items-baseline gap-3", children: [
-        title !== void 0 ? /* @__PURE__ */ jsx("h1", { className: "text-doc-heading font-bold text-foreground", children: title }) : null,
-        count !== void 0 ? /* @__PURE__ */ jsx("span", { className: "text-ui text-muted-foreground", children: count }) : null
-      ] }),
-      actions !== void 0 ? (
-        // `ml-auto` keeps a wrapped actions line right-aligned on
-        // narrow viewports, matching the same-line justify-between.
-        /* @__PURE__ */ jsx("div", { className: "ml-auto flex shrink-0 flex-wrap items-center gap-4 pb-1", children: actions })
-      ) : null
-    ] }),
-    description !== void 0 ? /* @__PURE__ */ jsx("p", { className: "mt-2 text-ui text-muted-foreground", children: description }) : null
-  ] });
-}
 var widthClasses = {
   reading: "max-w-reading",
   medium: "max-w-medium",

package/dist/components/page-scaffold.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/lib/merge-config.ts","../../src/lib/utils.ts","../../src/components/skeleton.tsx","../../src/components/surface.tsx","../../src/components/page-header.tsx","../../src/components/page-scaffold.tsx"],"names":["jsx","jsxs"],"mappings":"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","file":"page-scaffold.js","sourcesContent":["import { extendTailwindMerge } from \"tailwind-merge\"\n\n// The app's `@theme inline` tokens (theme.css) generate utility names\n// tailwind-merge doesn't know, so it misclassifies them — e.g. `text-ui` is\n// parsed as a text color and dropped next to any `text-*` color. The default\n// class groups are theme-backed, so extending the theme (keys mirror the v4\n// token namespaces one-to-one) registers every custom utility with correct\n// conflict semantics. merge-config.test.ts pins this list against theme.css.\nexport const mergeTheme = {\n\ttext: [\"tiny\", \"ui\", \"doc\", \"doc-title\", \"doc-heading\", \"quote\"],\n\tspacing: [\"chip\", \"control\", \"nav\", \"sidebar\", \"panel\"],\n\ttracking: [\"label\"],\n\tshadow: [\"card\", \"dialog\"],\n\tcontainer: [\"reading\", \"medium\", \"content\"],\n\tfont: [\"doc\", \"heading\"],\n\tease: [\"standard\"],\n\tanimate: [\"skel\", \"pop\"],\n} as const\n\nexport const twMerge = extendTailwindMerge({\n\textend: { theme: mergeTheme },\n})\n","import { type ClassValue, clsx } from \"clsx\"\nimport { twMerge } from \"./merge-config\"\n\nexport function cn(...inputs: ClassValue[]) {\n\treturn twMerge(clsx(inputs))\n}\n","import { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ElementType } from \"react\"\n\nfunction Skeleton({\n  className,\n  element: Element = \"div\",\n  ...props\n}: React.ComponentProps<\"div\"> & { readonly element?: ElementType }) {\n  return (\n    <Element\n      data-slot=\"skeleton\"\n      className={cn(\"animate-pulse rounded-md bg-muted\", className)}\n      {...props}\n    />\n  )\n}\n\nexport { Skeleton }\n","import { cn } from \"@hoardodile/ui/lib/utils\"\nimport type * as React from \"react\"\n\ntype SurfaceProps<C extends React.ElementType = \"div\"> = {\n\tas?: C\n\tsize?: \"default\" | \"compact\"\n\t/**\n\t * Visual tone. `flat` (default) is the hairline card\n\t */\n\ttone?: \"flat\"\n} & Omit<React.ComponentPropsWithoutRef<C>, \"as\" | \"size\" | \"tone\">\n\nfunction Surface<C extends React.ElementType = \"div\">({\n\tas,\n\tsize = \"default\",\n\ttone = \"flat\",\n\tclassName,\n\t...props\n}: SurfaceProps<C>) {\n\tconst Component = as || \"div\"\n\treturn (\n\t\t<Component\n\t\t\tdata-slot=\"surface\"\n\t\t\tdata-size={size}\n\t\t\tdata-tone={tone}\n\t\t\tclassName={cn(\n\t\t\t\t\"rounded-md border bg-card text-card-foreground\",\n\t\t\t\tsize === \"default\" && \"p-4\",\n\t\t\t\tsize === \"compact\" && \"p-2\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t)\n}\n\nexport { Surface }\n","import { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\n\ntype PageHeaderProps = {\n\treadonly title?: ReactNode\n\t/** Muted total on the title baseline (e.g. the item count). */\n\treadonly count?: string\n\treadonly description?: ReactNode\n\treadonly actions?: ReactNode\n\treadonly className?: string\n}\n\n/**\n * Page header — 28px bold title with the total count muted on its baseline,\n * optional muted description below, page actions on the right. The literary\n * serif (font-doc) is scoped to the documents section; chrome and index\n * pages speak in the app sans.\n */\nexport function PageHeader(props: PageHeaderProps) {\n\tconst { title, count, description, actions, className } = props\n\treturn (\n\t\t<header className={cn(\"mb-6\", className)}>\n\t\t\t<div className=\"flex flex-wrap items-end justify-between gap-x-6 gap-y-3\">\n\t\t\t\t<div className=\"flex min-w-0 items-baseline gap-3\">\n\t\t\t\t\t{title !== undefined ? (\n\t\t\t\t\t\t<h1 className=\"text-doc-heading font-bold text-foreground\">\n\t\t\t\t\t\t\t{title}\n\t\t\t\t\t\t</h1>\n\t\t\t\t\t) : null}\n\t\t\t\t\t{count !== undefined ? (\n\t\t\t\t\t\t<span className=\"text-ui text-muted-foreground\">{count}</span>\n\t\t\t\t\t) : null}\n\t\t\t\t</div>\n\t\t\t\t{actions !== undefined ? (\n\t\t\t\t\t// `ml-auto` keeps a wrapped actions line right-aligned on\n\t\t\t\t\t// narrow viewports, matching the same-line justify-between.\n\t\t\t\t\t<div className=\"ml-auto flex shrink-0 flex-wrap items-center gap-4 pb-1\">\n\t\t\t\t\t\t{actions}\n\t\t\t\t\t</div>\n\t\t\t\t) : null}\n\t\t\t</div>\n\t\t\t{description !== undefined ? (\n\t\t\t\t<p className=\"mt-2 text-ui text-muted-foreground\">{description}</p>\n\t\t\t) : null}\n\t\t</header>\n\t)\n}\n","import { Skeleton } from \"@hoardodile/ui/components/skeleton\"\nimport { Surface } from \"@hoardodile/ui/components/surface\"\nimport { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\nimport { PageHeader } from \"./page-header\"\n\n/** Content widths (DESIGN.md — Layout): the three fixed measures\n    index/detail pages are held to, centered beyond them. The measure is\n    the content width — padding never counts toward it (DESIGN.md),\n    so it lives on the outer wrapper, not on the measure element. Desktop\n    padding is `px-10 pt-10 pb-16`; mobile\n    and tablet keep their own tighter gutters. */\nexport type PageScaffoldWidth = \"reading\" | \"medium\" | \"content\"\n\nconst widthClasses: Record<PageScaffoldWidth, string> = {\n\treading: \"max-w-reading\",\n\tmedium: \"max-w-medium\",\n\tcontent: \"max-w-content\",\n}\n\ntype PageScaffoldProps = {\n\treadonly children: ReactNode\n\t/** Center the page at one of the three content measures; omitted when\n\t    the page's own component owns the measure. */\n\treadonly width?: PageScaffoldWidth\n\t/** Drop the desktop bottom padding — pages ending in a sticky ActionBar. */\n\treadonly bottomPad?: boolean\n\treadonly className?: string\n}\n\nfunction frameClassName(props: PageScaffoldProps) {\n\treturn cn(\n\t\t\"pb-4 pt-2 px-3 md:px-4 md:pt-4.5 lg:px-10\",\n\t\tprops.bottomPad !== false && \"lg:pb-16\",\n\t\tprops.className,\n\t)\n}\n\nexport function PageScaffold(props: PageScaffoldProps) {\n\tif (props.width === undefined) {\n\t\treturn (\n\t\t\t<div className={cn(\"flex w-full flex-col\", frameClassName(props))}>\n\t\t\t\t{props.children}\n\t\t\t</div>\n\t\t)\n\t}\n\n\treturn (\n\t\t<div className={frameClassName(props)}>\n\t\t\t<div\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"mx-auto flex w-full flex-col\",\n\t\t\t\t\twidthClasses[props.width],\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{props.children}\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\ntype SurfaceProps = {\n\treadonly children: ReactNode\n\treadonly className?: string\n}\n\nexport function FlatSurface(props: SurfaceProps) {\n\treturn (\n\t\t<Surface as=\"section\" size=\"compact\" className={props.className}>\n\t\t\t{props.children}\n\t\t</Surface>\n\t)\n}\n\ntype PillProps = {\n\treadonly children: ReactNode\n\treadonly tone?: \"primary\" | \"secondary\" | \"accent\" | \"muted\"\n\treadonly className?: string\n}\n\nexport function InfoPill(props: PillProps) {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(\n\t\t\t\t\"inline-flex items-center rounded-md px-2 py-1 text-xs font-medium\",\n\t\t\t\tpillToneClassName(props.tone),\n\t\t\t\tprops.className,\n\t\t\t)}\n\t\t>\n\t\t\t{props.children}\n\t\t</span>\n\t)\n}\n\nexport function RoutePendingFallback() {\n\treturn (\n\t\t<PageScaffold>\n\t\t\t<PageHeader\n\t\t\t\ttitle={\n\t\t\t\t\t// Span elements: the header wraps title in h1 and description\n\t\t\t\t\t// in p, and a block div inside either is invalid HTML.\n\t\t\t\t\t<Skeleton element=\"span\" className=\"block h-8 w-64 max-w-full\" />\n\t\t\t\t}\n\t\t\t\tdescription={\n\t\t\t\t\t<Skeleton element=\"span\" className=\"block h-4 w-full max-w-lg\" />\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<div className=\"grid gap-4 md:grid-cols-2 xl:grid-cols-3\">\n\t\t\t\t<Skeleton className=\"h-32 rounded-lg\" />\n\t\t\t\t<Skeleton className=\"h-32 rounded-lg\" />\n\t\t\t\t<Skeleton className=\"h-32 rounded-lg md:col-span-2 xl:col-span-1\" />\n\t\t\t</div>\n\t\t</PageScaffold>\n\t)\n}\n\nfunction pillToneClassName(tone: PillProps[\"tone\"]) {\n\tif (tone === \"primary\") {\n\t\treturn \"bg-primary/10 text-primary\"\n\t}\n\n\tif (tone === \"secondary\") {\n\t\treturn \"bg-secondary text-secondary-foreground\"\n\t}\n\n\tif (tone === \"accent\") {\n\t\treturn \"bg-accent text-accent-foreground\"\n\t}\n\n\treturn \"bg-muted text-muted-foreground\"\n}\n"]}
+{"version":3,"sources":["../../src/components/page-scaffold.tsx"],"names":[],"mappings":";;;;;;;AAcA,IAAM,YAAA,GAAkD;AAAA,EACvD,OAAA,EAAS,eAAA;AAAA,EACT,MAAA,EAAQ,cAAA;AAAA,EACR,OAAA,EAAS;AACV,CAAA;AAYA,SAAS,eAAe,KAAA,EAA0B;AACjD,EAAA,OAAO,EAAA;AAAA,IACN,2CAAA;AAAA,IACA,KAAA,CAAM,cAAc,KAAA,IAAS,UAAA;AAAA,IAC7B,KAAA,CAAM;AAAA,GACP;AACD;AAEO,SAAS,aAAa,KAAA,EAA0B;AACtD,EAAA,IAAI,KAAA,CAAM,UAAU,MAAA,EAAW;AAC9B,IAAA,uBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,EAAA,CAAG,sBAAA,EAAwB,eAAe,KAAK,CAAC,CAAA,EAC9D,QAAA,EAAA,KAAA,CAAM,QAAA,EACR,CAAA;AAAA,EAEF;AAEA,EAAA,uBACC,GAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAW,cAAA,CAAe,KAAK,CAAA,EACnC,QAAA,kBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACV,8BAAA;AAAA,QACA,YAAA,CAAa,MAAM,KAAK;AAAA,OACzB;AAAA,MAEC,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,GACR,EACD,CAAA;AAEF;AAOO,SAAS,YAAY,KAAA,EAAqB;AAChD,EAAA,uBACC,GAAA,CAAC,OAAA,EAAA,EAAQ,EAAA,EAAG,SAAA,EAAU,IAAA,EAAK,WAAU,SAAA,EAAW,KAAA,CAAM,SAAA,EACpD,QAAA,EAAA,KAAA,CAAM,QAAA,EACR,CAAA;AAEF;AAQO,SAAS,SAAS,KAAA,EAAkB;AAC1C,EAAA,uBACC,GAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACA,SAAA,EAAW,EAAA;AAAA,QACV,mEAAA;AAAA,QACA,iBAAA,CAAkB,MAAM,IAAI,CAAA;AAAA,QAC5B,KAAA,CAAM;AAAA,OACP;AAAA,MAEC,QAAA,EAAA,KAAA,CAAM;AAAA;AAAA,GACR;AAEF;AAEO,SAAS,oBAAA,GAAuB;AACtC,EAAA,4BACE,YAAA,EAAA,EACA,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACA,KAAA;AAAA;AAAA;AAAA,0BAGC,GAAA,CAAC,QAAA,EAAA,EAAS,OAAA,EAAQ,MAAA,EAAO,WAAU,2BAAA,EAA4B;AAAA,SAAA;AAAA,QAEhE,6BACC,GAAA,CAAC,QAAA,EAAA,EAAS,OAAA,EAAQ,MAAA,EAAO,WAAU,2BAAA,EAA4B;AAAA;AAAA,KAEjE;AAAA,oBACA,IAAA,CAAC,KAAA,EAAA,EAAI,SAAA,EAAU,0CAAA,EACd,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,QAAA,EAAA,EAAS,WAAU,iBAAA,EAAkB,CAAA;AAAA,sBACtC,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,iBAAA,EAAkB,CAAA;AAAA,sBACtC,GAAA,CAAC,QAAA,EAAA,EAAS,SAAA,EAAU,6CAAA,EAA8C;AAAA,KAAA,EACnE;AAAA,GAAA,EACD,CAAA;AAEF;AAEA,SAAS,kBAAkB,IAAA,EAAyB;AACnD,EAAA,IAAI,SAAS,SAAA,EAAW;AACvB,IAAA,OAAO,4BAAA;AAAA,EACR;AAEA,EAAA,IAAI,SAAS,WAAA,EAAa;AACzB,IAAA,OAAO,wCAAA;AAAA,EACR;AAEA,EAAA,IAAI,SAAS,QAAA,EAAU;AACtB,IAAA,OAAO,kCAAA;AAAA,EACR;AAEA,EAAA,OAAO,gCAAA;AACR","file":"page-scaffold.js","sourcesContent":["import { Skeleton } from \"@hoardodile/ui/components/skeleton\"\nimport { Surface } from \"@hoardodile/ui/components/surface\"\nimport { cn } from \"@hoardodile/ui/lib/utils\"\nimport type { ReactNode } from \"react\"\nimport { PageHeader } from \"./page-header\"\n\n/** Content widths (DESIGN.md — Layout): the three fixed measures\n    index/detail pages are held to, centered beyond them. The measure is\n    the content width — padding never counts toward it (DESIGN.md),\n    so it lives on the outer wrapper, not on the measure element. Desktop\n    padding is `px-10 pt-10 pb-16`; mobile\n    and tablet keep their own tighter gutters. */\nexport type PageScaffoldWidth = \"reading\" | \"medium\" | \"content\"\n\nconst widthClasses: Record<PageScaffoldWidth, string> = {\n\treading: \"max-w-reading\",\n\tmedium: \"max-w-medium\",\n\tcontent: \"max-w-content\",\n}\n\ntype PageScaffoldProps = {\n\treadonly children: ReactNode\n\t/** Center the page at one of the three content measures; omitted when\n\t    the page's own component owns the measure. */\n\treadonly width?: PageScaffoldWidth\n\t/** Drop the desktop bottom padding — pages ending in a sticky ActionBar. */\n\treadonly bottomPad?: boolean\n\treadonly className?: string\n}\n\nfunction frameClassName(props: PageScaffoldProps) {\n\treturn cn(\n\t\t\"pb-4 pt-2 px-3 md:px-4 md:pt-4.5 lg:px-10\",\n\t\tprops.bottomPad !== false && \"lg:pb-16\",\n\t\tprops.className,\n\t)\n}\n\nexport function PageScaffold(props: PageScaffoldProps) {\n\tif (props.width === undefined) {\n\t\treturn (\n\t\t\t<div className={cn(\"flex w-full flex-col\", frameClassName(props))}>\n\t\t\t\t{props.children}\n\t\t\t</div>\n\t\t)\n\t}\n\n\treturn (\n\t\t<div className={frameClassName(props)}>\n\t\t\t<div\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"mx-auto flex w-full flex-col\",\n\t\t\t\t\twidthClasses[props.width],\n\t\t\t\t)}\n\t\t\t>\n\t\t\t\t{props.children}\n\t\t\t</div>\n\t\t</div>\n\t)\n}\n\ntype SurfaceProps = {\n\treadonly children: ReactNode\n\treadonly className?: string\n}\n\nexport function FlatSurface(props: SurfaceProps) {\n\treturn (\n\t\t<Surface as=\"section\" size=\"compact\" className={props.className}>\n\t\t\t{props.children}\n\t\t</Surface>\n\t)\n}\n\ntype PillProps = {\n\treadonly children: ReactNode\n\treadonly tone?: \"primary\" | \"secondary\" | \"accent\" | \"muted\"\n\treadonly className?: string\n}\n\nexport function InfoPill(props: PillProps) {\n\treturn (\n\t\t<span\n\t\t\tclassName={cn(\n\t\t\t\t\"inline-flex items-center rounded-md px-2 py-1 text-xs font-medium\",\n\t\t\t\tpillToneClassName(props.tone),\n\t\t\t\tprops.className,\n\t\t\t)}\n\t\t>\n\t\t\t{props.children}\n\t\t</span>\n\t)\n}\n\nexport function RoutePendingFallback() {\n\treturn (\n\t\t<PageScaffold>\n\t\t\t<PageHeader\n\t\t\t\ttitle={\n\t\t\t\t\t// Span elements: the header wraps title in h1 and description\n\t\t\t\t\t// in p, and a block div inside either is invalid HTML.\n\t\t\t\t\t<Skeleton element=\"span\" className=\"block h-8 w-64 max-w-full\" />\n\t\t\t\t}\n\t\t\t\tdescription={\n\t\t\t\t\t<Skeleton element=\"span\" className=\"block h-4 w-full max-w-lg\" />\n\t\t\t\t}\n\t\t\t/>\n\t\t\t<div className=\"grid gap-4 md:grid-cols-2 xl:grid-cols-3\">\n\t\t\t\t<Skeleton className=\"h-32 rounded-lg\" />\n\t\t\t\t<Skeleton className=\"h-32 rounded-lg\" />\n\t\t\t\t<Skeleton className=\"h-32 rounded-lg md:col-span-2 xl:col-span-1\" />\n\t\t\t</div>\n\t\t</PageScaffold>\n\t)\n}\n\nfunction pillToneClassName(tone: PillProps[\"tone\"]) {\n\tif (tone === \"primary\") {\n\t\treturn \"bg-primary/10 text-primary\"\n\t}\n\n\tif (tone === \"secondary\") {\n\t\treturn \"bg-secondary text-secondary-foreground\"\n\t}\n\n\tif (tone === \"accent\") {\n\t\treturn \"bg-accent text-accent-foreground\"\n\t}\n\n\treturn \"bg-muted text-muted-foreground\"\n}\n"]}