@eifi1/ui-kit 0.53.0 → 0.55.0

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.\n//\n// Since 0.52 a node can hold `children`: a group, drawn as a labelled frame round its\n// tiles (keksdose dev #642, shops by chain). Where every node is drawn is the map's own\n// layout (treemap-layout.ts), not recharts': see \"Groups: a frame round their tiles\".\nimport {\n  createContext,\n  useCallback,\n  useContext,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  useSyncExternalStore,\n} from \"react\";\nimport type { ComponentProps, ComponentPropsWithoutRef, KeyboardEvent, ReactElement, ReactNode } from \"react\";\nimport { Treemap as RechartsTreemap, useChartHeight, useChartWidth } from \"recharts\";\nimport { ChartContainer, ChartTooltip, ChartTooltipContent, type ChartConfig } from \"./chart\";\nimport { CHART_ROLES, PALETTE_HEX, PALETTE_SIZE, lerpHex, textOn } from \"../theme/chart-palette\";\nimport { resolveChartColor, useChartEdge, useEdgesInForce, type ChartEdges } from \"./chart-edge\";\nimport { parseHex } from \"../theme/color\";\nimport { dirOf, rovingTarget, type Direction } from \"../lib/direction\";\nimport { shareFormat } from \"../lib/share-format\";\nimport { cn } from \"../lib/cn\";\nimport { useTextSize } from \"../theme/text-size\";\nimport { chartHeightProps, type ChartHeight } from \"./chart-height\";\nimport { formatWithMinus } from \"../lib/minus\";\nimport { useKitLabels, useKitLocale, type LabelOverride } from \"../i18n/kit-labels\";\nimport { DEFAULT_TREEMAP_LABELS, type TreemapLabels } from \"./treemap-labels\";\nimport { groupBody, layoutTreemap, type Box, type Placed } from \"./treemap-layout\";\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 among a group's own\n   *  nodes (or the top's). A group and a tile inside it may share one — chain 12 and shop\n   *  12 from two tables — and `onNodeClick`'s `groups` tells them apart (0.52). */\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   *\n   *  A GROUP's own `value` is not read: its area is its drawn children's together. Pass\n   *  that sum — the field stays required so that every reader of a `TreemapNode[]` keeps\n   *  a `number`. */\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   *\n   *  On a group, the colour of every tile inside it that sets none (0.52): keksdose's\n   *  \"hue = chain\" is a `fill` per chain. A group left without one takes the ramp by its\n   *  index, as a tile does, and hands that down; its frame is drawn in the page's own\n   *  colours whatever it is. */\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. A tile that takes its group's\n   *  `fill` takes the group's `labelColor` with it; one with a `fill` of its own, or one\n   *  that `shade` turns into another colour, is measured again. */\n  labelColor?: string;\n  /**\n   * The tile's colour strength, 0–1 (0.52): its `fill` mixed into the card's colour\n   * (`--bg-surface`) as a concrete hex, `1` the full hue. For a second, ordered quantity\n   * on top of the hue — keksdose's recency steps (1, 0.78, 0.55) over the chain's hue —\n   * without a `color-mix()`: the result is measured like any hex, so the label ink stays\n   * automatic and no `labelColor` is needed. keksdose found a tile under ~0.55 stops\n   * reading as its hue and passes for the muted \"other\" (#642).\n   *\n   * Only a fill the kit can measure is shaded (a hex, a bare `var(--chart-N)` or another\n   * bare token), and only on a page that declares `--bg-surface` as a hex; anything else\n   * keeps its full hue. On a group, the default for its tiles, as `fill` is.\n   */\n  shade?: number;\n  /**\n   * Makes this node a GROUP (0.52, keksdose dev #642: \"Is there already a distinction\n   * between shop and chain?\"): a labelled frame, its name in a band along the top, its\n   * tiles laid out inside it by the map's own layout, each at its share of the whole\n   * picture (see \"Groups: a frame round their tiles\"). Groups nest. A group with nothing\n   * drawable inside is not drawn; an empty array is a tile.\n   *\n   * The frame is in the page's colours (the well, `--bg-surface-2`, under\n   * `--text-primary`, at least 7.4:1 in every preset and contrast), and under More\n   * contrast it is outlined in `--chart-ink` as a pale tile is. Its band is drawn only\n   * where the group has the room for it — see `TreemapCell`.\n   */\n  children?: readonly TreemapNode[];\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 *\n * The root is a `role=\"figure\"` (0.52, refactor audit 2026-10-30, DSP-5): name it with\n * `aria-label` (\"Spending by category\"), and say what it shows with {@link\n * TreemapProps.description}.\n */\nexport interface TreemapProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n  data: readonly 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   * A tile's and a group's accessible name (`labels.tile`, `labels.group`, 0.52) says the\n   * value too, asked of the formatter as the tooltip asks it, share and all, and its text\n   * is used; markup is said as the bare number. The name says the share itself, so a\n   * formatter that writes it into its text has it said twice — say so with\n   * {@link TreemapProps.shareInValue}.\n   *\n   * Default: the bare number through `Intl.NumberFormat` in the provider's locale (0.52,\n   * DOC-10: before, the runtime's). A host with a currency passes this — the kit knows\n   * none.\n   */\n  valueFormatter?: (value: number, share: number | undefined) => ReactNode;\n  /**\n   * The `valueFormatter`'s text already says the share (\"CHF 412.30 · 12%\"), so a tile's\n   * and a group's accessible name leave their own \" (12%)\" out (0.53, keksdose after 0.52):\n   * the map hands `labels.tile` and `labels.group` the share as `\"\"`, and every catalogue's\n   * template drops it there, in its own typography. Before, the only way out was to replace\n   * both templates, and with them the kit's seven catalogues. The tooltip is the same either\n   * way: it prints what the formatter prints. A formatter whose value is markup is said as\n   * the bare number, so its share is then not said at all.\n   *\n   * Default `false`: the name says the share.\n   */\n  shareInValue?: boolean;\n  /**\n   * What the map SHOWS, in a sentence — \"Rent is three fifths of the month.\" — the\n   * figure's accessible description (0.52, DSP-5). Not drawn; a caption the eye should\n   * read too belongs in the page.\n   */\n  description?: string;\n  /** Per-map strings over `<UiKitProvider labels={{ treemap }}>`. */\n  labels?: LabelOverride<TreemapLabels>;\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  /**\n   * A tile was activated — by click, or by Enter/Space on a focused tile. Setting this\n   * makes every tile a `role=\"button\"`.\n   *\n   * Either way every tile is reachable (0.52, DSP-5): ONE tab stop for the map, the\n   * arrows (←/→ along the reading direction, ↓/↑), Home and End between tiles in the\n   * order given, each named \"name: value (share)\" (`labels.tile`) — a `role=\"img\"` to read\n   * when nothing listens, as PieChart's slices. Before, a map nobody clicked was nothing\n   * to a screen reader, and a clickable tile said its name alone, one tab stop each.\n   *\n   * In a map with groups (`TreemapNode.children`, 0.52) the walk is the data's own order,\n   * depth first: a group's frame, then its tiles, then the next group. A frame is named\n   * by `labels.group` (\"Interspar, group: €1,240 (40%)\"), a tile inside one by\n   * `labels.inGroup` round its own name (\"Rankweil: €412 (12%), in Interspar\"). Only\n   * tiles reach this callback (a frame reaches `onGroupClick`); a tile inside a group is\n   * handed a third argument, the ids of its groups, outermost first. Optional in the type,\n   * so a forwarder calling this with two arguments still type-checks — and absent for a\n   * tile at the top, so a flat map calls it exactly as before.\n   */\n  onNodeClick?: (id: string, name: string, groups?: readonly string[]) => void;\n  /**\n   * A group's frame was activated — by click on its band or margin, or by Enter/Space on\n   * the focused frame (0.52). Setting this makes every frame a `role=\"button\"`; without it\n   * a frame is a `role=\"img\"`, still a stop of the map's keyboard so its total is heard.\n   * `groups` as for {@link TreemapProps.onNodeClick}: the groups round this one, passed\n   * only for a group inside another.\n   */\n  onGroupClick?: (id: string, name: string, groups?: readonly 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   * Every tile is tagged as a whole too, clickable or not (0.52): its accessible name\n   * (`labels.tile`) says the name and the value, in an attribute a host's redaction\n   * reaches only through the tag.\n   *\n   * - `true`: every node — the tiles, and a group's frame (its `<g>` and its band's name)\n   *   and tooltip bubble too.\n   * - `\"tiles\"` (0.53, keksdose after 0.52): the tiles as `true` tags them, and no group —\n   *   for groups that are public names over private ones, as chains (Migros, Coop) over\n   *   the shops a user paid. Its frame's band, its frame and its bubble's name are\n   *   untagged, and so is the frame's accessible name (`labels.group`), which says the\n   *   group's TOTAL: use it only where the groups' names and totals are not the private\n   *   part. The bubble's value cell is tagged whatever this says, as in every chart.\n   *   A tile's name still says its group's (`labels.inGroup`), under the tile's tag.\n   */\n  redactNames?: boolean | \"tiles\";\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   * Asked for tiles only: a group's band holds its name and nothing else.\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   * With groups, the tiles are counted across them in the order given, depth first; a\n   * group left with none is not drawn, and a group's frame is not a tile.\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   * How tiles are parted (0.51.6, keksdose dev #642, Marcel: \"The borders do not look\n   * nice when changing from tile to tile. Can this be uniform black?\" — and then, on the\n   * contrast rule that would go with it: follow the contrast setting).\n   *\n   * - `\"auto\"` (default): `\"uniform\"` at Standard contrast, `\"contrast\"` while More\n   *   contrast is in force (`<html data-contrast=\"more\">`: the reader chose it, or chose\n   *   System on a device that asks for more). Followed live.\n   * - `\"uniform\"`: one 2px gutter in the page's ground colour (`--bg-page`, near-black\n   *   in the dark theme) round every tile, and nothing else. Tiles always abut, so the\n   *   gutter parts them; each tile is named by its label.\n   * - `\"contrast\"`: the 0.49 rule. The gutter is the card's colour (`--bg-surface`),\n   *   and a tile whose hue is under 3:1 against the card gets a 1px ink edge inside it\n   *   (WCAG 1.4.11, `useChartEdge`). In the dark theme that ink is light, so some tiles\n   *   carry a white outline and their neighbours none — the unevenness #642 saw, and\n   *   the price of the edge for a reader who asked for it.\n   */\n  edges?: TreemapEdges;\n}\n\n/** {@link TreemapProps.edges}. The switch itself is chart-edge's `useEdgesInForce`,\n *  which SeriesChart's bars and areas follow too since 0.52 (DSP-18). */\nexport type TreemapEdges = ChartEdges;\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, and after a `|` the card's colour, joined into ONE string so\n *  `useSyncExternalStore` compares a primitive: a fresh array per read would never be\n *  `Object.is`-equal to the last and 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  const ramp = 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  // The card, which `TreemapNode.shade` mixes a hue into (0.52). No fallback: a page that\n  // declares no `--bg-surface` hex leaves nothing to mix into, and the tile keeps its hue.\n  const card = style.getPropertyValue(\"--bg-surface\").trim();\n  return `${ramp}|${parseHex(card) ? card : \"\"}`;\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\ninterface ChartTokens {\n  ramp: readonly string[];\n  /** `--bg-surface` as hex, or null when the page declares none. */\n  card: string | null;\n}\n\nfunction useChartTokenHex(): ChartTokens {\n  const joined = useSyncExternalStore(subscribeChartTokens, readChartTokens, () => SERVER_TOKENS);\n  // One object per reading, not per render: the map's nodes are memoised on it.\n  return useMemo(() => {\n    const [ramp = \"\", card = \"\"] = joined.split(\"|\");\n    return { ramp: ramp.split(\",\"), card: card || null };\n  }, [joined]);\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// ── What a tile reads from its map ───────────────────────────────────────\n//\n// 0.52 (refactor audit 2026-10-30, DSP-22): every tile resolved the token ramp, the ink\n// edge and the edge rule itself — three stores, each with a MutationObserver on <html>, so\n// 72 on keksdose's 24-tile maps, and up to 29 custom properties re-read on every render of\n// every tile. `Treemap` resolves them once and hands them down here; a TreemapCell drawn\n// in a caller's own recharts `<Treemap>` has no map above it and resolves its own.\n\ninterface TileContext {\n  tokens: readonly string[];\n  edgeFor: (fill: string | undefined) => string | undefined;\n  edges: \"uniform\" | \"contrast\";\n  /** The map's keyboard (DSP-5): absent for a standalone cell. */\n  keys?: TileKeys;\n  /** Where every node is drawn in a chart of this size (see \"Groups\"), by path: absent\n   *  for a standalone cell, which draws where recharts laid it. */\n  layout?: (width: number, height: number, scale: number) => ReadonlyMap<string, Placed>;\n  /** The pointer is on the node drawn at `box`: where the map's tooltip stands. */\n  hover?: (box: Box) => void;\n}\n\n/**\n * Keyed by a node's PATH (`MapNode.path`), not its id: a group and a tile may share an id\n * — chain 12 and shop 12 come from two tables — and keyed by id the map had two tab stops,\n * the frame said the tile's name and the arrows stuck (0.52 code review of treemap.tsx,\n * finding 3).\n */\ninterface TileKeys {\n  /** A tile's or a group's accessible name (`labels.tile`, `labels.group`). */\n  name: (path: string) => string | undefined;\n  onFocus: (path: string) => void;\n  /** A node's element as it mounts (and `null` as it goes): the map sets its `tabindex` and\n   *  gives it back the focus its previous element held (see the map's keyboard). */\n  register: (path: string, element: SVGGElement | null) => void;\n  /** Moves focus for an arrow, Home or End pressed on node `path`; `false` for any other key. */\n  move: (path: string, event: KeyboardEvent<SVGGElement>) => boolean;\n}\n\nconst TreemapTiles = createContext<TileContext | null>(null);\n\n// ── Groups: a frame round their tiles ─────────────────────────────────────\n//\n// 0.52 (keksdose dev #642). A group is a frame with its name in a band along the top, its\n// tiles inside it. recharts lays nested data out edge to edge, with no room for a band, so\n// the map lays it out ITSELF (treemap-layout.ts): squarified as recharts does it, each\n// group given its frame's area on top of its tiles' — so a tile's area stays its share of\n// the picture in any group (0.52 code review of treemap.tsx, finding 1) — and computed up\n// front from the drawn nodes and the chart's size, which every cell reads by its path.\n// Before, a group's cell made the room during render and left it in a module cache for its\n// children's cells, which held only while recharts rendered a group before its children\n// (finding 8). recharts still renders each node's cell, and its tooltip; the map stands the\n// tooltip at the tile as drawn (`TreemapTooltip`), since recharts' own anchor is the centre\n// of the rectangle IT laid out.\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/** A tile's text, painted over a halo in its tile's colour (see `TreemapCell`). */\nconst haloOf = (halo: string) => ({\n  stroke: halo,\n  strokeWidth: 2.5,\n  strokeLinejoin: \"round\" as const,\n  paintOrder: \"stroke\",\n});\n\n/** A band's name: the page's text on the well, 8.2:1 at the least in every preset, 7.4:1\n *  under More contrast (measured 0.52) — no halo, nothing to stand out from; `none`\n *  against the inherited chart stroke. */\nconst BAND_INK = { fill: \"var(--text-primary)\", stroke: \"none\" };\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  /** Called with `groups` as its third argument when the cell has any; see\n   *  {@link TreemapProps.onNodeClick}. */\n  onNodeClick?: (id: string, name: string, groups?: readonly string[]) => void;\n  /** A group's cell's click; see {@link TreemapProps.onGroupClick}. */\n  onGroupClick?: (id: string, name: string, groups?: readonly string[]) => void;\n  /** The ids of the groups round the node, outermost first. `Treemap` puts it on every\n   *  node it hands recharts; a cell drawn in a caller's own map has it if the data does. */\n  groups?: readonly string[];\n  /** The node's place in the tree, which `Treemap` puts on every node it hands recharts:\n   *  its key in the map's keyboard, where an id may repeat between a group and a tile. */\n  path?: string;\n  /** Filled in by recharts for a GROUP: the nodes laid out inside it. A cell with\n   *  children draws a frame, not a tile (0.52). */\n  children?: readonly object[] | null;\n  /** See {@link TreemapProps.redactNames}: `\"tiles\"` tags a cell with no `children`, and\n   *  leaves a group's frame and band untagged (0.53). */\n  redactNames?: boolean | \"tiles\";\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  /** See {@link TreemapProps.edges}. Default `auto`. Read by a cell drawn on its own; a\n   *  `Treemap` hands its tiles its own `edges`. */\n  edges?: TreemapEdges;\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 *\n * Inside a `Treemap` it is one stop of the map's keyboard, named with its value and\n * share (0.52); drawn on its own it is a stop only as a button (`onNodeClick`), named by\n * `name`.\n *\n * A node with `children` is a GROUP (0.52): the cell draws a frame in the well's colour\n * (`--bg-surface-2`), with the group's name in a band along its top where the group has\n * the room (61px at Normal, treemap-layout's `BODY_SHARE`). Inside a `Treemap` its tiles are laid out\n * in the frame's body; in a caller's own nested recharts `<Treemap>` they are drawn where\n * recharts lays them, over the frame — only `Treemap` makes the room.\n */\nexport function TreemapCell(props: TreemapCellProps) {\n  const map = useContext(TreemapTiles);\n  return map ? <MapTile {...props} map={map} /> : <StandaloneTile {...props} />;\n}\n\n/** A cell inside a `Treemap`: drawn where the map's layout puts its node, read by path\n *  for the chart's size as recharts measured it. */\nfunction MapTile(props: TreemapCellProps & { map: TileContext }) {\n  const width = useChartWidth();\n  const height = useChartHeight();\n  const { scale } = useTextSize();\n  const place =\n    props.path !== undefined && width && height ? props.map.layout?.(width, height, scale).get(props.path) : undefined;\n  return <Tile {...props} place={place} />;\n}\n\n/** A cell with no `Treemap` above it: it resolves what the map would have handed it. */\nfunction StandaloneTile(props: TreemapCellProps) {\n  const tokens = useChartTokenHex().ramp;\n  const edgeFor = useChartEdge();\n  const edges = useEdgesInForce(props.edges ?? \"auto\");\n  const map = useMemo(() => ({ tokens, edgeFor, edges }), [tokens, edgeFor, edges]);\n  return <Tile {...props} map={map} />;\n}\n\nfunction Tile({\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  onGroupClick,\n  groups,\n  path,\n  children,\n  redactNames,\n  nodeNote,\n  dir = \"ltr\",\n  map,\n  place,\n}: TreemapCellProps & { map: TileContext; place?: Placed }) {\n  // Before the early return: a hook has to run on every render of the cell.\n  const { scale } = useTextSize();\n  const { tokens: tokenHex, edgeFor, edges, keys } = map;\n  // Depth 0 is recharts' synthetic root, which spans the whole chart.\n  if (!depth) return null;\n  // Inside a Treemap, where the map's layout draws the node; on its own, where recharts\n  // laid it out.\n  const box = place?.box ?? { x, y, width, height };\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(box.x);\n  const py = Math.round(box.y);\n  const pw = Math.round(box.width);\n  const ph = Math.round(box.height);\n  const isGroup = children != null && children.length > 0;\n  const group = !isGroup\n    ? undefined\n    : place?.body\n      ? { banded: place.banded ?? false, body: place.body }\n      : groupBody({ x: px, y: py, width: pw, height: ph }, scale);\n  const tileFill = fill ?? \"var(--chart-1)\";\n  const measured = measurableFill(tileFill, tokenHex);\n  const ink = labelColor ?? (measured ? textOn(measured) : \"currentColor\");\n  // `contrast`: a tile in a hue under 3:1 against the card gets a 1px ink edge inside\n  // the gutter (WCAG 1.4.11, anyplot's rule); a hue that clears it stays bare.\n  // `uniform`: no per-tile edge; every tile is parted by the same gutter.\n  // A group's frame is the well, 1.09–1.24:1 from the card in every preset and contrast\n  // (measured 0.52): under `contrast` it always takes the edge.\n  const edge =\n    edges !== \"contrast\" ? undefined : group ? CHART_ROLES.outline : 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. A group's name only in its band.\n  const labelSize = LABEL_FONT_SIZE * scale;\n  const noteSize = NOTE_FONT_SIZE * scale;\n  const roomForName = group ? group.banded : pw >= 44 * scale && ph >= 20 * scale;\n  const label = roomForName ? 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. Never in a band.\n  const rawNote = !group && 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  // A tile's click is `onNodeClick`, a frame's `onGroupClick`. The groups go along only\n  // when there are any, so a flat map calls back exactly as it did before 0.52.\n  const click = group ? onGroupClick : onNodeClick;\n  const activate =\n    id != null && click\n      ? () => (groups && groups.length > 0 ? click(id, name ?? \"\", groups) : click(id, name ?? \"\"))\n      : undefined;\n  // Inside a Treemap every tile and frame is a stop of the map's one roving tab stop,\n  // named with its value and share; a standalone cell is a stop of its own only when it\n  // is a button.\n  const roving = path != null && keys ? keys : undefined;\n  const focusable = roving !== undefined || activate !== undefined;\n  // `\"tiles\"` (0.53, keksdose after 0.52) leaves a group's frame and band untagged: its\n  // groups are public chain names, and its blur on `[data-private]` blurred them with the\n  // payees. A truthy test on the union would have tagged them still.\n  const redact = redactNames === true || (redactNames === \"tiles\" && !group);\n  const onKeyDown = focusable\n    ? (e: KeyboardEvent<SVGGElement>) => {\n        if (roving?.move(path!, e)) {\n          e.preventDefault();\n          return;\n        }\n        if (!activate || (e.key !== \"Enter\" && e.key !== \" \")) return;\n        e.preventDefault();\n        activate();\n      }\n    : undefined;\n  return (\n    <g\n      ref={roving ? refFor(roving.register, path!) : undefined}\n      onClick={activate}\n      onKeyDown={onKeyDown}\n      onFocus={roving ? () => roving.onFocus(path!) : undefined}\n      onMouseEnter={map.hover ? () => map.hover!({ x: px, y: py, width: pw, height: ph }) : undefined}\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. Under `redactNames`\n      // the group carries `data-private` whenever it carries a name, button or not: the\n      // name says the node's name and value, and an untagged `aria-label` is read by a\n      // session replay or a redaction keyed on `[data-private]` (0.52, code review of\n      // feat/0.52.0 — DSP-5 named every tile, and this tagged only the buttons).\n      role={activate ? \"button\" : roving ? \"img\" : undefined}\n      // In a map, -1 as drawn: the map moves its one stop on the elements in place.\n      tabIndex={roving ? -1 : activate ? 0 : undefined}\n      aria-label={focusable ? (roving?.name(path!) ?? name) : undefined}\n      data-private={focusable && redact ? \"\" : undefined}\n      data-group={group ? \"\" : 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={focusable ? \"outline-none [&:focus-visible>rect]:stroke-[var(--brand)]\" : undefined}\n    >\n      {/* The 2px gutter: the page's ground (`uniform`, the same dark line round every\n          tile in the dark theme) or the card showing through (`contrast`). Never a white\n          grid: on a dark surface white lines glare harder than the tiles. A group's frame\n          is the well, the inset surface: the page's own colour in light, a step up from\n          it in dark, and never one of the hues its tiles are told apart by. */}\n      <rect\n        x={px}\n        y={py}\n        width={pw}\n        height={ph}\n        fill={group ? \"var(--bg-surface-2)\" : tileFill}\n        stroke={edges === \"contrast\" ? \"var(--bg-surface)\" : \"var(--bg-page)\"}\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={redact ? \"\" : undefined}\n          x={textX}\n          // A band's name centred in its 20px; a tile's where its floor leaves room below.\n          y={py + (group ? 14 : 15) * scale}\n          direction={dir}\n          {...(group ? BAND_INK : { fill: ink, ...haloOf(halo) })}\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          {...haloOf(halo)}\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 *\n * `groups: false` is `redactNames=\"tiles\"` (0.53): a group's bubble is left untagged, as its\n * frame is. The payload says which node is hovered — recharts hands the node itself, with\n * its laid-out `children` for a group and `null` for a tile, as the cell is told — so\n * anything else, or no payload, is tagged.\n */\nfunction RedactedTooltipContent({\n  groups = true,\n  ...props\n}: ComponentProps<typeof ChartTooltipContent> & { groups?: boolean }) {\n  const children = props.payload?.[0]?.payload?.children;\n  const group = Array.isArray(children) && children.length > 0;\n  return (\n    <div data-private={groups || !group ? true : undefined}>\n      <ChartTooltipContent {...props} />\n    </div>\n  );\n}\n\n/** Where the pointer last entered a node, as drawn: a store of one box, so that only the\n *  tooltip re-renders when it moves — not the map, nor (through recharts) every tile. */\ninterface Anchor {\n  read: () => Box | null;\n  subscribe: (onChange: () => void) => () => void;\n  set: (box: Box) => void;\n}\n\nfunction createAnchor(): Anchor {\n  let at: Box | null = null;\n  const listeners = new Set<() => void>();\n  return {\n    read: () => at,\n    subscribe: (onChange) => {\n      listeners.add(onChange);\n      return () => listeners.delete(onChange);\n    },\n    set: (box) => {\n      if (at && at.x === box.x && at.y === box.y && at.width === box.width && at.height === box.height) return;\n      at = box;\n      listeners.forEach((onChange) => onChange());\n    },\n  };\n}\n\n/**\n * The map's tooltip, stood at the tile the pointer is on AS DRAWN. recharts anchors its\n * tooltip at the centre of the rectangle it laid the node out in, and since 0.52 the map\n * draws its nodes where its own layout puts them (see \"Groups\") — a tooltip anchored by\n * recharts could stand over a neighbour. It stands 10px off the tile's centre, towards the\n * chart's middle, so it does not run off the side the tile is on. `content` is the bubble,\n * as recharts' own `content`.\n */\nfunction TreemapTooltip({ content, anchor }: { content: ReactElement; anchor: Anchor }) {\n  const at = useSyncExternalStore(anchor.subscribe, anchor.read, anchor.read);\n  const width = useChartWidth() ?? 0;\n  const height = useChartHeight() ?? 0;\n  if (!at) return <ChartTooltip content={content} />;\n  const cx = at.x + at.width / 2;\n  const cy = at.y + at.height / 2;\n  const left = cx > width / 2;\n  const up = cy > height / 2;\n  return (\n    <ChartTooltip\n      content={content}\n      position={{ x: cx + (left ? -10 : 10), y: cy + (up ? -10 : 10) }}\n      // `translate` composes with the `transform` recharts sets for `position`.\n      wrapperStyle={{ translate: `${left ? \"-100%\" : \"0\"} ${up ? \"-100%\" : \"0\"}` }}\n    />\n  );\n}\n\n/** What `Treemap` hands recharts per node: a tile, or a group with `children`. recharts\n *  hands each node's fields to its cell; a field left out of this never reaches\n *  `TreemapCell` (0.8.0 shipped `labelColor` without it — keksdose). A type, not an\n *  interface: recharts' `data` wants an index signature, which only an alias meets. */\ntype MapNode = {\n  id: string;\n  name: string;\n  /** A tile's value; a group's, its drawn tiles' together. recharts sums a group again\n   *  for its layout, and its tooltip reads this field. */\n  size: number;\n  fill: string;\n  labelColor?: string;\n  /** The ids of the groups round the node, outermost first. */\n  groups: readonly string[];\n  /** The node's key in the map's keyboard and names: its id and its groups' (see TileKeys). */\n  path: string;\n  children?: MapNode[];\n};\n\n/** What a group hands down to the tiles inside it that set none of their own. */\ninterface Paint {\n  fill: string;\n  labelColor?: string;\n  shade?: number;\n}\n\n/**\n * `data` as drawn: tiles with a positive value, at most `maxTiles` of them in the order\n * given (depth first), and the groups that still hold any. `shaded` turns a fill and a\n * `shade` into the fill drawn.\n *\n * Coloured by index into `data` AS GIVEN, before anything is dropped: a caller painting a\n * legend or a second map from the same list must land on the same hue for the same row,\n * and filtering first would shift every colour after a gap. Below the top a node takes\n * its group's colour, so a group's tiles share one hue unless they set their own.\n */\nfunction mapNodes(\n  data: readonly TreemapNode[],\n  ramp: readonly string[],\n  maxTiles: number | null | undefined,\n  shaded: (fill: string, shade: number | undefined) => string,\n): MapNode[] {\n  // Whole tiles, as `slice(0, maxTiles ?? undefined)` counted them up to 0.51: 2.5 draws 2,\n  // NaN none and null every one (0.52 code review of treemap.tsx, finding 4 — a bare\n  // counter drew 3, and every tile; deep review, charts, finding 2 — Math.floor(null) is 0,\n  // and a JS caller's or a `number | null` setting's null drew an empty card).\n  let left = maxTiles == null ? Infinity : Number.isNaN(maxTiles) ? 0 : Math.floor(maxTiles);\n  const walk = (list: readonly TreemapNode[], groups: readonly string[], paint: Paint | undefined): MapNode[] =>\n    list.flatMap((d, idx): MapNode[] => {\n      const fill = d.fill ?? paint?.fill ?? ramp[idx % ramp.length]!;\n      // An inherited fill brings its ink along (a `color-mix()` group needs its\n      // `labelColor`); a fill of the tile's own is measured again.\n      const labelColor = d.labelColor ?? (d.fill === undefined ? paint?.labelColor : undefined);\n      const shade = d.shade ?? paint?.shade;\n      if (d.children && d.children.length > 0) {\n        const children = walk(d.children, [...groups, d.id], { fill, labelColor, shade });\n        if (children.length === 0) return [];\n        const size = children.reduce((acc, c) => acc + c.size, 0);\n        return [{ id: d.id, name: d.name, size, fill, groups, path: pathOf(groups, d.id), children }];\n      }\n      if (!(Number.isFinite(d.value) && d.value > 0) || left <= 0) return [];\n      left -= 1;\n      const drawn = shaded(fill, shade);\n      // An ink the GROUP chose was chosen for the group's colour: once `shade` makes the\n      // tile another hex, that hex is measured instead (0.52 code review of treemap.tsx,\n      // finding 5 — white ink on a tile shaded almost to the card, ~1.3:1). The tile's\n      // own `labelColor` still wins: the caller set it for this tile.\n      const ink = d.labelColor ?? (drawn === fill ? labelColor : undefined);\n      return [\n        { id: d.id, name: d.name, size: d.value, fill: drawn, labelColor: ink, groups, path: pathOf(groups, d.id) },\n      ];\n    });\n  return walk(data, [], undefined);\n}\n\n/** The last layout made for each drawn tree, by size and text size: a memo, not state — it\n *  is a pure function of its key, so whichever cell asks first, every cell gets the same. */\nconst LAYOUTS = new WeakMap<readonly MapNode[], { key: string; placed: ReadonlyMap<string, Placed> }>();\n\nfunction layoutFor(nodes: readonly MapNode[], width: number, height: number, scale: number) {\n  const key = `${width}x${height}@${scale}`;\n  const last = LAYOUTS.get(nodes);\n  if (last?.key === key) return last.placed;\n  const placed = layoutTreemap(nodes, width, height, scale);\n  LAYOUTS.set(nodes, { key, placed });\n  return placed;\n}\n\n/** One ref callback per map and path, the same on every render: a new function each time\n *  makes React detach and attach the element on every render of the tile. A path no longer\n *  drawn is let go as the map lays out its new data (see the map's keyboard). */\nconst REFS = new WeakMap<TileKeys[\"register\"], Map<string, (element: SVGGElement | null) => void>>();\n\nfunction refFor(register: TileKeys[\"register\"], path: string) {\n  let byPath = REFS.get(register);\n  if (!byPath) {\n    byPath = new Map();\n    REFS.set(register, byPath);\n  }\n  let ref = byPath.get(path);\n  if (!ref) {\n    ref = (element) => register(path, element);\n    byPath.set(path, ref);\n  }\n  return ref;\n}\n\n/** A node's path: its groups' ids and its own, as JSON so that no id can fake a separator. */\nconst pathOf = (groups: readonly string[], id: string) => JSON.stringify([...groups, id]);\n\n/** `nodes` in the order the keyboard walks them: each group, then what is inside it. */\nfunction depthFirst(nodes: readonly MapNode[]): MapNode[] {\n  return nodes.flatMap((n) => [n, ...(n.children ? depthFirst(n.children) : [])]);\n}\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; every tile is a keyboard stop named with its value and share (see\n * `onNodeClick`), and `onNodeClick` turns the tiles into buttons.\n *\n * A node with `children` is a group (0.52): a labelled frame with its tiles inside, in\n * its colour unless they set their own — see {@link TreemapNode.children}.\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  onGroupClick,\n  redactNames = false,\n  shareInValue = false,\n  nodeNote,\n  maxTiles,\n  colors,\n  edges = \"auto\",\n  description,\n  labels: labelsProp,\n  style,\n  ...rest\n}: TreemapProps) {\n  // Resolved once for every tile, which reads them from `TreemapTiles` (DSP-22).\n  const { ramp: tokenHex, card } = useChartTokenHex();\n  const edgeFor = useChartEdge();\n  const edgesInForce = useEdgesInForce(edges);\n  const labels = useKitLabels(\"treemap\", DEFAULT_TREEMAP_LABELS, labelsProp);\n  // The provider's locale (0.52, refactor audit 2026-10-30, DOC-10): this was the one\n  // formatter default in the kit that took the runtime's.\n  const locale = useKitLocale();\n  const numberFormat = useMemo(() => new Intl.NumberFormat(locale), [locale]);\n  // One decimal under 10 %, the rule PieChart says its shares by too (lib/share-format):\n  // a tile of 0.4 % named \"0%\" says it is not there.\n  const shareText = useMemo(() => shareFormat(locale), [locale]);\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  // Memoised: moving the tab stop re-renders the map, and fresh nodes would re-lay it.\n  const nodes = useMemo(\n    () =>\n      mapNodes(data, ramp, maxTiles, (fill, shade) => {\n        // `shade` (0.52): the hue mixed into the card as a hex, so it is measured like\n        // any other. A fill or a card it cannot read keeps the full hue.\n        if (shade === undefined || !Number.isFinite(shade) || shade >= 1 || !card) return fill;\n        const hex = measurableFill(fill, tokenHex);\n        return hex ? lerpHex(card, hex, shade) : fill;\n      }),\n    [data, ramp, maxTiles, tokenHex, card],\n  );\n  // The keyboard walks groups and tiles alike, in the data's order (see `onNodeClick`).\n  const order = useMemo(() => depthFirst(nodes), [nodes]);\n  // The map's layout (see \"Groups\"), for the size recharts measured: each cell asks for it\n  // by that size, and `layoutFor` makes it once per size and text size.\n  const layout = useMemo(\n    () => (width: number, height: number, scale: number) => layoutFor(nodes, width, height, scale),\n    [nodes],\n  );\n  // Where the pointer is, for the tooltip to stand at (`TreemapTooltip`).\n  const [anchor] = useState(createAnchor);\n\n  // The keyboard (DSP-5): one tab stop for the map, moved between tiles in `order` as\n  // PieChart's is between slices. The tiles are drawn by recharts, so they register\n  // their element here rather than being looked up.\n  //\n  // The stop is moved on the elements IN PLACE, as PieChart moves its own, and never\n  // reaches the tiles' context: kept there, every arrow-key step was a new context and\n  // every tile drew again — layout, fitted labels, notes (0.52 code review of treemap.tsx,\n  // finding 6). And recharts keys a node by where IT lays it out (`x-y-name`), so new data\n  // or a resize remounts the focused node: its element leaves holding the focus, which\n  // fell to <body> (finding 7). The path it held is kept, and its new element takes the\n  // focus back as it mounts — or, if the node is gone, the stop does.\n  const tiles = useRef(new Map<string, SVGGElement>());\n  const orderRef = useRef(order);\n  const stopRef = useRef<string | undefined>(undefined);\n  const restoreRef = useRef<string | null>(null);\n  /** The path holding the stop: the last one focused while it is drawn, else the first. */\n  const stopOf = useCallback(() => {\n    const drawn = orderRef.current;\n    return drawn.some((n) => n.path === stopRef.current) ? stopRef.current : drawn[0]?.path;\n  }, []);\n  const applyStop = useCallback(() => {\n    const at = stopOf();\n    tiles.current.forEach((el, path) => el.setAttribute(\"tabindex\", path === at ? \"0\" : \"-1\"));\n    return at;\n  }, [stopOf]);\n  const register = useCallback(\n    (path: string, element: SVGGElement | null) => {\n      if (element) {\n        tiles.current.set(path, element);\n        element.setAttribute(\"tabindex\", path === stopOf() ? \"0\" : \"-1\");\n        if (restoreRef.current === path) {\n          restoreRef.current = null;\n          element.focus();\n        }\n        return;\n      }\n      // Detached before it is removed: still the focused element if it held the focus.\n      // Kept for this commit only — the node's new element mounts in it, or the effect below\n      // hands the focus on. A node that left with no new data (`<Activity mode=\"hidden\">`, a\n      // panel 0 wide) took the focus back whenever it was shown again, from wherever the\n      // reader was by then (0.52 code review, deep, charts, finding 3).\n      if (tiles.current.get(path) === document.activeElement) {\n        restoreRef.current = path;\n        queueMicrotask(() => {\n          if (restoreRef.current === path) restoreRef.current = null;\n        });\n      }\n      tiles.current.delete(path);\n    },\n    [stopOf],\n  );\n  const onFocus = useCallback(\n    (path: string) => {\n      stopRef.current = path;\n      applyStop();\n    },\n    [applyStop],\n  );\n  // New data: the order the stop is read against, the stop set again on what is drawn now,\n  // the focus of a node that is gone handed to the stop — and the ref callbacks of the paths\n  // no longer drawn let go: a map that switched data (a month picker over payees) kept one\n  // for every node it had ever drawn (0.52 code review, deep, charts, finding 11).\n  useLayoutEffect(() => {\n    orderRef.current = order;\n    const refs = REFS.get(register);\n    if (refs) {\n      const drawn = new Set(order.map((n) => n.path));\n      for (const path of refs.keys()) if (!drawn.has(path)) refs.delete(path);\n    }\n    const at = applyStop();\n    if (restoreRef.current === null) return;\n    restoreRef.current = null;\n    if (at) tiles.current.get(at)?.focus();\n  }, [order, applyStop, register]);\n  const move = useCallback((path: string, event: KeyboardEvent<SVGGElement>) => {\n    const drawn = orderRef.current;\n    const at = drawn.findIndex((n) => n.path === path);\n    // The ends hold: a map is a plane, not PieChart's ring. → is the next tile in any page:\n    // the tiles are laid out left to right whatever the reading direction (the plot is not\n    // mirrored, see `ChartContainer`), and → read off the page walked an RTL page's map\n    // backwards, against the picture (0.52 code review, deep, charts, finding 1).\n    const to = at < 0 ? undefined : rovingTarget(event.key, \"ltr\", at, drawn.length, false);\n    if (to === undefined) return false;\n    const target = drawn[to];\n    if (target) tiles.current.get(target.path)?.focus();\n    return true;\n  }, []);\n\n  // Everything below is memoised over what it reads (0.52, code review of feat/0.52.0). A\n  // tile re-renders when its context or its recharts element changes, and recharts' map is\n  // a PureComponent that redraws every node when `content` or its tooltip child is a new\n  // element: built afresh per render, as they were, a page re-rendering the card or one\n  // arrow-key step redrew every tile and ran `labels.tile` and two `Intl` formats per node\n  // again — the cost DSP-22 had just taken out of the tiles.\n  //\n  // The share is of what is DRAWN, so it always reads as \"of this picture\" — a group's\n  // and a tile's inside it alike.\n  const total = useMemo(() => nodes.reduce((acc, n) => acc + n.size, 0), [nodes]);\n  const format = useCallback(\n    (v: number): ReactNode =>\n      valueFormatter ? valueFormatter(v, total > 0 ? v / total : undefined) : formatWithMinus(numberFormat, v),\n    [valueFormatter, total, numberFormat],\n  );\n  const names = useMemo(() => {\n    // The value as the tooltip says it: the caller's formatter, handed the node's share as\n    // it is there, when it gives text; a value it formats as markup is said as a number.\n    //\n    // It was asked with the share `undefined` — which, with anything drawn, it had never\n    // been before 0.52 — so a formatter leaning on the share printed \"NaN%\" into every name\n    // or threw and took the chart down (0.52 code review of treemap.tsx, finding 2). A guard\n    // caught both; every named node has its share, so it is handed over instead (deep\n    // review, charts, finding 13).\n    const valueText = (v: number) => {\n      const out = format(v);\n      return typeof out === \"string\" || typeof out === \"number\" ? String(out) : formatWithMinus(numberFormat, v);\n    };\n    // A group's name by its path; a node's groups by theirs, its own path's prefixes.\n    const groupName = new Map(order.filter((n) => n.children).map((n) => [n.path, n.name]));\n    // `\"\"` when the formatter's text says the share already, which every template drops\n    // (0.53, `shareInValue`).\n    const shareOf = (v: number) => (shareInValue ? \"\" : shareText(total > 0 ? v / total : 0));\n    return new Map(\n      order.map((n) => {\n        const say = n.children ? labels.group : labels.tile;\n        const own = say(n.name, valueText(n.size), shareOf(n.size));\n        // The innermost group first: \"Rent: …, in Housing, in Fixed costs\".\n        const named = n.groups\n          .map((g, i) => groupName.get(pathOf(n.groups.slice(0, i), g)) ?? g)\n          .reduceRight((acc, group) => labels.inGroup(acc, group), own);\n        return [n.path, named] as const;\n      }),\n    );\n  }, [order, labels, format, numberFormat, shareText, shareInValue, total]);\n  const keys = useMemo<TileKeys>(\n    () => ({ name: (path) => names.get(path), onFocus, register, move }),\n    [names, onFocus, register, move],\n  );\n  const context = useMemo<TileContext>(\n    () => ({ tokens: tokenHex, edgeFor, edges: edgesInForce, keys, layout, hover: anchor.set }),\n    [tokenHex, edgeFor, edgesInForce, keys, layout, anchor],\n  );\n  const cell = useMemo(\n    () => (\n      <TreemapCell\n        onNodeClick={onNodeClick}\n        onGroupClick={onGroupClick}\n        redactNames={redactNames}\n        nodeNote={nodeNote}\n        dir={dir}\n      />\n    ),\n    [onNodeClick, onGroupClick, redactNames, nodeNote, dir],\n  );\n  const tooltip = useMemo(\n    () => (\n      <TreemapTooltip\n        content={\n          redactNames ? (\n            <RedactedTooltipContent hideLabel valueFormatter={format} groups={redactNames === true} />\n          ) : (\n            <ChartTooltipContent hideLabel valueFormatter={format} />\n          )\n        }\n        anchor={anchor}\n      />\n    ),\n    [redactNames, format, anchor],\n  );\n\n  if (nodes.length === 0) return null;\n  const box = chartHeightProps(height);\n  return (\n    // Round the container, not inside it: ResponsiveContainer sizes its ONE child, the chart.\n    <TreemapTiles.Provider value={context}>\n      <ChartContainer\n        role=\"figure\"\n        {...rest}\n        // Read through `aria-describedby`, after a caller's own ids; `hidden`, inside the\n        // figure (0.52 code review, deep, charts, finding 7).\n        description={description}\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 data={nodes} dataKey=\"size\" fill=\"var(--chart-1)\" isAnimationActive={false} content={cell}>\n          {tooltip}\n        </RechartsTreemap>\n      </ChartContainer>\n    </TreemapTiles.Provider>\n  );\n}\n"],"mappings":"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","names":["height"]}
+{"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.\n//\n// Since 0.52 a node can hold `children`: a group, drawn as a labelled frame round its\n// tiles (keksdose dev #642, shops by chain). Where every node is drawn is the map's own\n// layout (treemap-layout.ts), not recharts': see \"Groups: a frame round their tiles\".\n// Since 0.55 it draws them itself too, and recharts' `<Treemap>` is gone from it: see\n// \"The picture\".\nimport {\n  cloneElement,\n  memo,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useRef,\n  useState,\n  useSyncExternalStore,\n} from \"react\";\nimport type { ComponentProps, ComponentPropsWithoutRef, KeyboardEvent, ReactElement, ReactNode } from \"react\";\nimport { ChartContainer, ChartTooltipContent, type ChartConfig } from \"./chart\";\nimport { CHART_ROLES, PALETTE_HEX, PALETTE_SIZE, lerpHex, textOn } from \"../theme/chart-palette\";\nimport { resolveChartColor, useChartEdge, useEdgesInForce, type ChartEdges } from \"./chart-edge\";\nimport { parseHex } from \"../theme/color\";\nimport { dirOf, rovingTarget, type Direction } from \"../lib/direction\";\nimport { returnFocus } from \"../lib/focus-left\";\nimport { shareFormat } from \"../lib/share-format\";\nimport { cn } from \"../lib/cn\";\nimport { useTextSize } from \"../theme/text-size\";\nimport { chartHeightProps, type ChartHeight } from \"./chart-height\";\nimport { formatWithMinus } from \"../lib/minus\";\nimport { prefersReducedMotion } from \"../lib/reduced-motion\";\nimport { useKitLabels, useKitLocale, type LabelOverride } from \"../i18n/kit-labels\";\nimport { DEFAULT_TREEMAP_LABELS, type TreemapLabels } from \"./treemap-labels\";\nimport { groupBody, layoutTreemap, type Placed } from \"./treemap-layout\";\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 among a group's own\n   *  nodes (or the top's). A group and a tile inside it may share one — chain 12 and shop\n   *  12 from two tables — and `onNodeClick`'s `groups` tells them apart (0.52). */\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 a squarified layout handed a negative size\n   *  draws 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   *\n   *  A GROUP's own `value` is not read: its area is its drawn children's together. Pass\n   *  that sum — the field stays required so that every reader of a `TreemapNode[]` keeps\n   *  a `number`. */\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   *\n   *  On a group, the colour of every tile inside it that sets none (0.52): keksdose's\n   *  \"hue = chain\" is a `fill` per chain. A group left without one takes the ramp by its\n   *  index, as a tile does, and hands that down; its frame is drawn in the page's own\n   *  colours whatever it is. */\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. A tile that takes its group's\n   *  `fill` takes the group's `labelColor` with it; one with a `fill` of its own, or one\n   *  that `shade` turns into another colour, is measured again. */\n  labelColor?: string;\n  /**\n   * The tile's colour strength, 0–1 (0.52): its `fill` mixed into the card's colour\n   * (`--bg-surface`) as a concrete hex, `1` the full hue. For a second, ordered quantity\n   * on top of the hue — keksdose's recency steps (1, 0.78, 0.55) over the chain's hue —\n   * without a `color-mix()`: the result is measured like any hex, so the label ink stays\n   * automatic and no `labelColor` is needed. keksdose found a tile under ~0.55 stops\n   * reading as its hue and passes for the muted \"other\" (#642).\n   *\n   * Only a fill the kit can measure is shaded (a hex, a bare `var(--chart-N)` or another\n   * bare token), and only on a page that declares `--bg-surface` as a hex; anything else\n   * keeps its full hue. On a group, the default for its tiles, as `fill` is.\n   */\n  shade?: number;\n  /**\n   * Makes this node a GROUP (0.52, keksdose dev #642: \"Is there already a distinction\n   * between shop and chain?\"): a labelled frame, its name in a band along the top, its\n   * tiles laid out inside it by the map's own layout, each at its share of the whole\n   * picture (see \"Groups: a frame round their tiles\"). Groups nest. A group with nothing\n   * drawable inside is not drawn; an empty array is a tile.\n   *\n   * The frame is in the page's colours (the well, `--bg-surface-2`, under\n   * `--text-primary`, at least 7.4:1 in every preset and contrast), and under More\n   * contrast it is outlined in `--chart-ink` as a pale tile is. Its band is drawn only\n   * where the group has the room for it — see `TreemapCell`.\n   */\n  children?: readonly TreemapNode[];\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 *\n * The root is a `role=\"figure\"` (0.52, refactor audit 2026-10-30, DSP-5): name it with\n * `aria-label` (\"Spending by category\"), and say what it shows with {@link\n * TreemapProps.description}.\n */\nexport interface TreemapProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\"> {\n  data: readonly 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   * A tile's and a group's accessible name (`labels.tile`, `labels.group`, 0.52) says the\n   * value too, asked of the formatter as the tooltip asks it, share and all, and its text\n   * is used; markup is said as the bare number. The name says the share itself, so a\n   * formatter that writes it into its text has it said twice — say so with\n   * {@link TreemapProps.shareInValue}.\n   *\n   * Default: the bare number through `Intl.NumberFormat` in the provider's locale (0.52,\n   * DOC-10: before, the runtime's). A host with a currency passes this — the kit knows\n   * none.\n   */\n  valueFormatter?: (value: number, share: number | undefined) => ReactNode;\n  /**\n   * The `valueFormatter`'s text already says the share (\"CHF 412.30 · 12%\"), so a tile's\n   * and a group's accessible name leave their own \" (12%)\" out (0.53, keksdose after 0.52):\n   * the map hands `labels.tile` and `labels.group` the share as `\"\"`, and every catalogue's\n   * template drops it there, in its own typography. Before, the only way out was to replace\n   * both templates, and with them the kit's seven catalogues. The tooltip is the same either\n   * way: it prints what the formatter prints. A formatter whose value is markup is said as\n   * the bare number, so its share is then not said at all.\n   *\n   * Default `false`: the name says the share.\n   */\n  shareInValue?: boolean;\n  /**\n   * What the map SHOWS, in a sentence — \"Rent is three fifths of the month.\" — the\n   * figure's accessible description (0.52, DSP-5). Not drawn; a caption the eye should\n   * read too belongs in the page.\n   */\n  description?: string;\n  /** Per-map strings over `<UiKitProvider labels={{ treemap }}>`. */\n  labels?: LabelOverride<TreemapLabels>;\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  /**\n   * A tile was activated — by click, or by Enter/Space on a focused tile. Setting this\n   * makes every tile a `role=\"button\"`.\n   *\n   * Either way every tile is reachable (0.52, DSP-5): ONE tab stop for the map, the\n   * arrows (←/→ along the reading direction, ↓/↑), Home and End between tiles in the\n   * order given, each named \"name: value (share)\" (`labels.tile`) — a `role=\"img\"` to read\n   * when nothing listens, as PieChart's slices. Before, a map nobody clicked was nothing\n   * to a screen reader, and a clickable tile said its name alone, one tab stop each.\n   *\n   * In a map with groups (`TreemapNode.children`, 0.52) the walk is the data's own order,\n   * depth first: a group's frame, then its tiles, then the next group. A frame is named\n   * by `labels.group` (\"Interspar, group: €1,240 (40%)\"), a tile inside one by\n   * `labels.inGroup` round its own name (\"Rankweil: €412 (12%), in Interspar\"). Only\n   * tiles reach this callback (a frame reaches `onGroupClick`); a tile inside a group is\n   * handed a third argument, the ids of its groups, outermost first. Optional in the type,\n   * so a forwarder calling this with two arguments still type-checks — and absent for a\n   * tile at the top, so a flat map calls it exactly as before.\n   */\n  onNodeClick?: (id: string, name: string, groups?: readonly string[]) => void;\n  /**\n   * A group's frame was activated — by click on its band or margin, or by Enter/Space on\n   * the focused frame (0.52). Setting this makes every frame a `role=\"button\"`; without it\n   * a frame is a `role=\"img\"`, still a stop of the map's keyboard so its total is heard.\n   * `groups` as for {@link TreemapProps.onNodeClick}: the groups round this one, passed\n   * only for a group inside another.\n   */\n  onGroupClick?: (id: string, name: string, groups?: readonly 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   * Every tile is tagged as a whole too, clickable or not (0.52): its accessible name\n   * (`labels.tile`) says the name and the value, in an attribute a host's redaction\n   * reaches only through the tag.\n   *\n   * - `true`: every node — the tiles, and a group's frame (its `<g>` and its band's name)\n   *   and tooltip bubble too.\n   * - `\"tiles\"` (0.53, keksdose after 0.52): the tiles as `true` tags them, and no group —\n   *   for groups that are public names over private ones, as chains (Migros, Coop) over\n   *   the shops a user paid. Its frame's band, its frame and its bubble's name are\n   *   untagged, and so is the frame's accessible name (`labels.group`), which says the\n   *   group's TOTAL: use it only where the groups' names and totals are not the private\n   *   part. The bubble's value cell is tagged whatever this says, as in every chart.\n   *   A tile's name still says its group's (`labels.inGroup`), under the tile's tag.\n   */\n  redactNames?: boolean | \"tiles\";\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   * Asked for tiles only: a group's band holds its name and nothing else.\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   * With groups, the tiles are counted across them in the order given, depth first; a\n   * group left with none is not drawn, and a group's frame is not a tile.\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   * How tiles are parted (0.51.6, keksdose dev #642, Marcel: \"The borders do not look\n   * nice when changing from tile to tile. Can this be uniform black?\" — and then, on the\n   * contrast rule that would go with it: follow the contrast setting).\n   *\n   * - `\"auto\"` (default): `\"uniform\"` at Standard contrast, `\"contrast\"` while More\n   *   contrast is in force (`<html data-contrast=\"more\">`: the reader chose it, or chose\n   *   System on a device that asks for more). Followed live.\n   * - `\"uniform\"`: one 2px gutter in the page's ground colour (`--bg-page`, near-black\n   *   in the dark theme) round every tile, and nothing else. Tiles always abut, so the\n   *   gutter parts them; each tile is named by its label.\n   * - `\"contrast\"`: the 0.49 rule. The gutter is the card's colour (`--bg-surface`),\n   *   and a tile whose hue is under 3:1 against the card gets a 1px ink edge inside it\n   *   (WCAG 1.4.11, `useChartEdge`). In the dark theme that ink is light, so some tiles\n   *   carry a white outline and their neighbours none — the unevenness #642 saw, and\n   *   the price of the edge for a reader who asked for it.\n   */\n  edges?: TreemapEdges;\n}\n\n/** {@link TreemapProps.edges}. The switch itself is chart-edge's `useEdgesInForce`,\n *  which SeriesChart's bars and areas follow too since 0.52 (DSP-18). */\nexport type TreemapEdges = ChartEdges;\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, and after a `|` the card's colour, joined into ONE string so\n *  `useSyncExternalStore` compares a primitive: a fresh array per read would never be\n *  `Object.is`-equal to the last and 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  const ramp = 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  // The card, which `TreemapNode.shade` mixes a hue into (0.52). No fallback: a page that\n  // declares no `--bg-surface` hex leaves nothing to mix into, and the tile keeps its hue.\n  const card = style.getPropertyValue(\"--bg-surface\").trim();\n  return `${ramp}|${parseHex(card) ? card : \"\"}`;\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\ninterface ChartTokens {\n  ramp: readonly string[];\n  /** `--bg-surface` as hex, or null when the page declares none. */\n  card: string | null;\n}\n\nfunction useChartTokenHex(): ChartTokens {\n  const joined = useSyncExternalStore(subscribeChartTokens, readChartTokens, () => SERVER_TOKENS);\n  // One object per reading, not per render: the map's nodes are memoised on it.\n  return useMemo(() => {\n    const [ramp = \"\", card = \"\"] = joined.split(\"|\");\n    return { ramp: ramp.split(\",\"), card: card || null };\n  }, [joined]);\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// ── What a tile reads from its map ───────────────────────────────────────\n//\n// 0.52 (refactor audit 2026-10-30, DSP-22): every tile resolved the token ramp, the ink\n// edge and the edge rule itself — three stores, each with a MutationObserver on <html>, so\n// 72 on keksdose's 24-tile maps, and up to 29 custom properties re-read on every render of\n// every tile. `Treemap` resolves them once and hands them to every tile it draws; a\n// TreemapCell drawn in a caller's own recharts `<Treemap>` has no map above it and\n// resolves its own.\n\ninterface TileContext {\n  tokens: readonly string[];\n  edgeFor: (fill: string | undefined) => string | undefined;\n  edges: \"uniform\" | \"contrast\";\n  /** The map's keyboard (DSP-5): absent for a standalone cell. */\n  keys?: TileKeys;\n  /** The pointer is on the node at `path`: what the map's tooltip says, standing where the\n   *  node is drawn. Absent for a standalone cell, whose tooltip is its recharts map's. */\n  hover?: (path: string) => void;\n}\n\n/**\n * Keyed by a node's PATH (`MapNode.path`), not its id: a group and a tile may share an id\n * — chain 12 and shop 12 come from two tables — and keyed by id the map had two tab stops,\n * the frame said the tile's name and the arrows stuck (0.52 code review of treemap.tsx,\n * finding 3).\n */\ninterface TileKeys {\n  /** A tile's or a group's accessible name (`labels.tile`, `labels.group`). */\n  name: (path: string) => string | undefined;\n  onFocus: (path: string) => void;\n  /** A node's element as it mounts (and `null` as it goes): the map sets its `tabindex` and\n   *  gives it back the focus its previous element held (see the map's keyboard). */\n  register: (path: string, element: SVGGElement | null) => void;\n  /** Moves focus for an arrow, Home or End pressed on node `path`; `false` for any other key. */\n  move: (path: string, event: KeyboardEvent<SVGGElement>) => boolean;\n}\n\n// ── Groups: a frame round their tiles ─────────────────────────────────────\n//\n// 0.52 (keksdose dev #642). A group is a frame with its name in a band along the top, its\n// tiles inside it. recharts lays nested data out edge to edge, with no room for a band, so\n// the map lays it out ITSELF (treemap-layout.ts): squarified as recharts does it, each\n// group given its frame's area on top of its tiles' — so a tile's area stays its share of\n// the picture in any group (0.52 code review of treemap.tsx, finding 1) — and computed up\n// front from the drawn nodes and the chart's size. Before, a group's cell made the room\n// during render and left it in a module cache for its children's cells, which held only\n// while recharts rendered a group before its children (finding 8).\n//\n// ── The picture ───────────────────────────────────────────────────────────\n//\n// 0.55 (held back from 0.53's code review): the map draws its nodes itself, an `<svg>` of\n// its own tiles in the order its keyboard walks them (`TreemapPlot`), with its own bubble\n// beside it (`TreemapTooltip`). Up to 0.54 recharts' `<Treemap>` still rendered each node's\n// cell and the tooltip, and the map worked round it at every turn: recharts laid the nodes\n// out again for nothing, keyed each by where IT had put it (so new data remounted the tile\n// holding the focus), anchored its bubble at the rectangle IT had laid out (so the map\n// stood it again), and brought its chart store along — about 240 kB of recharts, minified,\n// on a page whose one chart is a map. What stays is the shell every chart is drawn in,\n// `ChartContainer`.\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/** A tile's text, painted over a halo in its tile's colour (see `TreemapCell`). */\nconst haloOf = (halo: string) => ({\n  stroke: halo,\n  strokeWidth: 2.5,\n  strokeLinejoin: \"round\" as const,\n  paintOrder: \"stroke\",\n});\n\n/** A band's name: the page's text on the well, 8.2:1 at the least in every preset, 7.4:1\n *  under More contrast (measured 0.52) — no halo, nothing to stand out from; `none`\n *  against the inherited chart stroke. */\nconst BAND_INK = { fill: \"var(--text-primary)\", stroke: \"none\" };\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  /** Called with `groups` as its third argument when the cell has any; see\n   *  {@link TreemapProps.onNodeClick}. */\n  onNodeClick?: (id: string, name: string, groups?: readonly string[]) => void;\n  /** A group's cell's click; see {@link TreemapProps.onGroupClick}. */\n  onGroupClick?: (id: string, name: string, groups?: readonly string[]) => void;\n  /** The ids of the groups round the node, outermost first. `Treemap` gives it every tile\n   *  it draws; a cell drawn in a caller's own map has it if the data does. */\n  groups?: readonly string[];\n  /** The node's place in the tree, which `Treemap` gives every tile it draws: its key in\n   *  the map's keyboard, where an id may repeat between a group and a tile. */\n  path?: string;\n  /** Filled in by recharts for a GROUP: the nodes laid out inside it. A cell with\n   *  children draws a frame, not a tile (0.52). */\n  children?: readonly object[] | null;\n  /** See {@link TreemapProps.redactNames}: `\"tiles\"` tags a cell with no `children`, and\n   *  leaves a group's frame and band untagged (0.53). */\n  redactNames?: boolean | \"tiles\";\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  /** See {@link TreemapProps.edges}. Default `auto`. Read by a cell drawn on its own; a\n   *  `Treemap` hands its tiles its own `edges`. */\n  edges?: TreemapEdges;\n}\n\n/**\n * One tile, for a caller drawing its own recharts `<Treemap>`: the `content` that gives it\n * the map's label rules. `Treemap` itself draws the same tile (0.55, \"The picture\").\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 *\n * Drawn on its own it is a stop only as a button (`onNodeClick`), named by `name`; a\n * `Treemap`'s tile is one stop of the map's keyboard, named with its value and share\n * (0.52).\n *\n * A node with `children` is a GROUP (0.52): the cell draws a frame in the well's colour\n * (`--bg-surface-2`), with the group's name in a band along its top where the group has\n * the room (61px at Normal, treemap-layout's `BODY_SHARE`). In a caller's own nested\n * recharts `<Treemap>` the group's tiles are drawn where recharts lays them, over the\n * frame — only `Treemap` makes the room, laying them out in the frame's body.\n */\nexport function TreemapCell(props: TreemapCellProps) {\n  // A cell with no `Treemap` above it resolves what the map would have handed it.\n  const tokens = useChartTokenHex().ramp;\n  const edgeFor = useChartEdge();\n  const edges = useEdgesInForce(props.edges ?? \"auto\");\n  const map = useMemo(() => ({ tokens, edgeFor, edges }), [tokens, edgeFor, edges]);\n  return <Tile {...props} map={map} />;\n}\n\nfunction Tile({\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  onGroupClick,\n  groups,\n  path,\n  children,\n  redactNames,\n  nodeNote,\n  dir = \"ltr\",\n  map,\n  place,\n}: TreemapCellProps & { map: TileContext; place?: Placed }) {\n  // Before the early return: a hook has to run on every render of the cell.\n  const { scale } = useTextSize();\n  const { tokens: tokenHex, edgeFor, edges, keys } = map;\n  // Depth 0 is recharts' synthetic root, which spans the whole chart; the map draws none.\n  if (!depth) return null;\n  // In a Treemap, where the map's layout puts the node; on its own, where recharts laid it.\n  const box = place?.box ?? { x, y, width, height };\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(box.x);\n  const py = Math.round(box.y);\n  const pw = Math.round(box.width);\n  const ph = Math.round(box.height);\n  const isGroup = children != null && children.length > 0;\n  const group = !isGroup\n    ? undefined\n    : place?.body\n      ? { banded: place.banded ?? false, body: place.body }\n      : groupBody({ x: px, y: py, width: pw, height: ph }, scale);\n  const tileFill = fill ?? \"var(--chart-1)\";\n  const measured = measurableFill(tileFill, tokenHex);\n  const ink = labelColor ?? (measured ? textOn(measured) : \"currentColor\");\n  // `contrast`: a tile in a hue under 3:1 against the card gets a 1px ink edge inside\n  // the gutter (WCAG 1.4.11, anyplot's rule); a hue that clears it stays bare.\n  // `uniform`: no per-tile edge; every tile is parted by the same gutter.\n  // A group's frame is the well, 1.09–1.24:1 from the card in every preset and contrast\n  // (measured 0.52): under `contrast` it always takes the edge.\n  const edge =\n    edges !== \"contrast\" ? undefined : group ? CHART_ROLES.outline : 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. A group's name only in its band.\n  const labelSize = LABEL_FONT_SIZE * scale;\n  const noteSize = NOTE_FONT_SIZE * scale;\n  const roomForName = group ? group.banded : pw >= 44 * scale && ph >= 20 * scale;\n  const label = roomForName ? 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. Never in a band.\n  const rawNote = !group && 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  // A tile's click is `onNodeClick`, a frame's `onGroupClick`. The groups go along only\n  // when there are any, so a flat map calls back exactly as it did before 0.52.\n  const click = group ? onGroupClick : onNodeClick;\n  const activate =\n    id != null && click\n      ? () => (groups && groups.length > 0 ? click(id, name ?? \"\", groups) : click(id, name ?? \"\"))\n      : undefined;\n  // Inside a Treemap every tile and frame is a stop of the map's one roving tab stop,\n  // named with its value and share; a standalone cell is a stop of its own only when it\n  // is a button.\n  const roving = path != null && keys ? keys : undefined;\n  const focusable = roving !== undefined || activate !== undefined;\n  // `\"tiles\"` (0.53, keksdose after 0.52) leaves a group's frame and band untagged: its\n  // groups are public chain names, and its blur on `[data-private]` blurred them with the\n  // payees. A truthy test on the union would have tagged them still.\n  const redact = redactNames === true || (redactNames === \"tiles\" && !group);\n  const onKeyDown = focusable\n    ? (e: KeyboardEvent<SVGGElement>) => {\n        if (roving?.move(path!, e)) {\n          e.preventDefault();\n          return;\n        }\n        if (!activate || (e.key !== \"Enter\" && e.key !== \" \")) return;\n        e.preventDefault();\n        activate();\n      }\n    : undefined;\n  return (\n    <g\n      ref={roving ? refFor(roving.register, path!) : undefined}\n      onClick={activate}\n      onKeyDown={onKeyDown}\n      onFocus={roving ? () => roving.onFocus(path!) : undefined}\n      onMouseEnter={map.hover && path != null ? () => map.hover!(path) : undefined}\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. Under `redactNames`\n      // the group carries `data-private` whenever it carries a name, button or not: the\n      // name says the node's name and value, and an untagged `aria-label` is read by a\n      // session replay or a redaction keyed on `[data-private]` (0.52, code review of\n      // feat/0.52.0 — DSP-5 named every tile, and this tagged only the buttons).\n      role={activate ? \"button\" : roving ? \"img\" : undefined}\n      // In a map, -1 as drawn: the map moves its one stop on the elements in place.\n      tabIndex={roving ? -1 : activate ? 0 : undefined}\n      aria-label={focusable ? (roving?.name(path!) ?? name) : undefined}\n      data-private={focusable && redact ? \"\" : undefined}\n      data-group={group ? \"\" : 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={focusable ? \"outline-none [&:focus-visible>rect]:stroke-[var(--brand)]\" : undefined}\n    >\n      {/* The 2px gutter: the page's ground (`uniform`, the same dark line round every\n          tile in the dark theme) or the card showing through (`contrast`). Never a white\n          grid: on a dark surface white lines glare harder than the tiles. A group's frame\n          is the well, the inset surface: the page's own colour in light, a step up from\n          it in dark, and never one of the hues its tiles are told apart by. */}\n      <rect\n        x={px}\n        y={py}\n        width={pw}\n        height={ph}\n        fill={group ? \"var(--bg-surface-2)\" : tileFill}\n        stroke={edges === \"contrast\" ? \"var(--bg-surface)\" : \"var(--bg-page)\"}\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={redact ? \"\" : undefined}\n          x={textX}\n          // A band's name centred in its 20px; a tile's where its floor leaves room below.\n          y={py + (group ? 14 : 15) * scale}\n          direction={dir}\n          {...(group ? BAND_INK : { fill: ink, ...haloOf(halo) })}\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          {...haloOf(halo)}\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 * The map's tooltip CLONES the bubble element to hand it `active`/`payload`, as recharts'\n * did, so this has to BE that element — a `<div>` wrapped around `<ChartTooltipContent />`\n * in the JSX would take those props itself and hand the tooltip nothing.\n *\n * `groups: false` is `redactNames=\"tiles\"` (0.53): a group's bubble is left untagged, as its\n * frame is. The payload says which node is hovered — the node itself, with its `children`\n * for a group and none for a tile — so anything else, or no payload, is tagged.\n */\nfunction RedactedTooltipContent({\n  groups = true,\n  ...props\n}: ComponentProps<typeof ChartTooltipContent> & { groups?: boolean }) {\n  const children = props.payload?.[0]?.payload?.children;\n  const group = Array.isArray(children) && children.length > 0;\n  return (\n    <div data-private={groups || !group ? true : undefined}>\n      <ChartTooltipContent {...props} />\n    </div>\n  );\n}\n\n/** Which node the pointer is on, by path: a store of one string, so that only the tooltip\n *  re-renders when it moves — not the map, nor every tile. `clear` when it leaves the\n *  chart, or on Escape. Its box is read off the layout as drawn now, so new data or a\n *  resize under a still pointer moves the bubble with its node, or takes it away with it. */\ninterface Anchor {\n  read: () => string | null;\n  subscribe: (onChange: () => void) => () => void;\n  set: (path: string | null) => void;\n  clear: () => void;\n}\n\nfunction createAnchor(): Anchor {\n  let at: string | null = null;\n  const listeners = new Set<() => void>();\n  const set = (path: string | null) => {\n    if (path === at) return;\n    at = path;\n    listeners.forEach((onChange) => onChange());\n  };\n  return {\n    read: () => at,\n    subscribe: (onChange) => {\n      listeners.add(onChange);\n      return () => listeners.delete(onChange);\n    },\n    set,\n    clear: () => set(null),\n  };\n}\n\n/** The slide recharts gave its bubble between two positions, kept for the kit's own. */\nconst TOOLTIP_SLIDE = \"transform 400ms ease\";\n\n/**\n * The map's tooltip (0.55): the bubble for the node the pointer is on, stood at the node AS\n * DRAWN, 10px off its centre towards the chart's middle so it does not run off the side\n * the node is on. `content` is the bubble, cloned with `active` and the node as its\n * `payload`, in the shape recharts handed it: `ChartTooltipContent` reads the name, the\n * value and the node's own `fill` for its swatch.\n *\n * It behaves as recharts' bubble did, through which the map drew it up to 0.54: entering a\n * node shows it, leaving the chart takes it away, Escape dismisses it until the pointer\n * enters another node (WCAG 1.4.13, content on hover), and it slides from node to node\n * unless the reader asked for less motion. Its box keeps recharts' class,\n * `recharts-tooltip-wrapper`: `ChartTooltipContent` re-measures its nudge into the viewport\n * when that box's slide ends, and a host's CSS for a chart's bubble reaches it there too.\n */\nfunction TreemapTooltip({\n  content,\n  anchor,\n  nodes,\n  placed,\n  width,\n  height,\n}: {\n  content: ReactElement;\n  anchor: Anchor;\n  nodes: ReadonlyMap<string, MapNode>;\n  placed: ReadonlyMap<string, Placed>;\n  width: number;\n  height: number;\n}) {\n  const at = useSyncExternalStore(anchor.subscribe, anchor.read, anchor.read);\n  const shown = at !== null;\n  useEffect(() => {\n    if (!shown) return;\n    const onKeyDown = (event: globalThis.KeyboardEvent) => {\n      if (event.key === \"Escape\") anchor.clear();\n    };\n    document.addEventListener(\"keydown\", onKeyDown);\n    return () => document.removeEventListener(\"keydown\", onKeyDown);\n  }, [shown, anchor]);\n  // A node that is gone takes the bubble with it for good: the node coming back with new\n  // data is not the pointer coming back to it.\n  useEffect(() => {\n    if (at !== null && !nodes.has(at)) anchor.clear();\n  }, [at, nodes, anchor]);\n  const node = at === null ? undefined : nodes.get(at);\n  // The box the tile draws: the layout's, on whole pixels already.\n  const box = at === null ? undefined : placed.get(at)?.box;\n  if (!node || !box) return null;\n  const cx = box.x + box.width / 2;\n  const cy = box.y + box.height / 2;\n  const left = cx > width / 2;\n  const up = cy > height / 2;\n  return (\n    <div\n      className=\"recharts-tooltip-wrapper\"\n      style={{\n        position: \"absolute\",\n        top: 0,\n        left: 0,\n        pointerEvents: \"none\",\n        transform: `translate(${cx + (left ? -10 : 10)}px, ${cy + (up ? -10 : 10)}px)`,\n        // The bubble's corner at that point: towards the middle, whatever its size.\n        translate: `${left ? \"-100%\" : \"0\"} ${up ? \"-100%\" : \"0\"}`,\n        transition: prefersReducedMotion() ? undefined : TOOLTIP_SLIDE,\n      }}\n    >\n      {cloneElement(content, {\n        active: true,\n        payload: [{ dataKey: \"size\", name: node.name, value: node.size, color: node.fill, payload: node }],\n      } as Partial<ComponentProps<typeof ChartTooltipContent>>)}\n    </div>\n  );\n}\n\n/** What `Treemap` draws per node: a tile, or a group with `children`. Every field a tile\n *  reads is here; a field left out of this never reaches the tile (0.8.0 shipped\n *  `labelColor` without it — keksdose). A type, not an interface: the tooltip hands it on\n *  as a `payload`, a `Record<string, unknown>`, whose index signature only an alias meets. */\ntype MapNode = {\n  id: string;\n  name: string;\n  /** A tile's value; a group's, its drawn tiles' together. The layout and the tooltip read\n   *  this field. */\n  size: number;\n  fill: string;\n  labelColor?: string;\n  /** The ids of the groups round the node, outermost first. */\n  groups: readonly string[];\n  /** The node's key in the map's keyboard and names: its id and its groups' (see TileKeys). */\n  path: string;\n  children?: MapNode[];\n};\n\n/** What a group hands down to the tiles inside it that set none of their own. */\ninterface Paint {\n  fill: string;\n  labelColor?: string;\n  shade?: number;\n}\n\n/**\n * `data` as drawn: tiles with a positive value, at most `maxTiles` of them in the order\n * given (depth first), and the groups that still hold any. `shaded` turns a fill and a\n * `shade` into the fill drawn.\n *\n * Coloured by index into `data` AS GIVEN, before anything is dropped: a caller painting a\n * legend or a second map from the same list must land on the same hue for the same row,\n * and filtering first would shift every colour after a gap. Below the top a node takes\n * its group's colour, so a group's tiles share one hue unless they set their own.\n */\nfunction mapNodes(\n  data: readonly TreemapNode[],\n  ramp: readonly string[],\n  maxTiles: number | null | undefined,\n  shaded: (fill: string, shade: number | undefined) => string,\n): MapNode[] {\n  // Whole tiles, as `slice(0, maxTiles ?? undefined)` counted them up to 0.51: 2.5 draws 2,\n  // NaN none and null every one (0.52 code review of treemap.tsx, finding 4 — a bare\n  // counter drew 3, and every tile; deep review, charts, finding 2 — Math.floor(null) is 0,\n  // and a JS caller's or a `number | null` setting's null drew an empty card).\n  let left = maxTiles == null ? Infinity : Number.isNaN(maxTiles) ? 0 : Math.floor(maxTiles);\n  const walk = (list: readonly TreemapNode[], groups: readonly string[], paint: Paint | undefined): MapNode[] =>\n    list.flatMap((d, idx): MapNode[] => {\n      const fill = d.fill ?? paint?.fill ?? ramp[idx % ramp.length]!;\n      // An inherited fill brings its ink along (a `color-mix()` group needs its\n      // `labelColor`); a fill of the tile's own is measured again.\n      const labelColor = d.labelColor ?? (d.fill === undefined ? paint?.labelColor : undefined);\n      const shade = d.shade ?? paint?.shade;\n      if (d.children && d.children.length > 0) {\n        const children = walk(d.children, [...groups, d.id], { fill, labelColor, shade });\n        if (children.length === 0) return [];\n        const size = children.reduce((acc, c) => acc + c.size, 0);\n        return [{ id: d.id, name: d.name, size, fill, groups, path: pathOf(groups, d.id), children }];\n      }\n      if (!(Number.isFinite(d.value) && d.value > 0) || left <= 0) return [];\n      left -= 1;\n      const drawn = shaded(fill, shade);\n      // An ink the GROUP chose was chosen for the group's colour: once `shade` makes the\n      // tile another hex, that hex is measured instead (0.52 code review of treemap.tsx,\n      // finding 5 — white ink on a tile shaded almost to the card, ~1.3:1). The tile's\n      // own `labelColor` still wins: the caller set it for this tile.\n      const ink = d.labelColor ?? (drawn === fill ? labelColor : undefined);\n      return [\n        { id: d.id, name: d.name, size: d.value, fill: drawn, labelColor: ink, groups, path: pathOf(groups, d.id) },\n      ];\n    });\n  return walk(data, [], undefined);\n}\n\n/** What every tile of a map is handed alike: the map's options, which a cell drawn in a\n *  caller's own recharts map takes as props. */\ntype TileOptions = Pick<TreemapCellProps, \"onNodeClick\" | \"onGroupClick\" | \"redactNames\" | \"nodeNote\" | \"dir\">;\n\n/** A tile of the map's own picture: memoised, so a render of the map that changes nothing a\n *  tile reads draws no tile again — its layout, fitted labels and note (0.52 code review of\n *  feat/0.52.0; recharts' PureComponent kept that up to 0.54). */\nconst PlotTile = memo(Tile);\n\ninterface PlotProps {\n  /** The chart's box in px: see {@link TreemapPlot}. Nothing is drawn at 0. */\n  width?: number;\n  height?: number;\n  nodes: readonly MapNode[];\n  /** `nodes` depth first: the order the tiles are drawn and walked in. */\n  order: readonly MapNode[];\n  options: TileOptions;\n  map: TileContext;\n  /** The tooltip's bubble, cloned per node by `TreemapTooltip`. */\n  bubble: ReactElement;\n  anchor: Anchor;\n}\n\n/**\n * The map's picture (0.55, see \"The picture\"): an `<svg>` of the map's own tiles and frames,\n * laid out for the box it is handed, and the bubble over it.\n *\n * The box is the chart's own, which `Treemap` measures on its root (`useBoxSize`) — or the\n * one a container hands its one child, which wins: recharts' `ResponsiveContainer` did so\n * up to recharts 2, and the kit's suites stand one in at 800x300.\n *\n * Drawn in `order`, the keyboard's: a group's frame before the tiles inside it, which paint\n * over it, so the document's order is the walk the arrows take. A node is keyed by its PATH:\n * recharts keyed it by where it had laid it out (`x-y-name`), so new data or a resize\n * remounted the node holding the focus, and its focus fell to <body> unless the map gave it\n * back (0.52 code review of treemap.tsx, finding 7). Now its element stays.\n *\n * The SVG takes no chart-level `stroke`: recharts spread one onto its root, from where it\n * inherited into every label (see TreemapCell). Each tile strokes its own rect. And it is\n * pinned `ltr`, as `ChartContainer` pins recharts' surface: the tiles are laid out\n * physically, and each label sets its own direction.\n */\nconst TreemapPlot = memo(function TreemapPlot({\n  width = 0,\n  height = 0,\n  nodes,\n  order,\n  options,\n  map,\n  bubble,\n  anchor,\n}: PlotProps) {\n  // The band a group's name stands in grows with the text size, and its frame with it.\n  const { scale } = useTextSize();\n  const placed = useMemo(\n    () => (width > 0 && height > 0 ? layoutTreemap(nodes, width, height, scale) : null),\n    [nodes, width, height, scale],\n  );\n  const byPath = useMemo(() => new Map(order.map((node) => [node.path, node])), [order]);\n  if (!placed) return null;\n  return (\n    <div className=\"relative\" style={{ width, height }}>\n      <svg\n        width={width}\n        height={height}\n        viewBox={`0 0 ${width} ${height}`}\n        className=\"block outline-none\"\n        style={{ direction: \"ltr\" }}\n        // The pointer leaving the chart takes the bubble away, as leaving recharts' wrapper\n        // did. The SVG is the whole chart, and the bubble over it takes no pointer.\n        onMouseLeave={anchor.clear}\n      >\n        {order.map((node) => (\n          <PlotTile\n            key={node.path}\n            depth={node.groups.length + 1}\n            id={node.id}\n            name={node.name}\n            fill={node.fill}\n            labelColor={node.labelColor}\n            groups={node.groups}\n            path={node.path}\n            // A group's cell is told it is one by its children, as recharts told it.\n            children={node.children}\n            {...options}\n            map={map}\n            place={placed.get(node.path)}\n          />\n        ))}\n      </svg>\n      <TreemapTooltip content={bubble} anchor={anchor} nodes={byPath} placed={placed} width={width} height={height} />\n    </div>\n  );\n});\n\n/**\n * An element's box in whole px, measured as it mounts and followed (`ResizeObserver`):\n * `null` until then, and where there is no layout to measure (SSR, jsdom) or nothing in it.\n * The size the map is laid out for (see {@link TreemapPlot}).\n */\nfunction useBoxSize(element: HTMLElement | null): { width: number; height: number } | null {\n  const [size, setSize] = useState<{ width: number; height: number } | null>(null);\n  useLayoutEffect(() => {\n    if (!element) return;\n    const take = (width: number, height: number) => {\n      const w = Math.round(width);\n      const h = Math.round(height);\n      setSize((last) =>\n        w > 0 && h > 0 ? (last?.width === w && last.height === h ? last : { width: w, height: h }) : null,\n      );\n    };\n    // The layout box, not the bounding one: a chart in a scaled preview is drawn in its own\n    // px, which a transform does not change.\n    take(element.clientWidth, element.clientHeight);\n    if (typeof ResizeObserver === \"undefined\") return;\n    const observer = new ResizeObserver(([entry]) => {\n      if (entry) take(entry.contentRect.width, entry.contentRect.height);\n    });\n    observer.observe(element);\n    return () => observer.disconnect();\n  }, [element]);\n  return size;\n}\n\n/** One ref callback per map and path, the same on every render: a new function each time\n *  makes React detach and attach the element on every render of the tile. A path no longer\n *  drawn is let go as the map lays out its new data (see the map's keyboard). */\nconst REFS = new WeakMap<TileKeys[\"register\"], Map<string, (element: SVGGElement | null) => void>>();\n\nfunction refFor(register: TileKeys[\"register\"], path: string) {\n  let byPath = REFS.get(register);\n  if (!byPath) {\n    byPath = new Map();\n    REFS.set(register, byPath);\n  }\n  let ref = byPath.get(path);\n  if (!ref) {\n    ref = (element) => register(path, element);\n    byPath.set(path, ref);\n  }\n  return ref;\n}\n\n/** A node's path: its groups' ids and its own, as JSON so that no id can fake a separator. */\nconst pathOf = (groups: readonly string[], id: string) => JSON.stringify([...groups, id]);\n\n/** `nodes` in the order the keyboard walks them: each group, then what is inside it. */\nfunction depthFirst(nodes: readonly MapNode[]): MapNode[] {\n  return nodes.flatMap((n) => [n, ...(n.children ? depthFirst(n.children) : [])]);\n}\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; every tile is a keyboard stop named with its value and share (see\n * `onNodeClick`), and `onNodeClick` turns the tiles into buttons.\n *\n * A node with `children` is a group (0.52): a labelled frame with its tiles inside, in\n * its colour unless they set their own — see {@link TreemapNode.children}.\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 * Drawn by the kit (0.55): the layout, the SVG and the tooltip are the map's own, inside the\n * chart shell every chart shares, `ChartContainer` — whose `ResponsiveContainer` is all of\n * `recharts` it still needs.\n */\nexport function Treemap({\n  data,\n  valueFormatter,\n  height = \"20rem\",\n  onNodeClick,\n  onGroupClick,\n  redactNames = false,\n  shareInValue = false,\n  nodeNote,\n  maxTiles,\n  colors,\n  edges = \"auto\",\n  description,\n  labels: labelsProp,\n  style,\n  ...rest\n}: TreemapProps) {\n  // Resolved once for every tile, which is handed them (DSP-22).\n  const { ramp: tokenHex, card } = useChartTokenHex();\n  const edgeFor = useChartEdge();\n  const edgesInForce = useEdgesInForce(edges);\n  const labels = useKitLabels(\"treemap\", DEFAULT_TREEMAP_LABELS, labelsProp);\n  // The provider's locale (0.52, refactor audit 2026-10-30, DOC-10): this was the one\n  // formatter default in the kit that took the runtime's.\n  const locale = useKitLocale();\n  const numberFormat = useMemo(() => new Intl.NumberFormat(locale), [locale]);\n  // One decimal under 10 %, the rule PieChart says its shares by too (lib/share-format):\n  // a tile of 0.4 % named \"0%\" says it is not there.\n  const shareText = useMemo(() => shareFormat(locale), [locale]);\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, and when the root mounts: a map that had nothing to draw rendered none.\n  const rootRef = useRef<HTMLDivElement | null>(null);\n  const [root, setRoot] = useState<HTMLDivElement | null>(null);\n  const takeRoot = useCallback((element: HTMLDivElement | null) => {\n    rootRef.current = element;\n    setRoot(element);\n  }, []);\n  const [dir, setDir] = useState<Direction>(\"ltr\");\n  useLayoutEffect(() => {\n    setDir(dirOf(rootRef.current));\n  }, [root, data]);\n  // The box the map is laid out for (0.55): the root's own, as recharts measured it.\n  const size = useBoxSize(root);\n  const ramp = colors && colors.length > 0 ? colors : tokenHex;\n  // Memoised: moving the tab stop re-renders the map, and fresh nodes would re-lay it.\n  const nodes = useMemo(\n    () =>\n      mapNodes(data, ramp, maxTiles, (fill, shade) => {\n        // `shade` (0.52): the hue mixed into the card as a hex, so it is measured like\n        // any other. A fill or a card it cannot read keeps the full hue.\n        if (shade === undefined || !Number.isFinite(shade) || shade >= 1 || !card) return fill;\n        const hex = measurableFill(fill, tokenHex);\n        return hex ? lerpHex(card, hex, shade) : fill;\n      }),\n    [data, ramp, maxTiles, tokenHex, card],\n  );\n  // The keyboard walks groups and tiles alike, in the data's order (see `onNodeClick`); the\n  // picture is drawn in it too (`TreemapPlot`).\n  const order = useMemo(() => depthFirst(nodes), [nodes]);\n  // Where the pointer is, for the tooltip to stand at (`TreemapTooltip`).\n  const [anchor] = useState(createAnchor);\n\n  // The keyboard (DSP-5): one tab stop for the map, moved between tiles in `order` as\n  // PieChart's is between slices. Each tile registers its element here as it mounts,\n  // rather than being looked up.\n  //\n  // The stop is moved on the elements IN PLACE, as PieChart moves its own, and never\n  // reaches the tiles' props: kept there, every arrow-key step was a new context and every\n  // tile drew again — layout, fitted labels, notes (0.52 code review of treemap.tsx,\n  // finding 6). A tile keeps its element across new data and a resize (it is keyed by its\n  // path, see TreemapPlot; recharts remounted it, finding 7), but one can still leave\n  // holding the focus: its node is gone, or the whole picture is (a box measured 0). The\n  // path it held is kept for the commit, and a new element for it takes the focus back as\n  // it mounts — or, once the node is gone, the stop does.\n  const tiles = useRef(new Map<string, SVGGElement>());\n  const orderRef = useRef(order);\n  const stopRef = useRef<string | undefined>(undefined);\n  const restoreRef = useRef<string | null>(null);\n  /** The path holding the stop: the last one focused while it is drawn, else the first. */\n  const stopOf = useCallback(() => {\n    const drawn = orderRef.current;\n    return drawn.some((n) => n.path === stopRef.current) ? stopRef.current : drawn[0]?.path;\n  }, []);\n  const applyStop = useCallback(() => {\n    const at = stopOf();\n    tiles.current.forEach((el, path) => el.setAttribute(\"tabindex\", path === at ? \"0\" : \"-1\"));\n    return at;\n  }, [stopOf]);\n  const register = useCallback(\n    (path: string, element: SVGGElement | null) => {\n      if (element) {\n        tiles.current.set(path, element);\n        element.setAttribute(\"tabindex\", path === stopOf() ? \"0\" : \"-1\");\n        // The kit's one rule (lib/focus-left `returnFocus`; 0.52 code review 2026-10-31,\n        // held to 0.55): the path's new element, in the commit that removed its old one.\n        if (restoreRef.current === path) {\n          restoreRef.current = null;\n          returnFocus({ opener: element });\n        }\n        return;\n      }\n      // Detached before it is removed: still the focused element if it held the focus.\n      // Kept for this commit only — the node's new element mounts in it, or the effect below\n      // hands the focus on. A node that left with no new data (`<Activity mode=\"hidden\">`, a\n      // panel 0 wide) took the focus back whenever it was shown again, from wherever the\n      // reader was by then (0.52 code review, deep, charts, finding 3).\n      if (tiles.current.get(path) === document.activeElement) {\n        restoreRef.current = path;\n        queueMicrotask(() => {\n          if (restoreRef.current === path) restoreRef.current = null;\n        });\n      }\n      tiles.current.delete(path);\n    },\n    [stopOf],\n  );\n  const onFocus = useCallback(\n    (path: string) => {\n      stopRef.current = path;\n      applyStop();\n    },\n    [applyStop],\n  );\n  // New data: the order the stop is read against, the stop set again on what is drawn now,\n  // the focus of a node that is gone handed to the stop — and the ref callbacks of the paths\n  // no longer drawn let go: a map that switched data (a month picker over payees) kept one\n  // for every node it had ever drawn (0.52 code review, deep, charts, finding 11).\n  useLayoutEffect(() => {\n    orderRef.current = order;\n    const refs = REFS.get(register);\n    if (refs) {\n      const drawn = new Set(order.map((n) => n.path));\n      for (const path of refs.keys()) if (!drawn.has(path)) refs.delete(path);\n    }\n    const at = applyStop();\n    if (restoreRef.current === null) return;\n    restoreRef.current = null;\n    // The node is gone: the stated fallback, the tile that holds the tab stop now.\n    returnFocus({ fallback: [at ? tiles.current.get(at) : null] });\n  }, [order, applyStop, register]);\n  const move = useCallback((path: string, event: KeyboardEvent<SVGGElement>) => {\n    const drawn = orderRef.current;\n    const at = drawn.findIndex((n) => n.path === path);\n    // The ends hold: a map is a plane, not PieChart's ring. → is the next tile in any page:\n    // the tiles are laid out left to right whatever the reading direction (the plot is not\n    // mirrored, see `ChartContainer`), and → read off the page walked an RTL page's map\n    // backwards, against the picture (0.52 code review, deep, charts, finding 1).\n    const to = at < 0 ? undefined : rovingTarget(event.key, \"ltr\", at, drawn.length, false);\n    if (to === undefined) return false;\n    const target = drawn[to];\n    if (target) tiles.current.get(target.path)?.focus();\n    return true;\n  }, []);\n\n  // Everything below is memoised over what it reads (0.52, code review of feat/0.52.0). The\n  // picture and each tile are memoised components (`TreemapPlot`, `PlotTile`) that draw\n  // again when a prop is new: built afresh per render, as these were, a page re-rendering\n  // the card or one arrow-key step redrew every tile and ran `labels.tile` and two `Intl`\n  // formats per node again — the cost DSP-22 had just taken out of the tiles.\n  //\n  // The share is of what is DRAWN, so it always reads as \"of this picture\" — a group's\n  // and a tile's inside it alike.\n  const total = useMemo(() => nodes.reduce((acc, n) => acc + n.size, 0), [nodes]);\n  const format = useCallback(\n    (v: number): ReactNode =>\n      valueFormatter ? valueFormatter(v, total > 0 ? v / total : undefined) : formatWithMinus(numberFormat, v),\n    [valueFormatter, total, numberFormat],\n  );\n  const names = useMemo(() => {\n    // The value as the tooltip says it: the caller's formatter, handed the node's share as\n    // it is there, when it gives text; a value it formats as markup is said as a number.\n    //\n    // It was asked with the share `undefined` — which, with anything drawn, it had never\n    // been before 0.52 — so a formatter leaning on the share printed \"NaN%\" into every name\n    // or threw and took the chart down (0.52 code review of treemap.tsx, finding 2). A guard\n    // caught both; every named node has its share, so it is handed over instead (deep\n    // review, charts, finding 13).\n    const valueText = (v: number) => {\n      const out = format(v);\n      return typeof out === \"string\" || typeof out === \"number\" ? String(out) : formatWithMinus(numberFormat, v);\n    };\n    // A group's name by its path; a node's groups by theirs, its own path's prefixes.\n    const groupName = new Map(order.filter((n) => n.children).map((n) => [n.path, n.name]));\n    // `\"\"` when the formatter's text says the share already, which every template drops\n    // (0.53, `shareInValue`).\n    const shareOf = (v: number) => (shareInValue ? \"\" : shareText(total > 0 ? v / total : 0));\n    return new Map(\n      order.map((n) => {\n        const say = n.children ? labels.group : labels.tile;\n        const own = say(n.name, valueText(n.size), shareOf(n.size));\n        // The innermost group first: \"Rent: …, in Housing, in Fixed costs\".\n        const named = n.groups\n          .map((g, i) => groupName.get(pathOf(n.groups.slice(0, i), g)) ?? g)\n          .reduceRight((acc, group) => labels.inGroup(acc, group), own);\n        return [n.path, named] as const;\n      }),\n    );\n  }, [order, labels, format, numberFormat, shareText, shareInValue, total]);\n  const keys = useMemo<TileKeys>(\n    () => ({ name: (path) => names.get(path), onFocus, register, move }),\n    [names, onFocus, register, move],\n  );\n  const map = useMemo<TileContext>(\n    () => ({ tokens: tokenHex, edgeFor, edges: edgesInForce, keys, hover: anchor.set }),\n    [tokenHex, edgeFor, edgesInForce, keys, anchor],\n  );\n  const options = useMemo<TileOptions>(\n    () => ({ onNodeClick, onGroupClick, redactNames, nodeNote, dir }),\n    [onNodeClick, onGroupClick, redactNames, nodeNote, dir],\n  );\n  const bubble = useMemo(\n    () =>\n      redactNames ? (\n        <RedactedTooltipContent hideLabel valueFormatter={format} groups={redactNames === true} />\n      ) : (\n        <ChartTooltipContent hideLabel valueFormatter={format} />\n      ),\n    [redactNames, format],\n  );\n\n  if (nodes.length === 0) return null;\n  const box = chartHeightProps(height);\n  return (\n    <ChartContainer\n      role=\"figure\"\n      {...rest}\n      // Read through `aria-describedby`, after a caller's own ids; `hidden`, inside the\n      // figure (0.52 code review, deep, charts, finding 7).\n      description={description}\n      ref={takeRoot}\n      config={TREEMAP_CONFIG}\n      className={cn(box.className, rest.className)}\n      style={{ ...style, ...box.style }}\n    >\n      <TreemapPlot\n        width={size?.width}\n        height={size?.height}\n        nodes={nodes}\n        order={order}\n        options={options}\n        map={map}\n        bubble={bubble}\n        anchor={anchor}\n      />\n    </ChartContainer>\n  );\n}\n"],"mappings":"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","names":["TreemapPlot"]}

package/dist/currencies.d.ts

@@ -4,6 +4,19 @@ export interface CurrencyOption {
     symbol: string;
     /** ISO 3166-1 alpha-2 country code (lowercase) used by flag-icons. */
     country: string;
+    /**
+     * The day ("YYYY-MM-DD") the currency was replaced as its country's money — set only on
+     * one that was. The pickers leave it out of their default list. A field that already
+     * holds it still shows it (the trigger's flag and code, and its row in the list,
+     * checked), and an explicit `options` list that names it still offers it: that list is
+     * the caller's.
+     *
+     * Marked rather than deleted, because an app may hold amounts in it from before. Gone
+     * from the array, `getCurrency` would answer `undefined` for a stored value, the field
+     * would show its placeholder over a real amount, and an app's flag subset
+     * (`CURRENCY_COUNTRIES`) would ship that value's flag as an empty box.
+     */
+    retired?: string;
 }
 export declare const CURRENCIES: CurrencyOption[];
 /**
@@ -11,8 +24,9 @@ export declare const CURRENCIES: CurrencyOption[];
  * code flag-icons names it by (`fi-ch`, `flags/4x3/ch.svg`). `CHF` → `"ch"`, `EUR` →
  * `"eu"` (flag-icons has the EU's flag under that code).
  *
- * Derived from {@link CURRENCIES}, so a currency the pickers gain is a flag here too. An
- * app that ships only the flags it renders builds its subset from these values:
+ * Derived from {@link CURRENCIES}, so a currency the pickers gain is a flag here too — and
+ * a `retired` one keeps its flag, for the values an app still holds in it. An app that
+ * ships only the flags it renders builds its subset from these values:
  *
  * ```ts
  * // vite.config.ts — plain Node, no DOM

package/dist/currencies.js

@@ -15,7 +15,8 @@ const CURRENCIES = [
   { code: "CZK", name: "Czech Koruna", symbol: "K\u010D", country: "cz" },
   { code: "HUF", name: "Hungarian Forint", symbol: "Ft", country: "hu" },
   { code: "RON", name: "Romanian Leu", symbol: "lei", country: "ro" },
-  { code: "BGN", name: "Bulgarian Lev", symbol: "\u043B\u0432", country: "bg" },
+  // Bulgaria adopted the euro on 2026-01-01 (keksdose audit follow-up, 2026-11-01).
+  { code: "BGN", name: "Bulgarian Lev", symbol: "\u043B\u0432", country: "bg", retired: "2026-01-01" },
   { code: "TRY", name: "Turkish Lira", symbol: "\u20BA", country: "tr" },
   { code: "RUB", name: "Russian Ruble", symbol: "\u20BD", country: "ru" },
   { code: "CNY", name: "Chinese Yuan", symbol: "\xA5", country: "cn" },

package/dist/currencies.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/currencies.ts"],"sourcesContent":["// `@eifi1/ui-kit/currencies` — the currencies the kit's pickers offer, as plain data\n// (0.35, keksdose's 0.34 report).\n//\n// This module imports NOTHING: no React, no stylesheet, no other kit module. That is the\n// entry's whole promise, because an app's BUILD reads it in Node — keksdose's Vite plugin\n// builds its flag-icons subset from these country codes while Vite loads its config. Until\n// 0.35 that plugin parsed the `country` literals out of dist/components/currency-select.js;\n// 0.34 moved the list into the picker's option list and 91 of its test files failed at\n// load. A file inside dist/ is not something the kit promises; an entry is.\n// packaging-contract.test.ts pins the purity, scripts/verify-package.mjs the load in Node.\n//\n// CurrencySelect, AmountInput's currency chip and NumberInput's code detection read this\n// same array (components/currency-option-list re-exports it, and currency-select as it\n// always has), so the list the pickers show and the flags an app ships cannot drift.\n\nexport interface CurrencyOption {\n  code: string;\n  name: string;\n  symbol: string;\n  /** ISO 3166-1 alpha-2 country code (lowercase) used by flag-icons. */\n  country: string;\n}\n\nexport const CURRENCIES: CurrencyOption[] = [\n  { code: \"EUR\", name: \"Euro\", symbol: \"€\", country: \"eu\" },\n  { code: \"USD\", name: \"US Dollar\", symbol: \"$\", country: \"us\" },\n  { code: \"GBP\", name: \"British Pound\", symbol: \"£\", country: \"gb\" },\n  { code: \"CHF\", name: \"Swiss Franc\", symbol: \"CHF\", country: \"ch\" },\n  { code: \"JPY\", name: \"Japanese Yen\", symbol: \"¥\", country: \"jp\" },\n  { code: \"CAD\", name: \"Canadian Dollar\", symbol: \"CA$\", country: \"ca\" },\n  { code: \"AUD\", name: \"Australian Dollar\", symbol: \"A$\", country: \"au\" },\n  { code: \"NZD\", name: \"New Zealand Dollar\", symbol: \"NZ$\", country: \"nz\" },\n  { code: \"SEK\", name: \"Swedish Krona\", symbol: \"kr\", country: \"se\" },\n  { code: \"NOK\", name: \"Norwegian Krone\", symbol: \"kr\", country: \"no\" },\n  { code: \"DKK\", name: \"Danish Krone\", symbol: \"kr\", country: \"dk\" },\n  { code: \"PLN\", name: \"Polish Zloty\", symbol: \"zł\", country: \"pl\" },\n  { code: \"CZK\", name: \"Czech Koruna\", symbol: \"Kč\", country: \"cz\" },\n  { code: \"HUF\", name: \"Hungarian Forint\", symbol: \"Ft\", country: \"hu\" },\n  { code: \"RON\", name: \"Romanian Leu\", symbol: \"lei\", country: \"ro\" },\n  { code: \"BGN\", name: \"Bulgarian Lev\", symbol: \"лв\", country: \"bg\" },\n  { code: \"TRY\", name: \"Turkish Lira\", symbol: \"₺\", country: \"tr\" },\n  { code: \"RUB\", name: \"Russian Ruble\", symbol: \"₽\", country: \"ru\" },\n  { code: \"CNY\", name: \"Chinese Yuan\", symbol: \"¥\", country: \"cn\" },\n  { code: \"HKD\", name: \"Hong Kong Dollar\", symbol: \"HK$\", country: \"hk\" },\n  { code: \"SGD\", name: \"Singapore Dollar\", symbol: \"S$\", country: \"sg\" },\n  { code: \"INR\", name: \"Indian Rupee\", symbol: \"₹\", country: \"in\" },\n  { code: \"BRL\", name: \"Brazilian Real\", symbol: \"R$\", country: \"br\" },\n  { code: \"MXN\", name: \"Mexican Peso\", symbol: \"MX$\", country: \"mx\" },\n  { code: \"ZAR\", name: \"South African Rand\", symbol: \"R\", country: \"za\" },\n  { code: \"ILS\", name: \"Israeli Shekel\", symbol: \"₪\", country: \"il\" },\n  { code: \"AED\", name: \"UAE Dirham\", symbol: \"د.إ\", country: \"ae\" },\n];\n\n/**\n * Each currency code → the flag the kit paints for it: the lowercase ISO 3166-1 alpha-2\n * code flag-icons names it by (`fi-ch`, `flags/4x3/ch.svg`). `CHF` → `\"ch\"`, `EUR` →\n * `\"eu\"` (flag-icons has the EU's flag under that code).\n *\n * Derived from {@link CURRENCIES}, so a currency the pickers gain is a flag here too. An\n * app that ships only the flags it renders builds its subset from these values:\n *\n * ```ts\n * // vite.config.ts — plain Node, no DOM\n * import { CURRENCY_COUNTRIES } from \"@eifi1/ui-kit/currencies\";\n * const flags = new Set(Object.values(CURRENCY_COUNTRIES));\n * ```\n */\nexport const CURRENCY_COUNTRIES: Record<string, string> = Object.fromEntries(\n  CURRENCIES.map((c) => [c.code, c.country]),\n);\n"],"mappings":";AAuBO,MAAM,aAA+B;AAAA,EAC1C,EAAE,MAAM,OAAO,MAAM,QAAQ,QAAQ,UAAK,SAAS,KAAK;AAAA,EACxD,EAAE,MAAM,OAAO,MAAM,aAAa,QAAQ,KAAK,SAAS,KAAK;AAAA,EAC7D,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,QAAK,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,eAAe,QAAQ,OAAO,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,QAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,mBAAmB,QAAQ,OAAO,SAAS,KAAK;AAAA,EACrE,EAAE,MAAM,OAAO,MAAM,qBAAqB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACtE,EAAE,MAAM,OAAO,MAAM,sBAAsB,QAAQ,OAAO,SAAS,KAAK;AAAA,EACxE,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,MAAM,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,mBAAmB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACpE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,WAAM,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,WAAM,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,oBAAoB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACrE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,OAAO,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,gBAAM,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,UAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,UAAK,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,QAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,oBAAoB,QAAQ,OAAO,SAAS,KAAK;AAAA,EACtE,EAAE,MAAM,OAAO,MAAM,oBAAoB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACrE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,UAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,kBAAkB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACnE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,OAAO,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,sBAAsB,QAAQ,KAAK,SAAS,KAAK;AAAA,EACtE,EAAE,MAAM,OAAO,MAAM,kBAAkB,QAAQ,UAAK,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,cAAc,QAAQ,iBAAO,SAAS,KAAK;AAClE;AAgBO,MAAM,qBAA6C,OAAO;AAAA,EAC/D,WAAW,IAAI,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,OAAO,CAAC;AAC3C;","names":[]}
+{"version":3,"sources":["../src/currencies.ts"],"sourcesContent":["// `@eifi1/ui-kit/currencies` — the currencies the kit's pickers offer, as plain data\n// (0.35, keksdose's 0.34 report).\n//\n// This module imports NOTHING: no React, no stylesheet, no other kit module. That is the\n// entry's whole promise, because an app's BUILD reads it in Node — keksdose's Vite plugin\n// builds its flag-icons subset from these country codes while Vite loads its config. Until\n// 0.35 that plugin parsed the `country` literals out of dist/components/currency-select.js;\n// 0.34 moved the list into the picker's option list and 91 of its test files failed at\n// load. A file inside dist/ is not something the kit promises; an entry is.\n// packaging-contract.test.ts pins the purity, scripts/verify-package.mjs the load in Node.\n//\n// CurrencySelect, AmountInput's currency chip and NumberInput's code detection read this\n// same array (components/currency-option-list re-exports it, and currency-select as it\n// always has), so the list the pickers show and the flags an app ships cannot drift.\n//\n// A currency that was REPLACED stays in the array, marked `retired`: the pickers stop\n// offering it, and whatever reads a value an app already holds — the trigger's flag and\n// code, `getCurrency`, the flag subset, NumberInput's code detection — keeps knowing it\n// (keksdose audit follow-up, 2026-11-01: the lev, after Bulgaria's euro).\n\nexport interface CurrencyOption {\n  code: string;\n  name: string;\n  symbol: string;\n  /** ISO 3166-1 alpha-2 country code (lowercase) used by flag-icons. */\n  country: string;\n  /**\n   * The day (\"YYYY-MM-DD\") the currency was replaced as its country's money — set only on\n   * one that was. The pickers leave it out of their default list. A field that already\n   * holds it still shows it (the trigger's flag and code, and its row in the list,\n   * checked), and an explicit `options` list that names it still offers it: that list is\n   * the caller's.\n   *\n   * Marked rather than deleted, because an app may hold amounts in it from before. Gone\n   * from the array, `getCurrency` would answer `undefined` for a stored value, the field\n   * would show its placeholder over a real amount, and an app's flag subset\n   * (`CURRENCY_COUNTRIES`) would ship that value's flag as an empty box.\n   */\n  retired?: string;\n}\n\nexport const CURRENCIES: CurrencyOption[] = [\n  { code: \"EUR\", name: \"Euro\", symbol: \"€\", country: \"eu\" },\n  { code: \"USD\", name: \"US Dollar\", symbol: \"$\", country: \"us\" },\n  { code: \"GBP\", name: \"British Pound\", symbol: \"£\", country: \"gb\" },\n  { code: \"CHF\", name: \"Swiss Franc\", symbol: \"CHF\", country: \"ch\" },\n  { code: \"JPY\", name: \"Japanese Yen\", symbol: \"¥\", country: \"jp\" },\n  { code: \"CAD\", name: \"Canadian Dollar\", symbol: \"CA$\", country: \"ca\" },\n  { code: \"AUD\", name: \"Australian Dollar\", symbol: \"A$\", country: \"au\" },\n  { code: \"NZD\", name: \"New Zealand Dollar\", symbol: \"NZ$\", country: \"nz\" },\n  { code: \"SEK\", name: \"Swedish Krona\", symbol: \"kr\", country: \"se\" },\n  { code: \"NOK\", name: \"Norwegian Krone\", symbol: \"kr\", country: \"no\" },\n  { code: \"DKK\", name: \"Danish Krone\", symbol: \"kr\", country: \"dk\" },\n  { code: \"PLN\", name: \"Polish Zloty\", symbol: \"zł\", country: \"pl\" },\n  { code: \"CZK\", name: \"Czech Koruna\", symbol: \"Kč\", country: \"cz\" },\n  { code: \"HUF\", name: \"Hungarian Forint\", symbol: \"Ft\", country: \"hu\" },\n  { code: \"RON\", name: \"Romanian Leu\", symbol: \"lei\", country: \"ro\" },\n  // Bulgaria adopted the euro on 2026-01-01 (keksdose audit follow-up, 2026-11-01).\n  { code: \"BGN\", name: \"Bulgarian Lev\", symbol: \"лв\", country: \"bg\", retired: \"2026-01-01\" },\n  { code: \"TRY\", name: \"Turkish Lira\", symbol: \"₺\", country: \"tr\" },\n  { code: \"RUB\", name: \"Russian Ruble\", symbol: \"₽\", country: \"ru\" },\n  { code: \"CNY\", name: \"Chinese Yuan\", symbol: \"¥\", country: \"cn\" },\n  { code: \"HKD\", name: \"Hong Kong Dollar\", symbol: \"HK$\", country: \"hk\" },\n  { code: \"SGD\", name: \"Singapore Dollar\", symbol: \"S$\", country: \"sg\" },\n  { code: \"INR\", name: \"Indian Rupee\", symbol: \"₹\", country: \"in\" },\n  { code: \"BRL\", name: \"Brazilian Real\", symbol: \"R$\", country: \"br\" },\n  { code: \"MXN\", name: \"Mexican Peso\", symbol: \"MX$\", country: \"mx\" },\n  { code: \"ZAR\", name: \"South African Rand\", symbol: \"R\", country: \"za\" },\n  { code: \"ILS\", name: \"Israeli Shekel\", symbol: \"₪\", country: \"il\" },\n  { code: \"AED\", name: \"UAE Dirham\", symbol: \"د.إ\", country: \"ae\" },\n];\n\n/**\n * Each currency code → the flag the kit paints for it: the lowercase ISO 3166-1 alpha-2\n * code flag-icons names it by (`fi-ch`, `flags/4x3/ch.svg`). `CHF` → `\"ch\"`, `EUR` →\n * `\"eu\"` (flag-icons has the EU's flag under that code).\n *\n * Derived from {@link CURRENCIES}, so a currency the pickers gain is a flag here too — and\n * a `retired` one keeps its flag, for the values an app still holds in it. An app that\n * ships only the flags it renders builds its subset from these values:\n *\n * ```ts\n * // vite.config.ts — plain Node, no DOM\n * import { CURRENCY_COUNTRIES } from \"@eifi1/ui-kit/currencies\";\n * const flags = new Set(Object.values(CURRENCY_COUNTRIES));\n * ```\n */\nexport const CURRENCY_COUNTRIES: Record<string, string> = Object.fromEntries(\n  CURRENCIES.map((c) => [c.code, c.country]),\n);\n"],"mappings":";AAyCO,MAAM,aAA+B;AAAA,EAC1C,EAAE,MAAM,OAAO,MAAM,QAAQ,QAAQ,UAAK,SAAS,KAAK;AAAA,EACxD,EAAE,MAAM,OAAO,MAAM,aAAa,QAAQ,KAAK,SAAS,KAAK;AAAA,EAC7D,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,QAAK,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,eAAe,QAAQ,OAAO,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,QAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,mBAAmB,QAAQ,OAAO,SAAS,KAAK;AAAA,EACrE,EAAE,MAAM,OAAO,MAAM,qBAAqB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACtE,EAAE,MAAM,OAAO,MAAM,sBAAsB,QAAQ,OAAO,SAAS,KAAK;AAAA,EACxE,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,MAAM,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,mBAAmB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACpE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,WAAM,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,WAAM,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,oBAAoB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACrE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,OAAO,SAAS,KAAK;AAAA;AAAA,EAElE,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,gBAAM,SAAS,MAAM,SAAS,aAAa;AAAA,EACzF,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,UAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,iBAAiB,QAAQ,UAAK,SAAS,KAAK;AAAA,EACjE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,QAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,oBAAoB,QAAQ,OAAO,SAAS,KAAK;AAAA,EACtE,EAAE,MAAM,OAAO,MAAM,oBAAoB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACrE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,UAAK,SAAS,KAAK;AAAA,EAChE,EAAE,MAAM,OAAO,MAAM,kBAAkB,QAAQ,MAAM,SAAS,KAAK;AAAA,EACnE,EAAE,MAAM,OAAO,MAAM,gBAAgB,QAAQ,OAAO,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,sBAAsB,QAAQ,KAAK,SAAS,KAAK;AAAA,EACtE,EAAE,MAAM,OAAO,MAAM,kBAAkB,QAAQ,UAAK,SAAS,KAAK;AAAA,EAClE,EAAE,MAAM,OAAO,MAAM,cAAc,QAAQ,iBAAO,SAAS,KAAK;AAClE;AAiBO,MAAM,qBAA6C,OAAO;AAAA,EAC/D,WAAW,IAAI,CAAC,MAAM,CAAC,EAAE,MAAM,EAAE,OAAO,CAAC;AAC3C;","names":[]}

package/dist/eslint/index.js

@@ -47,7 +47,7 @@ const roleUtilities = {
     };
   }
 };
-const VERSION = true ? "0.53.0" : "0.0.0-source";
+const VERSION = true ? "0.55.0" : "0.0.0-source";
 const recommended = {
   name: "@eifi1/ui-kit/recommended",
   // Not the tests, as check:tokens skips the kit's: a test names the old class to assert it

package/dist/eslint/role-utilities.d.ts

@@ -103,7 +103,7 @@ export interface RoleClassHit {
 /**
  * Every `[var(--token)]` class in `text` (or one of v4's spellings of it, above) whose
  * token has a role utility on that property.
- * A token with no utility there (`text-[var(--chart-1)]`, `--status-*`,
- * `bg-[var(--border)]` as a divider's fill) is not a hit: `[var(--…)]` is right for it.
+ * A token with no utility there (`text-[var(--chart-1)]`, `bg-[var(--border)]` as a
+ * divider's fill) is not a hit: `[var(--…)]` is right for it.
  */
 export declare function findRoleClasses(text: string, table: RoleUtilityTable): RoleClassHit[];

package/dist/eslint/role-utilities.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/eslint/role-utilities.ts"],"sourcesContent":["// Which `[var(--token)]` classes have a role utility, and what it is called — the one\n// definition `@eifi1/ui-kit/eslint`'s `role-utilities` rule and `npm run check:tokens`\n// (scripts/check-token-discipline.mjs) both read (round 0.35 R5, Kurvenschmiede's Q6).\n//\n// The table itself is role-utilities.generated.ts, re-rendered from tokens.css's\n// `@theme inline` block by scripts/gen-role-utilities.mjs with the parser below; the\n// check fails while it is stale. So tokens.css stays the source: a role that gains a\n// utility there is flagged in the kit and in the apps from the next release on. The\n// README's role-utility table (scripts/gen-styling-inventory.mjs) reads the block with\n// the same parser since 0.37, so the README, the check and the plugin cannot disagree.\n//\n// This module imports NOTHING, and its TypeScript is erasable only (no enum, no\n// namespace, no parameter property): the check imports it from source under Node's type\n// stripping, before any build, and the plugin ships it to an app's ESLint, which is\n// plain Node with no React and no stylesheet.\n\n/**\n * The properties a role utility exists for, each with the Tailwind theme namespace it is\n * declared in. `ring-width` and `outline-width` are a width typed `length:` —\n * `ring-[length:var(--focus-ring-width)]` is `ring-focus`. `divide-*` and the side borders\n * (`border-t-*`, `border-x-*` …) read `border`'s, as Tailwind does.\n */\nexport const ROLE_NAMESPACES = {\n  text: \"text-color\",\n  bg: \"background-color\",\n  border: \"border-color\",\n  ring: \"ring-color\",\n  \"ring-offset\": \"ring-offset-color\",\n  outline: \"outline-color\",\n  fill: \"fill\",\n  stroke: \"stroke\",\n  \"ring-width\": \"ring-width\",\n  \"outline-width\": \"outline-width\",\n} as const;\n\nexport type RoleProperty = keyof typeof ROLE_NAMESPACES;\n\n/**\n * Per property, each token that has a role utility → the utility's name after the\n * property's prefix: `border: { \"--border\": [\"subtle\"] }` is `border-subtle`. A list,\n * because nothing stops two names from reading one token; one name is a fix, several a\n * choice.\n */\nexport type RoleUtilityTable = {\n  readonly [P in RoleProperty]: Readonly<Record<string, readonly string[]>>;\n};\n\n/** One `--<namespace>-<name>: <value>;` of the `@theme inline` block. */\nexport interface ThemeInlineDeclaration {\n  /** The theme variable without its dashes: `text-color-muted`, `ring-width-focus`. */\n  variable: string;\n  /** The property whose namespace it is in; `null` for a namespace ROLE_NAMESPACES lacks. */\n  property: RoleProperty | null;\n  /** The name after the namespace, `muted`; `null` with `property`. */\n  name: string | null;\n  /** The utility it makes: `text-muted`, `ring-focus` (a width is `ring-*` like a colour). */\n  utility: string | null;\n  /** The token the value reads, `--text-muted`; `null` unless the value is a bare `var()`. */\n  token: string | null;\n  /** The value as written, trimmed. */\n  value: string;\n}\n\n/** The `@theme inline` block: where it stands, and every declaration in it in block order. */\nexport interface ThemeInlineBlock {\n  /** Its first and one-past-last offset in `stripCssComments(css)`, not in `css`. With\n   *  several `@theme inline` blocks, the first one's; `ranges` holds each. */\n  start: number;\n  end: number;\n  ranges: { start: number; end: number }[];\n  /** Every block's, in stylesheet order. */\n  declarations: ThemeInlineDeclaration[];\n}\n\n/** `css` without its comments: a declaration commented out is not one. */\nexport function stripCssComments(css: string): string {\n  return css.replace(/\\/\\*[\\s\\S]*?\\*\\//g, \"\");\n}\n\n/** One `@theme … { … }` block: its first and one-past-last offset, and what its braces hold. */\nexport interface ThemeBlock {\n  start: number;\n  end: number;\n  body: string;\n}\n\n/**\n * Every `@theme` block of `css` (comments already stripped) whose prelude names `inline`\n * (`@theme inline`, `@theme inline reference`) — or, with `inline: false`, every other\n * one (`@theme {`, Tailwind's `@theme default {`). Counted brace by brace, so a nested\n * block does not end it early.\n *\n * The one block finder (refactor audit 2026-10-30, DUP-13): this parser read only the\n * first `@theme inline {…}` up to its first `}`, the testing guard's\n * `declaredCustomProperties` every inline block brace-aware, and the README's inventory a\n * plain `@theme {` by a regex of its own — three readers that disagreed on what one block\n * is. It lives here because this module imports nothing, so the scripts load it from\n * source under Node.\n */\nexport function themeBlocks(css: string, { inline }: { inline: boolean }): ThemeBlock[] {\n  const blocks: ThemeBlock[] = [];\n  for (const m of css.matchAll(/@theme\\b([^{;]*)\\{/g)) {\n    if (/\\binline\\b/.test(m[1]) !== inline) continue;\n    const open = m.index + m[0].length - 1;\n    let depth = 0;\n    let close = open;\n    for (; close < css.length; close++) {\n      if (css[close] === \"{\") depth++;\n      else if (css[close] === \"}\" && --depth === 0) break;\n    }\n    blocks.push({ start: m.index, end: close + 1, body: css.slice(open + 1, close) });\n  }\n  return blocks;\n}\n\nconst PROPERTIES = Object.keys(ROLE_NAMESPACES) as RoleProperty[];\n\n/**\n * tokens.css's `@theme inline` block (every one, should there be several), read once for\n * every reader: the table below, and the README's (scripts/gen-styling-inventory.mjs),\n * which fails on a `property: null` where the table leaves it out. `null` when there is\n * no such block — the role utilities are gone, or this parser is. No namespace is\n * another's prefix, so the first that fits is the one.\n */\nexport function parseThemeInline(css: string): ThemeInlineBlock | null {\n  const blocks = themeBlocks(stripCssComments(css), { inline: true });\n  if (blocks.length === 0) return null;\n  const declarations = [\n    ...blocks\n      .map((b) => b.body)\n      .join(\"\\n\")\n      .matchAll(/--([a-z0-9-]+)\\s*:\\s*([^;]+);/g),\n  ].map(([, variable, raw]) => {\n    const value = raw.trim();\n    const property = PROPERTIES.find((p) => variable.startsWith(`${ROLE_NAMESPACES[p]}-`)) ?? null;\n    const name = property && variable.slice(ROLE_NAMESPACES[property].length + 1);\n    return {\n      variable,\n      property,\n      name,\n      utility: property && `${property.replace(/-width$/, \"\")}-${name}`,\n      token: /^var\\((--[a-z0-9-]+)\\)$/.exec(value)?.[1] ?? null,\n      value,\n    };\n  });\n  const ranges = blocks.map(({ start, end }) => ({ start, end }));\n  return { start: ranges[0].start, end: ranges[0].end, ranges, declarations };\n}\n\n/**\n * The table `tokens.css` declares: every `--<namespace>-<name>: var(--<token>)` in its\n * `@theme inline` block, in block order, each property present (in ROLE_NAMESPACES' order)\n * even when it has none. `null` when there is no such block.\n */\nexport function roleUtilitiesFromCss(css: string): RoleUtilityTable | null {\n  const block = parseThemeInline(css);\n  if (!block) return null;\n  const table = Object.fromEntries(PROPERTIES.map((p) => [p, {}])) as Record<RoleProperty, Record<string, string[]>>;\n  for (const { property, name, token } of block.declarations) {\n    if (property && name && token) (table[property][token] ??= []).push(name);\n  }\n  return table;\n}\n\n/**\n * `text-[var(--text-muted)]`, `hover:bg-[var(--bg-hover)]`, `border-t-[var(--border)]`,\n * `focus-visible:ring-[var(--brand)]/40`, `ring-offset-[var(--bg-surface)]`,\n * `ring-[length:var(--focus-ring-width)]` — and, since 0.52, Tailwind v4's own spellings\n * of the same: the shorthand `text-(--text-muted)`, a type hint `text-[color:var(--x)]` /\n * `text-(color:--x)` / `ring-(length:--x)`, and the arbitrary property\n * `[color:var(--text-muted)]`, which is `text-muted` (refactor audit 2026-10-30, DOC-1:\n * all of them passed the check and every app's lint). Preceded by a start, a space, a\n * quote or a variant's colon, which the match does not include — nor the variants before\n * it or an opacity or `!` after it — so replacing the match keeps all of them.\n *\n * Groups: 1 the property; then 2 the hint and 3 the token of `-[…var()]`, or 4 and 5 of\n * `-(…)`; or 6 the CSS property and 7 the token of `[property:var()]`.\n */\nconst TOKEN = \"(--[a-zA-Z0-9-]+)\";\nconst ROLE_CLASS = new RegExp(\n  \"(?<=^|[\\\\s\\\"'`:])(?:\" +\n    \"(text|bg|border(?:-[xytrblse])?|divide|ring-offset|ring|outline|fill|stroke)-\" +\n    `(?:\\\\[(?:(length|color):)?var\\\\(${TOKEN}\\\\)\\\\]|\\\\((?:(length|color):)?${TOKEN}\\\\))` +\n    `|\\\\[(color|background-color|border-color|outline-color|fill|stroke):var\\\\(${TOKEN}\\\\)\\\\]` +\n    \")\",\n  \"g\",\n);\n\n/** The utility prefix an arbitrary property `[property:var(--x)]` is written as. */\nconst ARBITRARY_PROPERTY: Record<string, string> = {\n  color: \"text\",\n  \"background-color\": \"bg\",\n  \"border-color\": \"border\",\n  \"outline-color\": \"outline\",\n  fill: \"fill\",\n  stroke: \"stroke\",\n};\n\nexport interface RoleClassHit {\n  /** Where the class starts in the scanned text, after its variants. */\n  index: number;\n  /** The class as written, without variants or opacity: `border-t-[var(--border)]`. */\n  found: string;\n  /** The role utilities that paint the same: `[\"border-t-subtle\"]`. */\n  utilities: string[];\n}\n\n/**\n * Every `[var(--token)]` class in `text` (or one of v4's spellings of it, above) whose\n * token has a role utility on that property.\n * A token with no utility there (`text-[var(--chart-1)]`, `--status-*`,\n * `bg-[var(--border)]` as a divider's fill) is not a hit: `[var(--…)]` is right for it.\n */\nexport function findRoleClasses(text: string, table: RoleUtilityTable): RoleClassHit[] {\n  // Every form names a token: `var(--x)`, or `(--x)` in v4's shorthand.\n  if (!text.includes(\"--\")) return [];\n  const hits: RoleClassHit[] = [];\n  for (const m of text.matchAll(ROLE_CLASS)) {\n    const [found, utility, bracketHint, bracketToken, parenHint, parenToken, cssProperty, propertyToken] = m;\n    const prop = utility ?? ARBITRARY_PROPERTY[cssProperty];\n    const token = bracketToken ?? parenToken ?? propertyToken;\n    // `border-t` and `divide` read `border`'s names; a `length:` hint reads the widths.\n    const key =\n      (bracketHint ?? parenHint) === \"length\"\n        ? `${prop}-width`\n        : prop.startsWith(\"border-\") || prop === \"divide\"\n          ? \"border\"\n          : prop;\n    const names = (table as Partial<Record<string, Readonly<Record<string, readonly string[]>>>>)[key]?.[token];\n    if (names?.length) hits.push({ index: m.index, found, utilities: names.map((name) => `${prop}-${name}`) });\n  }\n  return hits;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/eslint/role-utilities.ts"],"sourcesContent":["// Which `[var(--token)]` classes have a role utility, and what it is called — the one\n// definition `@eifi1/ui-kit/eslint`'s `role-utilities` rule and `npm run check:tokens`\n// (scripts/check-token-discipline.mjs) both read (round 0.35 R5, Kurvenschmiede's Q6).\n//\n// The table itself is role-utilities.generated.ts, re-rendered from tokens.css's\n// `@theme inline` block by scripts/gen-role-utilities.mjs with the parser below; the\n// check fails while it is stale. So tokens.css stays the source: a role that gains a\n// utility there is flagged in the kit and in the apps from the next release on. The\n// README's role-utility table (scripts/gen-styling-inventory.mjs) reads the block with\n// the same parser since 0.37, so the README, the check and the plugin cannot disagree.\n//\n// This module imports NOTHING, and its TypeScript is erasable only (no enum, no\n// namespace, no parameter property): the check imports it from source under Node's type\n// stripping, before any build, and the plugin ships it to an app's ESLint, which is\n// plain Node with no React and no stylesheet.\n\n/**\n * The properties a role utility exists for, each with the Tailwind theme namespace it is\n * declared in. `ring-width` and `outline-width` are a width typed `length:` —\n * `ring-[length:var(--focus-ring-width)]` is `ring-focus`. `divide-*` and the side borders\n * (`border-t-*`, `border-x-*` …) read `border`'s, as Tailwind does.\n */\nexport const ROLE_NAMESPACES = {\n  text: \"text-color\",\n  bg: \"background-color\",\n  border: \"border-color\",\n  ring: \"ring-color\",\n  \"ring-offset\": \"ring-offset-color\",\n  outline: \"outline-color\",\n  fill: \"fill\",\n  stroke: \"stroke\",\n  \"ring-width\": \"ring-width\",\n  \"outline-width\": \"outline-width\",\n} as const;\n\nexport type RoleProperty = keyof typeof ROLE_NAMESPACES;\n\n/**\n * Per property, each token that has a role utility → the utility's name after the\n * property's prefix: `border: { \"--border\": [\"subtle\"] }` is `border-subtle`. A list,\n * because nothing stops two names from reading one token; one name is a fix, several a\n * choice.\n */\nexport type RoleUtilityTable = {\n  readonly [P in RoleProperty]: Readonly<Record<string, readonly string[]>>;\n};\n\n/** One `--<namespace>-<name>: <value>;` of the `@theme inline` block. */\nexport interface ThemeInlineDeclaration {\n  /** The theme variable without its dashes: `text-color-muted`, `ring-width-focus`. */\n  variable: string;\n  /** The property whose namespace it is in; `null` for a namespace ROLE_NAMESPACES lacks. */\n  property: RoleProperty | null;\n  /** The name after the namespace, `muted`; `null` with `property`. */\n  name: string | null;\n  /** The utility it makes: `text-muted`, `ring-focus` (a width is `ring-*` like a colour). */\n  utility: string | null;\n  /** The token the value reads, `--text-muted`; `null` unless the value is a bare `var()`. */\n  token: string | null;\n  /** The value as written, trimmed. */\n  value: string;\n}\n\n/** The `@theme inline` block: where it stands, and every declaration in it in block order. */\nexport interface ThemeInlineBlock {\n  /** Its first and one-past-last offset in `stripCssComments(css)`, not in `css`. With\n   *  several `@theme inline` blocks, the first one's; `ranges` holds each. */\n  start: number;\n  end: number;\n  ranges: { start: number; end: number }[];\n  /** Every block's, in stylesheet order. */\n  declarations: ThemeInlineDeclaration[];\n}\n\n/** `css` without its comments: a declaration commented out is not one. */\nexport function stripCssComments(css: string): string {\n  return css.replace(/\\/\\*[\\s\\S]*?\\*\\//g, \"\");\n}\n\n/** One `@theme … { … }` block: its first and one-past-last offset, and what its braces hold. */\nexport interface ThemeBlock {\n  start: number;\n  end: number;\n  body: string;\n}\n\n/**\n * Every `@theme` block of `css` (comments already stripped) whose prelude names `inline`\n * (`@theme inline`, `@theme inline reference`) — or, with `inline: false`, every other\n * one (`@theme {`, Tailwind's `@theme default {`). Counted brace by brace, so a nested\n * block does not end it early.\n *\n * The one block finder (refactor audit 2026-10-30, DUP-13): this parser read only the\n * first `@theme inline {…}` up to its first `}`, the testing guard's\n * `declaredCustomProperties` every inline block brace-aware, and the README's inventory a\n * plain `@theme {` by a regex of its own — three readers that disagreed on what one block\n * is. It lives here because this module imports nothing, so the scripts load it from\n * source under Node.\n */\nexport function themeBlocks(css: string, { inline }: { inline: boolean }): ThemeBlock[] {\n  const blocks: ThemeBlock[] = [];\n  for (const m of css.matchAll(/@theme\\b([^{;]*)\\{/g)) {\n    if (/\\binline\\b/.test(m[1]) !== inline) continue;\n    const open = m.index + m[0].length - 1;\n    let depth = 0;\n    let close = open;\n    for (; close < css.length; close++) {\n      if (css[close] === \"{\") depth++;\n      else if (css[close] === \"}\" && --depth === 0) break;\n    }\n    blocks.push({ start: m.index, end: close + 1, body: css.slice(open + 1, close) });\n  }\n  return blocks;\n}\n\nconst PROPERTIES = Object.keys(ROLE_NAMESPACES) as RoleProperty[];\n\n/**\n * tokens.css's `@theme inline` block (every one, should there be several), read once for\n * every reader: the table below, and the README's (scripts/gen-styling-inventory.mjs),\n * which fails on a `property: null` where the table leaves it out. `null` when there is\n * no such block — the role utilities are gone, or this parser is. No namespace is\n * another's prefix, so the first that fits is the one.\n */\nexport function parseThemeInline(css: string): ThemeInlineBlock | null {\n  const blocks = themeBlocks(stripCssComments(css), { inline: true });\n  if (blocks.length === 0) return null;\n  const declarations = [\n    ...blocks\n      .map((b) => b.body)\n      .join(\"\\n\")\n      .matchAll(/--([a-z0-9-]+)\\s*:\\s*([^;]+);/g),\n  ].map(([, variable, raw]) => {\n    const value = raw.trim();\n    const property = PROPERTIES.find((p) => variable.startsWith(`${ROLE_NAMESPACES[p]}-`)) ?? null;\n    const name = property && variable.slice(ROLE_NAMESPACES[property].length + 1);\n    return {\n      variable,\n      property,\n      name,\n      utility: property && `${property.replace(/-width$/, \"\")}-${name}`,\n      token: /^var\\((--[a-z0-9-]+)\\)$/.exec(value)?.[1] ?? null,\n      value,\n    };\n  });\n  const ranges = blocks.map(({ start, end }) => ({ start, end }));\n  return { start: ranges[0].start, end: ranges[0].end, ranges, declarations };\n}\n\n/**\n * The table `tokens.css` declares: every `--<namespace>-<name>: var(--<token>)` in its\n * `@theme inline` block, in block order, each property present (in ROLE_NAMESPACES' order)\n * even when it has none. `null` when there is no such block.\n */\nexport function roleUtilitiesFromCss(css: string): RoleUtilityTable | null {\n  const block = parseThemeInline(css);\n  if (!block) return null;\n  const table = Object.fromEntries(PROPERTIES.map((p) => [p, {}])) as Record<RoleProperty, Record<string, string[]>>;\n  for (const { property, name, token } of block.declarations) {\n    if (property && name && token) (table[property][token] ??= []).push(name);\n  }\n  return table;\n}\n\n/**\n * `text-[var(--text-muted)]`, `hover:bg-[var(--bg-hover)]`, `border-t-[var(--border)]`,\n * `focus-visible:ring-[var(--brand)]/40`, `ring-offset-[var(--bg-surface)]`,\n * `ring-[length:var(--focus-ring-width)]` — and, since 0.52, Tailwind v4's own spellings\n * of the same: the shorthand `text-(--text-muted)`, a type hint `text-[color:var(--x)]` /\n * `text-(color:--x)` / `ring-(length:--x)`, and the arbitrary property\n * `[color:var(--text-muted)]`, which is `text-muted` (refactor audit 2026-10-30, DOC-1:\n * all of them passed the check and every app's lint). Preceded by a start, a space, a\n * quote or a variant's colon, which the match does not include — nor the variants before\n * it or an opacity or `!` after it — so replacing the match keeps all of them.\n *\n * Groups: 1 the property; then 2 the hint and 3 the token of `-[…var()]`, or 4 and 5 of\n * `-(…)`; or 6 the CSS property and 7 the token of `[property:var()]`.\n */\nconst TOKEN = \"(--[a-zA-Z0-9-]+)\";\nconst ROLE_CLASS = new RegExp(\n  \"(?<=^|[\\\\s\\\"'`:])(?:\" +\n    \"(text|bg|border(?:-[xytrblse])?|divide|ring-offset|ring|outline|fill|stroke)-\" +\n    `(?:\\\\[(?:(length|color):)?var\\\\(${TOKEN}\\\\)\\\\]|\\\\((?:(length|color):)?${TOKEN}\\\\))` +\n    `|\\\\[(color|background-color|border-color|outline-color|fill|stroke):var\\\\(${TOKEN}\\\\)\\\\]` +\n    \")\",\n  \"g\",\n);\n\n/** The utility prefix an arbitrary property `[property:var(--x)]` is written as. */\nconst ARBITRARY_PROPERTY: Record<string, string> = {\n  color: \"text\",\n  \"background-color\": \"bg\",\n  \"border-color\": \"border\",\n  \"outline-color\": \"outline\",\n  fill: \"fill\",\n  stroke: \"stroke\",\n};\n\nexport interface RoleClassHit {\n  /** Where the class starts in the scanned text, after its variants. */\n  index: number;\n  /** The class as written, without variants or opacity: `border-t-[var(--border)]`. */\n  found: string;\n  /** The role utilities that paint the same: `[\"border-t-subtle\"]`. */\n  utilities: string[];\n}\n\n/**\n * Every `[var(--token)]` class in `text` (or one of v4's spellings of it, above) whose\n * token has a role utility on that property.\n * A token with no utility there (`text-[var(--chart-1)]`, `bg-[var(--border)]` as a\n * divider's fill) is not a hit: `[var(--…)]` is right for it.\n */\nexport function findRoleClasses(text: string, table: RoleUtilityTable): RoleClassHit[] {\n  // Every form names a token: `var(--x)`, or `(--x)` in v4's shorthand.\n  if (!text.includes(\"--\")) return [];\n  const hits: RoleClassHit[] = [];\n  for (const m of text.matchAll(ROLE_CLASS)) {\n    const [found, utility, bracketHint, bracketToken, parenHint, parenToken, cssProperty, propertyToken] = m;\n    const prop = utility ?? ARBITRARY_PROPERTY[cssProperty];\n    const token = bracketToken ?? parenToken ?? propertyToken;\n    // `border-t` and `divide` read `border`'s names; a `length:` hint reads the widths.\n    const key =\n      (bracketHint ?? parenHint) === \"length\"\n        ? `${prop}-width`\n        : prop.startsWith(\"border-\") || prop === \"divide\"\n          ? \"border\"\n          : prop;\n    const names = (table as Partial<Record<string, Readonly<Record<string, readonly string[]>>>>)[key]?.[token];\n    if (names?.length) hits.push({ index: m.index, found, utilities: names.map((name) => `${prop}-${name}`) });\n  }\n  return hits;\n}\n"],"mappings":"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","names":[]}

package/dist/feedback/feedback-context-labels.js

@@ -1,7 +1,8 @@
 "use client";
 const DEFAULT_FEEDBACK_CONTEXT_LABELS = {
   user: "User",
-  attachUrl: "Attach current page URL"
+  attachUrl: "Attach current page URL",
+  diagnostics: "Diagnostics sent with the report"
 };
 export {
   DEFAULT_FEEDBACK_CONTEXT_LABELS

package/dist/feedback/feedback-context-labels.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/feedback/feedback-context-labels.ts"],"sourcesContent":["// The English words of ./feedback-context, in a module with no component code: the English\n// catalogue (src/i18n/defaults.ts) imports them without the component, so `en` loads as one\n// chunk like the other languages (0.34, KS U8). ./feedback-context re-exports them.\n\nimport type { FeedbackContextLabels } from \"./feedback-context\";\n\nexport const DEFAULT_FEEDBACK_CONTEXT_LABELS: FeedbackContextLabels = {\n  user: \"User\",\n  attachUrl: \"Attach current page URL\",\n};\n"],"mappings":";AAMO,MAAM,kCAAyD;AAAA,EACpE,MAAM;AAAA,EACN,WAAW;AACb;","names":[]}
+{"version":3,"sources":["../../src/feedback/feedback-context-labels.ts"],"sourcesContent":["// The English words of ./feedback-context, in a module with no component code: the English\n// catalogue (src/i18n/defaults.ts) imports them without the component, so `en` loads as one\n// chunk like the other languages (0.34, KS U8). ./feedback-context re-exports them.\n\nimport type { FeedbackContextLabels } from \"./feedback-context\";\n\nexport const DEFAULT_FEEDBACK_CONTEXT_LABELS: FeedbackContextLabels = {\n  user: \"User\",\n  attachUrl: \"Attach current page URL\",\n  diagnostics: \"Diagnostics sent with the report\",\n};\n"],"mappings":";AAMO,MAAM,kCAAyD;AAAA,EACpE,MAAM;AAAA,EACN,WAAW;AAAA,EACX,aAAa;AACf;","names":[]}