@photon-ai/pho-ui 4.3.0 → 4.4.0

package/dist/chunks/command-BfCCRaoc.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"command-BfCCRaoc.js","names":[],"sources":["../../src/components/command/command.tsx"],"sourcesContent":["import {\n  useEffect,\n  useId,\n  useLayoutEffect,\n  useRef,\n  type ComponentProps,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { IconArrowUpRight, IconChevronLeft } from \"@tabler/icons-react\";\nimport { SPRING_SETTLE } from \"../../motion\";\nimport { Command as CommandPrimitive, useCommandState } from \"cmdk\";\nimport { LayoutGroup, motion, useReducedMotion } from \"motion/react\";\nimport { AnimatedHeight } from \"../../utils/animated-height\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant, type VariantMap } from \"../../utils/resolve-variant\";\nimport { Dialog as PhoDialog } from \"../dialog\";\n\n/**\n * Spring for row moves (FLIP / shared-layout) — same feel as\n * `AnimatedHeight`: quick and critically damped, so rows glide to their new\n * slot without overshooting into neighbours.\n */\nconst ROW_MOVE_SPRING = SPRING_SETTLE;\n\nfunction Root({\n  // Filtering is yours by default: filter in render (state above the\n  // palette) so the rows' FLIP diff can glide survivors to their slots.\n  // cmdk's built-in matcher reorders DOM imperatively — invisible to the\n  // layout pass — so it is opt-in: pass `shouldFilter` to hand matching\n  // and ranking back to cmdk at the cost of the animation.\n  shouldFilter = false,\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof CommandPrimitive>) {\n  // Namespace row layoutIds per palette instance — the docs page mounts the\n  // inline demo and the dialog demo at once, with identical item values.\n  const layoutNamespace = useId();\n  return (\n    <CommandPrimitive\n      className={cn(\n        \"bg-pho-primary text-pho-primary flex w-full flex-col overflow-hidden outline-none\",\n        className,\n      )}\n      shouldFilter={shouldFilter}\n      {...props}\n    >\n      <LayoutGroup id={layoutNamespace}>{children}</LayoutGroup>\n    </CommandPrimitive>\n  );\n}\n\n/**\n * The input row — a bottom hairline separates it from the list. Position\n * leading icons absolutely and pad the input (`pl-9`), mirroring\n * `Autocomplete.InputGroup`.\n */\nfunction InputGroup({ className, ...props }: ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\n        \"border-pho-secondary relative flex items-center border-b\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** SSR-safe layout effect (same pattern cmdk uses internally). */\nconst useIsomorphicLayoutEffect =\n  typeof window === \"undefined\" ? useEffect : useLayoutEffect;\n\nfunction assignRef<T>(ref: Ref<T> | undefined, value: T | null) {\n  if (typeof ref === \"function\") ref(value);\n  else if (ref) ref.current = value;\n}\n\nfunction Input({\n  className,\n  value,\n  ref: consumerRef,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Input>) {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const search = useCommandState((state) => state.search);\n\n  // cmdk stays uncontrolled here on purpose. Its controlled path syncs the\n  // `value` prop into the search store through a passive effect — one painted\n  // frame late — so on that stale frame the old row is still \"selected\" while\n  // the list has already reflowed, and the selection pill visibly rides it\n  // before snapping to the re-selected first row. Uncontrolled keystrokes\n  // update search + first-row selection synchronously (pre-paint), killing\n  // that frame in both directions (typing and clearing).\n  //\n  // The consumer-facing API is still controlled: external `value` changes\n  // (programmatic reset, initial query) are replayed through the native input\n  // path below so store, display, and selection take the same sync route.\n  useIsomorphicLayoutEffect(() => {\n    const input = inputRef.current;\n    if (value == null || input == null || value === search) return;\n    const setNativeValue = Object.getOwnPropertyDescriptor(\n      HTMLInputElement.prototype,\n      \"value\",\n    )?.set;\n    setNativeValue?.call(input, value);\n    input.dispatchEvent(new Event(\"input\", { bubbles: true }));\n  }, [value, search]);\n\n  return (\n    <CommandPrimitive.Input\n      className={cn(\n        // Borderless inside the palette surface — the InputGroup hairline\n        // carries the edge. display-xs (18px) keeps iOS from zooming in.\n        \"text-pho-primary placeholder:text-pho-placeholder text-display-xs w-full bg-transparent px-3 py-3 outline-none disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n      ref={(node) => {\n        inputRef.current = node;\n        assignRef(consumerRef, node);\n      }}\n    />\n  );\n}\n\nfunction List({\n  className,\n  children,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.List>) {\n  return (\n    // Same spring as the onboarding / invite Card shell — list height glides\n    // when idle ↔ search (or filter) changes instead of jumping.\n    <AnimatedHeight>\n      {/* The scroller is a motion element with layoutScroll so the rows'\n          FLIP projections account for its scroll offset — without it,\n          scrolling reads as a layout change and every row glides to\n          compensate. scroll-py keeps a breath above and below the row\n          being scrolled into view. */}\n      <motion.div\n        layoutScroll\n        className=\"max-h-[min(24rem,60vh)] scroll-py-1 overflow-y-auto overscroll-contain\"\n      >\n        <CommandPrimitive.List\n          className={cn(\"relative isolate p-1\", className)}\n          {...props}\n        >\n          {children}\n        </CommandPrimitive.List>\n      </motion.div>\n    </AnimatedHeight>\n  );\n}\n\nfunction Empty({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Empty>) {\n  return (\n    <CommandPrimitive.Empty\n      className={cn(\n        \"text-pho-description px-2.5 py-6 text-center text-base\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Group({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Group>) {\n  return (\n    <CommandPrimitive.Group\n      className={cn(\n        // cmdk renders the `heading` prop in a [cmdk-group-heading] wrapper —\n        // typography mirrors `Autocomplete.GroupLabel`.\n        \"[&_[cmdk-group-heading]]:text-pho-secondary [&_[cmdk-group-heading]]:px-2.5 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * Row layout mode:\n * - `item` / `subitem` / `subsubitem` — idle hierarchy (icon column + indent)\n * - `result` — flat search hit (breadcrumb + trailing scope)\n */\nexport type CommandItemLevel = \"item\" | \"subitem\" | \"subsubitem\" | \"result\";\nexport type CommandItemSize = \"sm\" | \"md\";\n\nconst ITEM_SIZES = {\n  sm: {\n    classes: \"gap-1.5 py-1 pr-2 text-sm\",\n    description: \"Compact rows for filter lists and dense pickers\",\n  },\n  md: {\n    classes: \"gap-2 py-2 pr-2.5 text-base\",\n    description: \"Default palette row\",\n  },\n} as const satisfies VariantMap;\n\nconst ITEM_TITLE_SIZES = {\n  sm: { classes: \"text-sm\", description: \"Compact row title\" },\n  md: { classes: \"text-md\", description: \"Default row title\" },\n} as const satisfies VariantMap;\n\nconst ITEM_ICON_SIZES = {\n  sm: {\n    classes: \"size-3.5 [&>svg]:size-3.5\",\n    description: \"Compact leading glyph\",\n  },\n  md: {\n    classes: \"size-4 [&>svg]:size-4\",\n    description: \"Default leading glyph\",\n  },\n} as const satisfies VariantMap;\n\ntype ItemPrimitiveProps = ComponentProps<typeof CommandPrimitive.Item>;\n\nexport interface CommandItemProps extends Omit<\n  ItemPrimitiveProps,\n  \"children\" | \"title\"\n> {\n  /**\n   * Row depth / mode in the palette:\n   * - `item` — page / top destination (icon + title)\n   * - `subitem` — section under an item (label aligns with the item title)\n   * - `subsubitem` — row under a section (one step deeper)\n   * - `result` — flat search hit (`title` + `path` crumbs + `scope`)\n   */\n  level?: CommandItemLevel;\n  /**\n   * Leading glyph. On idle `item` rows (and reserved for sub-levels). On\n   * `result` rows, pass the resolved icon (self → parent → grandparent).\n   */\n  icon?: ReactNode;\n  /**\n   * When `level=\"result\"`, force the icon column so labels align across the\n   * list even if this row's `icon` is empty. Set true when any sibling result\n   * has an icon; omit when the whole result set is icon-less.\n   */\n  iconSlot?: boolean;\n  /**\n   * Row density. `sm` tightens padding and type for chip popovers\n   * (Filter Bar options). Palette destinations stay `md`.\n   * @default \"md\"\n   */\n  size?: CommandItemSize;\n  /** Primary label. Prefer this over free-form children for the shared layout. */\n  title?: ReactNode;\n  /**\n   * Ancestors after `title` for `level=\"result\"` — parent → page\n   * (e.g. `[\"Agent profile\", \"Settings\"]` → `Name < Agent profile < Settings`).\n   */\n  path?: ReactNode[];\n  /**\n   * Trailing scope for `level=\"result\"` — `Project` vs `Personal`, not a nav group.\n   */\n  scope?: ReactNode;\n  /** Shows a trailing external-link glyph (opens outside the app). */\n  external?: boolean;\n  /**\n   * Free-form content. When `title` is set, rendered after the label stack.\n   * When `title` is omitted, becomes the row body (legacy / simple items).\n   */\n  children?: ReactNode;\n}\n\n/** Leading icon column — `size-4` at `md`, tighter at `sm`. */\nfunction ItemIcon({\n  className,\n  size = \"md\",\n  ...props\n}: ComponentProps<\"span\"> & { size?: CommandItemSize }) {\n  return (\n    <span\n      className={cn(\n        \"text-pho-secondary flex shrink-0 items-center justify-center\",\n        resolveVariant(ITEM_ICON_SIZES, size),\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/** Primary label — medium + primary ink on `item` rows. */\nfunction ItemTitle({\n  className,\n  level = \"item\",\n  size = \"md\",\n  ...props\n}: ComponentProps<\"span\"> & {\n  level?: CommandItemLevel;\n  size?: CommandItemSize;\n}) {\n  return (\n    <span\n      className={cn(\n        \"block truncate\",\n        resolveVariant(ITEM_TITLE_SIZES, size),\n        level === \"item\" && \"text-pho-primary\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\n/**\n * One selectable row. Idle palettes use `level` + `icon` / `title`\n * (item → subitem → subsubitem). Searching uses `level=\"result\"` with `path`\n * crumbs and a trailing `scope` (Project / Personal). No description line —\n * match via `keywords` / aliases instead.\n */\nfunction ExternalGlyph() {\n  return (\n    <IconArrowUpRight\n      aria-hidden\n      className=\"text-pho-description size-4 shrink-0\"\n    />\n  );\n}\n\nfunction Item({\n  className,\n  level = \"item\",\n  size = \"md\",\n  icon,\n  iconSlot,\n  title,\n  path,\n  scope,\n  external,\n  children,\n  value,\n  ...props\n}: CommandItemProps) {\n  const reduceMotion = useReducedMotion();\n  // cmdk registers `value.trim()` and exposes the selected one as\n  // `state.value` — mirrors cmdk's own `data-selected` computation.\n  const trimmedValue = typeof value === \"string\" ? value.trim() : \"\";\n  const selectedValue = useCommandState((state) => state.value);\n  const isSelected = trimmedValue !== \"\" && selectedValue === trimmedValue;\n  const structured = title != null;\n  const isResult = level === \"result\";\n  // Reserve the icon column when the row has an icon, or when the list asks\n  // for alignment (`iconSlot`) even if this row's glyph is empty.\n  const showResultIcon = isResult && (icon != null || iconSlot);\n\n  const row = (\n    <CommandPrimitive.Item\n      data-level={level}\n      data-size={size}\n      value={value}\n      className={cn(\n        \"text-pho-secondary flex cursor-pointer items-center rounded-[calc(var(--radius-base)-4px)] outline-none select-none\",\n        resolveVariant(ITEM_SIZES, size),\n        // subsubitem steps in; item/subitem share the base gutter.\n        level === \"subsubitem\" ? \"pl-6\" : \"pl-2\",\n        // Secondary at rest; selection lifts to primary ink (Menu idiom).\n        // The wash lands with it instantly — stepping through rows is a\n        // snap, not a flight.\n        \"data-[selected=true]:text-pho-primary data-[selected=true]:bg-pho-ghost-hover\",\n        \"data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      {structured && isResult ? (\n        <>\n          {showResultIcon ? (\n            <ItemIcon size={size} aria-hidden={icon == null ? true : undefined}>\n              {icon ?? null}\n            </ItemIcon>\n          ) : null}\n          {/* Same title size as idle ItemTitle so row height matches. */}\n          <span\n            className={cn(\n              \"flex min-w-0 flex-1 items-center gap-1 overflow-hidden\",\n              resolveVariant(ITEM_TITLE_SIZES, size),\n            )}\n          >\n            <span className=\"text-pho-primary truncate\">{title}</span>\n            {(path ?? []).map((segment, index) => (\n              <span\n                key={index}\n                className=\"text-pho-description flex shrink-0 items-center gap-0.5\"\n              >\n                <IconChevronLeft aria-hidden className=\"size-4 shrink-0\" />\n                {segment}\n              </span>\n            ))}\n          </span>\n          {scope != null && scope !== \"\" ? (\n            <span className=\"text-pho-description shrink-0 text-xs\">\n              {scope}\n            </span>\n          ) : null}\n          {external ? <ExternalGlyph /> : null}\n          {children}\n        </>\n      ) : structured ? (\n        <>\n          {/* Icon column always reserved so subitem labels share the item title edge. */}\n          <ItemIcon size={size} aria-hidden={icon == null ? true : undefined}>\n            {icon ?? null}\n          </ItemIcon>\n          <span className=\"min-w-0 flex-1\">\n            <ItemTitle level={level} size={size}>\n              {title}\n            </ItemTitle>\n          </span>\n          {external ? <ExternalGlyph /> : null}\n          {children}\n        </>\n      ) : (\n        children\n      )}\n    </CommandPrimitive.Item>\n  );\n\n  if (reduceMotion) return row;\n\n  return (\n    // FLIP wrapper: rows that stay mounted glide when neighbours enter or\n    // leave, and a row remounting elsewhere with the same `value` (idle group\n    // ↔ flat search result) inherits the old bounds via its layoutId and\n    // slides to the new slot — the iOS list-diff feel. Rows without a match\n    // simply appear / disappear so the whole list never swarms.\n    //\n    // The selected row is the exception: it skips the travel and appears at\n    // its final slot immediately, so the selection wash is never sitting on\n    // empty space waiting for its row to fly in.\n    <motion.div\n      layout=\"position\"\n      layoutId={typeof value === \"string\" ? value : undefined}\n      initial={false}\n      transition={isSelected ? { duration: 0 } : ROW_MOVE_SPRING}\n    >\n      {row}\n    </motion.div>\n  );\n}\n\nfunction Separator({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Separator>) {\n  return (\n    <CommandPrimitive.Separator\n      className={cn(\n        \"-mx-1 my-1 h-px bg-[var(--border-color-pho-secondary)]\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Loading({\n  className,\n  ...props\n}: ComponentProps<typeof CommandPrimitive.Loading>) {\n  return (\n    <CommandPrimitive.Loading\n      className={cn(\"text-pho-description px-2.5 py-1.5 text-base\", className)}\n      {...props}\n    />\n  );\n}\n\ntype DialogRootProps = ComponentProps<typeof PhoDialog.Root>;\n\ninterface CommandDialogProps extends ComponentProps<typeof CommandPrimitive> {\n  /** Controlled dialog state — pass straight through to `Dialog.Root`. */\n  open?: DialogRootProps[\"open\"];\n  onOpenChange?: DialogRootProps[\"onOpenChange\"];\n  /** Accessible name for the palette (dialog and command menu). */\n  label?: string;\n  /** Extra classes for the dialog panel (not the command root). */\n  className?: string;\n}\n\n/**\n * A command palette in a modal — Pho's `Dialog` overlay (Base UI) around a\n * `Command.Root`, raised above center. We deliberately skip cmdk's own\n * `Command.Dialog` (Radix) so overlays stay on one primitive stack.\n *\n * List height springs via `AnimatedHeight` (same feel as the Card shell on\n * onboarding / invite) — the input row stays put while results resize.\n */\nfunction Dialog({\n  open,\n  onOpenChange,\n  label,\n  className,\n  children,\n  ...props\n}: CommandDialogProps) {\n  return (\n    <PhoDialog.Root open={open} onOpenChange={onOpenChange}>\n      <PhoDialog.Portal>\n        <PhoDialog.Backdrop />\n        <PhoDialog.Popup\n          aria-label={label}\n          // Palette sits above center so the list grows downward from a\n          // stable top edge instead of jumping around it.\n          className={cn(\n            \"top-[max(4rem,18vh)] max-w-xl translate-y-0 overflow-hidden p-0\",\n            className,\n          )}\n        >\n          {/* The popup is position: fixed; layout animations inside a fixed\n              element need a layoutRoot to project against, or their\n              measurements drift with the page scroll. */}\n          <motion.div layoutRoot>\n            <Root label={label} {...props}>\n              {children}\n            </Root>\n          </motion.div>\n        </PhoDialog.Popup>\n      </PhoDialog.Portal>\n    </PhoDialog.Root>\n  );\n}\n\n/**\n * Command menu built on `cmdk` — a filterable list of actions driven from a\n * single input, keyboard-first. Compose inline (`Command.Root`) or as a\n * ⌘K-style modal palette (`Command.Dialog`, which owns the overlay).\n * Filtering is yours by default — filter in render so the rows' diff can\n * glide; pass `shouldFilter` to hand matching and ranking to cmdk (its\n * imperative reorder skips the animation).\n *\n * Rows share one layout via `Command.Item` `level` — idle\n * `item` → `subitem` → `subsubitem`, or flat `result` while searching.\n */\nexport const Command = {\n  Root,\n  InputGroup,\n  Input,\n  List,\n  Empty,\n  Group,\n  Item,\n  ItemIcon,\n  ItemTitle,\n  Separator,\n  Loading,\n  Dialog,\n};\n\n/** Re-export of cmdk's state selector hook (search, value, filtered counts). */\nexport { useCommandState };\n"],"mappings":"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"}

package/dist/chunks/{copy-button-B_B15mEi.js → copy-button-D8XyP0oR.js}

@@ -1,7 +1,7 @@
 "use client";
 import { t as d } from "./cn-ChIgwEl3.js";
-import { t as u } from "./resolve-variant-CcD8iG5l.js";
-import { n as h } from "./use-copy-D6JwKUll.js";
+import { t as h } from "./resolve-variant-CcD8iG5l.js";
+import { n as u } from "./use-copy-D6JwKUll.js";
 import { t as m } from "./createReactComponent-BqCmnqfX.js";
 import { t as v } from "./IconCheck-D2WuculQ.js";
 import "react";
@@ -14,8 +14,8 @@ var y = [["path", {
   key: "svg-1"
 }]], x = m("outline", "copy", "Copy", y), C = {
   xs: {
-    classes: "size-6 [&>svg]:size-3.5",
-    description: "Extra small — inline after a mono value"
+    classes: "size-6 -m-1.25 [&>svg]:size-3.5",
+    description: "Extra small — 14px icon; 24px hover wash overflows the title line"
   },
   sm: {
     classes: "size-7 [&>svg]:size-4",
@@ -26,18 +26,18 @@ var y = [["path", {
     description: "Medium — toolbars"
   }
 };
-function b({ value: s, label: t = "to clipboard", size: a = "sm", onCopied: r, className: n, onClick: c, ...l }) {
-  const { copied: e, copy: p } = h();
+function b({ value: s, label: t = "to clipboard", size: r = "sm", onCopied: a, className: n, onClick: c, ...l }) {
+  const { copied: e, copy: p } = u();
   return /* @__PURE__ */ f("span", {
-    className: "inline-flex shrink-0",
+    className: "inline-flex shrink-0 overflow-visible",
     children: [/* @__PURE__ */ o("button", {
       type: "button",
       "aria-label": e ? `${t} copied` : `Copy ${t}`,
       "data-copied": e || void 0,
       onClick: async (i) => {
-        c?.(i), !i.defaultPrevented && await p(s) && r?.(s);
+        c?.(i), !i.defaultPrevented && await p(s) && a?.(s);
       },
-      className: d("text-pho-secondary outline-pho-brand hover:bg-pho-ghost-hover hover:text-pho-secondary-hover inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm transition-[color,background-color] duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2", "data-[copied]:text-pho-success data-[copied]:hover:text-pho-success", u(C, a), n),
+      className: d("text-pho-secondary outline-pho-brand hover:bg-pho-ghost-hover hover:text-pho-secondary-hover inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm transition-[color,background-color] duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2", "data-[copied]:text-pho-success data-[copied]:hover:text-pho-success", h(C, r), n),
       ...l,
       children: e ? /* @__PURE__ */ o(v, { "aria-hidden": !0 }) : /* @__PURE__ */ o(x, { "aria-hidden": !0 })
     }), /* @__PURE__ */ o("output", {
@@ -53,4 +53,4 @@ export {
   C as t
 };
 
-//# sourceMappingURL=copy-button-B_B15mEi.js.map
+//# sourceMappingURL=copy-button-D8XyP0oR.js.map

package/dist/chunks/copy-button-D8XyP0oR.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy-button-D8XyP0oR.js","names":[],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.46.0_react@19.2.8/node_modules/@tabler/icons-react/dist/esm/icons/IconCopy.mjs","../../src/components/copy-button/copy-button.tsx"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.46.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M7 9.667a2.667 2.667 0 0 1 2.667 -2.667h8.666a2.667 2.667 0 0 1 2.667 2.667v8.666a2.667 2.667 0 0 1 -2.667 2.667h-8.666a2.667 2.667 0 0 1 -2.667 -2.667l0 -8.666\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M4.012 16.737a2.005 2.005 0 0 1 -1.012 -1.737v-10c0 -1.1 .9 -2 2 -2h10c.75 0 1.158 .385 1.5 1\", \"key\": \"svg-1\" }]];\nconst IconCopy = createReactComponent(\"outline\", \"copy\", \"Copy\", __iconNode);\n\nexport { __iconNode, IconCopy as default };\n//# sourceMappingURL=IconCopy.mjs.map\n","import { type ButtonHTMLAttributes, type Ref } from \"react\";\nimport { IconCheck, IconCopy } from \"@tabler/icons-react\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant, type VariantMap } from \"../../utils/resolve-variant\";\nimport { useCopy } from \"../../utils/use-copy\";\n\n/**\n * Size axis — a square ghost control that sits inside a row or a panel\n * header. `sm` is the default: a 28px target beside 13px mono text.\n */\nexport const COPY_BUTTON_SIZES = {\n  xs: {\n    classes: \"size-6 -m-1.25 [&>svg]:size-3.5\",\n    description:\n      \"Extra small — 14px icon; 24px hover wash overflows the title line\",\n  },\n  sm: {\n    classes: \"size-7 [&>svg]:size-4\",\n    description: \"Small — the default; row cells, panel headers\",\n  },\n  md: {\n    classes: \"size-8 [&>svg]:size-4\",\n    description: \"Medium — toolbars\",\n  },\n} satisfies VariantMap;\n\nexport type CopyButtonSize = keyof typeof COPY_BUTTON_SIZES;\n\ninterface CopyButtonBaseProps {\n  /** The text that goes to the clipboard. */\n  value: string;\n  /**\n   * What is being copied, for the accessible name — \"request id\",\n   * \"API key\". Read as `Copy {label}`, then `{label} copied`.\n   * @default \"to clipboard\"\n   */\n  label?: string;\n  /** Size variant. @default \"sm\" */\n  size?: CopyButtonSize;\n  /** Called after the clipboard write lands. */\n  onCopied?: (value: string) => void;\n  ref?: Ref<HTMLButtonElement>;\n}\n\nexport interface CopyButtonProps\n  extends\n    CopyButtonBaseProps,\n    Omit<\n      ButtonHTMLAttributes<HTMLButtonElement>,\n      keyof CopyButtonBaseProps | \"children\"\n    > {}\n\n/**\n * Copy Button — the one copy affordance: a quiet icon button that writes\n * `value` to the clipboard, swaps its glyph to a check for a moment, and\n * says \"Copied\" to assistive tech through a polite live region. Ghost at\n * rest so a mono value stays the loudest thing on its line; the wash and\n * the ink lift on hover. Put it after the value it copies.\n */\nexport function CopyButton({\n  value,\n  label = \"to clipboard\",\n  size = \"sm\",\n  onCopied,\n  className,\n  onClick,\n  ...props\n}: CopyButtonProps) {\n  const { copied, copy } = useCopy();\n  return (\n    <span className=\"inline-flex shrink-0 overflow-visible\">\n      <button\n        type=\"button\"\n        aria-label={copied ? `${label} copied` : `Copy ${label}`}\n        data-copied={copied || undefined}\n        onClick={async (event) => {\n          onClick?.(event);\n          if (event.defaultPrevented) return;\n          if (await copy(value)) onCopied?.(value);\n        }}\n        className={cn(\n          \"text-pho-secondary outline-pho-brand hover:bg-pho-ghost-hover hover:text-pho-secondary-hover inline-flex shrink-0 cursor-pointer items-center justify-center rounded-sm transition-[color,background-color] duration-100 ease-linear focus-visible:outline-2 focus-visible:outline-offset-2\",\n          \"data-[copied]:text-pho-success data-[copied]:hover:text-pho-success\",\n          resolveVariant(COPY_BUTTON_SIZES, size),\n          className,\n        )}\n        {...props}\n      >\n        {copied ? <IconCheck aria-hidden /> : <IconCopy aria-hidden />}\n      </button>\n      <output className=\"sr-only\" aria-live=\"polite\">\n        {copied ? \"Copied\" : \"\"}\n      </output>\n    </span>\n  );\n}\n\nCopyButton.displayName = \"CopyButton\";\n"],"x_google_ignoreList":[0],"mappings":";;;;;;;;AASA,IAAM,IAAa,CAAC,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAoK,KAAO;AAAQ,CAAC,GAAG,CAAC,QAAQ;AAAA,EAAE,GAAK;AAAA,EAAiG,KAAO;AAAQ,CAAC,CAAC,GACvV,IAAW,EAAqB,WAAW,QAAQ,QAAQ,CAAU,GCA9D,IAAoB;AAAA,EAC/B,IAAI;AAAA,IACF,SAAS;AAAA,IACT,aACE;AAAA,EACJ;AAAA,EACA,IAAI;AAAA,IACF,SAAS;AAAA,IACT,aAAa;AAAA,EACf;AAAA,EACA,IAAI;AAAA,IACF,SAAS;AAAA,IACT,aAAa;AAAA,EACf;AACF;AAmCA,SAAgB,EAAW,EACzB,OAAA,GACA,OAAA,IAAQ,gBACR,MAAA,IAAO,MACP,UAAA,GACA,WAAA,GACA,SAAA,GACA,GAAG,EAAA,GACe;AAClB,QAAM,EAAE,QAAA,GAAQ,MAAA,EAAA,IAAS,EAAQ;AACjC,SACE,gBAAA,EAAC,QAAD;AAAA,IAAM,WAAU;AAAA,IAAhB,UAAA,CACE,gBAAA,EAAC,UAAD;AAAA,MACE,MAAK;AAAA,MACL,cAAY,IAAS,GAAG,CAAA,YAAiB,QAAQ,CAAA;AAAA,MACjD,eAAa,KAAU;AAAA,MACvB,SAAS,OAAO,MAAU;AAExB,QADA,IAAU,CAAK,GACX,CAAA,EAAM,oBACN,MAAM,EAAK,CAAK,KAAG,IAAW,CAAK;AAAA,MACzC;AAAA,MACA,WAAW,EACT,+RACA,uEACA,EAAe,GAAmB,CAAI,GACtC,CACF;AAAA,MACA,GAAI;AAAA,MAEH,UAAA,IAAS,gBAAA,EAAC,GAAD,EAAW,eAAA,GAAa,CAAA,IAAI,gBAAA,EAAC,GAAD,EAAU,eAAA,GAAa,CAAA;AAAA,IACvD,CAAA,GACR,gBAAA,EAAC,UAAD;AAAA,MAAQ,WAAU;AAAA,MAAU,aAAU;AAAA,MACnC,UAAA,IAAS,WAAW;AAAA,IACf,CAAA,CACJ;AAAA;AAEV;AAEA,EAAW,cAAc"}

package/dist/chunks/{data-table-BeUwsjmX.js → data-table-Mog6m3d9.js}

@@ -6,7 +6,7 @@ import { SPRING_ENTRANCE as xe } from "../motion.js";
 import { t as Se } from "./createReactComponent-BqCmnqfX.js";
 import { t as ye } from "./IconChevronDown-CZilB71T.js";
 import { t as we } from "./IconChevronUp-CrpWSgIl.js";
-import { t as ve } from "./animated-height-CCO-Ocoz.js";
+import { t as ve } from "./animated-height-I44sUq0n.js";
 import { r as W } from "./checkbox-CLPmblNA.js";
 import { t as Ne } from "./skeleton-DwjSl4vC.js";
 import { t as Ce } from "./ghost-search-AmVXd0zE.js";
@@ -294,4 +294,4 @@ export {
   Je as t
 };
 
-//# sourceMappingURL=data-table-BeUwsjmX.js.map
+//# sourceMappingURL=data-table-Mog6m3d9.js.map

package/dist/chunks/{data-table-BeUwsjmX.js.map → data-table-Mog6m3d9.js.map}

@@ -1 +1 @@
-{"version":3,"file":"data-table-BeUwsjmX.js","names":[],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.46.0_react@19.2.8/node_modules/@tabler/icons-react/dist/esm/icons/IconSelector.mjs","../../src/components/data-table/data-table.tsx"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.46.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M8 9l4 -4l4 4\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M16 15l-4 4l-4 -4\", \"key\": \"svg-1\" }]];\nconst IconSelector = createReactComponent(\"outline\", \"selector\", \"Selector\", __iconNode);\n\nexport { __iconNode, IconSelector as default };\n//# sourceMappingURL=IconSelector.mjs.map\n","import {\n  createContext,\n  Fragment,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useState,\n  useSyncExternalStore,\n  type ComponentProps,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport {\n  columnFilteringFeature,\n  createColumnHelper,\n  createFilteredRowModel,\n  createSortedRowModel,\n  filterFn_includesString,\n  FlexRender,\n  globalFilteringFeature,\n  rowSelectionFeature,\n  rowSortingFeature,\n  sortFn_alphanumeric,\n  sortFn_basic,\n  sortFn_datetime,\n  sortFn_text,\n  tableFeatures,\n  useTable,\n  type ColumnDef,\n  type RowData,\n  type SortingState,\n} from \"@tanstack/react-table\";\nimport {\n  IconChevronDown,\n  IconChevronUp,\n  IconSelector,\n} from \"@tabler/icons-react\";\nimport { Skeleton } from \"../skeleton\";\nimport { Checkbox } from \"../checkbox\";\nimport { SPRING_ENTRANCE } from \"../../motion\";\nimport { AnimatedHeight } from \"../../utils/animated-height\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant, type VariantMap } from \"../../utils/resolve-variant\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\n\n/**\n * DataTable — a table of records with column semantics: sortable headers,\n * aligned cells, rows that are links into a subpage. TanStack Table (v9)\n * does the thinking — column defs, sorting, row identity — and renders\n * nothing; every pixel here is Pho's.\n *\n * Design notes:\n * - The surface is `BasicPage.Card`'s: hairline border, `base` radius, the\n *   page's primary fill, hairline rules between rows. A table is a card of\n *   rows that happen to line up in columns, so it sits in a page's `Stack`\n *   as any card does.\n * - Header cells are description ink at body size — never small caps, never\n *   bold. Hierarchy comes from ink alone; the header is a label row, not a\n *   banner.\n * - A sortable header is a button inside the cell: the label and its\n *   indicator (`IconSelector` at rest, a chevron once sorted). `aria-sort`\n *   sits on the `th`.\n * - Rows that navigate stretch one link across the row (the first cell's\n *   link, extended with a pseudo-element), so the whole row is one target\n *   for pointer and one stop for keyboard. Hover washes the row; the row\n *   whose page is open beside the table (`current`) keeps the wash — the\n *   same cue `BasicPage.RowLink` gives under `aria-current`.\n * - Numbers align to the end with tabular figures (`meta.align: \"end\"`).\n * - `search` is one box over every column — plain contains matching, and\n *   the body says when nothing matches. In a page, `BasicPage.Search` in\n *   the section header adopts the box; alone, the table keeps one in a\n *   toolbar row inside its frame. Server-side search keeps its own box\n *   outside.\n * - A wide table scrolls sideways inside its own frame; the page never does.\n *   `contain: inline-size` keeps the table's intrinsic width out of the\n *   page's — a host that sizes to content (a scroll area's fit-content\n *   pane, a grid's auto column) would otherwise grow to the widest row.\n *   Left with no width of its own, the frame takes its container's\n *   (`w-full`); a shrink-to-fit host (a flex row) would collapse it.\n *   `layout=\"fixed\"` is the other way out: columns size from the frame,\n *   and a long cell truncates instead of stretching the table.\n *\n * Reach for it when a list needs column semantics — sorting, aligned\n * figures, several fields side by side. A list where each row is one\n * label and a chevron stays `BasicPage.RowLink`.\n */\n\n/** Column metadata a `DataTable` understands. */\nexport interface DataTableColumnMeta {\n  /** Cell alignment — `end` for figures (right-aligned, tabular). */\n  align?: \"start\" | \"end\";\n  /**\n   * Extra classes on every `th` and `td` in this column. With\n   * `layout=\"fixed\"`, size a short column here (`w-24`) and leave the\n   * flexible ones unsaid — they share what remains. Prefer this over\n   * `nth-child` width hacks on the table's `className`.\n   */\n  className?: string;\n}\n\n/**\n * The feature set every `DataTable` runs on — sorting with the stock sort\n * functions, the column meta above. Fixed, so column definitions written\n * once fit every table.\n */\nconst features = tableFeatures({\n  rowSortingFeature,\n  rowSelectionFeature,\n  columnFilteringFeature,\n  globalFilteringFeature,\n  sortedRowModel: createSortedRowModel(),\n  filteredRowModel: createFilteredRowModel(),\n  filterFns: { includesString: filterFn_includesString },\n  sortFns: {\n    alphanumeric: sortFn_alphanumeric,\n    basic: sortFn_basic,\n    datetime: sortFn_datetime,\n    text: sortFn_text,\n  },\n  columnMeta: {} as DataTableColumnMeta,\n});\n\nexport type DataTableFeatures = typeof features;\n\n/** Body row height — the header keeps its own `h-10` on every size. */\nexport const DATA_TABLE_SIZES = {\n  sm: {\n    classes: \"h-10\",\n    description: \"Small — 40px at 13px; the header's height, for dense lists\",\n  },\n  base: {\n    classes: \"h-12\",\n    description: \"Base — 48px at 14px; one line of body type\",\n  },\n  lg: {\n    classes: \"h-14\",\n    description:\n      \"Large — 56px at 16px; two-line cells (a number and a caption)\",\n  },\n} satisfies VariantMap;\n\nexport type DataTableSize = keyof typeof DATA_TABLE_SIZES;\n\n/**\n * The type each size sets on the table, so cells and header move together:\n * 13px dense, the body's 14px, 16px for rows that carry two lines.\n */\nconst DATA_TABLE_TEXT: Record<DataTableSize, string> = {\n  sm: \"text-xs\",\n  base: \"text-base\",\n  lg: \"text-md\",\n};\n\n/** A column definition for a `DataTable` of `TData` rows. */\nexport type DataTableColumn<\n  TData extends RowData,\n  TValue = unknown,\n> = ColumnDef<DataTableFeatures, TData, TValue>;\n\n/**\n * The column helper, bound to the table's feature set — `accessor`,\n * `display`, `group`, and `columns` to collect them with their types\n * intact.\n *\n * @example\n * const col = createColumns<Request>();\n * const columns = col.columns([\n *   col.accessor(\"actor\", { header: \"Actor\" }),\n *   col.accessor(\"amount\", { header: \"Amount\", meta: { align: \"end\" } }),\n * ]);\n */\nexport function createColumns<TData extends RowData>() {\n  return createColumnHelper<DataTableFeatures, TData>();\n}\n\n/**\n * The leading checkbox column selection adds. The header checkbox works\n * the visible set: everything the search still shows toggles together,\n * while rows selected earlier and then hidden stay selected.\n */\nconst SELECT_COLUMN = createColumns<RowData>().display({\n  id: \"select\",\n  enableSorting: false,\n  header: ({ table }) => {\n    const visible = table.getRowModel().rows;\n    const chosen = visible.filter((row) => row.getIsSelected()).length;\n    const all = visible.length > 0 && chosen === visible.length;\n    return (\n      <Checkbox\n        size=\"sm\"\n        aria-label=\"Select all\"\n        checked={all}\n        indeterminate={chosen > 0 && !all}\n        onCheckedChange={(checked) => {\n          table.setRowSelection((old) => {\n            const next = { ...old };\n            for (const row of visible) {\n              if (checked === true) next[row.id] = true;\n              else delete next[row.id];\n            }\n            return next;\n          });\n        }}\n      />\n    );\n  },\n  cell: ({ row }) => (\n    <Checkbox\n      size=\"sm\"\n      aria-label=\"Select row\"\n      checked={row.getIsSelected()}\n      onCheckedChange={(checked) => row.toggleSelected(checked === true)}\n    />\n  ),\n});\n\nexport interface DataTableProps<TData extends RowData> extends Omit<\n  ComponentProps<\"div\">,\n  \"children\"\n> {\n  columns: ReadonlyArray<DataTableColumn<TData, any>>;\n  data: ReadonlyArray<TData>;\n  /**\n   * A row's identity — what `current` is matched against, and what keeps a\n   * row itself across sorts. Defaults to the row's `id` field, else its\n   * index.\n   */\n  getRowId?: (row: TData) => string;\n  /**\n   * Rows that navigate: each row is one link into a subpage, through the\n   * host's `LinkProvider`. Beside a `BasicPage.Aside`, the subpage opens\n   * next to the table. Return nothing for a row with no page yet (one\n   * still in flight) and that row stays plain.\n   */\n  rowHref?: (row: TData) => string | null | undefined;\n  /**\n   * A click on the row (not on a link, button, or other control). The\n   * table still activates `rowHref` unless the handler calls\n   * `preventDefault`.\n   */\n  onRowClick?: (\n    row: TData,\n    event: MouseEvent<HTMLTableRowElement> | KeyboardEvent<HTMLTableRowElement>,\n  ) => void;\n  /** The row whose page is open (its id) — it keeps the wash. */\n  current?: string | null;\n  /**\n   * Sorting is on for every accessor column (`enableSorting: false` on a\n   * column turns it off there). Uncontrolled by default; `defaultSort`\n   * seeds it. Pass `sort` with `onSortChange` to own it — the way to sort\n   * on the server.\n   */\n  defaultSort?: SortingState;\n  sort?: SortingState;\n  onSortChange?: (sort: SortingState) => void;\n  /**\n   * A search box on the table — `true`, or the placeholder it should\n   * show. One box searches every column (a column opts out with\n   * `enableGlobalFilter: false`); matching is a plain case-insensitive\n   * contains, on the client. With no matches the body says so. When the\n   * list doesn't all come down, keep the box outside and ask the server.\n   */\n  search?: boolean | string;\n  /**\n   * Controls in the frame's top band — a `BasicPage.Search` first, then a\n   * filter or two. The band is part of the table (one surface, a hairline\n   * above the header row), so nothing floats over the page and the\n   * spacing above and below is the frame's own. A `Search` here adopts\n   * the table's box the way a header one does.\n   */\n  toolbar?: ReactNode;\n  /**\n   * Row selection: hand either of these and rows grow a leading checkbox\n   * column. The header checkbox works the visible set — everything the\n   * search still shows — so select-all after a search means what it says;\n   * rows selected earlier and then hidden stay selected. `selected` is\n   * the selected ids (ids come from `getRowId`; pair with\n   * `onSelectedChange` to own the state); `onSelectedChange` alone\n   * listens while the table keeps it. The page renders its own bulk\n   * actions from the ids — the table only keeps the score.\n   */\n  selected?: readonly string[];\n  onSelectedChange?: (ids: string[]) => void;\n  /**\n   * File rows into labeled groups: return a label and the row renders\n   * under it, `null` and it stays in the main body. Groups follow the\n   * main body, in the order their labels first appear in `data`, each\n   * under a quiet label row — and only while they have rows, so a group\n   * a search empties simply leaves. Sorting orders rows within their\n   * group.\n   */\n  group?: (row: TData) => string | null;\n  /**\n   * Glide the frame's height when the rows change — a search narrowing,\n   * a filter, bones becoming rows. The height follows the content on the\n   * page spring instead of jumping; reserve it for tables whose rows\n   * change while mounted (same contract as `BasicPage.Card`'s).\n   */\n  animateHeight?: boolean;\n  /** Bones while the rows are on their way — `true` for five, or a count. */\n  loading?: boolean | number;\n  /** What the body says when there are no rows. */\n  empty?: ReactNode;\n  /**\n   * How columns take width. `auto` (the default) sizes them from their\n   * content — a long cell grows the table and the frame scrolls sideways.\n   * `fixed` sizes them from the table's width (`table-layout: fixed`):\n   * short columns take a width hint on `meta.className`, the rest share\n   * what remains, and cells get `min-w-0` so an inner `truncate` can\n   * shrink. `width: 0` (`w-0`) is not a content-size hint here — fixed\n   * layout treats it as a real zero — so give a short column a real\n   * width (`w-24`) rather than the auto-layout shrink-wrap trick.\n   */\n  layout?: \"auto\" | \"fixed\";\n  /**\n   * Body row height and the type that comes with it. `base` (the default)\n   * is 48px rows at 14px — one line of body type. `sm` is 40px at 13px,\n   * the header's own height, for a dense list scanned more than read.\n   * `lg` is 56px at 16px, for a two-line cell (a number and a caption)\n   * that would crowd `base`. The header row keeps its 40px on every size\n   * and follows the type.\n   */\n  size?: DataTableSize;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * A host that sizes itself around tables provides this; each table\n * announces itself while mounted. `BasicPage.Root` runs wide when the\n * page carries one and `width` was left unsaid.\n */\nexport const TableHostContext = createContext<\n  ((present: boolean) => void) | null\n>(null);\n\n/** A searchable table's search, published for a header to adopt. */\nexport interface TableSearchApi {\n  placeholder: string;\n  query: string;\n  setQuery: (query: string) => void;\n  /** Rows still showing after the current query. */\n  matched: number;\n  /** Rows in the list, before search. */\n  total: number;\n}\n\ninterface TableSearchState {\n  api: TableSearchApi | null;\n  adopted: boolean;\n}\n\n/**\n * The channel between a searchable table and a `BasicPage.Search` placed\n * in a section header: the table publishes its search (placeholder,\n * query, the setter); a mounted `Search` adopts it, and the table's own\n * box yields. Provided by `BasicPage.Root`; a table outside any page\n * keeps its built-in box. One searchable table per page — a later\n * publisher takes the slot.\n */\nexport interface TableSearchStore {\n  get: () => TableSearchState;\n  subscribe: (listener: () => void) => () => void;\n  publish: (api: TableSearchApi | null) => void;\n  adopt: (adopted: boolean) => void;\n}\n\nexport function createTableSearchStore(): TableSearchStore {\n  let state: TableSearchState = { api: null, adopted: false };\n  const listeners = new Set<() => void>();\n  const emit = () => {\n    for (const listener of listeners) listener();\n  };\n  return {\n    get: () => state,\n    subscribe(listener) {\n      listeners.add(listener);\n      return () => listeners.delete(listener);\n    },\n    publish(api) {\n      state = { ...state, api };\n      emit();\n    },\n    adopt(adopted) {\n      state = { ...state, adopted };\n      emit();\n    },\n  };\n}\n\nexport const TableSearchContext = createContext<TableSearchStore | null>(null);\n\nconst subscribeToNothing = () => () => {};\n\nexport { GhostSearch, type GhostSearchProps } from \"../../utils/ghost-search\";\nimport { GhostSearch } from \"../../utils/ghost-search\";\n\n/** Same chrome as `BasicPage.Card`, minus its dividers — rows draw their own. */\nconst DATA_TABLE_SURFACE =\n  \"rounded-base border border-pho-secondary bg-pho-primary\";\n\nconst DEFAULT_BONES = 5;\n\nfunction defaultRowId(row: unknown, index: number): string {\n  const id = (row as { id?: unknown } | null)?.id;\n  return typeof id === \"string\" || typeof id === \"number\"\n    ? String(id)\n    : String(index);\n}\n\n/** Controls keep their own click; the row only navigates from empty surface. */\nconst ROW_NAV_IGNORE = \"a, button, input, textarea, select, label\";\n\nfunction shouldIgnoreRowNav(target: EventTarget | null): boolean {\n  return target instanceof Element && target.closest(ROW_NAV_IGNORE) != null;\n}\n\nfunction activateRowHref(event: MouseEvent<HTMLTableRowElement>, href: string) {\n  const newTab =\n    event.button === 1 || event.metaKey || event.ctrlKey || event.shiftKey;\n  if (event.button === 1) event.preventDefault();\n  if (event.button !== 0 && event.button !== 1) return;\n  if (newTab) {\n    window.open(href, \"_blank\", \"noopener,noreferrer\");\n    return;\n  }\n  event.currentTarget.querySelector<HTMLAnchorElement>(\"a[href]\")?.click();\n}\n\nfunction DataTable<TData extends RowData>({\n  columns,\n  data,\n  getRowId,\n  rowHref,\n  onRowClick,\n  current,\n  selected,\n  onSelectedChange,\n  defaultSort,\n  sort,\n  onSortChange,\n  search,\n  toolbar,\n  group,\n  animateHeight,\n  loading,\n  empty = \"Nothing here yet.\",\n  layout = \"auto\",\n  size = \"base\",\n  className,\n  ...props\n}: DataTableProps<TData>) {\n  const fixed = layout === \"fixed\";\n  const rowSize = resolveVariant(DATA_TABLE_SIZES, size);\n  const rowText = DATA_TABLE_TEXT[size] ?? DATA_TABLE_TEXT.base;\n  const Link = useLinkComponent();\n  const announce = useContext(TableHostContext);\n  const searching = search === true || typeof search === \"string\";\n  const [query, setQuery] = useState(\"\");\n  const placeholder = typeof search === \"string\" ? search : \"Search\";\n  // A `BasicPage.Search` in a section header adopts the box; the table\n  // then renders no toolbar of its own.\n  const searchStore = useContext(TableSearchContext);\n  const adopted = useSyncExternalStore(\n    searchStore?.subscribe ?? subscribeToNothing,\n    () => searchStore?.get().adopted ?? false,\n    () => false,\n  );\n  useLayoutEffect(() => {\n    if (announce == null) return;\n    announce(true);\n    return () => announce(false);\n  }, [announce]);\n  const selecting = selected != null || onSelectedChange != null;\n  const [ownSelection, setOwnSelection] = useState<Record<string, true>>({});\n  const rowSelection: Record<string, true> =\n    selected != null\n      ? Object.fromEntries(selected.map((id) => [id, true as const]))\n      : ownSelection;\n  // Sorting mirrors selection: the component always owns a fallback state,\n  // so `defaultSort` + `onSortChange` without `sort` still sorts — a custom\n  // `onSortingChange` replaces the table's own updater entirely.\n  const [ownSort, setOwnSort] = useState<SortingState>(defaultSort ?? []);\n  const sorting: SortingState = sort ?? ownSort;\n  const table = useTable<DataTableFeatures, TData>({\n    features,\n    columns: (selecting\n      ? [SELECT_COLUMN as DataTableColumn<TData, any>, ...columns]\n      : columns) as Array<DataTableColumn<TData, any>>,\n    data: data as Array<TData>,\n    getRowId: getRowId ? (row) => getRowId(row) : defaultRowId,\n    // Keys only when meant: a present-but-undefined slice of `state` reads\n    // as \"controlled, with nobody listening\".\n    state: {\n      sorting,\n      ...(searching ? { globalFilter: query } : {}),\n      ...(selecting ? { rowSelection } : {}),\n    },\n    ...(selecting\n      ? {\n          enableRowSelection: true,\n          onRowSelectionChange: (\n            updater:\n              | Record<string, true>\n              | ((old: Record<string, true>) => Record<string, true>),\n          ) => {\n            const next =\n              typeof updater === \"function\" ? updater(rowSelection) : updater;\n            if (selected == null) setOwnSelection(next);\n            onSelectedChange?.(Object.keys(next));\n          },\n        }\n      : {}),\n    ...(searching\n      ? {\n          onGlobalFilterChange: setQuery,\n          globalFilterFn: \"includesString\" as const,\n        }\n      : {}),\n    onSortingChange: (\n      updater: SortingState | ((prev: SortingState) => SortingState),\n    ) => {\n      const next = typeof updater === \"function\" ? updater(sorting) : updater;\n      if (sort == null) setOwnSort(next);\n      onSortChange?.(next);\n    },\n  });\n  const rows = table.getRowModel().rows;\n  const total = data.length;\n  const matched = searching ? rows.length : total;\n  useLayoutEffect(() => {\n    if (!searching || searchStore == null) return;\n    searchStore.publish({ placeholder, query, setQuery, matched, total });\n  }, [searching, searchStore, placeholder, query, matched, total]);\n  useEffect(() => {\n    if (searchStore == null) return;\n    return () => searchStore.publish(null);\n  }, [searchStore]);\n  const leafCount = table.getAllLeafColumns().length;\n  const bones = useMemo(\n    () =>\n      loading\n        ? Array.from({ length: loading === true ? DEFAULT_BONES : loading })\n        : [],\n    [loading],\n  );\n\n  const renderRow = (row: (typeof rows)[number]) => {\n    const href = rowHref?.(row.original);\n    const isCurrent = current != null && current === row.id;\n    const navigable = href != null || onRowClick != null;\n    const onActivate = (event: MouseEvent<HTMLTableRowElement>) => {\n      if (event.button !== 0 && event.button !== 1) return;\n      if (event.defaultPrevented || shouldIgnoreRowNav(event.target)) return;\n      onRowClick?.(row.original, event);\n      if (event.defaultPrevented || href == null) return;\n      activateRowHref(event, href);\n    };\n    const onRowKeyDown = (event: KeyboardEvent<HTMLTableRowElement>) => {\n      if (href != null) return;\n      if (event.key !== \"Enter\" && event.key !== \" \") return;\n      if (event.defaultPrevented || shouldIgnoreRowNav(event.target)) return;\n      event.preventDefault();\n      onRowClick?.(row.original, event);\n    };\n    return (\n      <tr\n        key={row.id}\n        className={cn(\n          navigable &&\n            \"hover:bg-pho-primary-hover outline-pho-brand cursor-pointer transition-colors has-[a:focus-visible]:outline-2 has-[a:focus-visible]:-outline-offset-2\",\n          (isCurrent || row.getIsSelected()) && \"bg-pho-primary-hover\",\n        )}\n        tabIndex={navigable && href == null ? 0 : undefined}\n        onClick={navigable ? onActivate : undefined}\n        onAuxClick={navigable ? onActivate : undefined}\n        onKeyDown={navigable && href == null ? onRowKeyDown : undefined}\n      >\n        {row.getAllCells().map((cell, index) => {\n          const align = cell.column.columnDef.meta?.align ?? \"start\";\n          return (\n            <td\n              key={cell.id}\n              className={cn(\n                \"text-pho-primary px-5 align-middle whitespace-nowrap\",\n                rowSize,\n                fixed && \"min-w-0\",\n                align === \"end\" && \"text-right tabular-nums\",\n                cell.column.columnDef.meta?.className,\n              )}\n            >\n              {/* The link lives in the first data cell; with selection on,\n                  cell 0 is the checkbox and must stay outside the anchor. */}\n              {index === (selecting ? 1 : 0) && href != null ? (\n                // One real link for keyboard and right-click; the row\n                // click handler covers the rest of the surface.\n                <Link\n                  href={href}\n                  aria-current={isCurrent ? \"page\" : undefined}\n                  className=\"outline-none\"\n                >\n                  <FlexRender cell={cell} />\n                </Link>\n              ) : (\n                <FlexRender cell={cell} />\n              )}\n            </td>\n          );\n        })}\n      </tr>\n    );\n  };\n\n  // Partition the (sorted, filtered) rows: the main body, then each\n  // labeled group in the order labels first appear in `data`.\n  let mainRows = rows;\n  let groupSections: Array<[string, typeof rows]> = [];\n  if (group != null) {\n    mainRows = [];\n    const byLabel = new Map<string, typeof rows>();\n    const order: string[] = [];\n    for (const item of data) {\n      const label = group(item);\n      if (label != null && !byLabel.has(label)) {\n        byLabel.set(label, []);\n        order.push(label);\n      }\n    }\n    for (const row of rows) {\n      const label = group(row.original);\n      if (label == null) {\n        mainRows.push(row);\n      } else {\n        if (!byLabel.has(label)) {\n          byLabel.set(label, []);\n          order.push(label);\n        }\n        byLabel.get(label)!.push(row);\n      }\n    }\n    groupSections = order\n      .map((label) => [label, byLabel.get(label)!] as [string, typeof rows])\n      .filter(([, sectionRows]) => sectionRows.length > 0);\n  }\n\n  const grid = (\n    <table\n      className={cn(\"w-full border-collapse\", rowText, fixed && \"table-fixed\")}\n      aria-busy={loading ? true : undefined}\n    >\n      <thead>\n        {table.getHeaderGroups().map((headerGroup) => (\n          <tr key={headerGroup.id}>\n            {headerGroup.headers.map((header) => {\n              const align = header.column.columnDef.meta?.align ?? \"start\";\n              const sorted = header.column.getIsSorted();\n              const sortable =\n                !header.isPlaceholder && header.column.getCanSort();\n              return (\n                <th\n                  key={header.id}\n                  scope=\"col\"\n                  colSpan={header.colSpan}\n                  aria-sort={\n                    sorted === \"asc\"\n                      ? \"ascending\"\n                      : sorted === \"desc\"\n                        ? \"descending\"\n                        : undefined\n                  }\n                  className={cn(\n                    \"text-pho-description h-10 px-5 text-left align-middle font-normal whitespace-nowrap\",\n                    fixed && \"min-w-0\",\n                    align === \"end\" && \"text-right\",\n                    header.column.columnDef.meta?.className,\n                  )}\n                >\n                  {header.isPlaceholder ? null : sortable ? (\n                    <button\n                      type=\"button\"\n                      onClick={header.column.getToggleSortingHandler()}\n                      className={cn(\n                        \"group/sort outline-pho-brand hover:text-pho-primary -mx-1 inline-flex items-center gap-1 rounded-sm px-1 transition-colors focus-visible:outline-2\",\n                        align === \"end\" && \"flex-row-reverse\",\n                        sorted && \"text-pho-primary\",\n                      )}\n                    >\n                      <FlexRender header={header} />\n                      <SortIndicator sorted={sorted} />\n                    </button>\n                  ) : (\n                    <FlexRender header={header} />\n                  )}\n                </th>\n              );\n            })}\n          </tr>\n        ))}\n      </thead>\n      <tbody className=\"divide-pho-secondary border-pho-secondary divide-y border-t\">\n        {bones.length > 0 ? (\n          bones.map((_, index) => (\n            <tr key={index}>\n              {table.getAllLeafColumns().map((column) => (\n                <td\n                  key={column.id}\n                  className={cn(\n                    \"px-5 align-middle\",\n                    rowSize,\n                    fixed && \"min-w-0\",\n                    column.columnDef.meta?.className,\n                  )}\n                >\n                  <Skeleton\n                    className={cn(\n                      \"h-3.5 w-24\",\n                      column.columnDef.meta?.align === \"end\" && \"ml-auto\",\n                    )}\n                  />\n                </td>\n              ))}\n            </tr>\n          ))\n        ) : rows.length === 0 ? (\n          <tr>\n            <td\n              colSpan={leafCount}\n              className=\"text-pho-description px-5 py-10 text-center\"\n            >\n              {searching && query !== \"\" && data.length > 0 ? (\n                <>Nothing matches “{query}”.</>\n              ) : (\n                empty\n              )}\n            </td>\n          </tr>\n        ) : (\n          <>\n            {mainRows.map(renderRow)}\n            {groupSections.map(([label, sectionRows]) => (\n              <Fragment key={label}>\n                <tr data-table-group=\"\">\n                  <td\n                    colSpan={leafCount}\n                    // A tinted band, not spacing: the wash marks the group\n                    // off, the height stays compact.\n                    className=\"bg-pho-page text-pho-description h-9 px-5 align-middle text-xs font-medium\"\n                  >\n                    {label}\n                  </td>\n                </tr>\n                {sectionRows.map(renderRow)}\n              </Fragment>\n            ))}\n          </>\n        )}\n      </tbody>\n    </table>\n  );\n\n  return (\n    <div\n      className={cn(\n        DATA_TABLE_SURFACE,\n        \"w-full scroll-mt-12 contain-inline-size\",\n        !animateHeight && \"overflow-x-auto\",\n        className,\n      )}\n      {...props}\n      data-data-table=\"\"\n    >\n      {(toolbar != null || (searching && !adopted)) && (\n        // The toolbar band — table chrome, like the header row: the ghost\n        // search on the cells' text line (`px-5`), filters at the end.\n        // Quiet ink, no boxes in the box; the hairline below is the only\n        // border it brings.\n        <div className=\"border-pho-secondary flex min-h-11 flex-wrap items-center gap-x-4 gap-y-1 border-b px-5 py-2\">\n          {searching && !adopted && (\n            <GhostSearch\n              value={query}\n              onChange={setQuery}\n              placeholder={placeholder}\n              aria-label={placeholder}\n            />\n          )}\n          {toolbar}\n        </div>\n      )}\n      {animateHeight ? (\n        // The height glides on the page spring while the rows inside swap;\n        // sideways scrolling moves onto the measured layer so the frame\n        // clips height only.\n        <AnimatedHeight\n          transition={SPRING_ENTRANCE}\n          className=\"overflow-x-auto\"\n        >\n          {grid}\n        </AnimatedHeight>\n      ) : (\n        grid\n      )}\n    </div>\n  );\n}\n\n/**\n * The sort cue beside a sortable header: the two-way glyph at rest (shown\n * on hover and focus, so a header reads as plain text until it matters), a\n * chevron pointing the way once the column is sorted.\n */\nfunction SortIndicator({ sorted }: { sorted: false | \"asc\" | \"desc\" }) {\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        \"inline-flex shrink-0 [&>svg]:size-3.5\",\n        !sorted &&\n          \"opacity-0 transition-opacity group-hover/sort:opacity-100 group-focus-visible/sort:opacity-100\",\n      )}\n    >\n      {sorted === \"asc\" ? (\n        <IconChevronUp />\n      ) : sorted === \"desc\" ? (\n        <IconChevronDown />\n      ) : (\n        <IconSelector />\n      )}\n    </span>\n  );\n}\n\nexport { DataTable, DATA_TABLE_SURFACE };\n"],"x_google_ignoreList":[0],"mappings":"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"}
+{"version":3,"file":"data-table-Mog6m3d9.js","names":[],"sources":["../../../../node_modules/.pnpm/@tabler+icons-react@3.46.0_react@19.2.8/node_modules/@tabler/icons-react/dist/esm/icons/IconSelector.mjs","../../src/components/data-table/data-table.tsx"],"sourcesContent":["/**\n * @license @tabler/icons-react v3.46.0 - MIT\n *\n * This source code is licensed under the MIT license.\n * See the LICENSE file in the root directory of this source tree.\n */\n\nimport createReactComponent from '../createReactComponent.mjs';\n\nconst __iconNode = [[\"path\", { \"d\": \"M8 9l4 -4l4 4\", \"key\": \"svg-0\" }], [\"path\", { \"d\": \"M16 15l-4 4l-4 -4\", \"key\": \"svg-1\" }]];\nconst IconSelector = createReactComponent(\"outline\", \"selector\", \"Selector\", __iconNode);\n\nexport { __iconNode, IconSelector as default };\n//# sourceMappingURL=IconSelector.mjs.map\n","import {\n  createContext,\n  Fragment,\n  useContext,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useState,\n  useSyncExternalStore,\n  type ComponentProps,\n  type KeyboardEvent,\n  type MouseEvent,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport {\n  columnFilteringFeature,\n  createColumnHelper,\n  createFilteredRowModel,\n  createSortedRowModel,\n  filterFn_includesString,\n  FlexRender,\n  globalFilteringFeature,\n  rowSelectionFeature,\n  rowSortingFeature,\n  sortFn_alphanumeric,\n  sortFn_basic,\n  sortFn_datetime,\n  sortFn_text,\n  tableFeatures,\n  useTable,\n  type ColumnDef,\n  type RowData,\n  type SortingState,\n} from \"@tanstack/react-table\";\nimport {\n  IconChevronDown,\n  IconChevronUp,\n  IconSelector,\n} from \"@tabler/icons-react\";\nimport { Skeleton } from \"../skeleton\";\nimport { Checkbox } from \"../checkbox\";\nimport { SPRING_ENTRANCE } from \"../../motion\";\nimport { AnimatedHeight } from \"../../utils/animated-height\";\nimport { cn } from \"../../utils/cn\";\nimport { resolveVariant, type VariantMap } from \"../../utils/resolve-variant\";\nimport { useLinkComponent } from \"../../utils/link-provider\";\n\n/**\n * DataTable — a table of records with column semantics: sortable headers,\n * aligned cells, rows that are links into a subpage. TanStack Table (v9)\n * does the thinking — column defs, sorting, row identity — and renders\n * nothing; every pixel here is Pho's.\n *\n * Design notes:\n * - The surface is `BasicPage.Card`'s: hairline border, `base` radius, the\n *   page's primary fill, hairline rules between rows. A table is a card of\n *   rows that happen to line up in columns, so it sits in a page's `Stack`\n *   as any card does.\n * - Header cells are description ink at body size — never small caps, never\n *   bold. Hierarchy comes from ink alone; the header is a label row, not a\n *   banner.\n * - A sortable header is a button inside the cell: the label and its\n *   indicator (`IconSelector` at rest, a chevron once sorted). `aria-sort`\n *   sits on the `th`.\n * - Rows that navigate stretch one link across the row (the first cell's\n *   link, extended with a pseudo-element), so the whole row is one target\n *   for pointer and one stop for keyboard. Hover washes the row; the row\n *   whose page is open beside the table (`current`) keeps the wash — the\n *   same cue `BasicPage.RowLink` gives under `aria-current`.\n * - Numbers align to the end with tabular figures (`meta.align: \"end\"`).\n * - `search` is one box over every column — plain contains matching, and\n *   the body says when nothing matches. In a page, `BasicPage.Search` in\n *   the section header adopts the box; alone, the table keeps one in a\n *   toolbar row inside its frame. Server-side search keeps its own box\n *   outside.\n * - A wide table scrolls sideways inside its own frame; the page never does.\n *   `contain: inline-size` keeps the table's intrinsic width out of the\n *   page's — a host that sizes to content (a scroll area's fit-content\n *   pane, a grid's auto column) would otherwise grow to the widest row.\n *   Left with no width of its own, the frame takes its container's\n *   (`w-full`); a shrink-to-fit host (a flex row) would collapse it.\n *   `layout=\"fixed\"` is the other way out: columns size from the frame,\n *   and a long cell truncates instead of stretching the table.\n *\n * Reach for it when a list needs column semantics — sorting, aligned\n * figures, several fields side by side. A list where each row is one\n * label and a chevron stays `BasicPage.RowLink`.\n */\n\n/** Column metadata a `DataTable` understands. */\nexport interface DataTableColumnMeta {\n  /** Cell alignment — `end` for figures (right-aligned, tabular). */\n  align?: \"start\" | \"end\";\n  /**\n   * Extra classes on every `th` and `td` in this column. With\n   * `layout=\"fixed\"`, size a short column here (`w-24`) and leave the\n   * flexible ones unsaid — they share what remains. Prefer this over\n   * `nth-child` width hacks on the table's `className`.\n   */\n  className?: string;\n}\n\n/**\n * The feature set every `DataTable` runs on — sorting with the stock sort\n * functions, the column meta above. Fixed, so column definitions written\n * once fit every table.\n */\nconst features = tableFeatures({\n  rowSortingFeature,\n  rowSelectionFeature,\n  columnFilteringFeature,\n  globalFilteringFeature,\n  sortedRowModel: createSortedRowModel(),\n  filteredRowModel: createFilteredRowModel(),\n  filterFns: { includesString: filterFn_includesString },\n  sortFns: {\n    alphanumeric: sortFn_alphanumeric,\n    basic: sortFn_basic,\n    datetime: sortFn_datetime,\n    text: sortFn_text,\n  },\n  columnMeta: {} as DataTableColumnMeta,\n});\n\nexport type DataTableFeatures = typeof features;\n\n/** Body row height — the header keeps its own `h-10` on every size. */\nexport const DATA_TABLE_SIZES = {\n  sm: {\n    classes: \"h-10\",\n    description: \"Small — 40px at 13px; the header's height, for dense lists\",\n  },\n  base: {\n    classes: \"h-12\",\n    description: \"Base — 48px at 14px; one line of body type\",\n  },\n  lg: {\n    classes: \"h-14\",\n    description:\n      \"Large — 56px at 16px; two-line cells (a number and a caption)\",\n  },\n} satisfies VariantMap;\n\nexport type DataTableSize = keyof typeof DATA_TABLE_SIZES;\n\n/**\n * The type each size sets on the table, so cells and header move together:\n * 13px dense, the body's 14px, 16px for rows that carry two lines.\n */\nconst DATA_TABLE_TEXT: Record<DataTableSize, string> = {\n  sm: \"text-xs\",\n  base: \"text-base\",\n  lg: \"text-md\",\n};\n\n/** A column definition for a `DataTable` of `TData` rows. */\nexport type DataTableColumn<\n  TData extends RowData,\n  TValue = unknown,\n> = ColumnDef<DataTableFeatures, TData, TValue>;\n\n/**\n * The column helper, bound to the table's feature set — `accessor`,\n * `display`, `group`, and `columns` to collect them with their types\n * intact.\n *\n * @example\n * const col = createColumns<Request>();\n * const columns = col.columns([\n *   col.accessor(\"actor\", { header: \"Actor\" }),\n *   col.accessor(\"amount\", { header: \"Amount\", meta: { align: \"end\" } }),\n * ]);\n */\nexport function createColumns<TData extends RowData>() {\n  return createColumnHelper<DataTableFeatures, TData>();\n}\n\n/**\n * The leading checkbox column selection adds. The header checkbox works\n * the visible set: everything the search still shows toggles together,\n * while rows selected earlier and then hidden stay selected.\n */\nconst SELECT_COLUMN = createColumns<RowData>().display({\n  id: \"select\",\n  enableSorting: false,\n  header: ({ table }) => {\n    const visible = table.getRowModel().rows;\n    const chosen = visible.filter((row) => row.getIsSelected()).length;\n    const all = visible.length > 0 && chosen === visible.length;\n    return (\n      <Checkbox\n        size=\"sm\"\n        aria-label=\"Select all\"\n        checked={all}\n        indeterminate={chosen > 0 && !all}\n        onCheckedChange={(checked) => {\n          table.setRowSelection((old) => {\n            const next = { ...old };\n            for (const row of visible) {\n              if (checked === true) next[row.id] = true;\n              else delete next[row.id];\n            }\n            return next;\n          });\n        }}\n      />\n    );\n  },\n  cell: ({ row }) => (\n    <Checkbox\n      size=\"sm\"\n      aria-label=\"Select row\"\n      checked={row.getIsSelected()}\n      onCheckedChange={(checked) => row.toggleSelected(checked === true)}\n    />\n  ),\n});\n\nexport interface DataTableProps<TData extends RowData> extends Omit<\n  ComponentProps<\"div\">,\n  \"children\"\n> {\n  columns: ReadonlyArray<DataTableColumn<TData, any>>;\n  data: ReadonlyArray<TData>;\n  /**\n   * A row's identity — what `current` is matched against, and what keeps a\n   * row itself across sorts. Defaults to the row's `id` field, else its\n   * index.\n   */\n  getRowId?: (row: TData) => string;\n  /**\n   * Rows that navigate: each row is one link into a subpage, through the\n   * host's `LinkProvider`. Beside a `BasicPage.Aside`, the subpage opens\n   * next to the table. Return nothing for a row with no page yet (one\n   * still in flight) and that row stays plain.\n   */\n  rowHref?: (row: TData) => string | null | undefined;\n  /**\n   * A click on the row (not on a link, button, or other control). The\n   * table still activates `rowHref` unless the handler calls\n   * `preventDefault`.\n   */\n  onRowClick?: (\n    row: TData,\n    event: MouseEvent<HTMLTableRowElement> | KeyboardEvent<HTMLTableRowElement>,\n  ) => void;\n  /** The row whose page is open (its id) — it keeps the wash. */\n  current?: string | null;\n  /**\n   * Sorting is on for every accessor column (`enableSorting: false` on a\n   * column turns it off there). Uncontrolled by default; `defaultSort`\n   * seeds it. Pass `sort` with `onSortChange` to own it — the way to sort\n   * on the server.\n   */\n  defaultSort?: SortingState;\n  sort?: SortingState;\n  onSortChange?: (sort: SortingState) => void;\n  /**\n   * A search box on the table — `true`, or the placeholder it should\n   * show. One box searches every column (a column opts out with\n   * `enableGlobalFilter: false`); matching is a plain case-insensitive\n   * contains, on the client. With no matches the body says so. When the\n   * list doesn't all come down, keep the box outside and ask the server.\n   */\n  search?: boolean | string;\n  /**\n   * Controls in the frame's top band — a `BasicPage.Search` first, then a\n   * filter or two. The band is part of the table (one surface, a hairline\n   * above the header row), so nothing floats over the page and the\n   * spacing above and below is the frame's own. A `Search` here adopts\n   * the table's box the way a header one does.\n   */\n  toolbar?: ReactNode;\n  /**\n   * Row selection: hand either of these and rows grow a leading checkbox\n   * column. The header checkbox works the visible set — everything the\n   * search still shows — so select-all after a search means what it says;\n   * rows selected earlier and then hidden stay selected. `selected` is\n   * the selected ids (ids come from `getRowId`; pair with\n   * `onSelectedChange` to own the state); `onSelectedChange` alone\n   * listens while the table keeps it. The page renders its own bulk\n   * actions from the ids — the table only keeps the score.\n   */\n  selected?: readonly string[];\n  onSelectedChange?: (ids: string[]) => void;\n  /**\n   * File rows into labeled groups: return a label and the row renders\n   * under it, `null` and it stays in the main body. Groups follow the\n   * main body, in the order their labels first appear in `data`, each\n   * under a quiet label row — and only while they have rows, so a group\n   * a search empties simply leaves. Sorting orders rows within their\n   * group.\n   */\n  group?: (row: TData) => string | null;\n  /**\n   * Glide the frame's height when the rows change — a search narrowing,\n   * a filter, bones becoming rows. The height follows the content on the\n   * page spring instead of jumping; reserve it for tables whose rows\n   * change while mounted (same contract as `BasicPage.Card`'s).\n   */\n  animateHeight?: boolean;\n  /** Bones while the rows are on their way — `true` for five, or a count. */\n  loading?: boolean | number;\n  /** What the body says when there are no rows. */\n  empty?: ReactNode;\n  /**\n   * How columns take width. `auto` (the default) sizes them from their\n   * content — a long cell grows the table and the frame scrolls sideways.\n   * `fixed` sizes them from the table's width (`table-layout: fixed`):\n   * short columns take a width hint on `meta.className`, the rest share\n   * what remains, and cells get `min-w-0` so an inner `truncate` can\n   * shrink. `width: 0` (`w-0`) is not a content-size hint here — fixed\n   * layout treats it as a real zero — so give a short column a real\n   * width (`w-24`) rather than the auto-layout shrink-wrap trick.\n   */\n  layout?: \"auto\" | \"fixed\";\n  /**\n   * Body row height and the type that comes with it. `base` (the default)\n   * is 48px rows at 14px — one line of body type. `sm` is 40px at 13px,\n   * the header's own height, for a dense list scanned more than read.\n   * `lg` is 56px at 16px, for a two-line cell (a number and a caption)\n   * that would crowd `base`. The header row keeps its 40px on every size\n   * and follows the type.\n   */\n  size?: DataTableSize;\n  ref?: Ref<HTMLDivElement>;\n}\n\n/**\n * A host that sizes itself around tables provides this; each table\n * announces itself while mounted. `BasicPage.Root` runs wide when the\n * page carries one and `width` was left unsaid.\n */\nexport const TableHostContext = createContext<\n  ((present: boolean) => void) | null\n>(null);\n\n/** A searchable table's search, published for a header to adopt. */\nexport interface TableSearchApi {\n  placeholder: string;\n  query: string;\n  setQuery: (query: string) => void;\n  /** Rows still showing after the current query. */\n  matched: number;\n  /** Rows in the list, before search. */\n  total: number;\n}\n\ninterface TableSearchState {\n  api: TableSearchApi | null;\n  adopted: boolean;\n}\n\n/**\n * The channel between a searchable table and a `BasicPage.Search` placed\n * in a section header: the table publishes its search (placeholder,\n * query, the setter); a mounted `Search` adopts it, and the table's own\n * box yields. Provided by `BasicPage.Root`; a table outside any page\n * keeps its built-in box. One searchable table per page — a later\n * publisher takes the slot.\n */\nexport interface TableSearchStore {\n  get: () => TableSearchState;\n  subscribe: (listener: () => void) => () => void;\n  publish: (api: TableSearchApi | null) => void;\n  adopt: (adopted: boolean) => void;\n}\n\nexport function createTableSearchStore(): TableSearchStore {\n  let state: TableSearchState = { api: null, adopted: false };\n  const listeners = new Set<() => void>();\n  const emit = () => {\n    for (const listener of listeners) listener();\n  };\n  return {\n    get: () => state,\n    subscribe(listener) {\n      listeners.add(listener);\n      return () => listeners.delete(listener);\n    },\n    publish(api) {\n      state = { ...state, api };\n      emit();\n    },\n    adopt(adopted) {\n      state = { ...state, adopted };\n      emit();\n    },\n  };\n}\n\nexport const TableSearchContext = createContext<TableSearchStore | null>(null);\n\nconst subscribeToNothing = () => () => {};\n\nexport { GhostSearch, type GhostSearchProps } from \"../../utils/ghost-search\";\nimport { GhostSearch } from \"../../utils/ghost-search\";\n\n/** Same chrome as `BasicPage.Card`, minus its dividers — rows draw their own. */\nconst DATA_TABLE_SURFACE =\n  \"rounded-base border border-pho-secondary bg-pho-primary\";\n\nconst DEFAULT_BONES = 5;\n\nfunction defaultRowId(row: unknown, index: number): string {\n  const id = (row as { id?: unknown } | null)?.id;\n  return typeof id === \"string\" || typeof id === \"number\"\n    ? String(id)\n    : String(index);\n}\n\n/** Controls keep their own click; the row only navigates from empty surface. */\nconst ROW_NAV_IGNORE = \"a, button, input, textarea, select, label\";\n\nfunction shouldIgnoreRowNav(target: EventTarget | null): boolean {\n  return target instanceof Element && target.closest(ROW_NAV_IGNORE) != null;\n}\n\nfunction activateRowHref(event: MouseEvent<HTMLTableRowElement>, href: string) {\n  const newTab =\n    event.button === 1 || event.metaKey || event.ctrlKey || event.shiftKey;\n  if (event.button === 1) event.preventDefault();\n  if (event.button !== 0 && event.button !== 1) return;\n  if (newTab) {\n    window.open(href, \"_blank\", \"noopener,noreferrer\");\n    return;\n  }\n  event.currentTarget.querySelector<HTMLAnchorElement>(\"a[href]\")?.click();\n}\n\nfunction DataTable<TData extends RowData>({\n  columns,\n  data,\n  getRowId,\n  rowHref,\n  onRowClick,\n  current,\n  selected,\n  onSelectedChange,\n  defaultSort,\n  sort,\n  onSortChange,\n  search,\n  toolbar,\n  group,\n  animateHeight,\n  loading,\n  empty = \"Nothing here yet.\",\n  layout = \"auto\",\n  size = \"base\",\n  className,\n  ...props\n}: DataTableProps<TData>) {\n  const fixed = layout === \"fixed\";\n  const rowSize = resolveVariant(DATA_TABLE_SIZES, size);\n  const rowText = DATA_TABLE_TEXT[size] ?? DATA_TABLE_TEXT.base;\n  const Link = useLinkComponent();\n  const announce = useContext(TableHostContext);\n  const searching = search === true || typeof search === \"string\";\n  const [query, setQuery] = useState(\"\");\n  const placeholder = typeof search === \"string\" ? search : \"Search\";\n  // A `BasicPage.Search` in a section header adopts the box; the table\n  // then renders no toolbar of its own.\n  const searchStore = useContext(TableSearchContext);\n  const adopted = useSyncExternalStore(\n    searchStore?.subscribe ?? subscribeToNothing,\n    () => searchStore?.get().adopted ?? false,\n    () => false,\n  );\n  useLayoutEffect(() => {\n    if (announce == null) return;\n    announce(true);\n    return () => announce(false);\n  }, [announce]);\n  const selecting = selected != null || onSelectedChange != null;\n  const [ownSelection, setOwnSelection] = useState<Record<string, true>>({});\n  const rowSelection: Record<string, true> =\n    selected != null\n      ? Object.fromEntries(selected.map((id) => [id, true as const]))\n      : ownSelection;\n  // Sorting mirrors selection: the component always owns a fallback state,\n  // so `defaultSort` + `onSortChange` without `sort` still sorts — a custom\n  // `onSortingChange` replaces the table's own updater entirely.\n  const [ownSort, setOwnSort] = useState<SortingState>(defaultSort ?? []);\n  const sorting: SortingState = sort ?? ownSort;\n  const table = useTable<DataTableFeatures, TData>({\n    features,\n    columns: (selecting\n      ? [SELECT_COLUMN as DataTableColumn<TData, any>, ...columns]\n      : columns) as Array<DataTableColumn<TData, any>>,\n    data: data as Array<TData>,\n    getRowId: getRowId ? (row) => getRowId(row) : defaultRowId,\n    // Keys only when meant: a present-but-undefined slice of `state` reads\n    // as \"controlled, with nobody listening\".\n    state: {\n      sorting,\n      ...(searching ? { globalFilter: query } : {}),\n      ...(selecting ? { rowSelection } : {}),\n    },\n    ...(selecting\n      ? {\n          enableRowSelection: true,\n          onRowSelectionChange: (\n            updater:\n              | Record<string, true>\n              | ((old: Record<string, true>) => Record<string, true>),\n          ) => {\n            const next =\n              typeof updater === \"function\" ? updater(rowSelection) : updater;\n            if (selected == null) setOwnSelection(next);\n            onSelectedChange?.(Object.keys(next));\n          },\n        }\n      : {}),\n    ...(searching\n      ? {\n          onGlobalFilterChange: setQuery,\n          globalFilterFn: \"includesString\" as const,\n        }\n      : {}),\n    onSortingChange: (\n      updater: SortingState | ((prev: SortingState) => SortingState),\n    ) => {\n      const next = typeof updater === \"function\" ? updater(sorting) : updater;\n      if (sort == null) setOwnSort(next);\n      onSortChange?.(next);\n    },\n  });\n  const rows = table.getRowModel().rows;\n  const total = data.length;\n  const matched = searching ? rows.length : total;\n  useLayoutEffect(() => {\n    if (!searching || searchStore == null) return;\n    searchStore.publish({ placeholder, query, setQuery, matched, total });\n  }, [searching, searchStore, placeholder, query, matched, total]);\n  useEffect(() => {\n    if (searchStore == null) return;\n    return () => searchStore.publish(null);\n  }, [searchStore]);\n  const leafCount = table.getAllLeafColumns().length;\n  const bones = useMemo(\n    () =>\n      loading\n        ? Array.from({ length: loading === true ? DEFAULT_BONES : loading })\n        : [],\n    [loading],\n  );\n\n  const renderRow = (row: (typeof rows)[number]) => {\n    const href = rowHref?.(row.original);\n    const isCurrent = current != null && current === row.id;\n    const navigable = href != null || onRowClick != null;\n    const onActivate = (event: MouseEvent<HTMLTableRowElement>) => {\n      if (event.button !== 0 && event.button !== 1) return;\n      if (event.defaultPrevented || shouldIgnoreRowNav(event.target)) return;\n      onRowClick?.(row.original, event);\n      if (event.defaultPrevented || href == null) return;\n      activateRowHref(event, href);\n    };\n    const onRowKeyDown = (event: KeyboardEvent<HTMLTableRowElement>) => {\n      if (href != null) return;\n      if (event.key !== \"Enter\" && event.key !== \" \") return;\n      if (event.defaultPrevented || shouldIgnoreRowNav(event.target)) return;\n      event.preventDefault();\n      onRowClick?.(row.original, event);\n    };\n    return (\n      <tr\n        key={row.id}\n        className={cn(\n          navigable &&\n            \"hover:bg-pho-primary-hover outline-pho-brand cursor-pointer transition-colors has-[a:focus-visible]:outline-2 has-[a:focus-visible]:-outline-offset-2\",\n          (isCurrent || row.getIsSelected()) && \"bg-pho-primary-hover\",\n        )}\n        tabIndex={navigable && href == null ? 0 : undefined}\n        onClick={navigable ? onActivate : undefined}\n        onAuxClick={navigable ? onActivate : undefined}\n        onKeyDown={navigable && href == null ? onRowKeyDown : undefined}\n      >\n        {row.getAllCells().map((cell, index) => {\n          const align = cell.column.columnDef.meta?.align ?? \"start\";\n          return (\n            <td\n              key={cell.id}\n              className={cn(\n                \"text-pho-primary px-5 align-middle whitespace-nowrap\",\n                rowSize,\n                fixed && \"min-w-0\",\n                align === \"end\" && \"text-right tabular-nums\",\n                cell.column.columnDef.meta?.className,\n              )}\n            >\n              {/* The link lives in the first data cell; with selection on,\n                  cell 0 is the checkbox and must stay outside the anchor. */}\n              {index === (selecting ? 1 : 0) && href != null ? (\n                // One real link for keyboard and right-click; the row\n                // click handler covers the rest of the surface.\n                <Link\n                  href={href}\n                  aria-current={isCurrent ? \"page\" : undefined}\n                  className=\"outline-none\"\n                >\n                  <FlexRender cell={cell} />\n                </Link>\n              ) : (\n                <FlexRender cell={cell} />\n              )}\n            </td>\n          );\n        })}\n      </tr>\n    );\n  };\n\n  // Partition the (sorted, filtered) rows: the main body, then each\n  // labeled group in the order labels first appear in `data`.\n  let mainRows = rows;\n  let groupSections: Array<[string, typeof rows]> = [];\n  if (group != null) {\n    mainRows = [];\n    const byLabel = new Map<string, typeof rows>();\n    const order: string[] = [];\n    for (const item of data) {\n      const label = group(item);\n      if (label != null && !byLabel.has(label)) {\n        byLabel.set(label, []);\n        order.push(label);\n      }\n    }\n    for (const row of rows) {\n      const label = group(row.original);\n      if (label == null) {\n        mainRows.push(row);\n      } else {\n        if (!byLabel.has(label)) {\n          byLabel.set(label, []);\n          order.push(label);\n        }\n        byLabel.get(label)!.push(row);\n      }\n    }\n    groupSections = order\n      .map((label) => [label, byLabel.get(label)!] as [string, typeof rows])\n      .filter(([, sectionRows]) => sectionRows.length > 0);\n  }\n\n  const grid = (\n    <table\n      className={cn(\"w-full border-collapse\", rowText, fixed && \"table-fixed\")}\n      aria-busy={loading ? true : undefined}\n    >\n      <thead>\n        {table.getHeaderGroups().map((headerGroup) => (\n          <tr key={headerGroup.id}>\n            {headerGroup.headers.map((header) => {\n              const align = header.column.columnDef.meta?.align ?? \"start\";\n              const sorted = header.column.getIsSorted();\n              const sortable =\n                !header.isPlaceholder && header.column.getCanSort();\n              return (\n                <th\n                  key={header.id}\n                  scope=\"col\"\n                  colSpan={header.colSpan}\n                  aria-sort={\n                    sorted === \"asc\"\n                      ? \"ascending\"\n                      : sorted === \"desc\"\n                        ? \"descending\"\n                        : undefined\n                  }\n                  className={cn(\n                    \"text-pho-description h-10 px-5 text-left align-middle font-normal whitespace-nowrap\",\n                    fixed && \"min-w-0\",\n                    align === \"end\" && \"text-right\",\n                    header.column.columnDef.meta?.className,\n                  )}\n                >\n                  {header.isPlaceholder ? null : sortable ? (\n                    <button\n                      type=\"button\"\n                      onClick={header.column.getToggleSortingHandler()}\n                      className={cn(\n                        \"group/sort outline-pho-brand hover:text-pho-primary -mx-1 inline-flex items-center gap-1 rounded-sm px-1 transition-colors focus-visible:outline-2\",\n                        align === \"end\" && \"flex-row-reverse\",\n                        sorted && \"text-pho-primary\",\n                      )}\n                    >\n                      <FlexRender header={header} />\n                      <SortIndicator sorted={sorted} />\n                    </button>\n                  ) : (\n                    <FlexRender header={header} />\n                  )}\n                </th>\n              );\n            })}\n          </tr>\n        ))}\n      </thead>\n      <tbody className=\"divide-pho-secondary border-pho-secondary divide-y border-t\">\n        {bones.length > 0 ? (\n          bones.map((_, index) => (\n            <tr key={index}>\n              {table.getAllLeafColumns().map((column) => (\n                <td\n                  key={column.id}\n                  className={cn(\n                    \"px-5 align-middle\",\n                    rowSize,\n                    fixed && \"min-w-0\",\n                    column.columnDef.meta?.className,\n                  )}\n                >\n                  <Skeleton\n                    className={cn(\n                      \"h-3.5 w-24\",\n                      column.columnDef.meta?.align === \"end\" && \"ml-auto\",\n                    )}\n                  />\n                </td>\n              ))}\n            </tr>\n          ))\n        ) : rows.length === 0 ? (\n          <tr>\n            <td\n              colSpan={leafCount}\n              className=\"text-pho-description px-5 py-10 text-center\"\n            >\n              {searching && query !== \"\" && data.length > 0 ? (\n                <>Nothing matches “{query}”.</>\n              ) : (\n                empty\n              )}\n            </td>\n          </tr>\n        ) : (\n          <>\n            {mainRows.map(renderRow)}\n            {groupSections.map(([label, sectionRows]) => (\n              <Fragment key={label}>\n                <tr data-table-group=\"\">\n                  <td\n                    colSpan={leafCount}\n                    // A tinted band, not spacing: the wash marks the group\n                    // off, the height stays compact.\n                    className=\"bg-pho-page text-pho-description h-9 px-5 align-middle text-xs font-medium\"\n                  >\n                    {label}\n                  </td>\n                </tr>\n                {sectionRows.map(renderRow)}\n              </Fragment>\n            ))}\n          </>\n        )}\n      </tbody>\n    </table>\n  );\n\n  return (\n    <div\n      className={cn(\n        DATA_TABLE_SURFACE,\n        \"w-full scroll-mt-12 contain-inline-size\",\n        !animateHeight && \"overflow-x-auto\",\n        className,\n      )}\n      {...props}\n      data-data-table=\"\"\n    >\n      {(toolbar != null || (searching && !adopted)) && (\n        // The toolbar band — table chrome, like the header row: the ghost\n        // search on the cells' text line (`px-5`), filters at the end.\n        // Quiet ink, no boxes in the box; the hairline below is the only\n        // border it brings.\n        <div className=\"border-pho-secondary flex min-h-11 flex-wrap items-center gap-x-4 gap-y-1 border-b px-5 py-2\">\n          {searching && !adopted && (\n            <GhostSearch\n              value={query}\n              onChange={setQuery}\n              placeholder={placeholder}\n              aria-label={placeholder}\n            />\n          )}\n          {toolbar}\n        </div>\n      )}\n      {animateHeight ? (\n        // The height glides on the page spring while the rows inside swap;\n        // sideways scrolling moves onto the measured layer so the frame\n        // clips height only.\n        <AnimatedHeight\n          transition={SPRING_ENTRANCE}\n          className=\"overflow-x-auto\"\n        >\n          {grid}\n        </AnimatedHeight>\n      ) : (\n        grid\n      )}\n    </div>\n  );\n}\n\n/**\n * The sort cue beside a sortable header: the two-way glyph at rest (shown\n * on hover and focus, so a header reads as plain text until it matters), a\n * chevron pointing the way once the column is sorted.\n */\nfunction SortIndicator({ sorted }: { sorted: false | \"asc\" | \"desc\" }) {\n  return (\n    <span\n      aria-hidden\n      className={cn(\n        \"inline-flex shrink-0 [&>svg]:size-3.5\",\n        !sorted &&\n          \"opacity-0 transition-opacity group-hover/sort:opacity-100 group-focus-visible/sort:opacity-100\",\n      )}\n    >\n      {sorted === \"asc\" ? (\n        <IconChevronUp />\n      ) : sorted === \"desc\" ? (\n        <IconChevronDown />\n      ) : (\n        <IconSelector />\n      )}\n    </span>\n  );\n}\n\nexport { DataTable, DATA_TABLE_SURFACE };\n"],"x_google_ignoreList":[0],"mappings":"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"}

package/dist/chunks/{description-list-C-mwe4ki.js → description-list-8qm83WZB.js}

@@ -1,47 +1,47 @@
 "use client";
-import { t as s } from "./cn-ChIgwEl3.js";
-import { n as y } from "./copy-button-B_B15mEi.js";
-import { createContext as N, useContext as w } from "react";
+import { t as a } from "./cn-ChIgwEl3.js";
+import { n as w } from "./copy-button-D8XyP0oR.js";
+import { createContext as y, useContext as N } from "react";
 import { Fragment as v, jsx as t, jsxs as m } from "react/jsx-runtime";
-var p = N("inline"), b = {
+var p = y("inline"), b = {
   1: "",
   2: "sm:grid-cols-2",
   3: "sm:grid-cols-3"
 };
-function C({ layout: e = "inline", columns: n = 1, className: r, ...a }) {
+function C({ layout: e = "inline", columns: n = 1, className: r, ...s }) {
   return /* @__PURE__ */ t(p.Provider, {
     value: e,
     children: /* @__PURE__ */ t("dl", {
       "data-description-list": e,
-      className: s("m-0 grid min-w-0", e === "inline" ? "grid-cols-[auto_minmax(0,1fr)] gap-x-6" : s("gap-x-6 gap-y-3", b[n]), r),
-      ...a
+      className: a("m-0 grid min-w-0", e === "inline" ? "grid-cols-[minmax(0,auto)_minmax(0,1fr)] gap-x-6" : a("gap-x-6 gap-y-3", b[n]), r),
+      ...s
     })
   });
 }
-function L({ label: e, value: n, children: r, mono: a, copy: o, optional: d, empty: x = "Not set", className: g, ...u }) {
-  const f = w(p), i = r ?? n, l = i == null || i === "" || i === !1, c = typeof o == "string" ? o : o && typeof n == "string" ? n : null, h = typeof e == "string" ? e.toLowerCase() : "value";
+function L({ label: e, value: n, children: r, mono: s, copy: o, optional: d, empty: x = "Not set", className: f, ...g }) {
+  const h = N(p), i = r ?? n, l = i == null || i === "" || i === !1, c = typeof o == "string" ? o : o && typeof n == "string" ? n : null, u = typeof e == "string" ? e.toLowerCase() : "value";
   return /* @__PURE__ */ m("div", {
     "data-description-item": "",
     "data-empty": l || void 0,
-    className: s("min-w-0", f === "inline" ? "col-span-2 grid grid-cols-subgrid items-baseline py-1" : "flex flex-col gap-0.5", g),
-    ...u,
+    className: a("min-w-0", h === "inline" ? "col-span-2 grid grid-cols-subgrid items-baseline py-1" : "flex flex-col gap-0.5", f),
+    ...g,
     children: [/* @__PURE__ */ m("dt", {
-      className: "text-pho-description min-w-0 text-base",
+      className: "text-pho-description min-w-0 text-base [overflow-wrap:anywhere]",
       children: [e, d ? /* @__PURE__ */ t("span", {
         className: "text-pho-placeholder",
         children: " (Optional)"
       }) : null]
     }), /* @__PURE__ */ t("dd", {
-      className: s("m-0 flex min-w-0 items-center gap-1", l ? "text-pho-placeholder text-base" : a ? "text-pho-primary font-mono text-xs" : "text-pho-primary text-base"),
+      className: a("m-0 flex min-w-0 items-center gap-1", l ? "text-pho-placeholder text-base" : s ? "text-pho-primary font-mono text-xs" : "text-pho-primary text-base"),
       children: l ? /* @__PURE__ */ t("span", {
         className: "truncate",
         children: x
       }) : /* @__PURE__ */ m(v, { children: [/* @__PURE__ */ t("span", {
-        className: s("min-w-0", a ? "truncate" : "[overflow-wrap:anywhere]"),
+        className: a("min-w-0", s ? "truncate" : "[overflow-wrap:anywhere]"),
         children: i
-      }), c != null && c !== "" ? /* @__PURE__ */ t(y, {
+      }), c != null && c !== "" ? /* @__PURE__ */ t(w, {
         value: c,
-        label: h,
+        label: u,
         size: "xs",
         className: "-my-1"
       }) : null] })
@@ -56,4 +56,4 @@ export {
   B as t
 };
 
-//# sourceMappingURL=description-list-C-mwe4ki.js.map
+//# sourceMappingURL=description-list-8qm83WZB.js.map

package/dist/chunks/description-list-8qm83WZB.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"description-list-8qm83WZB.js","names":[],"sources":["../../src/components/description-list/description-list.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  type ComponentProps,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { CopyButton } from \"../copy-button\";\nimport { cn } from \"../../utils/cn\";\n\n/**\n * Description List — the facts about one record, label beside value:\n * the status, the request id, the time, the ip, the api version, the\n * idempotency key, the api key. A `<dl>` under the hood.\n *\n * Where `BasicPage.Row` is a 68px row built for a control on its right,\n * these are dense lines of text: `inline` puts the label in a column\n * beside the value, every label the same width (a subgrid), one line per\n * fact; `stacked` puts the label above the value and flows the pairs\n * into `columns`. A `mono` value wears the mono face with a copy\n * control after it; a value that is not there says so in muted ink.\n */\n\nexport type DescriptionListLayout = \"inline\" | \"stacked\";\n\nconst LayoutContext = createContext<DescriptionListLayout>(\"inline\");\n\nexport interface DescriptionListRootProps extends ComponentProps<\"dl\"> {\n  /**\n   * `inline` (default): label column beside the value column, one line\n   * per item. `stacked`: label above value, pairs flowing into `columns`.\n   */\n  layout?: DescriptionListLayout;\n  /** For `stacked`: pairs per row from `sm` up. @default 1 */\n  columns?: 1 | 2 | 3;\n  ref?: Ref<HTMLDListElement>;\n}\n\nconst COLUMNS: Record<1 | 2 | 3, string> = {\n  1: \"\",\n  2: \"sm:grid-cols-2\",\n  3: \"sm:grid-cols-3\",\n};\n\nfunction Root({\n  layout = \"inline\",\n  columns = 1,\n  className,\n  ...props\n}: DescriptionListRootProps) {\n  return (\n    <LayoutContext.Provider value={layout}>\n      <dl\n        data-description-list={layout}\n        className={cn(\n          \"m-0 grid min-w-0\",\n          layout === \"inline\"\n            ? \"grid-cols-[minmax(0,auto)_minmax(0,1fr)] gap-x-6\"\n            : cn(\"gap-x-6 gap-y-3\", COLUMNS[columns]),\n          className,\n        )}\n        {...props}\n      />\n    </LayoutContext.Provider>\n  );\n}\n\nexport interface DescriptionListItemProps extends Omit<\n  ComponentProps<\"div\">,\n  \"children\" | \"title\"\n> {\n  /** The fact's name — \"Request ID\", \"Idempotency key\". */\n  label: ReactNode;\n  /** The fact. A string wears the item's type; a node is yours to style. */\n  value?: ReactNode;\n  /** Composed content instead of `value` — a `Badge`, a link. */\n  children?: ReactNode;\n  /** The value in the mono face — ids, keys, addresses. */\n  mono?: boolean;\n  /**\n   * A copy control after the value. `true` copies a string `value`;\n   * pass the text to copy when the value is composed.\n   */\n  copy?: boolean | string;\n  /** Marks the label `(Optional)` — a fact that may not be there. */\n  optional?: boolean;\n  /** What an absent value says. @default \"Not set\" */\n  empty?: ReactNode;\n  ref?: Ref<HTMLDivElement>;\n}\n\nfunction Item({\n  label,\n  value,\n  children,\n  mono,\n  copy,\n  optional,\n  empty = \"Not set\",\n  className,\n  ...props\n}: DescriptionListItemProps) {\n  const layout = useContext(LayoutContext);\n  const content = children ?? value;\n  const absent = content == null || content === \"\" || content === false;\n  const copyText =\n    typeof copy === \"string\"\n      ? copy\n      : copy && typeof value === \"string\"\n        ? value\n        : null;\n  const copyLabel = typeof label === \"string\" ? label.toLowerCase() : \"value\";\n  return (\n    <div\n      data-description-item=\"\"\n      data-empty={absent || undefined}\n      className={cn(\n        \"min-w-0\",\n        layout === \"inline\"\n          ? \"col-span-2 grid grid-cols-subgrid items-baseline py-1\"\n          : \"flex flex-col gap-0.5\",\n        className,\n      )}\n      {...props}\n    >\n      <dt className=\"text-pho-description min-w-0 text-base [overflow-wrap:anywhere]\">\n        {label}\n        {optional ? (\n          <span className=\"text-pho-placeholder\"> (Optional)</span>\n        ) : null}\n      </dt>\n      <dd\n        className={cn(\n          \"m-0 flex min-w-0 items-center gap-1\",\n          absent\n            ? \"text-pho-placeholder text-base\"\n            : mono\n              ? \"text-pho-primary font-mono text-xs\"\n              : \"text-pho-primary text-base\",\n        )}\n      >\n        {absent ? (\n          <span className=\"truncate\">{empty}</span>\n        ) : (\n          <>\n            {/* An id keeps its line and truncates; prose wraps. */}\n            <span\n              className={cn(\n                \"min-w-0\",\n                mono ? \"truncate\" : \"[overflow-wrap:anywhere]\",\n              )}\n            >\n              {content}\n            </span>\n            {copyText != null && copyText !== \"\" ? (\n              <CopyButton\n                value={copyText}\n                label={copyLabel}\n                size=\"xs\"\n                className=\"-my-1\"\n              />\n            ) : null}\n          </>\n        )}\n      </dd>\n    </div>\n  );\n}\n\n/**\n * ```tsx\n * <DescriptionList.Root>\n *   <DescriptionList.Item label=\"Status\"><Badge …/></DescriptionList.Item>\n *   <DescriptionList.Item label=\"Request ID\" value=\"pho_req_…\" mono copy />\n *   <DescriptionList.Item label=\"Idempotency key\" optional mono copy />\n * </DescriptionList.Root>\n * ```\n */\nexport const DescriptionList = { Root, Item };\n"],"mappings":";;;;;AAyBA,IAAM,IAAgB,EAAqC,QAAQ,GAa7D,IAAqC;AAAA,EACzC,GAAG;AAAA,EACH,GAAG;AAAA,EACH,GAAG;AACL;AAEA,SAAS,EAAK,EACZ,QAAA,IAAS,UACT,SAAA,IAAU,GACV,WAAA,GACA,GAAG,EAAA,GACwB;AAC3B,SACE,gBAAA,EAAC,EAAc,UAAf;AAAA,IAAwB,OAAO;AAAA,IAC7B,UAAA,gBAAA,EAAC,MAAD;AAAA,MACE,yBAAuB;AAAA,MACvB,WAAW,EACT,oBACA,MAAW,WACP,qDACA,EAAG,mBAAmB,EAAQ,CAAA,CAAQ,GAC1C,CACF;AAAA,MACA,GAAI;AAAA,IACL,CAAA;AAAA,EACqB,CAAA;AAE5B;AA0BA,SAAS,EAAK,EACZ,OAAA,GACA,OAAA,GACA,UAAA,GACA,MAAA,GACA,MAAA,GACA,UAAA,GACA,OAAA,IAAQ,WACR,WAAA,GACA,GAAG,EAAA,GACwB;AAC3B,QAAM,IAAS,EAAW,CAAa,GACjC,IAAU,KAAY,GACtB,IAAS,KAAW,QAAQ,MAAY,MAAM,MAAY,IAC1D,IACJ,OAAO,KAAS,WACZ,IACA,KAAQ,OAAO,KAAU,WACvB,IACA,MACF,IAAY,OAAO,KAAU,WAAW,EAAM,YAAY,IAAI;AACpE,SACE,gBAAA,EAAC,OAAD;AAAA,IACE,yBAAsB;AAAA,IACtB,cAAY,KAAU;AAAA,IACtB,WAAW,EACT,WACA,MAAW,WACP,0DACA,yBACJ,CACF;AAAA,IACA,GAAI;AAAA,IAVN,UAAA,CAYE,gBAAA,EAAC,MAAD;AAAA,MAAI,WAAU;AAAA,MAAd,UAAA,CACG,GACA,IACC,gBAAA,EAAC,QAAD;AAAA,QAAM,WAAU;AAAA,QAAuB,UAAA;AAAA,MAAiB,CAAA,IACtD,IACF;AAAA,IACJ,CAAA,GAAA,gBAAA,EAAC,MAAD;AAAA,MACE,WAAW,EACT,uCACA,IACI,mCACA,IACE,uCACA,4BACR;AAAA,MAEC,UAAA,IACC,gBAAA,EAAC,QAAD;AAAA,QAAM,WAAU;AAAA,QAAY,UAAA;AAAA,MAAY,CAAA,IAExC,gBAAA,EAAA,GAAA,EAAA,UAAA,CAEE,gBAAA,EAAC,QAAD;AAAA,QACE,WAAW,EACT,WACA,IAAO,aAAa,0BACtB;AAAA,QAEC,UAAA;AAAA,MACG,CAAA,GACL,KAAY,QAAQ,MAAa,KAChC,gBAAA,EAAC,GAAD;AAAA,QACE,OAAO;AAAA,QACP,OAAO;AAAA,QACP,MAAK;AAAA,QACL,WAAU;AAAA,MACX,CAAA,IACC,IACJ,EAAA,CAAA;AAAA,IAEF,CAAA,CACD;AAAA;AAET;AAWA,IAAa,IAAkB;AAAA,EAAE,MAAA;AAAA,EAAM,MAAA;AAAK"}