@eifi1/ui-kit 0.51.3 → 0.51.5

package/dist/components/tree-view.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/tree-view.tsx"],"sourcesContent":["import { useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithRef, KeyboardEvent, MouseEvent, ReactNode } from \"react\";\nimport { ChevronRight } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { horizontalStep } from \"../lib/direction\";\nimport { Spinner } from \"./spinner\";\nimport { FOCUS_RING } from \"./focus-ring\";\n\n/**\n * A hierarchy you walk with the keyboard: kastlan's chart of accounts (Assets › Current\n * assets › Bank › 1020 Operating account), and — through {@link TreeRow} alone — the\n * row labels of its gantt, which indent and fold like a tree but sit beside a timeline\n * and so cannot be one.\n *\n * Both apps had written it as nested `<div>`s with a chevron button per row: every\n * row a Tab stop (a 300-account chart was 300 presses to get past), no way to say\n * \"level 3 of 5, collapsed\" to a screen reader, and no ←/→ at all. This is the WAI-ARIA\n * tree pattern instead:\n *\n *  - `role=\"tree\"` › `treeitem` (with `aria-level`, `aria-expanded` on a parent,\n *    `aria-selected` when selectable) › `role=\"group\"` for its children — so the\n *    reader announces the position and the state it needs.\n *  - ONE Tab stop (roving tabindex). ↑/↓ walk the visible rows, → opens a closed\n *    parent and then steps into it, ← closes an open one and then steps out to the\n *    parent, Home/End jump to the ends, `*` opens every sibling, and typing a few\n *    letters jumps to the next row that starts with them. ←/→ follow the reading\n *    direction (`horizontalStep`): in an RTL tree the children hang off to the left,\n *    and ← is what opens them.\n *  - Enter / Space, or a click, select. The chevron alone toggles on click.\n *\n * `expanded` and `selected` each work controlled or uncontrolled.\n */\n\n/* ── Nodes ───────────────────────────────────────────────────────────────── */\n\nexport interface TreeNode<T = unknown> {\n  /** Unique across the whole tree — it is what `expanded` and `selected` hold. */\n  id: string;\n  label: ReactNode;\n  /** The text type-ahead matches. Defaults to the row's rendered text. */\n  textValue?: string;\n  /** Before the label: an account-type icon, a colour dot. */\n  icon?: ReactNode;\n  /** After the label, pushed to the end of the row: a balance, a count, an action. */\n  trailing?: ReactNode;\n  children?: readonly TreeNode<T>[];\n  /**\n   * The node has children that are not loaded yet — it gets a chevron, and opening it\n   * calls `loadChildren`. Pass the children in `items` once they arrive.\n   */\n  hasChildren?: boolean;\n  /** Focusable and announced as unavailable (`aria-disabled`), but not selectable. */\n  disabled?: boolean;\n  /** Anything of the host's own, handed back to `renderItem` and `onSelectedChange`. */\n  data?: T;\n}\n\n/** What {@link TreeViewProps.renderItem} is told about a row. */\nexport interface TreeItemState {\n  level: number;\n  expanded: boolean;\n  selected: boolean;\n  /** It has children, loaded or not — it shows a chevron. */\n  expandable: boolean;\n  loading: boolean;\n  disabled: boolean;\n}\n\n/* ── TreeRow ─────────────────────────────────────────────────────────────── */\n\nexport interface TreeRowProps extends ComponentPropsWithRef<\"div\"> {\n  /** 1 for a top-level row. Sets the indent and the number of guides. */\n  level: number;\n  /** `true`/`false` for a row that can fold; leave it `undefined` for a leaf, which\n   *  gets a chevron-sized gap instead so labels at one level still line up. */\n  expanded?: boolean;\n  /**\n   * Make the chevron a real button (with `aria-expanded`, named by the label) that\n   * calls this. For a row used ON ITS OWN — kastlan's gantt labels, where each row is\n   * a line of a timeline and not an item of a tree widget. Inside {@link TreeView} it\n   * is omitted: the tree owns the keys, and a button per row would be a Tab stop per\n   * row, which is what the tree exists to remove.\n   */\n  onToggle?: () => void;\n  /** The toggle button's name. By default it is named by the row's label (the state\n   *  is `aria-expanded`'s to say); required when `children` replaces the label. */\n  toggleLabel?: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  trailing?: ReactNode;\n  /** Pixels per level. Default 16. */\n  indent?: number;\n  /** Draw a vertical hairline per ancestor level. Default `true`. */\n  guides?: boolean;\n  selected?: boolean;\n  /** A spinner in place of the chevron, while lazy children load. */\n  loading?: boolean;\n  /** Replace the label + trailing part of the row (the indent and chevron stay). */\n  children?: ReactNode;\n}\n\nconst DEFAULT_INDENT = 16;\n/** The chevron's box; the guide for a level runs through its centre. */\nconst CHEVRON = 16;\n/** The row's start padding, before any indent. */\nconst ROW_PAD = 4;\n\n/**\n * One row: indent, guides, chevron, icon, label, trailing — no tree semantics of its\n * own. {@link TreeView} is built from it, and a host that needs the look without the\n * widget (a gantt's label column) uses it directly.\n *\n * Laid out with logical properties throughout (`padding-inline-start`,\n * `inset-inline-start`), so the indent, the guides and the chevron all hang from the\n * reading start in an RTL layout without a second code path.\n */\nexport function TreeRow({\n  level,\n  expanded,\n  onToggle,\n  toggleLabel,\n  label,\n  icon,\n  trailing,\n  indent = DEFAULT_INDENT,\n  guides = true,\n  selected,\n  loading,\n  children,\n  className,\n  style,\n  ...rest\n}: TreeRowProps) {\n  const labelId = useId();\n  const depth = Math.max(0, level - 1);\n  const expandable = expanded !== undefined;\n  // A right-pointing chevron that turns DOWN when open. In RTL it is mirrored to point\n  // left, and turning that one clockwise would point it UP — so it turns the other way.\n  const chevron = (\n    <ChevronRight\n      aria-hidden\n      className={cn(\n        \"size-4 transition-transform motion-reduce:transition-none rtl:-scale-x-100\",\n        expanded && \"rotate-90 rtl:-rotate-90\",\n      )}\n    />\n  );\n  return (\n    <div\n      {...rest}\n      data-tree-row=\"\"\n      data-selected={selected || undefined}\n      style={{ paddingInlineStart: ROW_PAD + depth * indent, ...style }}\n      className={cn(\n        \"relative flex min-h-8 items-center gap-1.5 rounded pe-2 text-sm\",\n        selected\n          ? \"bg-active font-medium text-primary\"\n          : \"text-secondary\",\n        className,\n      )}\n    >\n      {guides &&\n        Array.from({ length: depth }, (_, i) => (\n          <span\n            key={i}\n            aria-hidden\n            data-tree-guide=\"\"\n            className=\"pointer-events-none absolute inset-y-0 w-px bg-[var(--border)]\"\n            style={{ insetInlineStart: ROW_PAD + i * indent + CHEVRON / 2 }}\n          />\n        ))}\n      {loading ? (\n        <span className=\"flex size-4 shrink-0 items-center justify-center\">\n          <Spinner label={null} className=\"size-3 border\" />\n        </span>\n      ) : expandable && onToggle ? (\n        <button\n          type=\"button\"\n          aria-expanded={expanded}\n          aria-label={toggleLabel}\n          aria-labelledby={toggleLabel ? undefined : labelId}\n          onClick={(e) => {\n            e.stopPropagation();\n            onToggle();\n          }}\n          className={cn(\"flex size-4 shrink-0 items-center justify-center rounded text-muted outline-none hover:text-primary\", FOCUS_RING)}\n        >\n          {chevron}\n        </button>\n      ) : expandable ? (\n        <span data-tree-toggle=\"\" className=\"flex size-4 shrink-0 cursor-pointer items-center justify-center text-muted\">\n          {chevron}\n        </span>\n      ) : (\n        <span aria-hidden className=\"size-4 shrink-0\" />\n      )}\n      {children ?? (\n        <>\n          {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n          {/* One line at Normal; from Large up it wraps and the `min-h-8` row grows\n              (text size §10.17, round 0.34 T1: the sweep read \"1020 Operat…\"). */}\n          <span id={labelId} data-tree-label=\"\" className=\"min-w-0 flex-1 truncate-until-large\">\n            {label}\n          </span>\n          {trailing !== undefined && trailing !== null && (\n            <span className=\"ms-auto flex shrink-0 items-center gap-1 text-xs tabular-nums text-muted\">\n              {trailing}\n            </span>\n          )}\n        </>\n      )}\n    </div>\n  );\n}\n\n/* ── TreeView ────────────────────────────────────────────────────────────── */\n\nexport interface TreeViewProps<T = unknown>\n  extends Omit<ComponentPropsWithRef<\"ul\">, \"onSelect\" | \"children\" | \"defaultValue\"> {\n  items: readonly TreeNode<T>[];\n  /** Open nodes, controlled. */\n  expanded?: readonly string[];\n  /** Open nodes on first render, uncontrolled. */\n  defaultExpanded?: readonly string[];\n  onExpandedChange?: (expanded: string[]) => void;\n  /** The selected node's id, controlled; `null` for none. */\n  selected?: string | null;\n  defaultSelected?: string | null;\n  onSelectedChange?: (id: string, node: TreeNode<T>) => void;\n  /** `\"none\"` makes it a navigation-only tree: no `aria-selected`, Enter toggles. */\n  selectionMode?: \"single\" | \"none\";\n  /** The whole row content after the chevron, per node. Wins over `label`/`trailing`. */\n  renderItem?: (node: TreeNode<T>, state: TreeItemState) => ReactNode;\n  /**\n   * Called when a node with `hasChildren` and no `children` is opened. While the\n   * promise is pending the row shows a spinner and is `aria-busy`; put the children\n   * into `items` before it resolves (or after — the row opens either way).\n   */\n  loadChildren?: (node: TreeNode<T>) => Promise<void> | void;\n  /** Pixels per level. Default 16. */\n  indent?: number;\n  /** Vertical hairlines per level. Default `true`. */\n  indentGuides?: boolean;\n  /** Extra classes for each row (the `TreeRow`), e.g. a denser height. */\n  rowClassName?: string;\n}\n\ninterface FlatNode<T> {\n  node: TreeNode<T>;\n  level: number;\n  parentId: string | null;\n}\n\nconst isExpandable = (n: TreeNode<unknown>) => Boolean(n.children?.length || n.hasChildren);\n\n/** Controlled when `value` is given, otherwise state seeded from `initial`. */\nfunction useControllable<V>(value: V | undefined, initial: V): [V, (next: V) => void] {\n  const [own, setOwn] = useState<V>(initial);\n  const controlled = value !== undefined;\n  const set = (next: V) => {\n    if (!controlled) setOwn(next);\n  };\n  return [controlled ? value : own, set];\n}\n\n/** How long a type-ahead run stays open between keys — the APG's suggested half second. */\nconst TYPEAHEAD_MS = 500;\n\nexport function TreeView<T = unknown>({\n  items,\n  expanded: expandedProp,\n  defaultExpanded,\n  onExpandedChange,\n  selected: selectedProp,\n  defaultSelected,\n  onSelectedChange,\n  selectionMode = \"single\",\n  renderItem,\n  loadChildren,\n  indent = DEFAULT_INDENT,\n  indentGuides = true,\n  rowClassName,\n  className,\n  onKeyDown,\n  onClick,\n  ...rest\n}: TreeViewProps<T>) {\n  const [expandedList, setExpandedOwn] = useControllable<readonly string[]>(\n    expandedProp,\n    defaultExpanded ?? [],\n  );\n  const [selected, setSelectedOwn] = useControllable<string | null>(\n    selectedProp,\n    defaultSelected ?? null,\n  );\n  const expandedSet = useMemo(() => new Set(expandedList), [expandedList]);\n  const [loading, setLoading] = useState<ReadonlySet<string>>(() => new Set());\n  const [focusedId, setFocusedId] = useState<string | null>(null);\n  const itemRefs = useRef(new Map<string, HTMLLIElement>());\n  const pendingFocus = useRef<string | null>(null);\n  const typeahead = useRef({ text: \"\", at: 0 });\n  const baseId = useId();\n\n  // Every node by id (for parents and lookups), and the rows currently on screen in\n  // order — the list the arrow keys walk.\n  const { byId, visible } = useMemo(() => {\n    const map = new Map<string, FlatNode<T>>();\n    const rows: FlatNode<T>[] = [];\n    const walk = (nodes: readonly TreeNode<T>[], level: number, parentId: string | null, shown: boolean) => {\n      for (const node of nodes) {\n        const flat = { node, level, parentId };\n        map.set(node.id, flat);\n        if (shown) rows.push(flat);\n        if (node.children) walk(node.children, level + 1, node.id, shown && expandedSet.has(node.id));\n      }\n    };\n    walk(items, 1, null, true);\n    return { byId: map, visible: rows };\n  }, [items, expandedSet]);\n\n  // The one tabbable row. Focus that was inside a branch that has since closed (a\n  // click on its parent's chevron) moves up to the nearest ancestor still on screen,\n  // so the tab stop never points at a row that is not rendered.\n  const visibleIds = useMemo(() => new Set(visible.map((f) => f.node.id)), [visible]);\n  const nearestVisible = (id: string | null): string | null => {\n    let cur = id;\n    while (cur && !visibleIds.has(cur)) cur = byId.get(cur)?.parentId ?? null;\n    return cur;\n  };\n  const tabbable =\n    nearestVisible(focusedId) ?? nearestVisible(selected) ?? visible[0]?.node.id ?? null;\n\n  useEffect(() => {\n    const id = pendingFocus.current;\n    if (!id) return;\n    pendingFocus.current = null;\n    itemRefs.current.get(id)?.focus();\n  });\n\n  const focusRow = (id: string) => {\n    setFocusedId(id);\n    // After the commit: moving into a branch that just opened targets a row that is\n    // not in the DOM yet.\n    pendingFocus.current = id;\n    itemRefs.current.get(id)?.focus();\n  };\n\n  const setExpanded = (next: Set<string>) => {\n    const list = [...next];\n    setExpandedOwn(list);\n    onExpandedChange?.(list);\n  };\n\n  const open = (node: TreeNode<T>) => {\n    if (expandedSet.has(node.id) || !isExpandable(node)) return;\n    const next = new Set(expandedSet);\n    next.add(node.id);\n    setExpanded(next);\n    if (loadChildren && node.hasChildren && !node.children?.length) {\n      const pending = loadChildren(node);\n      if (pending && typeof pending.then === \"function\") {\n        setLoading((s) => new Set(s).add(node.id));\n        const done = () =>\n          setLoading((s) => {\n            const n = new Set(s);\n            n.delete(node.id);\n            return n;\n          });\n        pending.then(done, done);\n      }\n    }\n  };\n\n  const close = (node: TreeNode<T>) => {\n    if (!expandedSet.has(node.id)) return;\n    const next = new Set(expandedSet);\n    next.delete(node.id);\n    setExpanded(next);\n  };\n\n  const toggle = (node: TreeNode<T>) => (expandedSet.has(node.id) ? close(node) : open(node));\n\n  const select = (node: TreeNode<T>) => {\n    if (node.disabled) return;\n    if (selectionMode === \"none\") {\n      toggle(node);\n      return;\n    }\n    setSelectedOwn(node.id);\n    onSelectedChange?.(node.id, node);\n  };\n\n  const idOf = (target: EventTarget | null): string | null =>\n    (target as Element | null)?.closest?.<HTMLElement>('[role=\"treeitem\"]')?.dataset.treeId ?? null;\n\n  const textOf = (flat: FlatNode<T>): string => {\n    if (flat.node.textValue !== undefined) return flat.node.textValue;\n    if (typeof flat.node.label === \"string\") return flat.node.label;\n    const row = itemRefs.current.get(flat.node.id)?.querySelector(\"[data-tree-row]\");\n    return row?.textContent ?? \"\";\n  };\n\n  const findByText = (fromIndex: number, text: string): string | null => {\n    const needle = text.toLocaleLowerCase();\n    for (let i = 1; i <= visible.length; i++) {\n      const flat = visible[(fromIndex + i) % visible.length];\n      if (textOf(flat).trim().toLocaleLowerCase().startsWith(needle)) return flat.node.id;\n    }\n    return null;\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLUListElement>) => {\n    onKeyDown?.(e);\n    if (e.defaultPrevented) return;\n    const id = idOf(e.target);\n    const flat = id ? byId.get(id) : undefined;\n    if (!flat) return;\n    const { node } = flat;\n    const index = visible.findIndex((f) => f.node.id === node.id);\n    const expandedNow = expandedSet.has(node.id);\n    // Forward / backward along the reading direction, from the row itself.\n    const step = horizontalStep(e.key, e.target as Element);\n    // A space inside a type-ahead run is part of the name being typed (\"current a…\"),\n    // not a request to select.\n    const inRun = Date.now() - typeahead.current.at < TYPEAHEAD_MS && typeahead.current.text !== \"\";\n    const key = e.key === \" \" && inRun ? \"typeahead\" : e.key;\n\n    let handled = true;\n    if (step === 1) {\n      if (!isExpandable(node)) handled = false;\n      else if (!expandedNow) open(node);\n      else if (node.children?.length) focusRow(node.children[0].id);\n    } else if (step === -1) {\n      if (expandedNow) close(node);\n      else if (flat.parentId) focusRow(flat.parentId);\n      else handled = false;\n    } else {\n      switch (key) {\n        case \"ArrowDown\":\n          if (index < visible.length - 1) focusRow(visible[index + 1].node.id);\n          break;\n        case \"ArrowUp\":\n          if (index > 0) focusRow(visible[index - 1].node.id);\n          break;\n        case \"Home\":\n          if (visible.length) focusRow(visible[0].node.id);\n          break;\n        case \"End\":\n          if (visible.length) focusRow(visible[visible.length - 1].node.id);\n          break;\n        case \"Enter\":\n        case \" \":\n          select(node);\n          break;\n        case \"*\": {\n          // Every sibling at this level, as the pattern suggests.\n          const siblings = flat.parentId ? (byId.get(flat.parentId)?.node.children ?? []) : items;\n          const next = new Set(expandedSet);\n          for (const s of siblings) if (isExpandable(s)) next.add(s.id);\n          setExpanded(next);\n          break;\n        }\n        default: {\n          const printable = e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey;\n          if (!printable) {\n            handled = false;\n            break;\n          }\n          const now = Date.now();\n          const run = now - typeahead.current.at < TYPEAHEAD_MS ? typeahead.current.text : \"\";\n          typeahead.current = { text: run + e.key, at: now };\n          const typed = typeahead.current.text;\n          // \"aaa\" cycles through the rows starting with \"a\", as a file list does;\n          // anything else extends the prefix, searched from the row after this one\n          // (or from this one, when it still matches the longer prefix).\n          const repeated = typed.length > 1 && [...typed].every((c) => c === typed[0]);\n          const target = repeated\n            ? findByText(index, typed[0])\n            : typed.length > 1 && textOf(flat).trim().toLocaleLowerCase().startsWith(typed.toLocaleLowerCase())\n              ? node.id\n              : findByText(index, typed);\n          if (target) focusRow(target);\n        }\n      }\n    }\n    if (handled) {\n      e.preventDefault();\n      e.stopPropagation();\n    }\n  };\n\n  const handleClick = (e: MouseEvent<HTMLUListElement>) => {\n    onClick?.(e);\n    const id = idOf(e.target);\n    const flat = id ? byId.get(id) : undefined;\n    if (!flat) return;\n    // Controls a host rendered into a row (an action in `trailing`) are their own.\n    const control = (e.target as Element).closest(\"button, a[href], input, select, textarea\");\n    if (control && itemRefs.current.get(flat.node.id)?.contains(control)) return;\n    setFocusedId(flat.node.id);\n    if ((e.target as Element).closest(\"[data-tree-toggle]\")) {\n      toggle(flat.node);\n      return;\n    }\n    select(flat.node);\n  };\n\n  const renderNodes = (nodes: readonly TreeNode<T>[], level: number, path: string): ReactNode =>\n    nodes.map((node, i) => {\n      // Named by its own row, not by its content: a treeitem's content is the whole\n      // open branch below it, and \"Assets Current assets 1020 Bank …\" is not a name.\n      // A path of indices, because a host's id may hold spaces an idref cannot.\n      const rowId = `${baseId}-${path}${i}`;\n      const expandable = isExpandable(node);\n      const isOpen = expandable && expandedSet.has(node.id);\n      const isSelected = selectionMode !== \"none\" && selected === node.id;\n      const isLoading = loading.has(node.id);\n      const state: TreeItemState = {\n        level,\n        expanded: isOpen,\n        selected: isSelected,\n        expandable,\n        loading: isLoading,\n        disabled: Boolean(node.disabled),\n      };\n      return (\n        <li\n          key={node.id}\n          ref={(el) => {\n            if (el) itemRefs.current.set(node.id, el);\n            else itemRefs.current.delete(node.id);\n          }}\n          role=\"treeitem\"\n          data-tree-id={node.id}\n          aria-labelledby={rowId}\n          aria-level={level}\n          aria-expanded={expandable ? isOpen : undefined}\n          aria-selected={selectionMode === \"none\" ? undefined : isSelected}\n          aria-disabled={node.disabled || undefined}\n          aria-busy={isLoading || undefined}\n          tabIndex={node.id === tabbable ? 0 : -1}\n          onFocus={(e) => {\n            // Only the row itself: a focus event bubbling up from a nested row, or from\n            // a control inside this one, is not this row being focused.\n            if (e.target === e.currentTarget) setFocusedId(node.id);\n          }}\n          // The ring goes on this row's own box, not the <li>: the <li> contains the\n          // whole open branch below it, and ringing that would outline a subtree.\n          className=\"outline-none [&:focus-visible>[data-tree-row]]:ring-focus [&:focus-visible>[data-tree-row]]:ring-brand\"\n        >\n          <TreeRow\n            id={rowId}\n            level={level}\n            expanded={expandable ? isOpen : undefined}\n            label={node.label}\n            icon={node.icon}\n            trailing={node.trailing}\n            indent={indent}\n            guides={indentGuides}\n            selected={isSelected}\n            loading={isLoading}\n            className={cn(\n              node.disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer hover:bg-hover\",\n              rowClassName,\n            )}\n          >\n            {renderItem ? renderItem(node, state) : undefined}\n          </TreeRow>\n          {isOpen && (\n            <ul role=\"group\">\n              {/* Empty while lazy children load: a \"Loading…\" line in here would be\n                  a child that is not a treeitem, and the parent row already says\n                  `aria-busy` and shows the spinner. */}\n              {node.children?.length ? renderNodes(node.children, level + 1, `${path}${i}-`) : null}\n            </ul>\n          )}\n        </li>\n      );\n    });\n\n  return (\n    <ul\n      {...rest}\n      role=\"tree\"\n      onKeyDown={handleKeyDown}\n      onClick={handleClick}\n      className={cn(\"flex flex-col text-sm\", className)}\n    >\n      {renderNodes(items, 1, \"\")}\n    </ul>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/tree-view.tsx"],"sourcesContent":["import { useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithRef, KeyboardEvent, MouseEvent, ReactNode } from \"react\";\nimport { ChevronRight } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { horizontalStep } from \"../lib/direction\";\nimport { Spinner } from \"./spinner\";\nimport { FOCUS_RING } from \"./focus-ring\";\n\n/**\n * A hierarchy you walk with the keyboard: kastlan's chart of accounts (Assets › Current\n * assets › Bank › 1020 Operating account), and — through {@link TreeRow} alone — the\n * row labels of its gantt, which indent and fold like a tree but sit beside a timeline\n * and so cannot be one.\n *\n * Both apps had written it as nested `<div>`s with a chevron button per row: every\n * row a Tab stop (a 300-account chart was 300 presses to get past), no way to say\n * \"level 3 of 5, collapsed\" to a screen reader, and no ←/→ at all. This is the WAI-ARIA\n * tree pattern instead:\n *\n *  - `role=\"tree\"` › `treeitem` (with `aria-level`, `aria-expanded` on a parent,\n *    `aria-selected` when selectable) › `role=\"group\"` for its children — so the\n *    reader announces the position and the state it needs.\n *  - ONE Tab stop (roving tabindex). ↑/↓ walk the visible rows, → opens a closed\n *    parent and then steps into it, ← closes an open one and then steps out to the\n *    parent, Home/End jump to the ends, `*` opens every sibling, and typing a few\n *    letters jumps to the next row that starts with them. ←/→ follow the reading\n *    direction (`horizontalStep`): in an RTL tree the children hang off to the left,\n *    and ← is what opens them.\n *  - Enter / Space, or a click, select. The chevron alone toggles on click.\n *\n * `expanded` and `selected` each work controlled or uncontrolled.\n */\n\n/* ── Nodes ───────────────────────────────────────────────────────────────── */\n\nexport interface TreeNode<T = unknown> {\n  /** Unique across the whole tree — it is what `expanded` and `selected` hold. */\n  id: string;\n  label: ReactNode;\n  /** The text type-ahead matches. Defaults to the row's rendered text. */\n  textValue?: string;\n  /** Before the label: an account-type icon, a colour dot. */\n  icon?: ReactNode;\n  /** After the label, pushed to the end of the row: a balance, a count, an action. */\n  trailing?: ReactNode;\n  children?: readonly TreeNode<T>[];\n  /**\n   * The node has children that are not loaded yet — it gets a chevron, and opening it\n   * calls `loadChildren`. Pass the children in `items` once they arrive.\n   */\n  hasChildren?: boolean;\n  /** Focusable and announced as unavailable (`aria-disabled`), but not selectable. */\n  disabled?: boolean;\n  /** Anything of the host's own, handed back to `renderItem` and `onSelectedChange`. */\n  data?: T;\n}\n\n/** What {@link TreeViewProps.renderItem} is told about a row. */\nexport interface TreeItemState {\n  level: number;\n  expanded: boolean;\n  selected: boolean;\n  /** It has children, loaded or not — it shows a chevron. */\n  expandable: boolean;\n  loading: boolean;\n  disabled: boolean;\n}\n\n/* ── TreeRow ─────────────────────────────────────────────────────────────── */\n\nexport interface TreeRowProps extends ComponentPropsWithRef<\"div\"> {\n  /** 1 for a top-level row. Sets the indent and the number of guides. */\n  level: number;\n  /** `true`/`false` for a row that can fold; leave it `undefined` for a leaf, which\n   *  gets a chevron-sized gap instead so labels at one level still line up. */\n  expanded?: boolean;\n  /**\n   * Make the chevron a real button (with `aria-expanded`, named by the label) that\n   * calls this. For a row used ON ITS OWN — kastlan's gantt labels, where each row is\n   * a line of a timeline and not an item of a tree widget. Inside {@link TreeView} it\n   * is omitted: the tree owns the keys, and a button per row would be a Tab stop per\n   * row, which is what the tree exists to remove.\n   */\n  onToggle?: () => void;\n  /** The toggle button's name. By default it is named by the row's label (the state\n   *  is `aria-expanded`'s to say); required when `children` replaces the label. */\n  toggleLabel?: string;\n  label: ReactNode;\n  icon?: ReactNode;\n  trailing?: ReactNode;\n  /** Pixels per level. Default 16. */\n  indent?: number;\n  /** Draw a vertical hairline per ancestor level. Default `true`. */\n  guides?: boolean;\n  selected?: boolean;\n  /** A spinner in place of the chevron, while lazy children load. */\n  loading?: boolean;\n  /** Replace the label + trailing part of the row (the indent and chevron stay). */\n  children?: ReactNode;\n}\n\nconst DEFAULT_INDENT = 16;\n/** The chevron's box; the guide for a level runs through its centre. */\nconst CHEVRON = 16;\n/** The row's start padding, before any indent. */\nconst ROW_PAD = 4;\n\n/**\n * One row: indent, guides, chevron, icon, label, trailing — no tree semantics of its\n * own. {@link TreeView} is built from it, and a host that needs the look without the\n * widget (a gantt's label column) uses it directly.\n *\n * Laid out with logical properties throughout (`padding-inline-start`,\n * `inset-inline-start`), so the indent, the guides and the chevron all hang from the\n * reading start in an RTL layout without a second code path.\n */\nexport function TreeRow({\n  level,\n  expanded,\n  onToggle,\n  toggleLabel,\n  label,\n  icon,\n  trailing,\n  indent = DEFAULT_INDENT,\n  guides = true,\n  selected,\n  loading,\n  children,\n  className,\n  style,\n  ...rest\n}: TreeRowProps) {\n  const labelId = useId();\n  const depth = Math.max(0, level - 1);\n  const expandable = expanded !== undefined;\n  // A right-pointing chevron that turns DOWN when open. In RTL it is mirrored to point\n  // left, and turning that one clockwise would point it UP — so it turns the other way.\n  const chevron = (\n    <ChevronRight\n      aria-hidden\n      className={cn(\n        \"size-4 transition-transform motion-reduce:transition-none rtl:-scale-x-100\",\n        expanded && \"rotate-90 rtl:-rotate-90\",\n      )}\n    />\n  );\n  return (\n    <div\n      {...rest}\n      data-tree-row=\"\"\n      data-selected={selected || undefined}\n      style={{ paddingInlineStart: ROW_PAD + depth * indent, ...style }}\n      className={cn(\n        \"relative flex min-h-8 items-center gap-1.5 rounded pe-2 text-sm\",\n        selected ? \"bg-active font-medium text-primary\" : \"text-secondary\",\n        className,\n      )}\n    >\n      {guides &&\n        Array.from({ length: depth }, (_, i) => (\n          <span\n            key={i}\n            aria-hidden\n            data-tree-guide=\"\"\n            className=\"pointer-events-none absolute inset-y-0 w-px bg-[var(--border)]\"\n            style={{ insetInlineStart: ROW_PAD + i * indent + CHEVRON / 2 }}\n          />\n        ))}\n      {loading ? (\n        <span className=\"flex size-4 shrink-0 items-center justify-center\">\n          <Spinner label={null} className=\"size-3 border\" />\n        </span>\n      ) : expandable && onToggle ? (\n        <button\n          type=\"button\"\n          aria-expanded={expanded}\n          aria-label={toggleLabel}\n          aria-labelledby={toggleLabel ? undefined : labelId}\n          onClick={(e) => {\n            e.stopPropagation();\n            onToggle();\n          }}\n          className={cn(\n            \"flex size-4 shrink-0 items-center justify-center rounded text-muted outline-none hover:text-primary\",\n            FOCUS_RING,\n          )}\n        >\n          {chevron}\n        </button>\n      ) : expandable ? (\n        <span\n          data-tree-toggle=\"\"\n          className=\"flex size-4 shrink-0 cursor-pointer items-center justify-center text-muted\"\n        >\n          {chevron}\n        </span>\n      ) : (\n        <span aria-hidden className=\"size-4 shrink-0\" />\n      )}\n      {children ?? (\n        <>\n          {icon && <span className=\"flex shrink-0 items-center\">{icon}</span>}\n          {/* One line at Normal; from Large up it wraps and the `min-h-8` row grows\n              (text size §10.17, round 0.34 T1: the sweep read \"1020 Operat…\"). */}\n          <span id={labelId} data-tree-label=\"\" className=\"min-w-0 flex-1 truncate-until-large\">\n            {label}\n          </span>\n          {trailing !== undefined && trailing !== null && (\n            <span className=\"ms-auto flex shrink-0 items-center gap-1 text-xs tabular-nums text-muted\">{trailing}</span>\n          )}\n        </>\n      )}\n    </div>\n  );\n}\n\n/* ── TreeView ────────────────────────────────────────────────────────────── */\n\nexport interface TreeViewProps<T = unknown> extends Omit<\n  ComponentPropsWithRef<\"ul\">,\n  \"onSelect\" | \"children\" | \"defaultValue\"\n> {\n  items: readonly TreeNode<T>[];\n  /** Open nodes, controlled. */\n  expanded?: readonly string[];\n  /** Open nodes on first render, uncontrolled. */\n  defaultExpanded?: readonly string[];\n  onExpandedChange?: (expanded: string[]) => void;\n  /** The selected node's id, controlled; `null` for none. */\n  selected?: string | null;\n  defaultSelected?: string | null;\n  onSelectedChange?: (id: string, node: TreeNode<T>) => void;\n  /** `\"none\"` makes it a navigation-only tree: no `aria-selected`, Enter toggles. */\n  selectionMode?: \"single\" | \"none\";\n  /** The whole row content after the chevron, per node. Wins over `label`/`trailing`. */\n  renderItem?: (node: TreeNode<T>, state: TreeItemState) => ReactNode;\n  /**\n   * Called when a node with `hasChildren` and no `children` is opened. While the\n   * promise is pending the row shows a spinner and is `aria-busy`; put the children\n   * into `items` before it resolves (or after — the row opens either way).\n   */\n  loadChildren?: (node: TreeNode<T>) => Promise<void> | void;\n  /** Pixels per level. Default 16. */\n  indent?: number;\n  /** Vertical hairlines per level. Default `true`. */\n  indentGuides?: boolean;\n  /** Extra classes for each row (the `TreeRow`), e.g. a denser height. */\n  rowClassName?: string;\n}\n\ninterface FlatNode<T> {\n  node: TreeNode<T>;\n  level: number;\n  parentId: string | null;\n}\n\nconst isExpandable = (n: TreeNode<unknown>) => Boolean(n.children?.length || n.hasChildren);\n\n/** Controlled when `value` is given, otherwise state seeded from `initial`. */\nfunction useControllable<V>(value: V | undefined, initial: V): [V, (next: V) => void] {\n  const [own, setOwn] = useState<V>(initial);\n  const controlled = value !== undefined;\n  const set = (next: V) => {\n    if (!controlled) setOwn(next);\n  };\n  return [controlled ? value : own, set];\n}\n\n/** How long a type-ahead run stays open between keys — the APG's suggested half second. */\nconst TYPEAHEAD_MS = 500;\n\nexport function TreeView<T = unknown>({\n  items,\n  expanded: expandedProp,\n  defaultExpanded,\n  onExpandedChange,\n  selected: selectedProp,\n  defaultSelected,\n  onSelectedChange,\n  selectionMode = \"single\",\n  renderItem,\n  loadChildren,\n  indent = DEFAULT_INDENT,\n  indentGuides = true,\n  rowClassName,\n  className,\n  onKeyDown,\n  onClick,\n  ...rest\n}: TreeViewProps<T>) {\n  const [expandedList, setExpandedOwn] = useControllable<readonly string[]>(expandedProp, defaultExpanded ?? []);\n  const [selected, setSelectedOwn] = useControllable<string | null>(selectedProp, defaultSelected ?? null);\n  const expandedSet = useMemo(() => new Set(expandedList), [expandedList]);\n  const [loading, setLoading] = useState<ReadonlySet<string>>(() => new Set());\n  const [focusedId, setFocusedId] = useState<string | null>(null);\n  const itemRefs = useRef(new Map<string, HTMLLIElement>());\n  const pendingFocus = useRef<string | null>(null);\n  const typeahead = useRef({ text: \"\", at: 0 });\n  const baseId = useId();\n\n  // Every node by id (for parents and lookups), and the rows currently on screen in\n  // order — the list the arrow keys walk.\n  const { byId, visible } = useMemo(() => {\n    const map = new Map<string, FlatNode<T>>();\n    const rows: FlatNode<T>[] = [];\n    const walk = (nodes: readonly TreeNode<T>[], level: number, parentId: string | null, shown: boolean) => {\n      for (const node of nodes) {\n        const flat = { node, level, parentId };\n        map.set(node.id, flat);\n        if (shown) rows.push(flat);\n        if (node.children) walk(node.children, level + 1, node.id, shown && expandedSet.has(node.id));\n      }\n    };\n    walk(items, 1, null, true);\n    return { byId: map, visible: rows };\n  }, [items, expandedSet]);\n\n  // The one tabbable row. Focus that was inside a branch that has since closed (a\n  // click on its parent's chevron) moves up to the nearest ancestor still on screen,\n  // so the tab stop never points at a row that is not rendered.\n  const visibleIds = useMemo(() => new Set(visible.map((f) => f.node.id)), [visible]);\n  const nearestVisible = (id: string | null): string | null => {\n    let cur = id;\n    while (cur && !visibleIds.has(cur)) cur = byId.get(cur)?.parentId ?? null;\n    return cur;\n  };\n  const tabbable = nearestVisible(focusedId) ?? nearestVisible(selected) ?? visible[0]?.node.id ?? null;\n\n  useEffect(() => {\n    const id = pendingFocus.current;\n    if (!id) return;\n    pendingFocus.current = null;\n    itemRefs.current.get(id)?.focus();\n  });\n\n  const focusRow = (id: string) => {\n    setFocusedId(id);\n    // After the commit: moving into a branch that just opened targets a row that is\n    // not in the DOM yet.\n    pendingFocus.current = id;\n    itemRefs.current.get(id)?.focus();\n  };\n\n  const setExpanded = (next: Set<string>) => {\n    const list = [...next];\n    setExpandedOwn(list);\n    onExpandedChange?.(list);\n  };\n\n  const open = (node: TreeNode<T>) => {\n    if (expandedSet.has(node.id) || !isExpandable(node)) return;\n    const next = new Set(expandedSet);\n    next.add(node.id);\n    setExpanded(next);\n    if (loadChildren && node.hasChildren && !node.children?.length) {\n      const pending = loadChildren(node);\n      if (pending && typeof pending.then === \"function\") {\n        setLoading((s) => new Set(s).add(node.id));\n        const done = () =>\n          setLoading((s) => {\n            const n = new Set(s);\n            n.delete(node.id);\n            return n;\n          });\n        pending.then(done, done);\n      }\n    }\n  };\n\n  const close = (node: TreeNode<T>) => {\n    if (!expandedSet.has(node.id)) return;\n    const next = new Set(expandedSet);\n    next.delete(node.id);\n    setExpanded(next);\n  };\n\n  const toggle = (node: TreeNode<T>) => (expandedSet.has(node.id) ? close(node) : open(node));\n\n  const select = (node: TreeNode<T>) => {\n    if (node.disabled) return;\n    if (selectionMode === \"none\") {\n      toggle(node);\n      return;\n    }\n    setSelectedOwn(node.id);\n    onSelectedChange?.(node.id, node);\n  };\n\n  const idOf = (target: EventTarget | null): string | null =>\n    (target as Element | null)?.closest?.<HTMLElement>('[role=\"treeitem\"]')?.dataset.treeId ?? null;\n\n  const textOf = (flat: FlatNode<T>): string => {\n    if (flat.node.textValue !== undefined) return flat.node.textValue;\n    if (typeof flat.node.label === \"string\") return flat.node.label;\n    const row = itemRefs.current.get(flat.node.id)?.querySelector(\"[data-tree-row]\");\n    return row?.textContent ?? \"\";\n  };\n\n  const findByText = (fromIndex: number, text: string): string | null => {\n    const needle = text.toLocaleLowerCase();\n    for (let i = 1; i <= visible.length; i++) {\n      const flat = visible[(fromIndex + i) % visible.length];\n      if (textOf(flat).trim().toLocaleLowerCase().startsWith(needle)) return flat.node.id;\n    }\n    return null;\n  };\n\n  const handleKeyDown = (e: KeyboardEvent<HTMLUListElement>) => {\n    onKeyDown?.(e);\n    if (e.defaultPrevented) return;\n    const id = idOf(e.target);\n    const flat = id ? byId.get(id) : undefined;\n    if (!flat) return;\n    const { node } = flat;\n    const index = visible.findIndex((f) => f.node.id === node.id);\n    const expandedNow = expandedSet.has(node.id);\n    // Forward / backward along the reading direction, from the row itself.\n    const step = horizontalStep(e.key, e.target as Element);\n    // A space inside a type-ahead run is part of the name being typed (\"current a…\"),\n    // not a request to select.\n    const inRun = Date.now() - typeahead.current.at < TYPEAHEAD_MS && typeahead.current.text !== \"\";\n    const key = e.key === \" \" && inRun ? \"typeahead\" : e.key;\n\n    let handled = true;\n    if (step === 1) {\n      if (!isExpandable(node)) handled = false;\n      else if (!expandedNow) open(node);\n      else if (node.children?.length) focusRow(node.children[0].id);\n    } else if (step === -1) {\n      if (expandedNow) close(node);\n      else if (flat.parentId) focusRow(flat.parentId);\n      else handled = false;\n    } else {\n      switch (key) {\n        case \"ArrowDown\":\n          if (index < visible.length - 1) focusRow(visible[index + 1].node.id);\n          break;\n        case \"ArrowUp\":\n          if (index > 0) focusRow(visible[index - 1].node.id);\n          break;\n        case \"Home\":\n          if (visible.length) focusRow(visible[0].node.id);\n          break;\n        case \"End\":\n          if (visible.length) focusRow(visible[visible.length - 1].node.id);\n          break;\n        case \"Enter\":\n        case \" \":\n          select(node);\n          break;\n        case \"*\": {\n          // Every sibling at this level, as the pattern suggests.\n          const siblings = flat.parentId ? (byId.get(flat.parentId)?.node.children ?? []) : items;\n          const next = new Set(expandedSet);\n          for (const s of siblings) if (isExpandable(s)) next.add(s.id);\n          setExpanded(next);\n          break;\n        }\n        default: {\n          const printable = e.key.length === 1 && !e.ctrlKey && !e.metaKey && !e.altKey;\n          if (!printable) {\n            handled = false;\n            break;\n          }\n          const now = Date.now();\n          const run = now - typeahead.current.at < TYPEAHEAD_MS ? typeahead.current.text : \"\";\n          typeahead.current = { text: run + e.key, at: now };\n          const typed = typeahead.current.text;\n          // \"aaa\" cycles through the rows starting with \"a\", as a file list does;\n          // anything else extends the prefix, searched from the row after this one\n          // (or from this one, when it still matches the longer prefix).\n          const repeated = typed.length > 1 && [...typed].every((c) => c === typed[0]);\n          const target = repeated\n            ? findByText(index, typed[0])\n            : typed.length > 1 && textOf(flat).trim().toLocaleLowerCase().startsWith(typed.toLocaleLowerCase())\n              ? node.id\n              : findByText(index, typed);\n          if (target) focusRow(target);\n        }\n      }\n    }\n    if (handled) {\n      e.preventDefault();\n      e.stopPropagation();\n    }\n  };\n\n  const handleClick = (e: MouseEvent<HTMLUListElement>) => {\n    onClick?.(e);\n    const id = idOf(e.target);\n    const flat = id ? byId.get(id) : undefined;\n    if (!flat) return;\n    // Controls a host rendered into a row (an action in `trailing`) are their own.\n    const control = (e.target as Element).closest(\"button, a[href], input, select, textarea\");\n    if (control && itemRefs.current.get(flat.node.id)?.contains(control)) return;\n    setFocusedId(flat.node.id);\n    if ((e.target as Element).closest(\"[data-tree-toggle]\")) {\n      toggle(flat.node);\n      return;\n    }\n    select(flat.node);\n  };\n\n  const renderNodes = (nodes: readonly TreeNode<T>[], level: number, path: string): ReactNode =>\n    nodes.map((node, i) => {\n      // Named by its own row, not by its content: a treeitem's content is the whole\n      // open branch below it, and \"Assets Current assets 1020 Bank …\" is not a name.\n      // A path of indices, because a host's id may hold spaces an idref cannot.\n      const rowId = `${baseId}-${path}${i}`;\n      const expandable = isExpandable(node);\n      const isOpen = expandable && expandedSet.has(node.id);\n      const isSelected = selectionMode !== \"none\" && selected === node.id;\n      const isLoading = loading.has(node.id);\n      const state: TreeItemState = {\n        level,\n        expanded: isOpen,\n        selected: isSelected,\n        expandable,\n        loading: isLoading,\n        disabled: Boolean(node.disabled),\n      };\n      return (\n        <li\n          key={node.id}\n          ref={(el) => {\n            if (el) itemRefs.current.set(node.id, el);\n            else itemRefs.current.delete(node.id);\n          }}\n          role=\"treeitem\"\n          data-tree-id={node.id}\n          aria-labelledby={rowId}\n          aria-level={level}\n          aria-expanded={expandable ? isOpen : undefined}\n          aria-selected={selectionMode === \"none\" ? undefined : isSelected}\n          aria-disabled={node.disabled || undefined}\n          aria-busy={isLoading || undefined}\n          tabIndex={node.id === tabbable ? 0 : -1}\n          onFocus={(e) => {\n            // Only the row itself: a focus event bubbling up from a nested row, or from\n            // a control inside this one, is not this row being focused.\n            if (e.target === e.currentTarget) setFocusedId(node.id);\n          }}\n          // The ring goes on this row's own box, not the <li>: the <li> contains the\n          // whole open branch below it, and ringing that would outline a subtree.\n          className=\"outline-none [&:focus-visible>[data-tree-row]]:ring-focus [&:focus-visible>[data-tree-row]]:ring-brand\"\n        >\n          <TreeRow\n            id={rowId}\n            level={level}\n            expanded={expandable ? isOpen : undefined}\n            label={node.label}\n            icon={node.icon}\n            trailing={node.trailing}\n            indent={indent}\n            guides={indentGuides}\n            selected={isSelected}\n            loading={isLoading}\n            className={cn(\n              node.disabled ? \"cursor-not-allowed opacity-50\" : \"cursor-pointer hover:bg-hover\",\n              rowClassName,\n            )}\n          >\n            {renderItem ? renderItem(node, state) : undefined}\n          </TreeRow>\n          {isOpen && (\n            <ul role=\"group\">\n              {/* Empty while lazy children load: a \"Loading…\" line in here would be\n                  a child that is not a treeitem, and the parent row already says\n                  `aria-busy` and shows the spinner. */}\n              {node.children?.length ? renderNodes(node.children, level + 1, `${path}${i}-`) : null}\n            </ul>\n          )}\n        </li>\n      );\n    });\n\n  return (\n    <ul\n      {...rest}\n      role=\"tree\"\n      onKeyDown={handleKeyDown}\n      onClick={handleClick}\n      className={cn(\"flex flex-col text-sm\", className)}\n    >\n      {renderNodes(items, 1, \"\")}\n    </ul>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/treemap.js

@@ -102,19 +102,7 @@ function TreemapCell({
       cursor: activate ? "pointer" : void 0,
       className: activate ? "outline-none [&:focus-visible>rect]:stroke-[var(--brand)]" : void 0,
       children: [
-        /* @__PURE__ */ jsx(
-          "rect",
-          {
-            x: px,
-            y: py,
-            width: pw,
-            height: ph,
-            fill: tileFill,
-            stroke: "var(--bg-surface)",
-            strokeWidth: 2,
-            rx: 3
-          }
-        ),
+        /* @__PURE__ */ jsx("rect", { x: px, y: py, width: pw, height: ph, fill: tileFill, stroke: "var(--bg-surface)", strokeWidth: 2, rx: 3 }),
         edge && pw > 3 && ph > 3 && /* @__PURE__ */ jsx(
           "rect",
           {

package/dist/components/treemap.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/treemap.tsx"],"sourcesContent":["// A tile chart (\"treemap\"): one rectangle per node, its AREA the node's share of what\n// is drawn. Lifted out of keksdose's reports, where five cards drew it (spending by\n// group and by category, net worth by account and by type, allocation, payees, food\n// groups) — every domain word is gone and every string it could print is a prop.\n//\n// It uses the kit's own chart shell (`ChartContainer`, `ChartTooltipContent`) and the\n// kit's own ink rule (`textOn`), so it re-skins with the palette like every other\n// chart. The one thing it cannot take from a CSS var is the tile colour: the label ink\n// is MEASURED against the fill, and a `var(--chart-3)` string measures as nothing — see\n// `useChartTokenHex` below for how the concrete hex is found instead.\nimport { useLayoutEffect, useRef, useState, useSyncExternalStore } from \"react\";\nimport type { ComponentProps, ComponentPropsWithoutRef, KeyboardEvent, ReactNode } from \"react\";\nimport { Treemap as RechartsTreemap } from \"recharts\";\nimport { ChartContainer, ChartTooltip, ChartTooltipContent, type ChartConfig } from \"./chart\";\nimport { PALETTE_HEX, PALETTE_SIZE, textOn } from \"../theme/chart-palette\";\nimport { resolveChartColor, useChartEdge } from \"./chart-edge\";\nimport { parseHex } from \"../theme/color\";\nimport { dirOf, type Direction } from \"../lib/direction\";\nimport { cn } from \"../lib/cn\";\nimport { useTextSize } from \"../theme/text-size\";\nimport { chartHeightProps, type ChartHeight } from \"./chart-height\";\nimport { formatWithMinus } from \"../lib/minus\";\n\n/**\n * One tile.\n *\n * `value`, not keksdose's `total`: a treemap's areas are not always money (keksdose\n * already sizes one by transaction COUNT), and `value` is the word every other chart\n * in recharts uses for the number a mark is sized by. Migrating is a rename at the\n * mapping step — `{ id, name, value: row.total }`.\n */\nexport interface TreemapNode {\n  /** Stable key, handed back by {@link TreemapProps.onNodeClick} and\n   *  {@link TreemapProps.nodeNote}. Names can collide; ids must not. */\n  id: string;\n  name: string;\n  /** The tile's area. A node whose value is not a positive finite number is NOT\n   *  drawn — an area cannot be negative, and recharts lays a negative size out as\n   *  nonsense rather than refusing it. Saying so is the caller's job: a group that\n   *  vanishes silently between two views of the same data is a bug report. */\n  value: number;\n  /** Overrides the by-index palette colour for this tile — e.g. to paint every child\n   *  in its parent group's colour, so the groups stay legible in one picture. A\n   *  concrete `#rrggbb` or a bare `var(--chart-N)` keeps the label ink measured — so\n   *  does `CHART_ROLES.other` (`var(--chart-muted)`), the colour for a \"rest\" bucket,\n   *  which should not wrap round to a hue the reader matches to a real node;\n   *  anything else (another var, a `color-mix()`) gets `currentColor` ink, because\n   *  there is nothing to measure — set `labelColor` then. */\n  fill?: string;\n  /** The label's ink, for a `fill` the kit cannot measure (a `var()` or `color-mix()`):\n   *  keksdose's recency plot fills with `color-mix(in srgb, var(--chart-1) N%,\n   *  transparent)`, where `currentColor` put dark page text on full-strength indigo\n   *  (~1.5:1). Wins over the measured ink when given. */\n  labelColor?: string;\n}\n\n/**\n * Everything a `<div>` takes reaches the chart's root (`ChartContainer`), so a test id\n * or a `data-tour` anchor can find it. `children` is the chart's own.\n */\nexport interface TreemapProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n  data: TreemapNode[];\n  /**\n   * Formats a node's value in the tooltip. Handed the node's SHARE of what is drawn\n   * (0–1) as a second argument, because a tile is read for how big it is relative to\n   * the rest, and \"€412.30\" alone makes the reader estimate that ratio off the areas.\n   * The share is `undefined` when the drawn total is not positive.\n   *\n   * Default: the bare number through `Intl.NumberFormat` in the runtime's locale. A\n   * host that has a currency or a locale passes this — the kit knows neither.\n   */\n  valueFormatter?: (value: number, share: number | undefined) => ReactNode;\n  /** Chart height: a CSS length (`\"20rem\"`, `\"min(20rem, 50dvh)\"`), a Tailwind class,\n   *  or px. Default `\"20rem\"` — 320 px at Normal, growing with the text size like the\n   *  labels in the tiles (0.32, docs/text-size-harmonization.md §10.10). */\n  height?: ChartHeight;\n  /** A tile was activated — by click, or by Enter/Space on a focused tile. Setting\n   *  this makes every tile a focusable `role=\"button\"` named by its node name. */\n  onNodeClick?: (id: string, name: string) => void;\n  /**\n   * The node names are the user's own data (payees, not categories): the tile labels\n   * and the whole tooltip bubble get `data-private`, the same attribute the kit's\n   * `Tooltip redact` and `ChartTooltipContent`'s value cell carry, so the host's one\n   * privacy rule reaches them. Off by default — a category name is a label of the app.\n   */\n  redactNames?: boolean;\n  /**\n   * A second, smaller line under a tile's label — one extra figure per node that the\n   * name cannot carry (a year-on-year `+12%`, `new`). Return `undefined` for a node\n   * with nothing to add. Never tagged `data-private`: a ratio reveals no amount.\n   *\n   * ON THE TILE rather than in the tooltip, for two reasons. The tooltip identifies a\n   * node by name or by raw value, so a per-node note would be keyed on an amount (two\n   * nodes of equal size would swap notes). And a tooltip is a pointer affordance: a\n   * phone never hovers, so a figure that only exists on hover does not exist there.\n   */\n  nodeNote?: (id: string) => string | undefined;\n  /**\n   * Draw at most this many tiles (the first N drawable nodes, in the order given —\n   * sort first). Unbounded by default. A tile under ~44x20px has no room for a label,\n   * and a map made of unlabelled rectangles answers nothing; around 24 is where the\n   * smallest tile of a skewed series reaches that floor on a phone-width card. The\n   * caller owns the \"N more not shown\" line, since it knows how many it passed.\n   */\n  maxTiles?: number;\n  /**\n   * The categorical ramp tiles take by index, as concrete hex. Default: the page's\n   * live `--chart-1…8` tokens (see `useChartTokenHex`), cycled after eight like\n   * `paletteFor` (0.49). Pass one when the host\n   * already holds the active palette — e.g. `createPaletteStore`'s `useChartHex()` —\n   * so a caller colouring a legend beside the map is guaranteed the same list.\n   */\n  colors?: readonly string[];\n}\n\n// ── The categorical ramp, as concrete hex ──────────────────────────────────\n//\n// The label ink is measured against the tile's fill, so the fill has to be a colour\n// and not a reference to one. keksdose read it from its palette STORE, which is an\n// app object the kit cannot import. What the kit does own is the token layer: whether\n// a palette arrives through `applyTokenSet` (inline properties on <html>) or through\n// tokens.css (`:root` / `.dark`), the resolved `--chart-N` on <html> is the colour\n// every other chart on the page is being painted with. So that is what is read, and\n// re-read whenever <html>'s class or style changes — which is exactly when a theme\n// toggle or a palette switch lands.\n\nconst CHART_TOKENS = PALETTE_SIZE;\n\n/** The resolved ramp, joined into ONE string so `useSyncExternalStore` compares a\n *  primitive: a fresh array per read would never be `Object.is`-equal to the last and\n *  would re-render forever. */\nfunction readChartTokens(): string {\n  const root = document.documentElement;\n  const fallback = root.classList.contains(\"dark\") ? PALETTE_HEX.dark : PALETTE_HEX.light;\n  const style = getComputedStyle(root);\n  return Array.from({ length: CHART_TOKENS }, (_, i) => {\n    const v = style.getPropertyValue(`--chart-${i + 1}`).trim();\n    // An unresolved token (a host that never loaded tokens.css, a test DOM) falls\n    // back to the built-in ramp for the current theme rather than to no colour.\n    return parseHex(v) ? v : fallback[i];\n  }).join(\",\");\n}\n\nfunction subscribeChartTokens(onChange: () => void): () => void {\n  const observer = new MutationObserver(onChange);\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: [\"class\", \"style\", \"data-theme\"],\n  });\n  return () => observer.disconnect();\n}\n\nconst SERVER_TOKENS = PALETTE_HEX.light.join(\",\");\n\nfunction useChartTokenHex(): string[] {\n  const joined = useSyncExternalStore(subscribeChartTokens, readChartTokens, () => SERVER_TOKENS);\n  return joined.split(\",\");\n}\n\nconst CHART_TOKEN_REF = /^var\\(\\s*--chart-(\\d+)\\s*\\)$/;\n\n/**\n * The hex a tile fill measures as: the fill itself when it is hex, the live token when\n * it is a bare `var(--chart-N)` (what `paletteFor` returns), otherwise null. Without\n * the token case a hand-built recharts map coloured with the kit's own `paletteFor`\n * got `currentColor` ink — dark page text on dark indigo in the light theme.\n */\nfunction measurableFill(fill: string, tokens: readonly string[]): string | null {\n  if (parseHex(fill)) return fill;\n  const m = CHART_TOKEN_REF.exec(fill.trim());\n  const hex = m ? tokens[Number(m[1]) - 1] : undefined;\n  if (hex && parseHex(hex)) return hex;\n  // Any other bare token the page declares — `var(--chart-muted)` for a rest bucket,\n  // `var(--chart-9)`, a money colour — read off <html> as it resolves.\n  if (typeof document === \"undefined\") return null;\n  return resolveChartColor(fill, getComputedStyle(document.documentElement));\n}\n\n// ── Tile ──────────────────────────────────────────────────────────────────\n\n/** The name's size in px at Normal; a tile draws it × the text size's scale (§10.10), and\n *  every distance below that is measured in lines grows with it. */\nconst LABEL_FONT_SIZE = 12;\n/** The optional second line, a step down from the name so the tile reads name-first. */\nconst NOTE_FONT_SIZE = 11;\n\n/**\n * Fit a label to its tile: the text itself when it fits, an ellipsised head when it\n * does not, `null` when not even three characters would. Without this a long name ran\n * on across its neighbours and collided with THEIR labels. 0.58em is the average\n * advance of a UI sans at this weight; it only needs to be close, since the tile keeps\n * 6px of padding either side. The full name stays in the tooltip.\n */\nexport function fitLabel(name: string, boxWidth: number, fontSize: number): string | null {\n  const max = Math.floor((boxWidth - 12) / (fontSize * 0.58));\n  if (max < 3) return null;\n  return name.length <= max ? name : `${name.slice(0, max - 1).trimEnd()}…`;\n}\n\n/** What recharts hands a `content` element for each node, plus the three options the\n *  chart forwards. Everything optional because recharts clones the element it was\n *  given and fills the geometry in — the element as written carries only the options. */\nexport interface TreemapCellProps {\n  depth?: number;\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n  name?: string;\n  fill?: string;\n  /** See {@link TreemapNode.labelColor}; recharts hands each node's fields to its cell. */\n  labelColor?: string;\n  id?: string;\n  onNodeClick?: (id: string, name: string) => void;\n  redactNames?: boolean;\n  nodeNote?: (id: string) => string | undefined;\n  /** The page's reading direction, which `Treemap` reads off its own root. In `rtl`\n   *  the label stands in the tile's top RIGHT corner and is shaped right-to-left, so a\n   *  clipped name ends in its ellipsis on the reading end. Default `ltr`. */\n  dir?: Direction;\n}\n\n/**\n * One tile. Exported so a caller drawing its own recharts `<Treemap>` gets the same\n * label rules.\n *\n * recharts' default cell inherits the chart-level `stroke`, an SVG presentation\n * attribute that lands on the `<svg>` root and cascades into the label — so the glyphs\n * were painted with a 1px outline ON TOP of themselves, which reads as blur. This cell\n * draws its own label with a halo in the TILE colour painted BEHIND the fill\n * (`paint-order: stroke`), which defeats any inherited stroke and keeps the text solid\n * where it overlaps a lighter or darker part of its own tile.\n */\nexport function TreemapCell({\n  depth,\n  x = 0,\n  y = 0,\n  width = 0,\n  height = 0,\n  name,\n  fill,\n  labelColor,\n  id,\n  onNodeClick,\n  redactNames,\n  nodeNote,\n  dir = \"ltr\",\n}: TreemapCellProps) {\n  // Before the early return: a hook has to run on every render of the cell.\n  const tokenHex = useChartTokenHex();\n  const { scale } = useTextSize();\n  const edgeFor = useChartEdge();\n  // Depth 0 is recharts' synthetic root, which spans the whole chart.\n  if (!depth) return null;\n  // Whole pixels: a rect on a half pixel renders its edge across two half-lit\n  // columns, and the text baseline inherits that blur.\n  const px = Math.round(x);\n  const py = Math.round(y);\n  const pw = Math.round(width);\n  const ph = Math.round(height);\n  const tileFill = fill ?? \"var(--chart-1)\";\n  const measured = measurableFill(tileFill, tokenHex);\n  const ink = labelColor ?? (measured ? textOn(measured) : \"currentColor\");\n  // A tile in a hue under 3:1 against the card gets a 1px ink edge inside the gutter\n  // (WCAG 1.4.11, anyplot's rule); a hue that clears it stays bare.\n  const edge = measured ? edgeFor(measured) : undefined;\n  // The halo only on an OPAQUE fill we could measure. A translucent fill (a\n  // `color-mix(… transparent)`) composited twice — once as the tile, once as the halo\n  // over it — draws a darker ring round every glyph, which read as doubled text on the\n  // faded tiles. `none` still overrides the inherited chart `stroke`.\n  const halo = measured ? tileFill : \"none\";\n  // Below ~44x20 there is no room for a readable word, so no label at all rather than\n  // a one-letter stub bleeding over the tile edge.\n  const labelSize = LABEL_FONT_SIZE * scale;\n  const noteSize = NOTE_FONT_SIZE * scale;\n  const label = pw >= 44 * scale && ph >= 20 * scale ? fitLabel(name ?? \"\", pw, labelSize) : null;\n  // Only under a label that is itself drawn — a stray \"+12%\" on an unnamed rectangle\n  // names nothing — and only where a second baseline fits: the note's baseline sits\n  // 29px down and an 11px glyph hangs ~2px below it, so 36 leaves the same ~5px under\n  // the note that the label keeps under itself at the 20px floor.\n  const rawNote = id != null && nodeNote ? nodeNote(id) : undefined;\n  const note =\n    label != null && rawNote != null && ph >= 36 * scale ? fitLabel(rawNote, pw, noteSize) : null;\n  // The label's START edge, 6px in from the tile's. The tiles themselves are laid out\n  // physically (the plot is not mirrored, see `ChartContainer`) and the chart's SVG is\n  // pinned `ltr`, so the direction is set on each <text> explicitly: `start` is then\n  // the right end in RTL, and the label grows leftwards from the tile's right edge.\n  const textX = dir === \"rtl\" ? px + pw - 6 : px + 6;\n  const activate = id != null && onNodeClick ? () => onNodeClick(id, name ?? \"\") : undefined;\n  const onKeyDown = activate\n    ? (e: KeyboardEvent<SVGGElement>) => {\n        if (e.key !== \"Enter\" && e.key !== \" \") return;\n        e.preventDefault();\n        activate();\n      }\n    : undefined;\n  return (\n    <g\n      onClick={activate}\n      onKeyDown={onKeyDown}\n      // A clickable tile is a button to a keyboard and a screen reader too; the\n      // drilldown it opens was mouse-only in the app this came from. Named by the node\n      // name, which is also why the group carries `data-private` under `redactNames`.\n      role={activate ? \"button\" : undefined}\n      tabIndex={activate ? 0 : undefined}\n      aria-label={activate ? name : undefined}\n      data-private={activate && redactNames ? \"\" : undefined}\n      cursor={activate ? \"pointer\" : undefined}\n      // CSS beats a presentation attribute, so this recolours the rect's own stroke\n      // for as long as the tile has keyboard focus.\n      className={activate ? \"outline-none [&:focus-visible>rect]:stroke-[var(--brand)]\" : undefined}\n    >\n      {/* The 2px gutter is the card showing through, not a white grid — on a dark\n          surface white lines glare harder than the tiles. */}\n      <rect\n        x={px}\n        y={py}\n        width={pw}\n        height={ph}\n        fill={tileFill}\n        stroke=\"var(--bg-surface)\"\n        strokeWidth={2}\n        rx={3}\n      />\n      {edge && pw > 3 && ph > 3 && (\n        <rect\n          data-edge=\"\"\n          x={px + 1.5}\n          y={py + 1.5}\n          width={pw - 3}\n          height={ph - 3}\n          fill=\"none\"\n          stroke={edge}\n          strokeWidth={1}\n          rx={2}\n          style={{ pointerEvents: \"none\" }}\n        />\n      )}\n      {label != null && (\n        <text\n          // A plain attribute, so the host's `[data-private]` rule reaches an SVG\n          // <text> exactly as it reaches a table cell.\n          data-private={redactNames ? \"\" : undefined}\n          x={textX}\n          y={py + 15 * scale}\n          direction={dir}\n          fill={ink}\n          stroke={halo}\n          strokeWidth={2.5}\n          strokeLinejoin=\"round\"\n          paintOrder=\"stroke\"\n          fontSize={labelSize}\n          fontWeight={600}\n          style={{ pointerEvents: \"none\" }}\n        >\n          {label}\n        </text>\n      )}\n      {note != null && (\n        <text\n          x={textX}\n          y={py + 29 * scale}\n          direction={dir}\n          fill={ink}\n          fillOpacity={0.85}\n          stroke={halo}\n          strokeWidth={2.5}\n          strokeLinejoin=\"round\"\n          paintOrder=\"stroke\"\n          fontSize={noteSize}\n          fontWeight={500}\n          style={{ pointerEvents: \"none\" }}\n        >\n          {note}\n        </text>\n      )}\n    </g>\n  );\n}\n\n// ── Chart ─────────────────────────────────────────────────────────────────\n\n// Nodes carry their own `fill`, and `ChartTooltipContent` falls back to it for the\n// swatch, so no series config is needed.\nconst TREEMAP_CONFIG: ChartConfig = {};\n\n/**\n * The shared tooltip with the whole bubble tagged `data-private`, for names that are\n * the user's own data.\n *\n * The bubble, not just the name: `ChartTooltipContent` prints the name either from\n * `item.name` or from a config `label`, and only the config route could be tagged — but\n * a config entry keyed by a payee name is not a CSS identifier, and `ChartStyle` would\n * (rightly) refuse it. The bubble holds the name and the value, and the value cell is\n * already `data-private`, so tagging the wrapper hides nothing extra.\n *\n * recharts CLONES the `content` element to inject `active`/`payload`, so this has to BE\n * that element — a `<div>` wrapped around `<ChartTooltipContent />` in the JSX would\n * take those props itself and hand the tooltip nothing.\n */\nfunction RedactedTooltipContent(props: ComponentProps<typeof ChartTooltipContent>) {\n  return (\n    <div data-private>\n      <ChartTooltipContent {...props} />\n    </div>\n  );\n}\n\nconst DEFAULT_NUMBER = new Intl.NumberFormat();\n\n/**\n * Tile chart: one rectangle per {@link TreemapNode}, sized by `value`, coloured by\n * index from the chart ramp (or by the node's own `fill`), labelled in whichever of the\n * kit's two inks measures better against it. Hover shows the name and the formatted\n * value; `onNodeClick` turns the tiles into buttons.\n *\n * Renders nothing when no node has a positive value — an empty box is a hole in the\n * card, and the caller's own sentence is the better answer there.\n *\n * Needs `recharts`, like everything behind `@eifi1/ui-kit/chart`.\n */\nexport function Treemap({\n  data,\n  valueFormatter,\n  height = \"20rem\",\n  onNodeClick,\n  redactNames = false,\n  nodeNote,\n  maxTiles,\n  colors,\n  style,\n  ...rest\n}: TreemapProps) {\n  const tokenHex = useChartTokenHex();\n  // Read off the DOM after mount: the `dir` a treemap sits under is an ancestor's\n  // attribute, and SVG text anchoring cannot follow it by CSS (see TreemapCell). Again\n  // on new data, because a map that had nothing to draw rendered no root to read.\n  const rootRef = useRef<HTMLDivElement>(null);\n  const [dir, setDir] = useState<Direction>(\"ltr\");\n  useLayoutEffect(() => {\n    setDir(dirOf(rootRef.current));\n  }, [data]);\n  const ramp = colors && colors.length > 0 ? colors : tokenHex;\n  // Coloured by index into `data` AS GIVEN, before anything is dropped: a caller\n  // painting a legend or a second map from the same list must land on the same hue\n  // for the same row, and filtering first would shift every colour after a gap.\n  const nodes = data\n    .map((d, idx) => ({\n      id: d.id,\n      name: d.name,\n      size: d.value,\n      fill: d.fill ?? ramp[idx % ramp.length],\n      // recharts hands each node's fields to its cell; a field left out of this map\n      // never reaches `TreemapCell` (0.8.0 shipped `labelColor` without it — keksdose).\n      labelColor: d.labelColor,\n    }))\n    .filter((n) => Number.isFinite(n.size) && n.size > 0)\n    .slice(0, maxTiles ?? undefined);\n  if (nodes.length === 0) return null;\n  const box = chartHeightProps(height);\n\n  // The share is of what is DRAWN, so it always reads as \"of this picture\".\n  const total = nodes.reduce((acc, n) => acc + n.size, 0);\n  const format = (v: number): ReactNode => {\n    const share = total > 0 ? v / total : undefined;\n    return valueFormatter ? valueFormatter(v, share) : formatWithMinus(DEFAULT_NUMBER, v);\n  };\n  const Content = redactNames ? RedactedTooltipContent : ChartTooltipContent;\n  return (\n    <ChartContainer\n      {...rest}\n      ref={rootRef}\n      config={TREEMAP_CONFIG}\n      className={cn(box.className, rest.className)}\n      style={{ ...style, ...box.style }}\n    >\n      {/* No chart-level `stroke`: recharts spreads it onto the <svg> root, from where\n          it inherits into every label (see TreemapCell). Each cell strokes its own rect. */}\n      <RechartsTreemap\n        data={nodes}\n        dataKey=\"size\"\n        fill=\"var(--chart-1)\"\n        isAnimationActive={false}\n        content={\n          <TreemapCell onNodeClick={onNodeClick} redactNames={redactNames} nodeNote={nodeNote} dir={dir} />\n        }\n      >\n        <ChartTooltip content={<Content hideLabel valueFormatter={format} />} />\n      </RechartsTreemap>\n    </ChartContainer>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/treemap.tsx"],"sourcesContent":["// A tile chart (\"treemap\"): one rectangle per node, its AREA the node's share of what\n// is drawn. Lifted out of keksdose's reports, where five cards drew it (spending by\n// group and by category, net worth by account and by type, allocation, payees, food\n// groups) — every domain word is gone and every string it could print is a prop.\n//\n// It uses the kit's own chart shell (`ChartContainer`, `ChartTooltipContent`) and the\n// kit's own ink rule (`textOn`), so it re-skins with the palette like every other\n// chart. The one thing it cannot take from a CSS var is the tile colour: the label ink\n// is MEASURED against the fill, and a `var(--chart-3)` string measures as nothing — see\n// `useChartTokenHex` below for how the concrete hex is found instead.\nimport { useLayoutEffect, useRef, useState, useSyncExternalStore } from \"react\";\nimport type { ComponentProps, ComponentPropsWithoutRef, KeyboardEvent, ReactNode } from \"react\";\nimport { Treemap as RechartsTreemap } from \"recharts\";\nimport { ChartContainer, ChartTooltip, ChartTooltipContent, type ChartConfig } from \"./chart\";\nimport { PALETTE_HEX, PALETTE_SIZE, textOn } from \"../theme/chart-palette\";\nimport { resolveChartColor, useChartEdge } from \"./chart-edge\";\nimport { parseHex } from \"../theme/color\";\nimport { dirOf, type Direction } from \"../lib/direction\";\nimport { cn } from \"../lib/cn\";\nimport { useTextSize } from \"../theme/text-size\";\nimport { chartHeightProps, type ChartHeight } from \"./chart-height\";\nimport { formatWithMinus } from \"../lib/minus\";\n\n/**\n * One tile.\n *\n * `value`, not keksdose's `total`: a treemap's areas are not always money (keksdose\n * already sizes one by transaction COUNT), and `value` is the word every other chart\n * in recharts uses for the number a mark is sized by. Migrating is a rename at the\n * mapping step — `{ id, name, value: row.total }`.\n */\nexport interface TreemapNode {\n  /** Stable key, handed back by {@link TreemapProps.onNodeClick} and\n   *  {@link TreemapProps.nodeNote}. Names can collide; ids must not. */\n  id: string;\n  name: string;\n  /** The tile's area. A node whose value is not a positive finite number is NOT\n   *  drawn — an area cannot be negative, and recharts lays a negative size out as\n   *  nonsense rather than refusing it. Saying so is the caller's job: a group that\n   *  vanishes silently between two views of the same data is a bug report. */\n  value: number;\n  /** Overrides the by-index palette colour for this tile — e.g. to paint every child\n   *  in its parent group's colour, so the groups stay legible in one picture. A\n   *  concrete `#rrggbb` or a bare `var(--chart-N)` keeps the label ink measured — so\n   *  does `CHART_ROLES.other` (`var(--chart-muted)`), the colour for a \"rest\" bucket,\n   *  which should not wrap round to a hue the reader matches to a real node;\n   *  anything else (another var, a `color-mix()`) gets `currentColor` ink, because\n   *  there is nothing to measure — set `labelColor` then. */\n  fill?: string;\n  /** The label's ink, for a `fill` the kit cannot measure (a `var()` or `color-mix()`):\n   *  keksdose's recency plot fills with `color-mix(in srgb, var(--chart-1) N%,\n   *  transparent)`, where `currentColor` put dark page text on full-strength indigo\n   *  (~1.5:1). Wins over the measured ink when given. */\n  labelColor?: string;\n}\n\n/**\n * Everything a `<div>` takes reaches the chart's root (`ChartContainer`), so a test id\n * or a `data-tour` anchor can find it. `children` is the chart's own.\n */\nexport interface TreemapProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n  data: TreemapNode[];\n  /**\n   * Formats a node's value in the tooltip. Handed the node's SHARE of what is drawn\n   * (0–1) as a second argument, because a tile is read for how big it is relative to\n   * the rest, and \"€412.30\" alone makes the reader estimate that ratio off the areas.\n   * The share is `undefined` when the drawn total is not positive.\n   *\n   * Default: the bare number through `Intl.NumberFormat` in the runtime's locale. A\n   * host that has a currency or a locale passes this — the kit knows neither.\n   */\n  valueFormatter?: (value: number, share: number | undefined) => ReactNode;\n  /** Chart height: a CSS length (`\"20rem\"`, `\"min(20rem, 50dvh)\"`), a Tailwind class,\n   *  or px. Default `\"20rem\"` — 320 px at Normal, growing with the text size like the\n   *  labels in the tiles (0.32, docs/text-size-harmonization.md §10.10). */\n  height?: ChartHeight;\n  /** A tile was activated — by click, or by Enter/Space on a focused tile. Setting\n   *  this makes every tile a focusable `role=\"button\"` named by its node name. */\n  onNodeClick?: (id: string, name: string) => void;\n  /**\n   * The node names are the user's own data (payees, not categories): the tile labels\n   * and the whole tooltip bubble get `data-private`, the same attribute the kit's\n   * `Tooltip redact` and `ChartTooltipContent`'s value cell carry, so the host's one\n   * privacy rule reaches them. Off by default — a category name is a label of the app.\n   */\n  redactNames?: boolean;\n  /**\n   * A second, smaller line under a tile's label — one extra figure per node that the\n   * name cannot carry (a year-on-year `+12%`, `new`). Return `undefined` for a node\n   * with nothing to add. Never tagged `data-private`: a ratio reveals no amount.\n   *\n   * ON THE TILE rather than in the tooltip, for two reasons. The tooltip identifies a\n   * node by name or by raw value, so a per-node note would be keyed on an amount (two\n   * nodes of equal size would swap notes). And a tooltip is a pointer affordance: a\n   * phone never hovers, so a figure that only exists on hover does not exist there.\n   */\n  nodeNote?: (id: string) => string | undefined;\n  /**\n   * Draw at most this many tiles (the first N drawable nodes, in the order given —\n   * sort first). Unbounded by default. A tile under ~44x20px has no room for a label,\n   * and a map made of unlabelled rectangles answers nothing; around 24 is where the\n   * smallest tile of a skewed series reaches that floor on a phone-width card. The\n   * caller owns the \"N more not shown\" line, since it knows how many it passed.\n   */\n  maxTiles?: number;\n  /**\n   * The categorical ramp tiles take by index, as concrete hex. Default: the page's\n   * live `--chart-1…8` tokens (see `useChartTokenHex`), cycled after eight like\n   * `paletteFor` (0.49). Pass one when the host\n   * already holds the active palette — e.g. `createPaletteStore`'s `useChartHex()` —\n   * so a caller colouring a legend beside the map is guaranteed the same list.\n   */\n  colors?: readonly string[];\n}\n\n// ── The categorical ramp, as concrete hex ──────────────────────────────────\n//\n// The label ink is measured against the tile's fill, so the fill has to be a colour\n// and not a reference to one. keksdose read it from its palette STORE, which is an\n// app object the kit cannot import. What the kit does own is the token layer: whether\n// a palette arrives through `applyTokenSet` (inline properties on <html>) or through\n// tokens.css (`:root` / `.dark`), the resolved `--chart-N` on <html> is the colour\n// every other chart on the page is being painted with. So that is what is read, and\n// re-read whenever <html>'s class or style changes — which is exactly when a theme\n// toggle or a palette switch lands.\n\nconst CHART_TOKENS = PALETTE_SIZE;\n\n/** The resolved ramp, joined into ONE string so `useSyncExternalStore` compares a\n *  primitive: a fresh array per read would never be `Object.is`-equal to the last and\n *  would re-render forever. */\nfunction readChartTokens(): string {\n  const root = document.documentElement;\n  const fallback = root.classList.contains(\"dark\") ? PALETTE_HEX.dark : PALETTE_HEX.light;\n  const style = getComputedStyle(root);\n  return Array.from({ length: CHART_TOKENS }, (_, i) => {\n    const v = style.getPropertyValue(`--chart-${i + 1}`).trim();\n    // An unresolved token (a host that never loaded tokens.css, a test DOM) falls\n    // back to the built-in ramp for the current theme rather than to no colour.\n    return parseHex(v) ? v : fallback[i];\n  }).join(\",\");\n}\n\nfunction subscribeChartTokens(onChange: () => void): () => void {\n  const observer = new MutationObserver(onChange);\n  observer.observe(document.documentElement, {\n    attributes: true,\n    attributeFilter: [\"class\", \"style\", \"data-theme\"],\n  });\n  return () => observer.disconnect();\n}\n\nconst SERVER_TOKENS = PALETTE_HEX.light.join(\",\");\n\nfunction useChartTokenHex(): string[] {\n  const joined = useSyncExternalStore(subscribeChartTokens, readChartTokens, () => SERVER_TOKENS);\n  return joined.split(\",\");\n}\n\nconst CHART_TOKEN_REF = /^var\\(\\s*--chart-(\\d+)\\s*\\)$/;\n\n/**\n * The hex a tile fill measures as: the fill itself when it is hex, the live token when\n * it is a bare `var(--chart-N)` (what `paletteFor` returns), otherwise null. Without\n * the token case a hand-built recharts map coloured with the kit's own `paletteFor`\n * got `currentColor` ink — dark page text on dark indigo in the light theme.\n */\nfunction measurableFill(fill: string, tokens: readonly string[]): string | null {\n  if (parseHex(fill)) return fill;\n  const m = CHART_TOKEN_REF.exec(fill.trim());\n  const hex = m ? tokens[Number(m[1]) - 1] : undefined;\n  if (hex && parseHex(hex)) return hex;\n  // Any other bare token the page declares — `var(--chart-muted)` for a rest bucket,\n  // `var(--chart-9)`, a money colour — read off <html> as it resolves.\n  if (typeof document === \"undefined\") return null;\n  return resolveChartColor(fill, getComputedStyle(document.documentElement));\n}\n\n// ── Tile ──────────────────────────────────────────────────────────────────\n\n/** The name's size in px at Normal; a tile draws it × the text size's scale (§10.10), and\n *  every distance below that is measured in lines grows with it. */\nconst LABEL_FONT_SIZE = 12;\n/** The optional second line, a step down from the name so the tile reads name-first. */\nconst NOTE_FONT_SIZE = 11;\n\n/**\n * Fit a label to its tile: the text itself when it fits, an ellipsised head when it\n * does not, `null` when not even three characters would. Without this a long name ran\n * on across its neighbours and collided with THEIR labels. 0.58em is the average\n * advance of a UI sans at this weight; it only needs to be close, since the tile keeps\n * 6px of padding either side. The full name stays in the tooltip.\n */\nexport function fitLabel(name: string, boxWidth: number, fontSize: number): string | null {\n  const max = Math.floor((boxWidth - 12) / (fontSize * 0.58));\n  if (max < 3) return null;\n  return name.length <= max ? name : `${name.slice(0, max - 1).trimEnd()}…`;\n}\n\n/** What recharts hands a `content` element for each node, plus the three options the\n *  chart forwards. Everything optional because recharts clones the element it was\n *  given and fills the geometry in — the element as written carries only the options. */\nexport interface TreemapCellProps {\n  depth?: number;\n  x?: number;\n  y?: number;\n  width?: number;\n  height?: number;\n  name?: string;\n  fill?: string;\n  /** See {@link TreemapNode.labelColor}; recharts hands each node's fields to its cell. */\n  labelColor?: string;\n  id?: string;\n  onNodeClick?: (id: string, name: string) => void;\n  redactNames?: boolean;\n  nodeNote?: (id: string) => string | undefined;\n  /** The page's reading direction, which `Treemap` reads off its own root. In `rtl`\n   *  the label stands in the tile's top RIGHT corner and is shaped right-to-left, so a\n   *  clipped name ends in its ellipsis on the reading end. Default `ltr`. */\n  dir?: Direction;\n}\n\n/**\n * One tile. Exported so a caller drawing its own recharts `<Treemap>` gets the same\n * label rules.\n *\n * recharts' default cell inherits the chart-level `stroke`, an SVG presentation\n * attribute that lands on the `<svg>` root and cascades into the label — so the glyphs\n * were painted with a 1px outline ON TOP of themselves, which reads as blur. This cell\n * draws its own label with a halo in the TILE colour painted BEHIND the fill\n * (`paint-order: stroke`), which defeats any inherited stroke and keeps the text solid\n * where it overlaps a lighter or darker part of its own tile.\n */\nexport function TreemapCell({\n  depth,\n  x = 0,\n  y = 0,\n  width = 0,\n  height = 0,\n  name,\n  fill,\n  labelColor,\n  id,\n  onNodeClick,\n  redactNames,\n  nodeNote,\n  dir = \"ltr\",\n}: TreemapCellProps) {\n  // Before the early return: a hook has to run on every render of the cell.\n  const tokenHex = useChartTokenHex();\n  const { scale } = useTextSize();\n  const edgeFor = useChartEdge();\n  // Depth 0 is recharts' synthetic root, which spans the whole chart.\n  if (!depth) return null;\n  // Whole pixels: a rect on a half pixel renders its edge across two half-lit\n  // columns, and the text baseline inherits that blur.\n  const px = Math.round(x);\n  const py = Math.round(y);\n  const pw = Math.round(width);\n  const ph = Math.round(height);\n  const tileFill = fill ?? \"var(--chart-1)\";\n  const measured = measurableFill(tileFill, tokenHex);\n  const ink = labelColor ?? (measured ? textOn(measured) : \"currentColor\");\n  // A tile in a hue under 3:1 against the card gets a 1px ink edge inside the gutter\n  // (WCAG 1.4.11, anyplot's rule); a hue that clears it stays bare.\n  const edge = measured ? edgeFor(measured) : undefined;\n  // The halo only on an OPAQUE fill we could measure. A translucent fill (a\n  // `color-mix(… transparent)`) composited twice — once as the tile, once as the halo\n  // over it — draws a darker ring round every glyph, which read as doubled text on the\n  // faded tiles. `none` still overrides the inherited chart `stroke`.\n  const halo = measured ? tileFill : \"none\";\n  // Below ~44x20 there is no room for a readable word, so no label at all rather than\n  // a one-letter stub bleeding over the tile edge.\n  const labelSize = LABEL_FONT_SIZE * scale;\n  const noteSize = NOTE_FONT_SIZE * scale;\n  const label = pw >= 44 * scale && ph >= 20 * scale ? fitLabel(name ?? \"\", pw, labelSize) : null;\n  // Only under a label that is itself drawn — a stray \"+12%\" on an unnamed rectangle\n  // names nothing — and only where a second baseline fits: the note's baseline sits\n  // 29px down and an 11px glyph hangs ~2px below it, so 36 leaves the same ~5px under\n  // the note that the label keeps under itself at the 20px floor.\n  const rawNote = id != null && nodeNote ? nodeNote(id) : undefined;\n  const note = label != null && rawNote != null && ph >= 36 * scale ? fitLabel(rawNote, pw, noteSize) : null;\n  // The label's START edge, 6px in from the tile's. The tiles themselves are laid out\n  // physically (the plot is not mirrored, see `ChartContainer`) and the chart's SVG is\n  // pinned `ltr`, so the direction is set on each <text> explicitly: `start` is then\n  // the right end in RTL, and the label grows leftwards from the tile's right edge.\n  const textX = dir === \"rtl\" ? px + pw - 6 : px + 6;\n  const activate = id != null && onNodeClick ? () => onNodeClick(id, name ?? \"\") : undefined;\n  const onKeyDown = activate\n    ? (e: KeyboardEvent<SVGGElement>) => {\n        if (e.key !== \"Enter\" && e.key !== \" \") return;\n        e.preventDefault();\n        activate();\n      }\n    : undefined;\n  return (\n    <g\n      onClick={activate}\n      onKeyDown={onKeyDown}\n      // A clickable tile is a button to a keyboard and a screen reader too; the\n      // drilldown it opens was mouse-only in the app this came from. Named by the node\n      // name, which is also why the group carries `data-private` under `redactNames`.\n      role={activate ? \"button\" : undefined}\n      tabIndex={activate ? 0 : undefined}\n      aria-label={activate ? name : undefined}\n      data-private={activate && redactNames ? \"\" : undefined}\n      cursor={activate ? \"pointer\" : undefined}\n      // CSS beats a presentation attribute, so this recolours the rect's own stroke\n      // for as long as the tile has keyboard focus.\n      className={activate ? \"outline-none [&:focus-visible>rect]:stroke-[var(--brand)]\" : undefined}\n    >\n      {/* The 2px gutter is the card showing through, not a white grid — on a dark\n          surface white lines glare harder than the tiles. */}\n      <rect x={px} y={py} width={pw} height={ph} fill={tileFill} stroke=\"var(--bg-surface)\" strokeWidth={2} rx={3} />\n      {edge && pw > 3 && ph > 3 && (\n        <rect\n          data-edge=\"\"\n          x={px + 1.5}\n          y={py + 1.5}\n          width={pw - 3}\n          height={ph - 3}\n          fill=\"none\"\n          stroke={edge}\n          strokeWidth={1}\n          rx={2}\n          style={{ pointerEvents: \"none\" }}\n        />\n      )}\n      {label != null && (\n        <text\n          // A plain attribute, so the host's `[data-private]` rule reaches an SVG\n          // <text> exactly as it reaches a table cell.\n          data-private={redactNames ? \"\" : undefined}\n          x={textX}\n          y={py + 15 * scale}\n          direction={dir}\n          fill={ink}\n          stroke={halo}\n          strokeWidth={2.5}\n          strokeLinejoin=\"round\"\n          paintOrder=\"stroke\"\n          fontSize={labelSize}\n          fontWeight={600}\n          style={{ pointerEvents: \"none\" }}\n        >\n          {label}\n        </text>\n      )}\n      {note != null && (\n        <text\n          x={textX}\n          y={py + 29 * scale}\n          direction={dir}\n          fill={ink}\n          fillOpacity={0.85}\n          stroke={halo}\n          strokeWidth={2.5}\n          strokeLinejoin=\"round\"\n          paintOrder=\"stroke\"\n          fontSize={noteSize}\n          fontWeight={500}\n          style={{ pointerEvents: \"none\" }}\n        >\n          {note}\n        </text>\n      )}\n    </g>\n  );\n}\n\n// ── Chart ─────────────────────────────────────────────────────────────────\n\n// Nodes carry their own `fill`, and `ChartTooltipContent` falls back to it for the\n// swatch, so no series config is needed.\nconst TREEMAP_CONFIG: ChartConfig = {};\n\n/**\n * The shared tooltip with the whole bubble tagged `data-private`, for names that are\n * the user's own data.\n *\n * The bubble, not just the name: `ChartTooltipContent` prints the name either from\n * `item.name` or from a config `label`, and only the config route could be tagged — but\n * a config entry keyed by a payee name is not a CSS identifier, and `ChartStyle` would\n * (rightly) refuse it. The bubble holds the name and the value, and the value cell is\n * already `data-private`, so tagging the wrapper hides nothing extra.\n *\n * recharts CLONES the `content` element to inject `active`/`payload`, so this has to BE\n * that element — a `<div>` wrapped around `<ChartTooltipContent />` in the JSX would\n * take those props itself and hand the tooltip nothing.\n */\nfunction RedactedTooltipContent(props: ComponentProps<typeof ChartTooltipContent>) {\n  return (\n    <div data-private>\n      <ChartTooltipContent {...props} />\n    </div>\n  );\n}\n\nconst DEFAULT_NUMBER = new Intl.NumberFormat();\n\n/**\n * Tile chart: one rectangle per {@link TreemapNode}, sized by `value`, coloured by\n * index from the chart ramp (or by the node's own `fill`), labelled in whichever of the\n * kit's two inks measures better against it. Hover shows the name and the formatted\n * value; `onNodeClick` turns the tiles into buttons.\n *\n * Renders nothing when no node has a positive value — an empty box is a hole in the\n * card, and the caller's own sentence is the better answer there.\n *\n * Needs `recharts`, like everything behind `@eifi1/ui-kit/chart`.\n */\nexport function Treemap({\n  data,\n  valueFormatter,\n  height = \"20rem\",\n  onNodeClick,\n  redactNames = false,\n  nodeNote,\n  maxTiles,\n  colors,\n  style,\n  ...rest\n}: TreemapProps) {\n  const tokenHex = useChartTokenHex();\n  // Read off the DOM after mount: the `dir` a treemap sits under is an ancestor's\n  // attribute, and SVG text anchoring cannot follow it by CSS (see TreemapCell). Again\n  // on new data, because a map that had nothing to draw rendered no root to read.\n  const rootRef = useRef<HTMLDivElement>(null);\n  const [dir, setDir] = useState<Direction>(\"ltr\");\n  useLayoutEffect(() => {\n    setDir(dirOf(rootRef.current));\n  }, [data]);\n  const ramp = colors && colors.length > 0 ? colors : tokenHex;\n  // Coloured by index into `data` AS GIVEN, before anything is dropped: a caller\n  // painting a legend or a second map from the same list must land on the same hue\n  // for the same row, and filtering first would shift every colour after a gap.\n  const nodes = data\n    .map((d, idx) => ({\n      id: d.id,\n      name: d.name,\n      size: d.value,\n      fill: d.fill ?? ramp[idx % ramp.length],\n      // recharts hands each node's fields to its cell; a field left out of this map\n      // never reaches `TreemapCell` (0.8.0 shipped `labelColor` without it — keksdose).\n      labelColor: d.labelColor,\n    }))\n    .filter((n) => Number.isFinite(n.size) && n.size > 0)\n    .slice(0, maxTiles ?? undefined);\n  if (nodes.length === 0) return null;\n  const box = chartHeightProps(height);\n\n  // The share is of what is DRAWN, so it always reads as \"of this picture\".\n  const total = nodes.reduce((acc, n) => acc + n.size, 0);\n  const format = (v: number): ReactNode => {\n    const share = total > 0 ? v / total : undefined;\n    return valueFormatter ? valueFormatter(v, share) : formatWithMinus(DEFAULT_NUMBER, v);\n  };\n  const Content = redactNames ? RedactedTooltipContent : ChartTooltipContent;\n  return (\n    <ChartContainer\n      {...rest}\n      ref={rootRef}\n      config={TREEMAP_CONFIG}\n      className={cn(box.className, rest.className)}\n      style={{ ...style, ...box.style }}\n    >\n      {/* No chart-level `stroke`: recharts spreads it onto the <svg> root, from where\n          it inherits into every label (see TreemapCell). Each cell strokes its own rect. */}\n      <RechartsTreemap\n        data={nodes}\n        dataKey=\"size\"\n        fill=\"var(--chart-1)\"\n        isAnimationActive={false}\n        content={<TreemapCell onNodeClick={onNodeClick} redactNames={redactNames} nodeNote={nodeNote} dir={dir} />}\n      >\n        <ChartTooltip content={<Content hideLabel valueFormatter={format} />} />\n      </RechartsTreemap>\n    </ChartContainer>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/trigger-aria.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/trigger-aria.ts"],"sourcesContent":["// Internal — not re-exported from the barrel. Shared by the pickers whose trigger is\n// a `role=\"combobox\"` button inside a wrapper: DatePicker, DateRangePicker, MonthPicker.\n\n/**\n * The attributes that NAME or DESCRIBE a field, which belong on its trigger — the\n * element a `<label htmlFor>`, a form library's control slot or an error message has\n * to reach. They used to land on the wrapper `<div>` with the rest of the caller's\n * props, so an external label named nothing and a form library's `aria-describedby`\n * pointed a screen reader at an element with no role (kastlan, 0.5.0).\n */\nexport interface TriggerAria {\n  id?: string;\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n  \"aria-describedby\"?: string;\n  \"aria-invalid\"?: boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\";\n  /** 0.23.0: a form library's `required` (RhfMonthPicker) is announced on the trigger,\n   *  not lost on the wrapper. */\n  \"aria-required\"?: boolean | \"true\" | \"false\";\n}\n\n/** Split a field's props into what its trigger takes and what its wrapper takes. */\nexport function splitTriggerAria<T extends TriggerAria>(\n  props: T,\n): [TriggerAria, Omit<T, keyof TriggerAria>] {\n  const {\n    id,\n    \"aria-label\": label,\n    \"aria-labelledby\": labelledBy,\n    \"aria-describedby\": describedBy,\n    \"aria-invalid\": invalid,\n    \"aria-required\": required,\n    ...rest\n  } = props;\n  return [\n    {\n      id,\n      \"aria-label\": label,\n      \"aria-labelledby\": labelledBy,\n      \"aria-describedby\": describedBy,\n      \"aria-invalid\": invalid,\n      \"aria-required\": required,\n    },\n    rest,\n  ];\n}\n\n"],"mappings":";AAsBO,SAAS,iBACd,OAC2C;AAC3C,QAAM;AAAA,IACJ;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,IACpB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,GAAG;AAAA,EACL,IAAI;AACJ,SAAO;AAAA,IACL;AAAA,MACE;AAAA,MACA,cAAc;AAAA,MACd,mBAAmB;AAAA,MACnB,oBAAoB;AAAA,MACpB,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AACF;","names":[]}
+{"version":3,"sources":["../../src/components/trigger-aria.ts"],"sourcesContent":["// Internal — not re-exported from the barrel. Shared by the pickers whose trigger is\n// a `role=\"combobox\"` button inside a wrapper: DatePicker, DateRangePicker, MonthPicker.\n\n/**\n * The attributes that NAME or DESCRIBE a field, which belong on its trigger — the\n * element a `<label htmlFor>`, a form library's control slot or an error message has\n * to reach. They used to land on the wrapper `<div>` with the rest of the caller's\n * props, so an external label named nothing and a form library's `aria-describedby`\n * pointed a screen reader at an element with no role (kastlan, 0.5.0).\n */\nexport interface TriggerAria {\n  id?: string;\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n  \"aria-describedby\"?: string;\n  \"aria-invalid\"?: boolean | \"true\" | \"false\" | \"grammar\" | \"spelling\";\n  /** 0.23.0: a form library's `required` (RhfMonthPicker) is announced on the trigger,\n   *  not lost on the wrapper. */\n  \"aria-required\"?: boolean | \"true\" | \"false\";\n}\n\n/** Split a field's props into what its trigger takes and what its wrapper takes. */\nexport function splitTriggerAria<T extends TriggerAria>(props: T): [TriggerAria, Omit<T, keyof TriggerAria>] {\n  const {\n    id,\n    \"aria-label\": label,\n    \"aria-labelledby\": labelledBy,\n    \"aria-describedby\": describedBy,\n    \"aria-invalid\": invalid,\n    \"aria-required\": required,\n    ...rest\n  } = props;\n  return [\n    {\n      id,\n      \"aria-label\": label,\n      \"aria-labelledby\": labelledBy,\n      \"aria-describedby\": describedBy,\n      \"aria-invalid\": invalid,\n      \"aria-required\": required,\n    },\n    rest,\n  ];\n}\n"],"mappings":";AAsBO,SAAS,iBAAwC,OAAqD;AAC3G,QAAM;AAAA,IACJ;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,IACpB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,GAAG;AAAA,EACL,IAAI;AACJ,SAAO;AAAA,IACL;AAAA,MACE;AAAA,MACA,cAAc;AAAA,MACd,mBAAmB;AAAA,MACnB,oBAAoB;AAAA,MACpB,gBAAgB;AAAA,MAChB,iBAAiB;AAAA,IACnB;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/components/use-table-state.js

@@ -4,12 +4,7 @@ import * as ReactRouter from "react-router";
 import { useLocation, useSearchParams } from "react-router";
 import { useKitTableStorageKeyPrefix } from "../i18n/kit-labels.js";
 import { readStored, writeStored } from "../lib/safe-storage.js";
-import {
-  decodeFilterValue,
-  encodeFilterValue,
-  isFilterActive,
-  resolveFilter
-} from "./data-table-filters.js";
+import { decodeFilterValue, encodeFilterValue, isFilterActive, resolveFilter } from "./data-table-filters.js";
 import { decodeSorts, encodeSorts, normalizeSorts } from "./data-table-sort.js";
 function withDefaultHidden(view, defaults) {
   const extra = defaults.filter((k) => !view.hidden.has(k) && !view.shown.has(k));
@@ -168,10 +163,7 @@ function useTableState({
   const [urlInitial] = useState(
     () => urlSync ? readTableUrlState(searchParams, columns, urlPrefix) : {}
   );
-  const initial = useMemo(
-    () => loadPersisted(storageKey, storageKeyPrefix),
-    [storageKey, storageKeyPrefix]
-  );
+  const initial = useMemo(() => loadPersisted(storageKey, storageKeyPrefix), [storageKey, storageKeyPrefix]);
   const [internalSorts, setInternalSorts] = useState(
     () => urlInitial.sorts !== void 0 ? urlInitial.sorts : normalizeSorts(initial.sort)
   );
@@ -247,7 +239,18 @@ function useTableState({
     if (!urlSync) return;
     if (lastUrl.current === urlSig) return;
     lastUrl.current = urlSig;
-    writeUrlState(setSearchParams, columns, sorts, filters, pageSize, page, defaultPageSize, void 0, locationState, keys);
+    writeUrlState(
+      setSearchParams,
+      columns,
+      sorts,
+      filters,
+      pageSize,
+      page,
+      defaultPageSize,
+      void 0,
+      locationState,
+      keys
+    );
   }, [urlSync, urlSig]);
   return {
     sorts,

package/dist/components/use-table-state.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/use-table-state.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type { SetStateAction } from \"react\";\nimport * as ReactRouter from \"react-router\";\nimport { useLocation, useSearchParams } from \"react-router\";\nimport { useKitTableStorageKeyPrefix } from \"../i18n/kit-labels\";\nimport { readStored, writeStored } from \"../lib/safe-storage\";\nimport {\n  decodeFilterValue,\n  encodeFilterValue,\n  isFilterActive,\n  resolveFilter,\n} from \"./data-table-filters\";\nimport { decodeSorts, encodeSorts, normalizeSorts, type SortState } from \"./data-table-sort\";\nimport type { DataTableColumn, FilterState, ServerPagination } from \"./data-table\";\n\n// ---------- Persisted + URL-encoded view state ----------\n//\n// Moved here with `useTableState` when `DataTable` was split: these are what the hook\n// reads and writes, and nothing else in the table ever called them.\n\ninterface PersistedState {\n  // Multi-sort array; blobs from before the upgrade hold a single {key, dir}\n  // object (or null) — read back through normalizeSorts.\n  sort: SortState[] | { key: string; dir: string } | null;\n  filters: FilterState;\n  pageSize: number | \"all\";\n  widths?: Record<string, number>;\n  hidden?: string[];\n  /** 0.48: the `defaultHidden` columns the user ticked back on — an entry that beats the\n   *  default. Written only when non-empty, so a table without such columns stores what\n   *  it always did. */\n  shown?: string[];\n}\n\n/** The hidden set as drawn: the stored one plus every `defaultHidden` column the view\n *  holds no entry for (neither hidden nor `shown`). */\nfunction withDefaultHidden(view: { hidden: Set<string>; shown: Set<string> }, defaults: string[]): Set<string> {\n  const extra = defaults.filter((k) => !view.hidden.has(k) && !view.shown.has(k));\n  return extra.length === 0 ? view.hidden : new Set([...view.hidden, ...extra]);\n}\n\nexport const DEFAULT_PERSIST_PREFIX = \"hbui-table:\";\n\nfunction loadPersisted(storageKey: string | undefined, prefix: string): Partial<PersistedState> {\n  if (!storageKey) return {};\n  const raw = readStored(prefix + storageKey);\n  if (!raw) return {};\n  try {\n    const parsed = JSON.parse(raw) as Partial<PersistedState>;\n    return parsed && typeof parsed === \"object\" ? parsed : {};\n  } catch {\n    return {}; // corrupt JSON — the storage access itself is guarded by readStored\n  }\n}\n\n/** The blob that would be stored — also the value the effect below compares by, so\n *  the comparison and the write can never disagree about what \"unchanged\" means. */\nfunction serializePersisted(state: PersistedState): string {\n  return JSON.stringify(state);\n}\n\n/** A stored page size as a table holds it — `\"all\"` is `Infinity` — or `fallback`. */\nfunction storedPageSize(stored: Partial<PersistedState>, fallback: number): number {\n  if (stored.pageSize === \"all\") return Infinity;\n  if (typeof stored.pageSize === \"number\" && stored.pageSize > 0) return stored.pageSize;\n  return fallback;\n}\n\n// ---------- URL sync helpers ----------\n\nconst URL_FILTER_PREFIX = \"f.\";\nconst URL_SORT_KEY = \"sort\";\nconst URL_PAGE_KEY = \"p\";\nconst URL_PAGE_SIZE_KEY = \"ps\";\n/** The free-text search term — managed only by {@link useTableUrlState}, and only when\n *  it is asked to (`search: true`); a plain `urlSync` table leaves a `q` alone. */\nconst URL_SEARCH_KEY = \"q\";\n\n/**\n * How a table is mirrored into the URL: `true`, or `{ prefix }` for a table that shares\n * its page with another URL-synced one. The prefix is put verbatim in front of EVERY key\n * the table writes and reads — `{ prefix: \"inv.\" }` gives `inv.f.<column>`, `inv.sort`,\n * `inv.p`, `inv.ps` (and `inv.q`) — so two tables on one page stop sharing a sort and a\n * page. Without one the keys are unprefixed, as they always were.\n */\nexport type TableUrlSync = boolean | { prefix?: string };\n\n/** The query keys of one table, with its prefix applied. */\ninterface UrlKeys {\n  filter: string;\n  sort: string;\n  page: string;\n  pageSize: string;\n  search: string;\n}\n\nfunction urlKeys(prefix = \"\"): UrlKeys {\n  return {\n    filter: prefix + URL_FILTER_PREFIX,\n    sort: prefix + URL_SORT_KEY,\n    page: prefix + URL_PAGE_KEY,\n    pageSize: prefix + URL_PAGE_SIZE_KEY,\n    search: prefix + URL_SEARCH_KEY,\n  };\n}\n\n/** What a table reads and writes the URL through: react-router's, or none. */\ninterface TableSearch {\n  searchParams: URLSearchParams;\n  setSearchParams: ReturnType<typeof useSearchParams>[1];\n  locationState: unknown;\n}\n\nfunction useRouterSearch(): TableSearch {\n  const [searchParams, setSearchParams] = useSearchParams();\n  const location = useLocation();\n  return { searchParams, setSearchParams, locationState: location.state };\n}\n\nconst NO_ROUTER_SEARCH: TableSearch = {\n  searchParams: new URLSearchParams(),\n  setSearchParams: () => {},\n  locationState: null,\n};\nfunction useNoRouterSearch(): TableSearch {\n  return NO_ROUTER_SEARCH;\n}\n\n/**\n * `useInRouterContext`, read off the namespace inside a `try` like\n * use-search-param-state's probe: a test's `vi.mock(\"react-router\", () => ({ … }))`\n * without it throws on the read. Missing, a table assumes a Router, as before 0.49.\n */\nfunction readInRouterContext(): () => boolean {\n  try {\n    return (ReactRouter as unknown as { useInRouterContext?: () => boolean }).useInRouterContext ?? (() => true);\n  } catch {\n    return () => true;\n  }\n}\nconst useInRouterContext = readInRouterContext();\n\n/**\n * The URL access a table needs (0.49, KIT-3). Without `urlSync` a table needs no Router:\n * before 0.49 it called `useSearchParams()` unconditionally and threw outside one even\n * with URL sync off. With `urlSync` and no Router, a development build throws a message\n * that names the fix; a production build keeps the view in local state rather than\n * crash the page. Whether a Router is around does not change during a table's life, so\n * which hook runs is stable from render to render.\n */\nfunction useTableSearch(urlSync: boolean, owner: string): TableSearch {\n  const inRouter = useInRouterContext();\n  if (!inRouter && urlSync && import.meta.env?.DEV) {\n    throw new Error(\n      `${owner} urlSync requires a Router: render it inside a react-router Router ` +\n        \"(BrowserRouter, a data router or a MemoryRouter), or leave urlSync off.\",\n    );\n  }\n  const useSearch = inRouter ? useRouterSearch : useNoRouterSearch;\n  return useSearch();\n}\n\n/** `urlSync` split into \"is it on\" and \"under which prefix\". */\nfunction resolveTableUrlSync(urlSync: TableUrlSync | undefined): { enabled: boolean; prefix: string } {\n  if (!urlSync) return { enabled: false, prefix: \"\" };\n  return { enabled: true, prefix: urlSync === true ? \"\" : (urlSync.prefix ?? \"\") };\n}\n\n/** What {@link readTableUrlState} found in a query string. */\nexport interface TableUrlState {\n  sorts?: SortState[];\n  filters?: FilterState;\n  /** `Infinity` for `ps=all`. */\n  pageSize?: number;\n  /** 0-based (the URL's `p` is 1-based). */\n  page?: number;\n}\n\n/**\n * What a table's URL says, read out of a query string: the column filters (`f.<key>`),\n * the sort, the page size and the 0-based page. Absent keys are absent here too, so a\n * caller can tell \"not in the link\" from \"the default\". The same reader `urlSync` uses\n * on mount, exported for an owner that keeps the state itself — see\n * {@link useTableUrlState}.\n *\n * Pass the ROUTER's query string — the one `setSearchParams` writes — and the table's\n * `prefix` when it has one (see {@link TableUrlSync}).\n *\n * This read `window.location.search` until 0.7.0, which is the same string only under a\n * BrowserRouter. Under a HashRouter the router's query lives after the `#`\n * (`/#/tx?f.payee=Rewe`) and `window.location.search` is empty: a shared link opened\n * unfiltered, and the table's first write then replaced the link's filter with its own\n * empty state. Reading and writing through `useSearchParams` is one source for both\n * directions under every router, MemoryRouter included.\n */\nexport function readTableUrlState<T>(\n  sp: URLSearchParams,\n  columns: DataTableColumn<T>[],\n  prefix?: string,\n): TableUrlState {\n  const keys = urlKeys(prefix);\n  const out: TableUrlState = {};\n\n  const filters: FilterState = {};\n  for (const col of columns) {\n    const filter = resolveFilter(col);\n    if (!filter) continue;\n    const raw = sp.get(keys.filter + col.key);\n    if (raw == null) continue;\n    filters[col.key] = decodeFilterValue(filter, raw);\n  }\n  if (Object.keys(filters).length) out.filters = filters;\n\n  const sortRaw = sp.get(keys.sort);\n  if (sortRaw) {\n    const decoded = decodeSorts(sortRaw, new Set(columns.map((c) => c.key)));\n    if (decoded.length) out.sorts = decoded;\n  }\n\n  const psRaw = sp.get(keys.pageSize);\n  if (psRaw === \"all\") out.pageSize = Infinity;\n  else if (psRaw && Number(psRaw) > 0) out.pageSize = Number(psRaw);\n\n  const pRaw = sp.get(keys.page);\n  if (pRaw && Number(pRaw) >= 1) out.page = Number(pRaw) - 1;\n\n  return out;\n}\n\n/**\n * The managed part of the query string, as a string, for comparing by VALUE.\n *\n * Everything the table puts in the address and nothing else, in a fixed order.\n * `columns` is walked for its keys only, which is why it can be left out of the\n * effect's dependencies without lying: a new column ARRAY carrying the same keys\n * produces the same signature, and a genuinely different set of filterable columns\n * produces a different one.\n */\nfunction urlSignature<T>(\n  columns: DataTableColumn<T>[],\n  sorts: SortState[],\n  filters: FilterState,\n  pageSize: number,\n  page: number,\n  defaultPageSize: number,\n  keys: UrlKeys,\n): string {\n  const parts: string[] = [];\n  for (const col of columns) {\n    const state = filters[col.key];\n    if (!state || !isFilterActive(state)) continue;\n    const enc = encodeFilterValue(state);\n    if (enc != null) parts.push(`${keys.filter}${col.key}=${enc}`);\n  }\n  parts.push(`${keys.sort}=${encodeSorts(sorts)}`);\n  parts.push(\n    `${keys.pageSize}=${\n      pageSize === Infinity ? \"all\" : pageSize === defaultPageSize ? \"\" : String(pageSize)\n    }`,\n  );\n  parts.push(`${keys.page}=${page > 0 ? String(page + 1) : \"\"}`);\n  return parts.join(\"&\");\n}\n\nfunction writeUrlState<T>(\n  setSearchParams: ReturnType<typeof useSearchParams>[1],\n  columns: DataTableColumn<T>[],\n  sorts: SortState[],\n  filters: FilterState,\n  pageSize: number,\n  page: number,\n  defaultPageSize: number,\n  // `undefined`: the search term is not ours to manage, and a `q` is left as it is.\n  search: string | undefined,\n  // The current entry's route state, carried over the replace. A query rewrite is not\n  // a navigation, and dropping the state would, for one, lose the mark a URL-bound\n  // dialog's opener leaves there (see useDialogParam).\n  state: unknown,\n  keys: UrlKeys,\n): void {\n  setSearchParams(\n    (prev) => {\n      const next = new URLSearchParams(prev);\n      // clear managed keys\n      for (const col of columns) next.delete(keys.filter + col.key);\n      next.delete(keys.sort);\n      next.delete(keys.page);\n      next.delete(keys.pageSize);\n      if (search !== undefined) {\n        next.delete(keys.search);\n        if (search.trim()) next.set(keys.search, search);\n      }\n      // write filters\n      for (const col of columns) {\n        const state = filters[col.key];\n        if (!state || !isFilterActive(state)) continue;\n        const enc = encodeFilterValue(state);\n        if (enc != null) next.set(keys.filter + col.key, enc);\n      }\n      // write sort\n      const sortEnc = encodeSorts(sorts);\n      if (sortEnc) next.set(keys.sort, sortEnc);\n      // write page size if non-default\n      if (pageSize === Infinity) next.set(keys.pageSize, \"all\");\n      else if (pageSize !== defaultPageSize) next.set(keys.pageSize, String(pageSize));\n      // write page if not first\n      if (page > 0) next.set(keys.page, String(page + 1));\n      return next;\n    },\n    { replace: true, state },\n  );\n}\n\n/**\n * Where a table's view lives: what it is sorted and filtered by, which page, how wide\n * the columns are and which are hidden — plus the two places that outlives a render.\n *\n * Lifted out of `DataTable`, which was 984 lines and twenty hooks in one function. This\n * is the part that is genuinely about STATE rather than about drawing, and the three\n * rules it encodes are easy to lose among the markup:\n *\n * * **The URL is read once, on mount.** A shared or deep link populates the initial view;\n *   after that the state is local, or the browser's own history would fight the user's\n *   next click.\n * * **Sorting and filtering are optionally CONTROLLED.** A server-driven table passes\n *   state and a callback and owns them; everything else is self-owned. That is the\n *   `sortsProp ?? internalSorts` pair, and it is why the setters are exposed separately.\n * * **Persistence writes on every change, the URL only when asked.** `storageKey` is the\n *   per-table identity; `urlSync` is opt-in because only some tables want their view in\n *   a shareable address.\n * * **A controlled filter, sort or page size that changes sends the table back to page\n *   1.** See the note at the reset below.\n */\nexport function useTableState<T>({\n  columns,\n  storageKey,\n  storageKeyPrefix,\n  urlSync: urlSyncOption,\n  defaultPageSize,\n  sortsProp,\n  filtersProp,\n  pageSizeProp,\n}: {\n  columns: DataTableColumn<T>[];\n  storageKey?: string;\n  storageKeyPrefix: string;\n  urlSync?: TableUrlSync;\n  defaultPageSize: number;\n  sortsProp?: SortState[];\n  filtersProp?: FilterState;\n  pageSizeProp?: number;\n}) {\n  const { enabled: urlSync, prefix: urlPrefix } = resolveTableUrlSync(urlSyncOption);\n  const keys = useMemo(() => urlKeys(urlPrefix), [urlPrefix]);\n  // The SAME pair is used to read and to write; see `readTableUrlState`. No Router is\n  // needed without `urlSync` (0.49, KIT-3; see `useTableSearch`).\n  const { searchParams, setSearchParams, locationState } = useTableSearch(urlSync, \"DataTable\");\n  // Read URL once on mount so URL-encoded views (e.g. shared links, deep links from\n  // other pages) populate initial state. After mount, state is local.\n  const [urlInitial] = useState<TableUrlState>(() =>\n    urlSync ? readTableUrlState(searchParams, columns, urlPrefix) : {},\n  );\n  const initial = useMemo(\n    () => loadPersisted(storageKey, storageKeyPrefix),\n    [storageKey, storageKeyPrefix],\n  );\n  const [internalSorts, setInternalSorts] = useState<SortState[]>(() =>\n    urlInitial.sorts !== undefined ? urlInitial.sorts : normalizeSorts(initial.sort),\n  );\n  const [internalFilters, setInternalFilters] = useState<FilterState>(\n    () => urlInitial.filters ?? initial.filters ?? {},\n  );\n  // Controlled when the owner passes state + callback (server-driven tables);\n  // self-owned otherwise.\n  const sorts = sortsProp ?? internalSorts;\n  const filters = filtersProp ?? internalFilters;\n  const [page, setPage] = useState(() => urlInitial.page ?? 0);\n\n  // ---- Controlled filters/sorts reset the page ----\n  //\n  // A self-owned table resets to page 1 in the filter handlers. A CONTROLLED one could\n  // not: the handlers hand the change to the owner and return, and `page` lives here,\n  // where the owner has no way to reach it — so narrowing a filter from outside (a\n  // saved view, a chip dismissed above the table) left a client-side table on page 4\n  // of what was now two pages, clamped to the last one instead of the first.\n  //\n  // So the table does it: whenever the controlled VALUE changes, back to the first\n  // page. Compared by value, because a controlled prop is a fresh object on every\n  // parent render. Adjusted during render rather than in an effect, so the stale page\n  // is never painted and never written to the URL. Not on mount: a deep link's `p=3`\n  // must survive the owner's first render. (In `serverPagination` mode this state is\n  // unused — the owner's `page` is the page, and resetting it stays the owner's job.)\n  // A controlled page size counts too: the groups of `TranslationReviewPanel` share one,\n  // and a group paged deep into its rows starts over when another group's pager changes it.\n  const controlledSig =\n    sortsProp !== undefined || filtersProp !== undefined || pageSizeProp !== undefined\n      ? JSON.stringify([sortsProp ?? null, filtersProp ?? null, String(pageSizeProp)])\n      : null;\n  const [seenControlledSig, setSeenControlledSig] = useState(controlledSig);\n  if (seenControlledSig !== controlledSig) {\n    setSeenControlledSig(controlledSig);\n    setPage(0);\n  }\n  const [internalPageSize, setPageSize] = useState<number>(() =>\n    urlInitial.pageSize !== undefined ? urlInitial.pageSize : storedPageSize(initial, defaultPageSize),\n  );\n  const pageSize = pageSizeProp ?? internalPageSize;\n  const [widths, setWidths] = useState<Record<string, number>>(() => initial.widths ?? {});\n  // Hidden columns (0.48, keksdose #617): what the user chose — `hidden`, and `shown`\n  // for a `defaultHidden` column ticked back on — kept apart from the defaults, which\n  // are applied on read and never stored. Keyed on the default keys as a string: every\n  // call site builds `columns` inline, so the array is new on every render.\n  const [view, setView] = useState(() => ({\n    hidden: new Set<string>(initial.hidden ?? []),\n    shown: new Set<string>(initial.shown ?? []),\n  }));\n  const defaultHiddenSig = columns\n    .filter((c) => c.defaultHidden)\n    .map((c) => c.key)\n    .join(\"\\u0000\");\n  const hiddenCols = useMemo(\n    () => withDefaultHidden(view, defaultHiddenSig ? defaultHiddenSig.split(\"\\u0000\") : []),\n    [view, defaultHiddenSig],\n  );\n  // The panel hands over the next DRAWN set; what changed is recorded as a choice.\n  const setHiddenCols = useCallback(\n    (action: SetStateAction<Set<string>>) =>\n      setView((v) => {\n        const defaults = defaultHiddenSig ? defaultHiddenSig.split(\"\\u0000\") : [];\n        const prev = withDefaultHidden(v, defaults);\n        const next = typeof action === \"function\" ? action(prev) : action;\n        const hidden = new Set(v.hidden);\n        const shown = new Set(v.shown);\n        for (const k of next) {\n          if (prev.has(k)) continue;\n          hidden.add(k);\n          shown.delete(k);\n        }\n        for (const k of prev) {\n          if (next.has(k)) continue;\n          hidden.delete(k);\n          if (defaults.includes(k)) shown.add(k);\n        }\n        return { hidden, shown };\n      }),\n    [defaultHiddenSig],\n  );\n  const [showSettings, setShowSettings] = useState(false);\n  const headRefs = useMemo(() => new Map<string, HTMLTableCellElement>(), []);\n\n  // ---- Writing out: both of these compare by VALUE ----\n  //\n  // A CONTROLLED table (`sorts`/`filters` props plus callbacks — every server-driven\n  // one) receives a freshly-built object on every render of the page around it, and\n  // `{}` is never `===` the `{}` before it. Keyed on identity, both effects below\n  // therefore fired on every unrelated parent render: persistence wrote the same JSON\n  // into `localStorage` each time — a synchronous main-thread write, on a page whose\n  // other half may be a form being typed into — and the URL one handed react-router a\n  // `replace` it answers with a render, which is the loop the audit records. A `ref`\n  // holding what was last written is what makes \"changed\" mean changed.\n  const lastPersisted = useRef<string | null>(null);\n  const persisted = !storageKey\n    ? \"\"\n    : serializePersisted({\n        sort: sorts,\n        filters,\n        pageSize: pageSize === Infinity ? \"all\" : pageSize,\n        widths,\n        hidden: Array.from(view.hidden),\n        ...(view.shown.size > 0 ? { shown: Array.from(view.shown) } : {}),\n      });\n  useEffect(() => {\n    if (!storageKey) return;\n    // The destination is part of the signature: two tables can hold identical state,\n    // and a table that swaps `storageKey` has to write under the new one even though\n    // nothing about the view changed.\n    const target = storageKeyPrefix + storageKey;\n    const sig = `${target}\\u0000${persisted}`;\n    if (lastPersisted.current === sig) return;\n    lastPersisted.current = sig;\n    writeStored(target, persisted);\n  }, [storageKey, storageKeyPrefix, persisted]);\n\n  const lastUrl = useRef<string | null>(null);\n  const urlSig = urlSync\n    ? urlSignature(columns, sorts, filters, pageSize, page, defaultPageSize, keys)\n    : \"\";\n  useEffect(() => {\n    if (!urlSync) return;\n    if (lastUrl.current === urlSig) return;\n    lastUrl.current = urlSig;\n    // `columns` is deliberately not a dependency and does not need to be: the\n    // signature above is computed from it, so a column set that would produce a\n    // different address produces a different signature first.\n    writeUrlState(setSearchParams, columns, sorts, filters, pageSize, page, defaultPageSize, undefined, locationState, keys);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [urlSync, urlSig]);\n\n  return {\n    sorts,\n    filters,\n    setInternalSorts,\n    setInternalFilters,\n    page,\n    setPage,\n    pageSize,\n    setPageSize,\n    widths,\n    setWidths,\n    hiddenCols,\n    setHiddenCols,\n    showSettings,\n    setShowSettings,\n    headRefs,\n  };\n}\n\n// ---------- One view over several tables ----------\n\n/** What {@link useSharedTableView} keeps. */\nexport interface SharedTableView {\n  sorts: SortState[];\n  setSorts: (next: SortState[]) => void;\n  /** `Infinity` for \"all\", as a table holds it. */\n  pageSize: number;\n  setPageSize: (next: number) => void;\n}\n\n/**\n * One table view — the sort and the page size — for an owner that draws it as SEVERAL\n * tables over one `storageKey`: `TranslationReviewPanel`'s groups, which sort and page\n * alike (0.35, Kurvenschmiede: its grouped review stored no view at all). Pass them to\n * each table as `sorts`/`onSortsChange` and `pageSize`/`onPageSizeChange`.\n *\n * Kept in the very blob a `DataTable` with that `storageKey` keeps, not in a format of\n * its own, so the single table and the groups read each other's view. What the blob\n * holds besides (filters, column widths, hidden columns) is carried over as stored, for\n * the single table to find as it left it. Read when `active` turns on — on mount, or\n * when the owner switches to this view — and written on a change, never on a read. The\n * prefix resolves as DataTable's does: prop > provider > the kit's.\n */\nexport function useSharedTableView({\n  active,\n  storageKey,\n  storageKeyPrefix,\n  defaultPageSize,\n}: {\n  active: boolean;\n  storageKey?: string;\n  storageKeyPrefix?: string;\n  defaultPageSize: number;\n}): SharedTableView {\n  const providerPrefix = useKitTableStorageKeyPrefix();\n  const prefix = storageKeyPrefix ?? providerPrefix ?? DEFAULT_PERSIST_PREFIX;\n  const read = () => {\n    const stored = active ? loadPersisted(storageKey, prefix) : {};\n    return { sorts: normalizeSorts(stored.sort), pageSize: storedPageSize(stored, defaultPageSize) };\n  };\n  const [view, setView] = useState(read);\n  // Adjusted during render when `active` turns on, so the first render of the groups\n  // already has the view the single table left, not a frame of the default.\n  const [wasActive, setWasActive] = useState(active);\n  if (active !== wasActive) {\n    setWasActive(active);\n    if (active) setView(read());\n  }\n  const change = (patch: Partial<typeof view>) => {\n    const next = { ...view, ...patch };\n    setView(next);\n    if (!active || !storageKey) return;\n    const stored = loadPersisted(storageKey, prefix);\n    const blob: PersistedState = {\n      sort: next.sorts,\n      filters: stored.filters ?? {},\n      pageSize: next.pageSize === Infinity ? \"all\" : next.pageSize,\n      widths: stored.widths,\n      hidden: stored.hidden,\n    };\n    writeStored(prefix + storageKey, serializePersisted(blob));\n  };\n  return {\n    sorts: view.sorts,\n    setSorts: (sorts) => change({ sorts }),\n    pageSize: view.pageSize,\n    setPageSize: (pageSize) => change({ pageSize }),\n  };\n}\n\n// ---------- Owner-held table state, mirrored to the URL ----------\n\nexport interface UseTableUrlStateOptions<T> {\n  /** The table's columns — read for their keys and filter types only. */\n  columns: DataTableColumn<T>[];\n  /** Default 25. A page size equal to it is left out of the URL. */\n  defaultPageSize?: number;\n  /** Mirror the state into the URL and seed it from there on mount. Default true.\n   *  `{ prefix }` puts a prefix in front of every key, for a page with two URL-synced\n   *  tables — see {@link TableUrlSync}. */\n  urlSync?: TableUrlSync;\n  /** Shorthand for `urlSync: { prefix }`; wins over a prefix given there. */\n  urlPrefix?: string;\n  /** Also hold a free-text search term, under `q`. Off by default, so a `q` that\n   *  belongs to someone else on the page is never touched. */\n  search?: boolean;\n}\n\n/** The part of {@link DataTableProps} a server-driven table takes from its owner. */\nexport interface TableUrlStateProps {\n  serverPagination: ServerPagination;\n  filters: FilterState;\n  onFiltersChange: (next: FilterState) => void;\n  sorts: SortState[];\n  onSortsChange: (next: SortState[]) => void;\n}\n\nexport interface UseTableUrlStateReturn {\n  /** 0-based. */\n  page: number;\n  setPage: (page: number) => void;\n  pageSize: number;\n  /** Also back to the first page. */\n  setPageSize: (pageSize: number) => void;\n  filters: FilterState;\n  /** Also back to the first page. */\n  setFilters: (next: FilterState) => void;\n  sorts: SortState[];\n  /** Also back to the first page. */\n  setSorts: (next: SortState[]) => void;\n  /** The search term (`\"\"` unless `search: true`). */\n  search: string;\n  /** Also back to the first page. */\n  setSearch: (next: string) => void;\n  /**\n   * Everything the table needs, to spread onto it:\n   * `<DataTable {...table.tableProps(data?.total ?? 0, { isLoading })} rows={…} … />`.\n   */\n  tableProps: (total: number, options?: { isLoading?: boolean }) => TableUrlStateProps;\n}\n\ninterface OwnedState {\n  sorts: SortState[];\n  filters: FilterState;\n  pageSize: number;\n  page: number;\n  search: string;\n}\n\n/**\n * The controlled state of a `serverPagination` table — filters, sorts, page, page size\n * and optionally a search term — kept by the OWNER and mirrored into the URL in the\n * table's own scheme (`f.<key>`, `sort`, `p`, `ps`, and `q`).\n *\n * A server-driven table owns none of this: the owner has to hold it to turn it into\n * the query that fetches `rows`, and until now it also had to restate the table's URL\n * codec to keep the view bookmarkable (kastlan's use-server-table.ts copied\n * `readUrlState` / `writeUrlState` to do it). Same rules as `urlSync`:\n *\n * * **The URL is read once, on mount** — a shared or deep link (see {@link filterHref})\n *   seeds the view; after that the state is local and written out with `replace`.\n * * **Any change but the page itself goes back to page 1** — a narrower filter must not\n *   leave the user on page 7 of 2.\n * * **Written by value**: an unchanged view writes nothing, however often the owner\n *   renders.\n *\n * Mapping the state onto the backend's query parameters stays the owner's: that is the\n * part the kit cannot know.\n */\nexport function useTableUrlState<T>({\n  columns,\n  defaultPageSize = 25,\n  urlSync: urlSyncOption = true,\n  urlPrefix: urlPrefixOption,\n  search: manageSearch = false,\n}: UseTableUrlStateOptions<T>): UseTableUrlStateReturn {\n  const resolved = resolveTableUrlSync(urlSyncOption);\n  const urlSync = resolved.enabled;\n  const urlPrefix = urlPrefixOption ?? resolved.prefix;\n  const keys = useMemo(() => urlKeys(urlPrefix), [urlPrefix]);\n  const { searchParams, setSearchParams, locationState } = useTableSearch(urlSync, \"useTableUrlState\");\n  const [state, setState] = useState<OwnedState>(() => {\n    const url = urlSync ? readTableUrlState(searchParams, columns, urlPrefix) : {};\n    return {\n      sorts: url.sorts ?? [],\n      filters: url.filters ?? {},\n      pageSize: url.pageSize ?? defaultPageSize,\n      page: url.page ?? 0,\n      search: urlSync && manageSearch ? (searchParams.get(keys.search) ?? \"\") : \"\",\n    };\n  });\n\n  const lastUrl = useRef<string | null>(null);\n  const urlSig = urlSync\n    ? urlSignature(columns, state.sorts, state.filters, state.pageSize, state.page, defaultPageSize, keys) +\n      (manageSearch ? `&${keys.search}=${state.search.trim() ? state.search : \"\"}` : \"\")\n    : \"\";\n  useEffect(() => {\n    if (!urlSync) return;\n    // First run included: a link that arrives with `p=1` or a default `ps` is\n    // normalised to the table's own spelling, as `urlSync` does.\n    if (lastUrl.current === urlSig) return;\n    lastUrl.current = urlSig;\n    writeUrlState(\n      setSearchParams,\n      columns,\n      state.sorts,\n      state.filters,\n      state.pageSize,\n      state.page,\n      defaultPageSize,\n      manageSearch ? state.search : undefined,\n      locationState,\n      keys,\n    );\n    // Keyed on the signature, which is computed from everything the write reads — see\n    // the same effect in useTableState.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [urlSync, urlSig]);\n\n  const setPage = (page: number) => setState((s) => ({ ...s, page }));\n  const setPageSize = (pageSize: number) => setState((s) => ({ ...s, pageSize, page: 0 }));\n  const setFilters = (filters: FilterState) => setState((s) => ({ ...s, filters, page: 0 }));\n  const setSorts = (sorts: SortState[]) => setState((s) => ({ ...s, sorts, page: 0 }));\n  const setSearch = (search: string) => setState((s) => ({ ...s, search, page: 0 }));\n\n  return {\n    page: state.page,\n    setPage,\n    pageSize: state.pageSize,\n    setPageSize,\n    filters: state.filters,\n    setFilters,\n    sorts: state.sorts,\n    setSorts,\n    search: state.search,\n    setSearch,\n    tableProps: (total, options) => ({\n      serverPagination: {\n        page: state.page,\n        pageSize: state.pageSize,\n        total,\n        onPageChange: setPage,\n        onPageSizeChange: setPageSize,\n        isLoading: options?.isLoading,\n      },\n      filters: state.filters,\n      onFiltersChange: setFilters,\n      sorts: state.sorts,\n      onSortsChange: setSorts,\n    }),\n  };\n}\n"],"mappings":"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","names":["state"]}
+{"version":3,"sources":["../../src/components/use-table-state.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type { SetStateAction } from \"react\";\nimport * as ReactRouter from \"react-router\";\nimport { useLocation, useSearchParams } from \"react-router\";\nimport { useKitTableStorageKeyPrefix } from \"../i18n/kit-labels\";\nimport { readStored, writeStored } from \"../lib/safe-storage\";\nimport { decodeFilterValue, encodeFilterValue, isFilterActive, resolveFilter } from \"./data-table-filters\";\nimport { decodeSorts, encodeSorts, normalizeSorts, type SortState } from \"./data-table-sort\";\nimport type { DataTableColumn, FilterState, ServerPagination } from \"./data-table\";\n\n// ---------- Persisted + URL-encoded view state ----------\n//\n// Moved here with `useTableState` when `DataTable` was split: these are what the hook\n// reads and writes, and nothing else in the table ever called them.\n\ninterface PersistedState {\n  // Multi-sort array; blobs from before the upgrade hold a single {key, dir}\n  // object (or null) — read back through normalizeSorts.\n  sort: SortState[] | { key: string; dir: string } | null;\n  filters: FilterState;\n  pageSize: number | \"all\";\n  widths?: Record<string, number>;\n  hidden?: string[];\n  /** 0.48: the `defaultHidden` columns the user ticked back on — an entry that beats the\n   *  default. Written only when non-empty, so a table without such columns stores what\n   *  it always did. */\n  shown?: string[];\n}\n\n/** The hidden set as drawn: the stored one plus every `defaultHidden` column the view\n *  holds no entry for (neither hidden nor `shown`). */\nfunction withDefaultHidden(view: { hidden: Set<string>; shown: Set<string> }, defaults: string[]): Set<string> {\n  const extra = defaults.filter((k) => !view.hidden.has(k) && !view.shown.has(k));\n  return extra.length === 0 ? view.hidden : new Set([...view.hidden, ...extra]);\n}\n\nexport const DEFAULT_PERSIST_PREFIX = \"hbui-table:\";\n\nfunction loadPersisted(storageKey: string | undefined, prefix: string): Partial<PersistedState> {\n  if (!storageKey) return {};\n  const raw = readStored(prefix + storageKey);\n  if (!raw) return {};\n  try {\n    const parsed = JSON.parse(raw) as Partial<PersistedState>;\n    return parsed && typeof parsed === \"object\" ? parsed : {};\n  } catch {\n    return {}; // corrupt JSON — the storage access itself is guarded by readStored\n  }\n}\n\n/** The blob that would be stored — also the value the effect below compares by, so\n *  the comparison and the write can never disagree about what \"unchanged\" means. */\nfunction serializePersisted(state: PersistedState): string {\n  return JSON.stringify(state);\n}\n\n/** A stored page size as a table holds it — `\"all\"` is `Infinity` — or `fallback`. */\nfunction storedPageSize(stored: Partial<PersistedState>, fallback: number): number {\n  if (stored.pageSize === \"all\") return Infinity;\n  if (typeof stored.pageSize === \"number\" && stored.pageSize > 0) return stored.pageSize;\n  return fallback;\n}\n\n// ---------- URL sync helpers ----------\n\nconst URL_FILTER_PREFIX = \"f.\";\nconst URL_SORT_KEY = \"sort\";\nconst URL_PAGE_KEY = \"p\";\nconst URL_PAGE_SIZE_KEY = \"ps\";\n/** The free-text search term — managed only by {@link useTableUrlState}, and only when\n *  it is asked to (`search: true`); a plain `urlSync` table leaves a `q` alone. */\nconst URL_SEARCH_KEY = \"q\";\n\n/**\n * How a table is mirrored into the URL: `true`, or `{ prefix }` for a table that shares\n * its page with another URL-synced one. The prefix is put verbatim in front of EVERY key\n * the table writes and reads — `{ prefix: \"inv.\" }` gives `inv.f.<column>`, `inv.sort`,\n * `inv.p`, `inv.ps` (and `inv.q`) — so two tables on one page stop sharing a sort and a\n * page. Without one the keys are unprefixed, as they always were.\n */\nexport type TableUrlSync = boolean | { prefix?: string };\n\n/** The query keys of one table, with its prefix applied. */\ninterface UrlKeys {\n  filter: string;\n  sort: string;\n  page: string;\n  pageSize: string;\n  search: string;\n}\n\nfunction urlKeys(prefix = \"\"): UrlKeys {\n  return {\n    filter: prefix + URL_FILTER_PREFIX,\n    sort: prefix + URL_SORT_KEY,\n    page: prefix + URL_PAGE_KEY,\n    pageSize: prefix + URL_PAGE_SIZE_KEY,\n    search: prefix + URL_SEARCH_KEY,\n  };\n}\n\n/** What a table reads and writes the URL through: react-router's, or none. */\ninterface TableSearch {\n  searchParams: URLSearchParams;\n  setSearchParams: ReturnType<typeof useSearchParams>[1];\n  locationState: unknown;\n}\n\nfunction useRouterSearch(): TableSearch {\n  const [searchParams, setSearchParams] = useSearchParams();\n  const location = useLocation();\n  return { searchParams, setSearchParams, locationState: location.state };\n}\n\nconst NO_ROUTER_SEARCH: TableSearch = {\n  searchParams: new URLSearchParams(),\n  setSearchParams: () => {},\n  locationState: null,\n};\nfunction useNoRouterSearch(): TableSearch {\n  return NO_ROUTER_SEARCH;\n}\n\n/**\n * `useInRouterContext`, read off the namespace inside a `try` like\n * use-search-param-state's probe: a test's `vi.mock(\"react-router\", () => ({ … }))`\n * without it throws on the read. Missing, a table assumes a Router, as before 0.49.\n */\nfunction readInRouterContext(): () => boolean {\n  try {\n    return (ReactRouter as unknown as { useInRouterContext?: () => boolean }).useInRouterContext ?? (() => true);\n  } catch {\n    return () => true;\n  }\n}\nconst useInRouterContext = readInRouterContext();\n\n/**\n * The URL access a table needs (0.49, KIT-3). Without `urlSync` a table needs no Router:\n * before 0.49 it called `useSearchParams()` unconditionally and threw outside one even\n * with URL sync off. With `urlSync` and no Router, a development build throws a message\n * that names the fix; a production build keeps the view in local state rather than\n * crash the page. Whether a Router is around does not change during a table's life, so\n * which hook runs is stable from render to render.\n */\nfunction useTableSearch(urlSync: boolean, owner: string): TableSearch {\n  const inRouter = useInRouterContext();\n  if (!inRouter && urlSync && import.meta.env?.DEV) {\n    throw new Error(\n      `${owner} urlSync requires a Router: render it inside a react-router Router ` +\n        \"(BrowserRouter, a data router or a MemoryRouter), or leave urlSync off.\",\n    );\n  }\n  const useSearch = inRouter ? useRouterSearch : useNoRouterSearch;\n  return useSearch();\n}\n\n/** `urlSync` split into \"is it on\" and \"under which prefix\". */\nfunction resolveTableUrlSync(urlSync: TableUrlSync | undefined): { enabled: boolean; prefix: string } {\n  if (!urlSync) return { enabled: false, prefix: \"\" };\n  return { enabled: true, prefix: urlSync === true ? \"\" : (urlSync.prefix ?? \"\") };\n}\n\n/** What {@link readTableUrlState} found in a query string. */\nexport interface TableUrlState {\n  sorts?: SortState[];\n  filters?: FilterState;\n  /** `Infinity` for `ps=all`. */\n  pageSize?: number;\n  /** 0-based (the URL's `p` is 1-based). */\n  page?: number;\n}\n\n/**\n * What a table's URL says, read out of a query string: the column filters (`f.<key>`),\n * the sort, the page size and the 0-based page. Absent keys are absent here too, so a\n * caller can tell \"not in the link\" from \"the default\". The same reader `urlSync` uses\n * on mount, exported for an owner that keeps the state itself — see\n * {@link useTableUrlState}.\n *\n * Pass the ROUTER's query string — the one `setSearchParams` writes — and the table's\n * `prefix` when it has one (see {@link TableUrlSync}).\n *\n * This read `window.location.search` until 0.7.0, which is the same string only under a\n * BrowserRouter. Under a HashRouter the router's query lives after the `#`\n * (`/#/tx?f.payee=Rewe`) and `window.location.search` is empty: a shared link opened\n * unfiltered, and the table's first write then replaced the link's filter with its own\n * empty state. Reading and writing through `useSearchParams` is one source for both\n * directions under every router, MemoryRouter included.\n */\nexport function readTableUrlState<T>(\n  sp: URLSearchParams,\n  columns: DataTableColumn<T>[],\n  prefix?: string,\n): TableUrlState {\n  const keys = urlKeys(prefix);\n  const out: TableUrlState = {};\n\n  const filters: FilterState = {};\n  for (const col of columns) {\n    const filter = resolveFilter(col);\n    if (!filter) continue;\n    const raw = sp.get(keys.filter + col.key);\n    if (raw == null) continue;\n    filters[col.key] = decodeFilterValue(filter, raw);\n  }\n  if (Object.keys(filters).length) out.filters = filters;\n\n  const sortRaw = sp.get(keys.sort);\n  if (sortRaw) {\n    const decoded = decodeSorts(sortRaw, new Set(columns.map((c) => c.key)));\n    if (decoded.length) out.sorts = decoded;\n  }\n\n  const psRaw = sp.get(keys.pageSize);\n  if (psRaw === \"all\") out.pageSize = Infinity;\n  else if (psRaw && Number(psRaw) > 0) out.pageSize = Number(psRaw);\n\n  const pRaw = sp.get(keys.page);\n  if (pRaw && Number(pRaw) >= 1) out.page = Number(pRaw) - 1;\n\n  return out;\n}\n\n/**\n * The managed part of the query string, as a string, for comparing by VALUE.\n *\n * Everything the table puts in the address and nothing else, in a fixed order.\n * `columns` is walked for its keys only, which is why it can be left out of the\n * effect's dependencies without lying: a new column ARRAY carrying the same keys\n * produces the same signature, and a genuinely different set of filterable columns\n * produces a different one.\n */\nfunction urlSignature<T>(\n  columns: DataTableColumn<T>[],\n  sorts: SortState[],\n  filters: FilterState,\n  pageSize: number,\n  page: number,\n  defaultPageSize: number,\n  keys: UrlKeys,\n): string {\n  const parts: string[] = [];\n  for (const col of columns) {\n    const state = filters[col.key];\n    if (!state || !isFilterActive(state)) continue;\n    const enc = encodeFilterValue(state);\n    if (enc != null) parts.push(`${keys.filter}${col.key}=${enc}`);\n  }\n  parts.push(`${keys.sort}=${encodeSorts(sorts)}`);\n  parts.push(\n    `${keys.pageSize}=${pageSize === Infinity ? \"all\" : pageSize === defaultPageSize ? \"\" : String(pageSize)}`,\n  );\n  parts.push(`${keys.page}=${page > 0 ? String(page + 1) : \"\"}`);\n  return parts.join(\"&\");\n}\n\nfunction writeUrlState<T>(\n  setSearchParams: ReturnType<typeof useSearchParams>[1],\n  columns: DataTableColumn<T>[],\n  sorts: SortState[],\n  filters: FilterState,\n  pageSize: number,\n  page: number,\n  defaultPageSize: number,\n  // `undefined`: the search term is not ours to manage, and a `q` is left as it is.\n  search: string | undefined,\n  // The current entry's route state, carried over the replace. A query rewrite is not\n  // a navigation, and dropping the state would, for one, lose the mark a URL-bound\n  // dialog's opener leaves there (see useDialogParam).\n  state: unknown,\n  keys: UrlKeys,\n): void {\n  setSearchParams(\n    (prev) => {\n      const next = new URLSearchParams(prev);\n      // clear managed keys\n      for (const col of columns) next.delete(keys.filter + col.key);\n      next.delete(keys.sort);\n      next.delete(keys.page);\n      next.delete(keys.pageSize);\n      if (search !== undefined) {\n        next.delete(keys.search);\n        if (search.trim()) next.set(keys.search, search);\n      }\n      // write filters\n      for (const col of columns) {\n        const state = filters[col.key];\n        if (!state || !isFilterActive(state)) continue;\n        const enc = encodeFilterValue(state);\n        if (enc != null) next.set(keys.filter + col.key, enc);\n      }\n      // write sort\n      const sortEnc = encodeSorts(sorts);\n      if (sortEnc) next.set(keys.sort, sortEnc);\n      // write page size if non-default\n      if (pageSize === Infinity) next.set(keys.pageSize, \"all\");\n      else if (pageSize !== defaultPageSize) next.set(keys.pageSize, String(pageSize));\n      // write page if not first\n      if (page > 0) next.set(keys.page, String(page + 1));\n      return next;\n    },\n    { replace: true, state },\n  );\n}\n\n/**\n * Where a table's view lives: what it is sorted and filtered by, which page, how wide\n * the columns are and which are hidden — plus the two places that outlives a render.\n *\n * Lifted out of `DataTable`, which was 984 lines and twenty hooks in one function. This\n * is the part that is genuinely about STATE rather than about drawing, and the three\n * rules it encodes are easy to lose among the markup:\n *\n * * **The URL is read once, on mount.** A shared or deep link populates the initial view;\n *   after that the state is local, or the browser's own history would fight the user's\n *   next click.\n * * **Sorting and filtering are optionally CONTROLLED.** A server-driven table passes\n *   state and a callback and owns them; everything else is self-owned. That is the\n *   `sortsProp ?? internalSorts` pair, and it is why the setters are exposed separately.\n * * **Persistence writes on every change, the URL only when asked.** `storageKey` is the\n *   per-table identity; `urlSync` is opt-in because only some tables want their view in\n *   a shareable address.\n * * **A controlled filter, sort or page size that changes sends the table back to page\n *   1.** See the note at the reset below.\n */\nexport function useTableState<T>({\n  columns,\n  storageKey,\n  storageKeyPrefix,\n  urlSync: urlSyncOption,\n  defaultPageSize,\n  sortsProp,\n  filtersProp,\n  pageSizeProp,\n}: {\n  columns: DataTableColumn<T>[];\n  storageKey?: string;\n  storageKeyPrefix: string;\n  urlSync?: TableUrlSync;\n  defaultPageSize: number;\n  sortsProp?: SortState[];\n  filtersProp?: FilterState;\n  pageSizeProp?: number;\n}) {\n  const { enabled: urlSync, prefix: urlPrefix } = resolveTableUrlSync(urlSyncOption);\n  const keys = useMemo(() => urlKeys(urlPrefix), [urlPrefix]);\n  // The SAME pair is used to read and to write; see `readTableUrlState`. No Router is\n  // needed without `urlSync` (0.49, KIT-3; see `useTableSearch`).\n  const { searchParams, setSearchParams, locationState } = useTableSearch(urlSync, \"DataTable\");\n  // Read URL once on mount so URL-encoded views (e.g. shared links, deep links from\n  // other pages) populate initial state. After mount, state is local.\n  const [urlInitial] = useState<TableUrlState>(() =>\n    urlSync ? readTableUrlState(searchParams, columns, urlPrefix) : {},\n  );\n  const initial = useMemo(() => loadPersisted(storageKey, storageKeyPrefix), [storageKey, storageKeyPrefix]);\n  const [internalSorts, setInternalSorts] = useState<SortState[]>(() =>\n    urlInitial.sorts !== undefined ? urlInitial.sorts : normalizeSorts(initial.sort),\n  );\n  const [internalFilters, setInternalFilters] = useState<FilterState>(\n    () => urlInitial.filters ?? initial.filters ?? {},\n  );\n  // Controlled when the owner passes state + callback (server-driven tables);\n  // self-owned otherwise.\n  const sorts = sortsProp ?? internalSorts;\n  const filters = filtersProp ?? internalFilters;\n  const [page, setPage] = useState(() => urlInitial.page ?? 0);\n\n  // ---- Controlled filters/sorts reset the page ----\n  //\n  // A self-owned table resets to page 1 in the filter handlers. A CONTROLLED one could\n  // not: the handlers hand the change to the owner and return, and `page` lives here,\n  // where the owner has no way to reach it — so narrowing a filter from outside (a\n  // saved view, a chip dismissed above the table) left a client-side table on page 4\n  // of what was now two pages, clamped to the last one instead of the first.\n  //\n  // So the table does it: whenever the controlled VALUE changes, back to the first\n  // page. Compared by value, because a controlled prop is a fresh object on every\n  // parent render. Adjusted during render rather than in an effect, so the stale page\n  // is never painted and never written to the URL. Not on mount: a deep link's `p=3`\n  // must survive the owner's first render. (In `serverPagination` mode this state is\n  // unused — the owner's `page` is the page, and resetting it stays the owner's job.)\n  // A controlled page size counts too: the groups of `TranslationReviewPanel` share one,\n  // and a group paged deep into its rows starts over when another group's pager changes it.\n  const controlledSig =\n    sortsProp !== undefined || filtersProp !== undefined || pageSizeProp !== undefined\n      ? JSON.stringify([sortsProp ?? null, filtersProp ?? null, String(pageSizeProp)])\n      : null;\n  const [seenControlledSig, setSeenControlledSig] = useState(controlledSig);\n  if (seenControlledSig !== controlledSig) {\n    setSeenControlledSig(controlledSig);\n    setPage(0);\n  }\n  const [internalPageSize, setPageSize] = useState<number>(() =>\n    urlInitial.pageSize !== undefined ? urlInitial.pageSize : storedPageSize(initial, defaultPageSize),\n  );\n  const pageSize = pageSizeProp ?? internalPageSize;\n  const [widths, setWidths] = useState<Record<string, number>>(() => initial.widths ?? {});\n  // Hidden columns (0.48, keksdose #617): what the user chose — `hidden`, and `shown`\n  // for a `defaultHidden` column ticked back on — kept apart from the defaults, which\n  // are applied on read and never stored. Keyed on the default keys as a string: every\n  // call site builds `columns` inline, so the array is new on every render.\n  const [view, setView] = useState(() => ({\n    hidden: new Set<string>(initial.hidden ?? []),\n    shown: new Set<string>(initial.shown ?? []),\n  }));\n  const defaultHiddenSig = columns\n    .filter((c) => c.defaultHidden)\n    .map((c) => c.key)\n    .join(\"\\u0000\");\n  const hiddenCols = useMemo(\n    () => withDefaultHidden(view, defaultHiddenSig ? defaultHiddenSig.split(\"\\u0000\") : []),\n    [view, defaultHiddenSig],\n  );\n  // The panel hands over the next DRAWN set; what changed is recorded as a choice.\n  const setHiddenCols = useCallback(\n    (action: SetStateAction<Set<string>>) =>\n      setView((v) => {\n        const defaults = defaultHiddenSig ? defaultHiddenSig.split(\"\\u0000\") : [];\n        const prev = withDefaultHidden(v, defaults);\n        const next = typeof action === \"function\" ? action(prev) : action;\n        const hidden = new Set(v.hidden);\n        const shown = new Set(v.shown);\n        for (const k of next) {\n          if (prev.has(k)) continue;\n          hidden.add(k);\n          shown.delete(k);\n        }\n        for (const k of prev) {\n          if (next.has(k)) continue;\n          hidden.delete(k);\n          if (defaults.includes(k)) shown.add(k);\n        }\n        return { hidden, shown };\n      }),\n    [defaultHiddenSig],\n  );\n  const [showSettings, setShowSettings] = useState(false);\n  const headRefs = useMemo(() => new Map<string, HTMLTableCellElement>(), []);\n\n  // ---- Writing out: both of these compare by VALUE ----\n  //\n  // A CONTROLLED table (`sorts`/`filters` props plus callbacks — every server-driven\n  // one) receives a freshly-built object on every render of the page around it, and\n  // `{}` is never `===` the `{}` before it. Keyed on identity, both effects below\n  // therefore fired on every unrelated parent render: persistence wrote the same JSON\n  // into `localStorage` each time — a synchronous main-thread write, on a page whose\n  // other half may be a form being typed into — and the URL one handed react-router a\n  // `replace` it answers with a render, which is the loop the audit records. A `ref`\n  // holding what was last written is what makes \"changed\" mean changed.\n  const lastPersisted = useRef<string | null>(null);\n  const persisted = !storageKey\n    ? \"\"\n    : serializePersisted({\n        sort: sorts,\n        filters,\n        pageSize: pageSize === Infinity ? \"all\" : pageSize,\n        widths,\n        hidden: Array.from(view.hidden),\n        ...(view.shown.size > 0 ? { shown: Array.from(view.shown) } : {}),\n      });\n  useEffect(() => {\n    if (!storageKey) return;\n    // The destination is part of the signature: two tables can hold identical state,\n    // and a table that swaps `storageKey` has to write under the new one even though\n    // nothing about the view changed.\n    const target = storageKeyPrefix + storageKey;\n    const sig = `${target}\\u0000${persisted}`;\n    if (lastPersisted.current === sig) return;\n    lastPersisted.current = sig;\n    writeStored(target, persisted);\n  }, [storageKey, storageKeyPrefix, persisted]);\n\n  const lastUrl = useRef<string | null>(null);\n  const urlSig = urlSync ? urlSignature(columns, sorts, filters, pageSize, page, defaultPageSize, keys) : \"\";\n  useEffect(() => {\n    if (!urlSync) return;\n    if (lastUrl.current === urlSig) return;\n    lastUrl.current = urlSig;\n    // `columns` is deliberately not a dependency and does not need to be: the\n    // signature above is computed from it, so a column set that would produce a\n    // different address produces a different signature first.\n    writeUrlState(\n      setSearchParams,\n      columns,\n      sorts,\n      filters,\n      pageSize,\n      page,\n      defaultPageSize,\n      undefined,\n      locationState,\n      keys,\n    );\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [urlSync, urlSig]);\n\n  return {\n    sorts,\n    filters,\n    setInternalSorts,\n    setInternalFilters,\n    page,\n    setPage,\n    pageSize,\n    setPageSize,\n    widths,\n    setWidths,\n    hiddenCols,\n    setHiddenCols,\n    showSettings,\n    setShowSettings,\n    headRefs,\n  };\n}\n\n// ---------- One view over several tables ----------\n\n/** What {@link useSharedTableView} keeps. */\nexport interface SharedTableView {\n  sorts: SortState[];\n  setSorts: (next: SortState[]) => void;\n  /** `Infinity` for \"all\", as a table holds it. */\n  pageSize: number;\n  setPageSize: (next: number) => void;\n}\n\n/**\n * One table view — the sort and the page size — for an owner that draws it as SEVERAL\n * tables over one `storageKey`: `TranslationReviewPanel`'s groups, which sort and page\n * alike (0.35, Kurvenschmiede: its grouped review stored no view at all). Pass them to\n * each table as `sorts`/`onSortsChange` and `pageSize`/`onPageSizeChange`.\n *\n * Kept in the very blob a `DataTable` with that `storageKey` keeps, not in a format of\n * its own, so the single table and the groups read each other's view. What the blob\n * holds besides (filters, column widths, hidden columns) is carried over as stored, for\n * the single table to find as it left it. Read when `active` turns on — on mount, or\n * when the owner switches to this view — and written on a change, never on a read. The\n * prefix resolves as DataTable's does: prop > provider > the kit's.\n */\nexport function useSharedTableView({\n  active,\n  storageKey,\n  storageKeyPrefix,\n  defaultPageSize,\n}: {\n  active: boolean;\n  storageKey?: string;\n  storageKeyPrefix?: string;\n  defaultPageSize: number;\n}): SharedTableView {\n  const providerPrefix = useKitTableStorageKeyPrefix();\n  const prefix = storageKeyPrefix ?? providerPrefix ?? DEFAULT_PERSIST_PREFIX;\n  const read = () => {\n    const stored = active ? loadPersisted(storageKey, prefix) : {};\n    return { sorts: normalizeSorts(stored.sort), pageSize: storedPageSize(stored, defaultPageSize) };\n  };\n  const [view, setView] = useState(read);\n  // Adjusted during render when `active` turns on, so the first render of the groups\n  // already has the view the single table left, not a frame of the default.\n  const [wasActive, setWasActive] = useState(active);\n  if (active !== wasActive) {\n    setWasActive(active);\n    if (active) setView(read());\n  }\n  const change = (patch: Partial<typeof view>) => {\n    const next = { ...view, ...patch };\n    setView(next);\n    if (!active || !storageKey) return;\n    const stored = loadPersisted(storageKey, prefix);\n    const blob: PersistedState = {\n      sort: next.sorts,\n      filters: stored.filters ?? {},\n      pageSize: next.pageSize === Infinity ? \"all\" : next.pageSize,\n      widths: stored.widths,\n      hidden: stored.hidden,\n    };\n    writeStored(prefix + storageKey, serializePersisted(blob));\n  };\n  return {\n    sorts: view.sorts,\n    setSorts: (sorts) => change({ sorts }),\n    pageSize: view.pageSize,\n    setPageSize: (pageSize) => change({ pageSize }),\n  };\n}\n\n// ---------- Owner-held table state, mirrored to the URL ----------\n\nexport interface UseTableUrlStateOptions<T> {\n  /** The table's columns — read for their keys and filter types only. */\n  columns: DataTableColumn<T>[];\n  /** Default 25. A page size equal to it is left out of the URL. */\n  defaultPageSize?: number;\n  /** Mirror the state into the URL and seed it from there on mount. Default true.\n   *  `{ prefix }` puts a prefix in front of every key, for a page with two URL-synced\n   *  tables — see {@link TableUrlSync}. */\n  urlSync?: TableUrlSync;\n  /** Shorthand for `urlSync: { prefix }`; wins over a prefix given there. */\n  urlPrefix?: string;\n  /** Also hold a free-text search term, under `q`. Off by default, so a `q` that\n   *  belongs to someone else on the page is never touched. */\n  search?: boolean;\n}\n\n/** The part of {@link DataTableProps} a server-driven table takes from its owner. */\nexport interface TableUrlStateProps {\n  serverPagination: ServerPagination;\n  filters: FilterState;\n  onFiltersChange: (next: FilterState) => void;\n  sorts: SortState[];\n  onSortsChange: (next: SortState[]) => void;\n}\n\nexport interface UseTableUrlStateReturn {\n  /** 0-based. */\n  page: number;\n  setPage: (page: number) => void;\n  pageSize: number;\n  /** Also back to the first page. */\n  setPageSize: (pageSize: number) => void;\n  filters: FilterState;\n  /** Also back to the first page. */\n  setFilters: (next: FilterState) => void;\n  sorts: SortState[];\n  /** Also back to the first page. */\n  setSorts: (next: SortState[]) => void;\n  /** The search term (`\"\"` unless `search: true`). */\n  search: string;\n  /** Also back to the first page. */\n  setSearch: (next: string) => void;\n  /**\n   * Everything the table needs, to spread onto it:\n   * `<DataTable {...table.tableProps(data?.total ?? 0, { isLoading })} rows={…} … />`.\n   */\n  tableProps: (total: number, options?: { isLoading?: boolean }) => TableUrlStateProps;\n}\n\ninterface OwnedState {\n  sorts: SortState[];\n  filters: FilterState;\n  pageSize: number;\n  page: number;\n  search: string;\n}\n\n/**\n * The controlled state of a `serverPagination` table — filters, sorts, page, page size\n * and optionally a search term — kept by the OWNER and mirrored into the URL in the\n * table's own scheme (`f.<key>`, `sort`, `p`, `ps`, and `q`).\n *\n * A server-driven table owns none of this: the owner has to hold it to turn it into\n * the query that fetches `rows`, and until now it also had to restate the table's URL\n * codec to keep the view bookmarkable (kastlan's use-server-table.ts copied\n * `readUrlState` / `writeUrlState` to do it). Same rules as `urlSync`:\n *\n * * **The URL is read once, on mount** — a shared or deep link (see {@link filterHref})\n *   seeds the view; after that the state is local and written out with `replace`.\n * * **Any change but the page itself goes back to page 1** — a narrower filter must not\n *   leave the user on page 7 of 2.\n * * **Written by value**: an unchanged view writes nothing, however often the owner\n *   renders.\n *\n * Mapping the state onto the backend's query parameters stays the owner's: that is the\n * part the kit cannot know.\n */\nexport function useTableUrlState<T>({\n  columns,\n  defaultPageSize = 25,\n  urlSync: urlSyncOption = true,\n  urlPrefix: urlPrefixOption,\n  search: manageSearch = false,\n}: UseTableUrlStateOptions<T>): UseTableUrlStateReturn {\n  const resolved = resolveTableUrlSync(urlSyncOption);\n  const urlSync = resolved.enabled;\n  const urlPrefix = urlPrefixOption ?? resolved.prefix;\n  const keys = useMemo(() => urlKeys(urlPrefix), [urlPrefix]);\n  const { searchParams, setSearchParams, locationState } = useTableSearch(urlSync, \"useTableUrlState\");\n  const [state, setState] = useState<OwnedState>(() => {\n    const url = urlSync ? readTableUrlState(searchParams, columns, urlPrefix) : {};\n    return {\n      sorts: url.sorts ?? [],\n      filters: url.filters ?? {},\n      pageSize: url.pageSize ?? defaultPageSize,\n      page: url.page ?? 0,\n      search: urlSync && manageSearch ? (searchParams.get(keys.search) ?? \"\") : \"\",\n    };\n  });\n\n  const lastUrl = useRef<string | null>(null);\n  const urlSig = urlSync\n    ? urlSignature(columns, state.sorts, state.filters, state.pageSize, state.page, defaultPageSize, keys) +\n      (manageSearch ? `&${keys.search}=${state.search.trim() ? state.search : \"\"}` : \"\")\n    : \"\";\n  useEffect(() => {\n    if (!urlSync) return;\n    // First run included: a link that arrives with `p=1` or a default `ps` is\n    // normalised to the table's own spelling, as `urlSync` does.\n    if (lastUrl.current === urlSig) return;\n    lastUrl.current = urlSig;\n    writeUrlState(\n      setSearchParams,\n      columns,\n      state.sorts,\n      state.filters,\n      state.pageSize,\n      state.page,\n      defaultPageSize,\n      manageSearch ? state.search : undefined,\n      locationState,\n      keys,\n    );\n    // Keyed on the signature, which is computed from everything the write reads — see\n    // the same effect in useTableState.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [urlSync, urlSig]);\n\n  const setPage = (page: number) => setState((s) => ({ ...s, page }));\n  const setPageSize = (pageSize: number) => setState((s) => ({ ...s, pageSize, page: 0 }));\n  const setFilters = (filters: FilterState) => setState((s) => ({ ...s, filters, page: 0 }));\n  const setSorts = (sorts: SortState[]) => setState((s) => ({ ...s, sorts, page: 0 }));\n  const setSearch = (search: string) => setState((s) => ({ ...s, search, page: 0 }));\n\n  return {\n    page: state.page,\n    setPage,\n    pageSize: state.pageSize,\n    setPageSize,\n    filters: state.filters,\n    setFilters,\n    sorts: state.sorts,\n    setSorts,\n    search: state.search,\n    setSearch,\n    tableProps: (total, options) => ({\n      serverPagination: {\n        page: state.page,\n        pageSize: state.pageSize,\n        total,\n        onPageChange: setPage,\n        onPageSizeChange: setPageSize,\n        isLoading: options?.isLoading,\n      },\n      filters: state.filters,\n      onFiltersChange: setFilters,\n      sorts: state.sorts,\n      onSortsChange: setSorts,\n    }),\n  };\n}\n"],"mappings":"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","names":["state"]}