@eifi1/ui-kit 0.53.0 → 0.54.0

package/dist/components/amount-input.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/amount-input.tsx"],"sourcesContent":["import { useId, useMemo, useRef } from \"react\";\nimport { ChevronDown } from \"lucide-react\";\nimport type { ReactNode, Ref } from \"react\";\nimport { CurrencyOptionList, getCurrency } from \"./currency-option-list\";\nimport { useComboboxCore } from \"./combobox-core\";\nimport { FIELD_BASE, FIELD_DISPLAY, FIELD_INVALID, FLOATING_INPUT_CLASS, FloatingField } from \"./field-base\";\nimport { cn } from \"../lib/cn\";\nimport { currencyMinorDigits } from \"../lib/format\";\nimport { roundHalfAway } from \"../lib/round\";\nimport { CalculatorButton, type CalculatorButtonLabels } from \"./calculator\";\nimport { NumberPadSheet, type NumberPadSheetLabels } from \"./numpad-sheet\";\nimport {\n  DEFAULT_COMMON_LABELS,\n  DEFAULT_CURRENCY_LABELS,\n  useKitLabels,\n  useKitLocale,\n  type CurrencyLabels,\n} from \"../i18n/kit-labels\";\nimport {\n  commitExpression,\n  evaluateExpression,\n  formatResult,\n  isBareAmount,\n  looksLikeExpression,\n  sanitizeLive,\n  splitLeadingSign,\n} from \"../lib/calc\";\nimport {\n  FieldCaption,\n  LockedReason,\n  mergeRefs,\n  type DisabledReasonDisplay,\n  type FieldHelpProps,\n  type LockReason,\n} from \"./field-parts\";\nimport { useEndWidth, useNumericField } from \"./numeric-field\";\nimport type { CommitScope } from \"./write-lock\";\nimport { dataAttributes, type DataAttributes } from \"../lib/data-attributes\";\n\n/** {@link AmountInput}'s props — exported since 0.34 (refactor audit 2026-10, API-9): a\n *  wrapper typed itself off `ComponentProps<typeof AmountInput>` until then. */\nexport interface AmountInputProps extends FieldHelpProps, DataAttributes {\n  value: string;\n  onChange: (value: string) => void;\n  currency?: string;\n  onCurrencyChange?: (code: string) => void;\n  placeholder?: string;\n  label?: ReactNode;\n  disabled?: boolean;\n  /** Required and unanswered — {@link FIELD_INVALID}. See {@link Input}'s `invalid`. */\n  invalid?: boolean;\n  /**\n   * What is wrong with the amount, in the caller's own words — {@link Input}'s `error`\n   * (keksdose K4: \"exceeds the outstanding balance\" was a loose `<p>` beside the field\n   * that nothing pointed at). Rendered under the field, after a text `hint`; merged into\n   * `aria-describedby` after the caller's ids and the hint's; implies `invalid`, so the\n   * field paints as well as announces. `null`, `false` and `\"\"` are no message.\n   * {@link MoneyField} takes it too.\n   */\n  error?: ReactNode;\n  /**\n   * Show the desktop calculator trigger (default `true`). `false` for an amount in an\n   * ephemeral close-on-blur editor — a budget's assigned cell, a VAT cell (keksdose K6)\n   * — where a click on the icon blurs the field and tears the editor down before the\n   * popover can open. Typing a calculation (\"200+50\", then Enter) still evaluates, and\n   * a phone keeps its numpad, exactly as {@link NumberInput}'s `calculator={false}`.\n   */\n  calculator?: boolean;\n  /** The field's WRAPPER — width, a margin, a flex share. The `<input>` is\n   *  `inputClassName`'s. */\n  className?: string;\n  /**\n   * Classes for the `<input>` itself — {@link NumberInput}'s and {@link Input}'s prop of\n   * the same name, merged the same way: after everything the field sets for LOOKS — the\n   * base classes, the plain end padding, the display shape's centring and the `tone`\n   * colour — so it can restyle the figure (`text-end` for a money column whose decimal\n   * points line up, `font-medium`, a tighter `py-1` or a symmetric `px-2` in a table\n   * cell, `text-transparent` while a figure is being re-fetched), and before what the\n   * field needs to WORK: the end padding the calculator and the currency chip reserve,\n   * and the invalid border. Neither of those can be taken away by accident — a caller's\n   * `px-2` keeps its start edge and the digits still stop short of the chip, and a\n   * borderless cell's `border-transparent` still turns red when the value is wrong.\n   *\n   * keksdose G7: the invoice's VAT cell right-aligns its figure, and with only\n   * `className` (the wrapper) it reached the element through `[&_input]:text-end` — a\n   * descendant selector that depends on the field's inner markup, which the kit is free\n   * to change, and that a reader of the call site has to decode. {@link MoneyField}\n   * passes it through, and `RhfMoneyField` takes it too.\n   *\n   * keksdose 0.24: until then it sat BEFORE the plain end padding (`pe-3`) and the tone,\n   * so the budget's assigned cell could not make its padding symmetric (`px-2` came out\n   * `px-2 pe-3`) and the holdings price could not hide an outflow-toned figure while\n   * re-fetching — both were back on `[&_input]:` selectors on the wrapper.\n   */\n  inputClassName?: string;\n  id?: string;\n  /** Names the field when it has no visible `label` (a table cell, the display shape). */\n  \"aria-label\"?: string;\n  /**\n   * Set on the `<input>`, with `id` above. Declared so `Field`'s render-prop spread —\n   * `{(ids) => <AmountInput {...ids} … />}` — is typed and reaches the input: the\n   * hint and error are described, a required amount is announced as required, and\n   * `aria-invalid` paints {@link FIELD_INVALID} the way `invalid` does.\n   */\n  \"aria-describedby\"?: string;\n  \"aria-invalid\"?: boolean | \"true\" | \"false\";\n  \"aria-required\"?: boolean | \"true\" | \"false\";\n  /**\n   * BCP 47 tag for this field — {@link NumberInput}'s `locale` (0.34, DUP-10): the decimal\n   * mark the field SHOWS and reads typing in (\"1,5\" for fr-CH, \"1.5\" for de-CH, as `Intl`\n   * decides), and the language of the currency picker's search. Default the\n   * `<UiKitProvider locale>`, else the runtime's. `value` and `onChange` stay\n   * dot-decimal.\n   */\n  locale?: string;\n  /** {@link NumberInput}'s `hint`, the same rule: a {@link FieldHint} \"?\" rides the\n   *  label's own line, beside the label (not at the far end, where the calculator and\n   *  the currency chip live); plain TEXT (a string or a number) is a caption UNDER\n   *  the field, attached through `aria-describedby` after the caller's own. A phone's\n   *  `variant=\"display\"` has no visible label, so a FieldHint is dropped there; a\n   *  caption still shows.\n   *\n   *  Since 0.34 a FieldHint is that caption at Large and on a touch screen, as on\n   *  NumberInput since 0.32 (`useInlineHint`, docs/text-size-harmonization.md §4: a fact\n   *  a finger cannot hover open is printed). A `HelpPopover` — help, not a fact (§10.23)\n   *  — stays on the label line at every size. */\n  hint?: ReactNode;\n  /** Every user-facing string this component and the two it composes own, so a\n   *  translating host can supply its own. Each key optional, and each a per-field\n   *  override of the kit-wide translation in `<UiKitProvider labels>`: `currency`\n   *  and `currencySearch` of its `currency` namespace, the rest of `calculator`.\n   *  `currency` names the picker chip, composed with the selected code through\n   *  `common.fieldValue`; the rest are pass-through. */\n  labels?: {\n    currency?: string;\n    currencySearch?: string;\n    /** Names the calculator TRIGGER this component renders. `calculator` below\n     *  names the controls inside the popover it opens. */\n    calculatorTrigger?: string;\n    pad?: NumberPadSheetLabels;\n    calculator?: CalculatorButtonLabels;\n  };\n  /** Translated currency names for the chip's picker, keyed by ISO code. The same\n   *  sparse override `CurrencySelect` takes, and for the same reason: the names in\n   *  `CURRENCIES` are shipped data, so without this they are the one English word\n   *  left in a translated row. Not part of `labels` because it is keyed by DATA\n   *  rather than by a fixed set of slots, and an app passes the same map to both\n   *  pickers. */\n  currencyNames?: Record<string, string>;\n  /** Offer only these ISO codes in the chip's list, in this order — `CurrencySelect`'s\n   *  `options`, since the chip renders CurrencySelect's list (round 0.34 Wave 2, DUP-4).\n   *  Default every currency the kit knows. */\n  currencyOptions?: string[];\n  /** Focus the field on mount — on mobile this also opens the numpad sheet, so a\n   *  new-transaction form can jump straight to amount entry (feedback #70). */\n  autoFocus?: boolean;\n  /**\n   * Tint the typed figure by what it will DO (Keksdose feedback #167).\n   *\n   * The direction is chosen with a toggle beside the field rather than typed, so\n   * the digits alone say nothing about which way the money goes — on the one screen\n   * where getting that backwards is the expensive mistake. Colour says it\n   * continuously, and it costs no layout. It stays the MAIN indication (live #201\n   * rework: *\"The main indication shall still be the color\"*); {@link negative}\n   * renders the sign as a second, quieter signal in front of the figure.\n   *\n   * Never the ONLY signal: the toggle it mirrors is right there, labelled, so this\n   * is reinforcement rather than the sole carrier of the meaning.\n   */\n  tone?: \"neutral\" | \"outflow\" | \"inflow\";\n  /**\n   * The SIGN of the figure, owned by the caller's direction control (Keksdose live\n   * #201 rework: *\"Outflow should be negative and inflow positive … the sign shall\n   * be displayed but not necessarily be typed in\"*).\n   *\n   * `value` stays the MAGNITUDE. The minus is glued on at render time and stripped\n   * off again before anything is reported back, so the caller never sees its own\n   * prefix echoed and no code path can end up applying it twice. That is the whole\n   * cure: there is exactly ONE place the sign lives, and it is not the text.\n   *\n   * Because it is rendered rather than stored it cannot be deleted (the next render\n   * puts it back), a select-all-and-retype keeps the direction, and the caret needs\n   * no minding.\n   *\n   * Since 0.15.5 it is drawn on its own too, for a read-only or disabled signed figure\n   * (an \"Items total\" of −5.18): no `onNegativeChange` needed just to show the minus.\n   */\n  negative?: boolean;\n  /**\n   * A sign the user TYPED, or a calculation that resolved to a signed number.\n   *\n   * SET, never flip. A \"-\" means *\"this is an outflow\"*, so typing it twice says the\n   * same thing twice — which is exactly what the rework asks for (*\"Subtracting\n   * values twice resulting in inflow -> outflow and back to inflow seems not\n   * reasonable\"*). \"+\" says the other direction.\n   *\n   * Its presence is what ARMS the whole sign behaviour. A field with no direction\n   * control — an account's starting balance, a loan payment, a holding's cost —\n   * passes neither prop and keeps a text that is the whole truth, minus included.\n   */\n  onNegativeChange?: (negative: boolean) => void;\n  /**\n   * How the field presents itself ON A PHONE (Keksdose feedback #176).\n   *\n   * `\"field\"` (default) is the labelled, bordered input used everywhere else.\n   *\n   * `\"display\"` keeps every mechanic — the same `<input>`, the same numpad sheet,\n   * the same currency picker, the same commit/blur contract — and only drops the\n   * chrome: no border, no fill, no floating label, the figure set at display size.\n   * On a form whose whole point is one number, a bordered `text-sm` box draws the\n   * amount at the same weight as the memo beside it; this makes it the headline\n   * instead. It stays fully editable — the underline and the caret are what say so.\n   *\n   * Phone-only by construction: it keys off the same breakpoint as the numpad, so\n   * from `md` up the field is byte-for-byte the normal one and a desktop grid keeps\n   * its column rhythm.\n   */\n  variant?: \"field\" | \"display\";\n  /**\n   * Where the figure sits in its row, for `variant=\"display\"` only (Keksdose\n   * feedback #176 rework).\n   *\n   * `\"start\"` (default) keeps it flush left, in the reading column the fields\n   * below it share — and it is what the entry forms use, because a figure that\n   * starts at a known edge is legible at any width: when the value outgrows the\n   * field, the digits that scroll out of sight are the trailing ones, not the\n   * magnitude (Keksdose feedback #430 rework).\n   *\n   * `\"center\"` makes it a centred headline. It centres in the width that REMAINS\n   * after the trailing currency control, not in the whole box: the control is\n   * pinned to the right edge, so a plain `text-center` would centre the figure\n   * under it and the last digits would sit behind the chip. This used to mirror\n   * the control's reservation onto the left instead, which centred correctly but\n   * spent twice the control's width on padding — fatal on a 375px screen, where\n   * it left a 36px figure 16px to live in.\n   */\n  align?: \"start\" | \"center\";\n  /**\n   * Decimals the committed amount is rounded to (kastlan 0.12: \"12.345\" and a\n   * calculator's \"100/3\" reached a `Numeric(10,2)` column unrounded and failed with a\n   * 422). Default: the currency's minor unit, from `Intl` (CHF and EUR 2, JPY 0). With\n   * no `currency`, nothing is rounded unless this is set. Rounding is half away from\n   * zero (12.345 → 12.35, -12.345 → -12.35) and happens when the figure settles: on\n   * blur, on Enter, and on every result the calculator writes back. Keystrokes are left\n   * alone, so \"12.3\" can still become \"12.34\".\n   *\n   * ⚠️ **A unit price or a rate needs `digits`.** The default is right for an amount of\n   * money and silently wrong for a price per unit: a fund's NAV of 123.4567 or fuel at\n   * 1.789 €/l is stored as 123.46 / 1.79, and no test fails (keksdose G2, a\n   * `Numeric(18,6)` holding price and a `Numeric(18,4)` unit price). Pass the column's\n   * scale: `digits={4}`, `digits={6}`.\n   *\n   * **Set `digits` for any sub-currency scale** — not only a price: any field whose\n   * column holds more decimals than the currency's minor unit. A split line stored at\n   * the ledger's 4dp (`Numeric(18,4)`) and loaded as 12.3456 is SHOWN as 12.35, and\n   * committed as 12.35 as soon as the user tabs through it (blur settles) — so the form\n   * no longer equals what the server holds: the lines stop summing to the 4dp total,\n   * and Save is held (keksdose live #240). With a `currency`, every commit rounds to that currency's\n   * minor unit unless `digits` says otherwise: pass the column's scale (`digits={4}`).\n   */\n  digits?: number;\n  /** The smallest amount the field settles on. A lower figure is raised to it when it\n   *  settles, like `digits`. Compared with the signed figure. */\n  min?: number;\n  /** The largest amount the field settles on (a deposit release capped at the\n   *  balance). A higher figure is lowered to it when it settles. */\n  max?: number;\n  /**\n   * The SETTLED figure, dot-decimal, sign included — fired on blur, on Enter, on the\n   * numpad's \"=\" and once per calculator session (its \"=\" or Enter in its display, or\n   * the pad closing on a result not committed yet), never on a keystroke (\"1200+\" is\n   * not a figure yet). `onChange` still reports every keystroke and every result the\n   * calculator writes back; this is for a host that stores a number and must not see\n   * drafts (kastlan 52; see {@link MoneyField}, which is built on it).\n   *\n   * Refactor audit 2026-10-30, INP-1: every calculator keystroke that resolved used to\n   * commit, so \"100+50\" committed 105 on its way to 150 — keksdose saved both, and its\n   * threshold field, `disabled` while it saves, lost the calculator to the first.\n   */\n  onCommit?: (value: string) => void;\n  /**\n   * Why the amount cannot be changed — {@link NumberInput}'s `disabledReason` (0.34,\n   * round 0.34 C2), for an amount that SAVES itself: a budget row's assigned cell, a\n   * price committed on blur. `disabled` takes the field out of the tab order, so the\n   * reason never reached a keyboard.\n   *\n   * With a reason the field stays in the tab order and shows its figure, `readOnly` (the\n   * settled grey FIELD_BASE gives a `[readonly]` field) and `aria-disabled`. Nothing\n   * changes the amount: the calculator and the phone's numpad are not offered, the\n   * currency chip is a read-out rather than a picker, and neither blur nor Enter\n   * settles — so `onChange`, `onCommit`, `onNegativeChange` and `onCurrencyChange` are\n   * never called. Enter is swallowed, so the field does not submit the form around it.\n   * The reason is a line under the field at Large and on a touch screen, else in the kit\n   * {@link Tooltip} (`disabledReasonDisplay`), and on the input's `aria-describedby`,\n   * between the caption and the error. Wins over `disabled`. {@link MoneyField} and\n   * `RhfMoneyField` take it too.\n   */\n  disabledReason?: ReactNode;\n  /**\n   * Where the reason shows — {@link Button}'s `disabledReasonDisplay`: by default a line\n   * under the field at Large and on a touch screen, the tooltip otherwise (§4 \"No fact\n   * only in a tooltip\"; DUP-3, refactor audit 2026-10).\n   */\n  disabledReasonDisplay?: DisabledReasonDisplay;\n  /**\n   * This amount COMMITS — {@link Button}'s `commit`, NumberInput's: under a locked\n   * {@link WriteLockProvider} it is locked the `disabledReason` way with the lock's reason\n   * (which wins over its own). An amount that only reaches the server through its form's\n   * Save leaves this off and stays editable under the lock; the Save takes `commit`. No\n   * provider, or an unlocked one: no effect.\n   */\n  commit?: CommitScope;\n  /** The `<input>`. A React 19 ref prop since 0.34 (MOD-4, refactor audit 2026-10); it\n   *  was `forwardRef`. */\n  ref?: Ref<HTMLInputElement>;\n}\n\n/**\n * A settled figure, rounded to `digits` (half away from zero) and clamped to\n * `min`/`max`. Only a plain number is touched. A half-typed draft or an expression\n * comes back as it was. Rounding is `lib/round.ts`'s, shared with `roundToCurrency`\n * (BUG-11: this copy blanked \"0.0000001\" and a 22-digit figure on blur).\n */\nfunction settleAmount(text: string, digits: number | undefined, min?: number, max?: number): string {\n  const t = text.trim();\n  if (!/^-?\\d*\\.?\\d*$/.test(t) || !/\\d/.test(t)) return text;\n  let n = Number(t);\n  if (!Number.isFinite(n)) return text;\n  if (digits !== undefined) n = roundHalfAway(n, digits);\n  if (min !== undefined && n < min) n = min;\n  if (max !== undefined && n > max) n = max;\n  const out = formatResult(n);\n  // Unchanged figures keep their own spelling (\"12.50\" stays \"12.50\").\n  return Number(out) === Number(t) ? text : out;\n}\n\n// The locale's decimal mark and the grouping parse (kastlan 40, keksdose G1) live in\n// `lib/decimal-marks.ts`, read through the engine NumberInput and this field share\n// (`numeric-field.ts`, DUP-10).\n\n/**\n * The figure's colour per {@link AmountInputProps.tone} — public as `AMOUNT_TONE_CLASS`,\n * for a table cell or a test that must paint the same figure the same way (keksdose's\n * receipt lines, dev#556).\n *\n * The consuming app's ONE money palette (`--money-expense` / `--money-income`), not a\n * bespoke rose/emerald pairing: a figure being typed has to wear the same colour the same\n * figure will wear once it is a row in the table behind the form (Keksdose dev#434). The\n * utilities are unlayered and theme-aware, so no `dark:` variant is needed and they win\n * over the field's own text colour regardless of where `cn` puts them.\n */\nconst TONE_CLASS: Readonly<Record<NonNullable<AmountInputProps[\"tone\"]>, string>> = {\n  neutral: \"\",\n  outflow: \"text-money-neg\",\n  inflow: \"text-money-pos\",\n};\n// Exported in 0.52 because keksdose's tests read it out of dist/components/amount-input.js\n// with a regex for `const TONE_CLASS` — the one reach into the kit's dist in three apps,\n// which a rename or a moved module breaks with no public change (MOD-8, refactor audit\n// 2026-10-30; 0.34's move failed 91 of keksdose's test files that way). The local name\n// stays until keksdose imports the export, so the bump itself breaks nothing.\nexport { TONE_CLASS as AMOUNT_TONE_CLASS };\n\n// The shared chrome-less treatment at money size. `tabular-nums` so digits don't\n// reflow the figure as they are typed; FIELD_DISPLAY's own muted placeholder\n// colour is what keeps an EMPTY form from painting its zero in the direction tint\n// (`tone` is computed from 0, which reads as an inflow).\nconst DISPLAY_INPUT_CLASS = cn(FIELD_DISPLAY, \"text-4xl font-semibold leading-tight tracking-tight tabular-nums\");\n\n/**\n * Is `text` the ANSWER to `previous`, or something typed OVER it?\n *\n * \"The old text was a sum and the new one is bare\" cannot tell those apart, and both\n * gestures are ordinary: select-all-and-retype after a typo, or backspacing \"-20+\"\n * back down to a fresh figure. Read as an answer, they move the direction chip — so\n * an outflow of 7 quietly booked +7.00 (live #201 rework).\n *\n * The question that does separate them is arithmetic, not shape: evaluate what the\n * text replaced and see whether this IS that number. \"-12+30\" → \"18\" still is, so a\n * sum that comes out positive still takes the chip with it; \"-20+50\" → \"7\" is not,\n * and \"-20+\" evaluates to nothing at all.\n */\nfunction isResultOf(previous: string, text: string, settle: (text: string) => string): boolean {\n  const n = evaluateExpression(previous);\n  // Compared settled, since the field rounds what the calculator hands it.\n  return n !== null && settle(formatResult(n)) === text.trim();\n}\n\nexport function AmountInput(props: AmountInputProps) {\n  const {\n    ref,\n    value,\n    onChange,\n    currency,\n    onCurrencyChange,\n    placeholder,\n    label,\n    className,\n    inputClassName,\n    id,\n    \"aria-label\": ariaLabel,\n    \"aria-required\": ariaRequired,\n    autoFocus,\n    tone = \"neutral\",\n    negative = false,\n    onNegativeChange,\n    align = \"start\",\n    labels,\n    currencyNames,\n    currencyOptions,\n    digits: digitsProp,\n    min,\n    max,\n    onCommit,\n    disabledReasonDisplay,\n  } = props;\n  const generatedId = useId();\n  const fieldId = id ?? generatedId;\n  // The sign is DISPLAYED, not stored (live #201 rework). `value` is the\n  // magnitude; the minus is glued on here and taken off again in handleText, so\n  // the two can never disagree and the caller can never double-apply it. Only in\n  // front of a bare amount: an expression being typed (\"12-30\") owns its own\n  // minus and has to survive keystroke-for-keystroke.\n  const signOwned = onNegativeChange !== undefined;\n  // The sign is DRAWN whenever `negative` says so, handler or not (keksdose live #366):\n  // a read-only or disabled total (\"−5.18\") used to need a dummy `onNegativeChange`\n  // just to show its minus. Without the handler there is nothing to toggle — a typed\n  // minus simply stays in the text, as in any field without a direction control.\n  const shown = negative && isBareAmount(value) ? `-${value}` : value;\n  // What the user SEES is `shown` with the locale's decimal mark (kastlan 40: a\n  // fr-CH user typed \"1,5\" and watched it turn into \"1.5\" under their fingers). Display only — `value`, `onChange`, the sign split and the settle all\n  // stay dot-decimal, because that string is the contract: RhfMoneyField's\n  // `parseAmount`, every app's `Number(value)` and the calculator's evaluator read\n  // it. The way back is free: {@link sanitizeLive} already folds a typed \",\" into\n  // \".\", so a comma typed, pasted or tapped on the numpad lands as a dot.\n  //\n  // One character for one character, and no digit grouping: the caret stays where\n  // the typist put it, and \"1.000\" cannot be read back as a thousand in one locale\n  // and as one in the other. de-CH and it-CH are \".\" — CLDR says so, and this\n  // follows `Intl` rather than a guess about a country. The field's own `locale`,\n  // else the provider's (0.34, DUP-10).\n  const locale = useKitLocale(props.locale);\n  // Decimals the figure settles to: `digits`, else the currency's minor unit.\n  const digits = digitsProp ?? currencyMinorDigits(currency);\n  const settle = (text: string) => settleAmount(text, digits, min, max);\n  // The engine NumberInput shares (DUP-10): the lock (focusable, `readOnly`, nothing\n  // changes or settles — see `disabledReason`), the hint — a FieldHint is its words at\n  // Large and on touch, §4 — the error, the description's order, the typist's draft\n  // in the locale's mark, the calculator and the numpad. On a phone the OS keyboard\n  // is suppressed for the numpad sheet (feedback #334), and the display shape keys off\n  // the SAME phone layout, so the two can never drift apart on the breakpoint.\n  //\n  // A value the HOST set (not one typed here) is shown at the currency's minor unit\n  // while the field is not being edited: an FX estimate of 93.4213 showed four\n  // decimals (keksdose live #356). Display only — `value` is the host's, untouched.\n  const numeric = useNumericField(props, {\n    settle,\n    display: (focused) => (focused ? shown : settleAmount(shown, digits)),\n  });\n  const { lock, locked, off, isMobile, asDisplay, showCalc, showNumpad, setFocused, mark, draft, setDraft, derived } =\n    numeric;\n  const invalid = numeric.isInvalid;\n  // A locked or disabled chip is a read-out: picking a currency is a change too.\n  const editable = !!onCurrencyChange && !locked && !off;\n  // Room for the trailing controls — the calculator and the currency chip — once\n  // measured, as NumberInput reserves its own (keksdose live #367, DUP-10): their\n  // width, the track's `end-1` inset in the boxed shape, and NumberInput's 4px gap.\n  // Before that (the first paint, and wherever there is no layout) the classes below\n  // stand in. showCalc is always false on a phone, so the display shape only has to\n  // clear the chip, by its own width rather than the boxed shape's room (feedback #430\n  // rework: on a 375px screen 16px decide between a readable figure and a clipped one).\n  const hasEnd = showCalc || Boolean(currency);\n  const [endRef, endWidth] = useEndWidth(hasEnd);\n  const trailingRoom = asDisplay\n    ? currency\n      ? editable\n        ? \"pe-16\"\n        : \"pe-12\"\n      : undefined\n    : showCalc\n      ? currency\n        ? editable\n          ? \"pe-24\"\n          : \"pe-16\"\n        : \"pe-10\"\n      : currency\n        ? editable\n          ? \"pe-20\"\n          : \"pe-14\"\n        : undefined;\n  const innerRef = useRef<HTMLInputElement>(null);\n  const setRefs = useMemo(() => mergeRefs(innerRef, ref), [ref]);\n  // While the typist is typing, the field shows THEIR text (\"1.234,5\" stays exactly\n  // that), not the value re-spelt: re-spelling turned a grouping \".\" into a \",\" under\n  // their fingers, after which no rule could tell the two apart (keksdose G1). The\n  // draft only while it says what the field holds AND holds nothing the live\n  // sanitising would drop — a letter, a second decimal point (see `showsTyped`); a\n  // value set from outside, a calculator result or a commit shows the derived spelling.\n  const display =\n    draft === null\n      ? derived\n      : (numeric.typedFor(shown) ??\n        // The caller owns the sign: the typed \"12\" is shown as the \"-12\" it is.\n        (signOwned && negative && shown.startsWith(\"-\") && numeric.typedFor(shown.slice(1)) !== null\n          ? `-${draft}`\n          : derived));\n  // Every route into the field — typing, the numpad sheet, the desktop\n  // calculator, the blur/Enter commit — funnels through here, so the split is\n  // written once and the four entry paths cannot drift.\n  //\n  // `previous` is the text this one REPLACES, and it is what says whether a bare\n  // figure arriving here is an answer or a magnitude. For the three paths that\n  // edit the field's own text that is simply what the field was showing; the\n  // desktop calculator keeps its expression in a popover the field never sees,\n  // so it passes it in (see `CalculatorButton`'s `onChange`).\n  const handleText = (raw: string, previous: string = shown) => {\n    const text = sanitizeLive(raw);\n    if (!signOwned) {\n      onChange(text);\n      return;\n    }\n    const { sign, rest } = splitLeadingSign(text);\n    if (sign) {\n      // SET, not flip: re-reporting the same sign on every keystroke is a no-op.\n      onNegativeChange(sign === \"-\");\n    } else if (looksLikeExpression(previous) && isBareAmount(text) && isResultOf(previous, text, settle)) {\n      // A calculation that just RESOLVED states its sign in both directions. The\n      // figure it ran on is the SIGNED one the user could see — \"-12+30\" is +18 —\n      // so a positive result has to move the chip too, or the field would answer\n      // that sum with \"-18\" and contradict the arithmetic it just showed.\n      //\n      // Only when it really resolved, though: see {@link isResultOf}. A bare figure\n      // arriving on top of an expression is far more often a replacement than an\n      // answer, and reading it as an answer flips the direction of money.\n      onNegativeChange(false);\n    }\n    onChange(sign ? rest : text);\n  };\n  const commit = () => {\n    setDraft(null);\n    const settled = settle(commitExpression(shown));\n    handleText(settled);\n    onCommit?.(settled);\n  };\n  const typed = (raw: string) => handleText(numeric.read(raw));\n  // The currency list is CurrencySelect's (round 0.34 Wave 2, DUP-4) on the picker\n  // family's core: the chip was a hand copy of it and had drifted (no wrap at Large, no\n  // `options` subset, no check mark, no listbox id, no #308 width), and both were plain\n  // buttons under a listbox promise. `filter: false`: the list filters its own rows.\n  const core = useComboboxCore<string>({ filter: false, backCloses: true });\n  // `chipRef`: the chip the currency list hangs off (Keksdose dev#548: portalled, so the\n  // panel needs a real trigger rect rather than a relative parent). It is also where\n  // Escape and a pick hand focus back (round 0.34 BUG-1): Safari does not focus a\n  // clicked button, so \"whatever held focus\" is not the chip.\n  const { open, setOpen, closeToTrigger, triggerRef: chipRef } = core;\n  const listboxId = `${generatedId}-currencies`;\n  // A lock arriving while the list is up closes it, as on CountrySelect — adjusted\n  // while rendering, so no frame shows a list that can no longer be used.\n  if (!editable && open) setOpen(false);\n\n  // The currency chip's strings are the `currency` namespace — the same two\n  // `CurrencySelect` resolves, under this component's older key names. The\n  // calculator and the numpad resolve `calculator` themselves; `labels.calculator`\n  // and `labels.pad` are handed straight through to them as overrides.\n  // The two strings read out first, so the memo depends on them and not on the\n  // caller's `labels` object (a new one every render) — what the React Compiler infers.\n  const currencyLabel = labels?.currency;\n  const currencySearchLabel = labels?.currencySearch;\n  const currencyOverrides = useMemo(() => {\n    const out: Partial<CurrencyLabels> = {};\n    if (currencyLabel !== undefined) out.currency = currencyLabel;\n    if (currencySearchLabel !== undefined) out.search = currencySearchLabel;\n    return out;\n  }, [currencyLabel, currencySearchLabel]);\n  const currencyText = useKitLabels(\"currency\", DEFAULT_CURRENCY_LABELS, currencyOverrides);\n  const common = useKitLabels(\"common\", DEFAULT_COMMON_LABELS);\n\n  const selected = getCurrency(currency);\n\n  return (\n    <div {...dataAttributes(props)} className={cn(\"w-full\", className)}>\n      {/* Inner relative box holds the input + its absolutely-positioned\n          trailing controls (calculator / currency), so those stay anchored to\n          the INPUT even when the mobile math bar is rendered below (#334). It is\n          the kit's FloatingField, which draws the label — floating, or sr-only in\n          the display shape — and puts a FieldHint on the label's line, as it does\n          for NumberInput. */}\n      {/* Locked, the field sits in the reason's frame (LockedReason: the line, or the\n          Tooltip), as NumberInput does; the root above keeps `className`, so nothing\n          reflows. */}\n      <LockedOrNot lock={lock} display={disabledReasonDisplay}>\n        <FloatingField\n          className=\"w-full\"\n          htmlFor={fieldId}\n          label={label}\n          srOnlyLabel={asDisplay}\n          hint={numeric.hint.labelHint}\n        >\n          <input\n            ref={setRefs}\n            id={fieldId}\n            aria-label={ariaLabel}\n            type=\"text\"\n            // eslint-disable-next-line jsx-a11y/no-autofocus -- opt-in per call site (feedback #70)\n            autoFocus={autoFocus}\n            // On mobile suppress the OS keyboard so our numpad sheet owns entry; the\n            // field keeps focus/caret. Desktop keeps the native decimal keypad.\n            inputMode={isMobile ? \"none\" : \"decimal\"}\n            autoComplete=\"off\"\n            disabled={off}\n            // Locked: focusable, `readOnly`, `aria-disabled` — see `disabledReason`.\n            readOnly={locked || undefined}\n            aria-disabled={locked || undefined}\n            // The floating-label pattern needs a blank placeholder for its\n            // peer-placeholder-shown trick. The display shape has no floating label,\n            // so it spends the placeholder on what an empty borderless form actually\n            // needs: a zero to aim at, at full size. The caller supplies it because\n            // only the app knows the locale's decimal separator.\n            placeholder={asDisplay ? (placeholder ?? \"0\") : label !== undefined ? \" \" : placeholder}\n            value={display}\n            onChange={(e) => {\n              if (!locked) typed(e.target.value);\n            }}\n            onFocus={() => setFocused(true)}\n            onBlur={() => {\n              // Nothing settles under the lock — not even a draft typed before it arrived,\n              // which stays in the field for when it lifts.\n              if (!locked) commit();\n              setFocused(false);\n            }}\n            onKeyDown={(e) => {\n              if (e.key !== \"Enter\") return;\n              // Locked: Enter submits no form and settles nothing.\n              if (locked) e.preventDefault();\n              else commit();\n            }}\n            className={cn(\n              // With a label, use the floating-input padding (pt-4 pb-1) like every\n              // other labelled field so the value sits BELOW the floated label rather\n              // than vertically centred where it overlaps the resting label\n              // (feedback #314). FLOATING_INPUT_CLASS already bundles the peer +\n              // transparent-placeholder bits.\n              asDisplay ? DISPLAY_INPUT_CLASS : label !== undefined ? FLOATING_INPUT_CLASS : FIELD_BASE,\n              // The plain end padding, with nothing trailing: cosmetic, so the caller's\n              // to change (keksdose 0.24 — a symmetric `px-2` in a budget cell).\n              !trailingRoom && (asDisplay ? \"pe-0\" : \"pe-3\"),\n              // Centred display shape: centre in what is LEFT of the currency chip.\n              // `text-center` alone would centre the figure in the whole box, i.e.\n              // partly underneath the chip; the padding below is what takes the chip\n              // out of the centring, and nothing is added at the start because a\n              // mirrored reservation would spend the width twice (see `align`).\n              asDisplay && align === \"center\" && \"text-center\",\n              // Over the base class's own text colour.\n              TONE_CLASS[tone],\n              // The caller's, over all of the above — base, plain padding, alignment and\n              // tone — and under only what the field needs to work (see `inputClassName`).\n              inputClassName,\n              // Room for the trailing controls, after the caller's so a `px-2` cannot run\n              // the digits under the chip (NumberInput's order, which reserves its unit\n              // and calculator the same way).\n              trailingRoom,\n              invalid && FIELD_INVALID,\n              locked && \"cursor-not-allowed\",\n            )}\n            // The classes above are the fallback; once measured the field reserves exactly\n            // its trailing controls' width, inline so it wins over every class (see\n            // `trailingRoom`).\n            style={hasEnd && endWidth != null ? { paddingInlineEnd: endWidth + (asDisplay ? 4 : 8) } : undefined}\n            aria-invalid={invalid || undefined}\n            aria-describedby={numeric.describedBy}\n            aria-required={ariaRequired}\n          />\n          {/* The label is FloatingField's, after these children (the floating trick\n          reads the input through `peer-*`). The display shape drops it VISUALLY,\n          not from the accessibility tree: a 36px tinted figure at the top of a\n          transaction form is legibly the amount, but a screen reader still needs\n          the name, and callers that pass `label` without `aria-label` would\n          otherwise be left with none. */}\n          {/* Trailing controls share one flex track so the calculator icon and the\n          currency suffix/picker sit side by side without overlapping. */}\n          {/* The display shape has no box to inset from, so the controls align to the\n          figure's own end edge and its baseline strip (`bottom-1`, matching the\n          input's pb-1) instead of floating inside a field. */}\n          <div\n            // Measured for the input's end padding (see `trailingRoom`).\n            ref={endRef}\n            className={cn(\n              \"absolute flex items-center gap-0.5\",\n              // Logical `end-*`: the chip and the calculator are the figure's trailing\n              // controls, so a right-to-left form carries them on the left.\n              asDisplay ? \"bottom-1 end-0\" : \"inset-y-1 end-1\",\n            )}\n          >\n            {showCalc && (\n              <CalculatorButton\n                // The mark the field shows but not the typist's grouping: the evaluator\n                // reads either mark, and \"1.234,5\" is two of them. The result comes back\n                // dot-decimal.\n                value={derived}\n                // Live: every result, settled, so the field never shows more decimals than\n                // it will keep. The commit is the session's one (INP-1): its \"=\", or the pad\n                // closing on a newer result — not each figure on the way to the result.\n                onChange={(result, expression) => {\n                  setDraft(null);\n                  handleText(settle(result), expression);\n                }}\n                onCommit={(result) => onCommit?.(settle(result))}\n                className=\"px-1.5\"\n                aria-label={labels?.calculatorTrigger}\n                labels={labels?.calculator}\n              />\n            )}\n            {currency && !editable && (\n              <span\n                aria-hidden\n                className={cn(\n                  \"pointer-events-none px-1 font-medium text-muted\",\n                  // A text-xs chip next to a 36px figure reads as a stray footnote.\n                  asDisplay ? \"text-sm\" : \"text-xs\",\n                )}\n              >\n                {currency}\n              </span>\n            )}\n            {currency && editable && (\n              <button\n                ref={chipRef}\n                type=\"button\"\n                onClick={() => setOpen((v) => !v)}\n                // A button that opens a listbox, and says so: the chip is a control inside\n                // a text field, not a field of its own, so not a combobox.\n                aria-haspopup=\"listbox\"\n                aria-expanded={open}\n                aria-controls={listboxId}\n                aria-label={\n                  // \"Currency: EUR\" through `common.fieldValue`, not a template literal:\n                  // the colon-and-space is punctuation a translation has to own.\n                  selected ? common.fieldValue(currencyText.currency, selected.code) : currencyText.currency\n                }\n                className={cn(\n                  \"flex items-center gap-1 rounded px-2 py-1 font-medium text-secondary hover:bg-hover\",\n                  asDisplay ? \"text-sm\" : \"text-xs\",\n                )}\n              >\n                {currency}\n                <ChevronDown className=\"size-3\" />\n              </button>\n            )}\n          </div>\n          {editable && (\n            <CurrencyOptionList\n              core={core}\n              listboxId={listboxId}\n              value={currency}\n              codes={currencyOptions}\n              currencyNames={currencyNames}\n              locale={locale}\n              searchPlaceholder={currencyText.search}\n              // The phone sheet's title: what the chip is for.\n              sheetTitle={currencyText.currency}\n              onChoose={(code) => {\n                onCurrencyChange?.(code);\n                closeToTrigger();\n              }}\n            />\n          )}\n        </FloatingField>\n      </LockedOrNot>\n      {/* Outside the relative box, as NumberInput's caption is: the trailing\n          controls are `inset-y-1` in it and would stretch down over a second line. */}\n      <FieldCaption parts={numeric.hint} />\n      {/* The news after the standing advice, as Select orders them. The root is\n          already a steady box, so the message coming and going remounts nothing. */}\n      {numeric.errorEl}\n      {showNumpad && (\n        <NumberPadSheet\n          // Localised like the field it mirrors. Keys are typing, read by the\n          // locale's marks like the keyboard's; \"=\" is a result, dot-decimal.\n          value={display}\n          onChange={typed}\n          onResult={(result) => {\n            setDraft(null);\n            const settled = settle(result);\n            handleText(settled);\n            onCommit?.(settled);\n          }}\n          onDone={() => innerRef.current?.blur()}\n          label={label}\n          labels={labels?.pad}\n          decimalMark={mark}\n        />\n      )}\n    </div>\n  );\n}\n\n/** The field in its lock's {@link LockedReason} while locked, as it is otherwise. A\n *  component rather than a ternary so the field's JSX is written once. `block w-full`:\n *  the frame's box stands where the field's own did. */\nfunction LockedOrNot({\n  lock,\n  display,\n  children,\n}: {\n  lock: LockReason;\n  display: DisabledReasonDisplay | undefined;\n  children: ReactNode;\n}) {\n  if (!lock.locked) return <>{children}</>;\n  return (\n    <LockedReason lock={lock} display={display} className=\"block w-full\">\n      {children}\n    </LockedReason>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/amount-input.tsx"],"sourcesContent":["import { useId, useMemo, useRef } from \"react\";\nimport { ChevronDown } from \"lucide-react\";\nimport type { ReactNode, Ref } from \"react\";\nimport { CurrencyOptionList, getCurrency } from \"./currency-option-list\";\nimport { useComboboxCore } from \"./combobox-core\";\nimport { FIELD_BASE, FIELD_DISPLAY, FIELD_INVALID, FLOATING_INPUT_CLASS, FloatingField } from \"./field-base\";\nimport { cn } from \"../lib/cn\";\nimport { currencyMinorDigits } from \"../lib/format\";\nimport { roundHalfAway } from \"../lib/round\";\nimport { CalculatorButton, type CalculatorButtonLabels } from \"./calculator\";\nimport { NumberPadSheet, type NumberPadSheetLabels } from \"./numpad-sheet\";\nimport {\n  DEFAULT_COMMON_LABELS,\n  DEFAULT_CURRENCY_LABELS,\n  useKitLabels,\n  useKitLocale,\n  type CurrencyLabels,\n} from \"../i18n/kit-labels\";\nimport {\n  commitExpression,\n  evaluateExpression,\n  formatResult,\n  isBareAmount,\n  looksLikeExpression,\n  sanitizeLive,\n  splitLeadingSign,\n} from \"../lib/calc\";\nimport {\n  FieldCaption,\n  LockedReason,\n  mergeRefs,\n  type DisabledReasonDisplay,\n  type FieldHelpProps,\n  type LockReason,\n} from \"./field-parts\";\nimport { useEndWidth, useNumericField } from \"./numeric-field\";\nimport type { CommitScope } from \"./write-lock\";\nimport { dataAttributes, type DataAttributes } from \"../lib/data-attributes\";\n\n/** {@link AmountInput}'s props — exported since 0.34 (refactor audit 2026-10, API-9): a\n *  wrapper typed itself off `ComponentProps<typeof AmountInput>` until then. */\nexport interface AmountInputProps extends FieldHelpProps, DataAttributes {\n  value: string;\n  onChange: (value: string) => void;\n  currency?: string;\n  onCurrencyChange?: (code: string) => void;\n  placeholder?: string;\n  label?: ReactNode;\n  disabled?: boolean;\n  /** Required and unanswered — {@link FIELD_INVALID}. See {@link Input}'s `invalid`. */\n  invalid?: boolean;\n  /**\n   * What is wrong with the amount, in the caller's own words — {@link Input}'s `error`\n   * (keksdose K4: \"exceeds the outstanding balance\" was a loose `<p>` beside the field\n   * that nothing pointed at). Rendered under the field, after a text `hint`; merged into\n   * `aria-describedby` after the caller's ids and the hint's; implies `invalid`, so the\n   * field paints as well as announces. `null`, `false` and `\"\"` are no message.\n   * {@link MoneyField} takes it too.\n   */\n  error?: ReactNode;\n  /**\n   * Show the desktop calculator trigger (default `true`). `false` for an amount in an\n   * ephemeral close-on-blur editor — a budget's assigned cell, a VAT cell (keksdose K6)\n   * — where a click on the icon blurs the field and tears the editor down before the\n   * popover can open. Typing a calculation (\"200+50\", then Enter) still evaluates, and\n   * a phone keeps its numpad, exactly as {@link NumberInput}'s `calculator={false}`.\n   */\n  calculator?: boolean;\n  /** The field's WRAPPER — width, a margin, a flex share. The `<input>` is\n   *  `inputClassName`'s. */\n  className?: string;\n  /**\n   * Classes for the `<input>` itself — {@link NumberInput}'s and {@link Input}'s prop of\n   * the same name, merged the same way: after everything the field sets for LOOKS — the\n   * base classes, the plain end padding, the display shape's centring and the `tone`\n   * colour — so it can restyle the figure (`text-end` for a money column whose decimal\n   * points line up, `font-medium`, a tighter `py-1` or a symmetric `px-2` in a table\n   * cell, `text-transparent` while a figure is being re-fetched), and before what the\n   * field needs to WORK: the end padding the calculator and the currency chip reserve,\n   * and the invalid border. Neither of those can be taken away by accident — a caller's\n   * `px-2` keeps its start edge and the digits still stop short of the chip, and a\n   * borderless cell's `border-transparent` still turns red when the value is wrong.\n   *\n   * keksdose G7: the invoice's VAT cell right-aligns its figure, and with only\n   * `className` (the wrapper) it reached the element through `[&_input]:text-end` — a\n   * descendant selector that depends on the field's inner markup, which the kit is free\n   * to change, and that a reader of the call site has to decode. {@link MoneyField}\n   * passes it through, and `RhfMoneyField` takes it too.\n   *\n   * keksdose 0.24: until then it sat BEFORE the plain end padding (`pe-3`) and the tone,\n   * so the budget's assigned cell could not make its padding symmetric (`px-2` came out\n   * `px-2 pe-3`) and the holdings price could not hide an outflow-toned figure while\n   * re-fetching — both were back on `[&_input]:` selectors on the wrapper.\n   */\n  inputClassName?: string;\n  id?: string;\n  /** Names the field when it has no visible `label` (a table cell, the display shape). */\n  \"aria-label\"?: string;\n  /**\n   * Set on the `<input>`, with `id` above. Declared so `Field`'s render-prop spread —\n   * `{(ids) => <AmountInput {...ids} … />}` — is typed and reaches the input: the\n   * hint and error are described, a required amount is announced as required, and\n   * `aria-invalid` paints {@link FIELD_INVALID} the way `invalid` does.\n   */\n  \"aria-describedby\"?: string;\n  \"aria-invalid\"?: boolean | \"true\" | \"false\";\n  \"aria-required\"?: boolean | \"true\" | \"false\";\n  /**\n   * BCP 47 tag for this field — {@link NumberInput}'s `locale` (0.34, DUP-10): the decimal\n   * mark the field SHOWS and reads typing in (\"1,5\" for fr-CH, \"1.5\" for de-CH, as `Intl`\n   * decides), and the language of the currency picker's search. Default the\n   * `<UiKitProvider locale>`, else the runtime's. `value` and `onChange` stay\n   * dot-decimal.\n   */\n  locale?: string;\n  /** {@link NumberInput}'s `hint`, the same rule: a {@link FieldHint} \"?\" rides the\n   *  label's own line, beside the label (not at the far end, where the calculator and\n   *  the currency chip live); plain TEXT (a string or a number) is a caption UNDER\n   *  the field, attached through `aria-describedby` after the caller's own. A phone's\n   *  `variant=\"display\"` has no visible label, so a FieldHint is dropped there; a\n   *  caption still shows.\n   *\n   *  Since 0.34 a FieldHint is that caption at Large and on a touch screen, as on\n   *  NumberInput since 0.32 (`useInlineHint`, docs/text-size-harmonization.md §4: a fact\n   *  a finger cannot hover open is printed). A `HelpPopover` — help, not a fact (§10.23)\n   *  — stays on the label line at every size. */\n  hint?: ReactNode;\n  /** Every user-facing string this component and the two it composes own, so a\n   *  translating host can supply its own. Each key optional, and each a per-field\n   *  override of the kit-wide translation in `<UiKitProvider labels>`: `currency`\n   *  and `currencySearch` of its `currency` namespace, the rest of `calculator`.\n   *  `currency` names the picker chip, composed with the selected code through\n   *  `common.fieldValue`; the rest are pass-through. */\n  labels?: {\n    currency?: string;\n    currencySearch?: string;\n    /** Names the calculator TRIGGER this component renders. `calculator` below\n     *  names the controls inside the popover it opens. */\n    calculatorTrigger?: string;\n    pad?: NumberPadSheetLabels;\n    calculator?: CalculatorButtonLabels;\n  };\n  /** Translated currency names for the chip's picker, keyed by ISO code. The same\n   *  sparse override `CurrencySelect` takes, and for the same reason: the names in\n   *  `CURRENCIES` are shipped data, so without this they are the one English word\n   *  left in a translated row. Not part of `labels` because it is keyed by DATA\n   *  rather than by a fixed set of slots, and an app passes the same map to both\n   *  pickers. */\n  currencyNames?: Record<string, string>;\n  /** Offer only these ISO codes in the chip's list, in this order — `CurrencySelect`'s\n   *  `options`, since the chip renders CurrencySelect's list (round 0.34 Wave 2, DUP-4).\n   *  Default every currency the kit knows but a `retired` one (the lev), which only the\n   *  field that holds it lists. */\n  currencyOptions?: string[];\n  /** Focus the field on mount — on mobile this also opens the numpad sheet, so a\n   *  new-transaction form can jump straight to amount entry (feedback #70). */\n  autoFocus?: boolean;\n  /**\n   * Tint the typed figure by what it will DO (Keksdose feedback #167).\n   *\n   * The direction is chosen with a toggle beside the field rather than typed, so\n   * the digits alone say nothing about which way the money goes — on the one screen\n   * where getting that backwards is the expensive mistake. Colour says it\n   * continuously, and it costs no layout. It stays the MAIN indication (live #201\n   * rework: *\"The main indication shall still be the color\"*); {@link negative}\n   * renders the sign as a second, quieter signal in front of the figure.\n   *\n   * Never the ONLY signal: the toggle it mirrors is right there, labelled, so this\n   * is reinforcement rather than the sole carrier of the meaning.\n   */\n  tone?: \"neutral\" | \"outflow\" | \"inflow\";\n  /**\n   * The SIGN of the figure, owned by the caller's direction control (Keksdose live\n   * #201 rework: *\"Outflow should be negative and inflow positive … the sign shall\n   * be displayed but not necessarily be typed in\"*).\n   *\n   * `value` stays the MAGNITUDE. The minus is glued on at render time and stripped\n   * off again before anything is reported back, so the caller never sees its own\n   * prefix echoed and no code path can end up applying it twice. That is the whole\n   * cure: there is exactly ONE place the sign lives, and it is not the text.\n   *\n   * Because it is rendered rather than stored it cannot be deleted (the next render\n   * puts it back), a select-all-and-retype keeps the direction, and the caret needs\n   * no minding.\n   *\n   * Since 0.15.5 it is drawn on its own too, for a read-only or disabled signed figure\n   * (an \"Items total\" of −5.18): no `onNegativeChange` needed just to show the minus.\n   */\n  negative?: boolean;\n  /**\n   * A sign the user TYPED, or a calculation that resolved to a signed number.\n   *\n   * SET, never flip. A \"-\" means *\"this is an outflow\"*, so typing it twice says the\n   * same thing twice — which is exactly what the rework asks for (*\"Subtracting\n   * values twice resulting in inflow -> outflow and back to inflow seems not\n   * reasonable\"*). \"+\" says the other direction.\n   *\n   * Its presence is what ARMS the whole sign behaviour. A field with no direction\n   * control — an account's starting balance, a loan payment, a holding's cost —\n   * passes neither prop and keeps a text that is the whole truth, minus included.\n   */\n  onNegativeChange?: (negative: boolean) => void;\n  /**\n   * How the field presents itself ON A PHONE (Keksdose feedback #176).\n   *\n   * `\"field\"` (default) is the labelled, bordered input used everywhere else.\n   *\n   * `\"display\"` keeps every mechanic — the same `<input>`, the same numpad sheet,\n   * the same currency picker, the same commit/blur contract — and only drops the\n   * chrome: no border, no fill, no floating label, the figure set at display size.\n   * On a form whose whole point is one number, a bordered `text-sm` box draws the\n   * amount at the same weight as the memo beside it; this makes it the headline\n   * instead. It stays fully editable — the underline and the caret are what say so.\n   *\n   * Phone-only by construction: it keys off the same breakpoint as the numpad, so\n   * from `md` up the field is byte-for-byte the normal one and a desktop grid keeps\n   * its column rhythm.\n   */\n  variant?: \"field\" | \"display\";\n  /**\n   * Where the figure sits in its row, for `variant=\"display\"` only (Keksdose\n   * feedback #176 rework).\n   *\n   * `\"start\"` (default) keeps it flush left, in the reading column the fields\n   * below it share — and it is what the entry forms use, because a figure that\n   * starts at a known edge is legible at any width: when the value outgrows the\n   * field, the digits that scroll out of sight are the trailing ones, not the\n   * magnitude (Keksdose feedback #430 rework).\n   *\n   * `\"center\"` makes it a centred headline. It centres in the width that REMAINS\n   * after the trailing currency control, not in the whole box: the control is\n   * pinned to the right edge, so a plain `text-center` would centre the figure\n   * under it and the last digits would sit behind the chip. This used to mirror\n   * the control's reservation onto the left instead, which centred correctly but\n   * spent twice the control's width on padding — fatal on a 375px screen, where\n   * it left a 36px figure 16px to live in.\n   */\n  align?: \"start\" | \"center\";\n  /**\n   * Decimals the committed amount is rounded to (kastlan 0.12: \"12.345\" and a\n   * calculator's \"100/3\" reached a `Numeric(10,2)` column unrounded and failed with a\n   * 422). Default: the currency's minor unit, from `Intl` (CHF and EUR 2, JPY 0). With\n   * no `currency`, nothing is rounded unless this is set. Rounding is half away from\n   * zero (12.345 → 12.35, -12.345 → -12.35) and happens when the figure settles: on\n   * blur, on Enter, and on every result the calculator writes back. Keystrokes are left\n   * alone, so \"12.3\" can still become \"12.34\".\n   *\n   * ⚠️ **A unit price or a rate needs `digits`.** The default is right for an amount of\n   * money and silently wrong for a price per unit: a fund's NAV of 123.4567 or fuel at\n   * 1.789 €/l is stored as 123.46 / 1.79, and no test fails (keksdose G2, a\n   * `Numeric(18,6)` holding price and a `Numeric(18,4)` unit price). Pass the column's\n   * scale: `digits={4}`, `digits={6}`.\n   *\n   * **Set `digits` for any sub-currency scale** — not only a price: any field whose\n   * column holds more decimals than the currency's minor unit. A split line stored at\n   * the ledger's 4dp (`Numeric(18,4)`) and loaded as 12.3456 is SHOWN as 12.35, and\n   * committed as 12.35 as soon as the user tabs through it (blur settles) — so the form\n   * no longer equals what the server holds: the lines stop summing to the 4dp total,\n   * and Save is held (keksdose live #240). With a `currency`, every commit rounds to that currency's\n   * minor unit unless `digits` says otherwise: pass the column's scale (`digits={4}`).\n   */\n  digits?: number;\n  /** The smallest amount the field settles on. A lower figure is raised to it when it\n   *  settles, like `digits`. Compared with the signed figure. */\n  min?: number;\n  /** The largest amount the field settles on (a deposit release capped at the\n   *  balance). A higher figure is lowered to it when it settles. */\n  max?: number;\n  /**\n   * The SETTLED figure, dot-decimal, sign included — fired on blur, on Enter, on the\n   * numpad's \"=\" and once per calculator session (its \"=\" or Enter in its display, or\n   * the pad closing on a result not committed yet), never on a keystroke (\"1200+\" is\n   * not a figure yet). `onChange` still reports every keystroke and every result the\n   * calculator writes back; this is for a host that stores a number and must not see\n   * drafts (kastlan 52; see {@link MoneyField}, which is built on it).\n   *\n   * Refactor audit 2026-10-30, INP-1: every calculator keystroke that resolved used to\n   * commit, so \"100+50\" committed 105 on its way to 150 — keksdose saved both, and its\n   * threshold field, `disabled` while it saves, lost the calculator to the first.\n   */\n  onCommit?: (value: string) => void;\n  /**\n   * Why the amount cannot be changed — {@link NumberInput}'s `disabledReason` (0.34,\n   * round 0.34 C2), for an amount that SAVES itself: a budget row's assigned cell, a\n   * price committed on blur. `disabled` takes the field out of the tab order, so the\n   * reason never reached a keyboard.\n   *\n   * With a reason the field stays in the tab order and shows its figure, `readOnly` (the\n   * settled grey FIELD_BASE gives a `[readonly]` field) and `aria-disabled`. Nothing\n   * changes the amount: the calculator and the phone's numpad are not offered, the\n   * currency chip is a read-out rather than a picker, and neither blur nor Enter\n   * settles — so `onChange`, `onCommit`, `onNegativeChange` and `onCurrencyChange` are\n   * never called. Enter is swallowed, so the field does not submit the form around it.\n   * The reason is a line under the field at Large and on a touch screen, else in the kit\n   * {@link Tooltip} (`disabledReasonDisplay`), and on the input's `aria-describedby`,\n   * between the caption and the error. Wins over `disabled`. {@link MoneyField} and\n   * `RhfMoneyField` take it too.\n   */\n  disabledReason?: ReactNode;\n  /**\n   * Where the reason shows — {@link Button}'s `disabledReasonDisplay`: by default a line\n   * under the field at Large and on a touch screen, the tooltip otherwise (§4 \"No fact\n   * only in a tooltip\"; DUP-3, refactor audit 2026-10).\n   */\n  disabledReasonDisplay?: DisabledReasonDisplay;\n  /**\n   * This amount COMMITS — {@link Button}'s `commit`, NumberInput's: under a locked\n   * {@link WriteLockProvider} it is locked the `disabledReason` way with the lock's reason\n   * (which wins over its own). An amount that only reaches the server through its form's\n   * Save leaves this off and stays editable under the lock; the Save takes `commit`. No\n   * provider, or an unlocked one: no effect.\n   */\n  commit?: CommitScope;\n  /** The `<input>`. A React 19 ref prop since 0.34 (MOD-4, refactor audit 2026-10); it\n   *  was `forwardRef`. */\n  ref?: Ref<HTMLInputElement>;\n}\n\n/**\n * A settled figure, rounded to `digits` (half away from zero) and clamped to\n * `min`/`max`. Only a plain number is touched. A half-typed draft or an expression\n * comes back as it was. Rounding is `lib/round.ts`'s, shared with `roundToCurrency`\n * (BUG-11: this copy blanked \"0.0000001\" and a 22-digit figure on blur).\n */\nfunction settleAmount(text: string, digits: number | undefined, min?: number, max?: number): string {\n  const t = text.trim();\n  if (!/^-?\\d*\\.?\\d*$/.test(t) || !/\\d/.test(t)) return text;\n  let n = Number(t);\n  if (!Number.isFinite(n)) return text;\n  if (digits !== undefined) n = roundHalfAway(n, digits);\n  if (min !== undefined && n < min) n = min;\n  if (max !== undefined && n > max) n = max;\n  const out = formatResult(n);\n  // Unchanged figures keep their own spelling (\"12.50\" stays \"12.50\").\n  return Number(out) === Number(t) ? text : out;\n}\n\n// The locale's decimal mark and the grouping parse (kastlan 40, keksdose G1) live in\n// `lib/decimal-marks.ts`, read through the engine NumberInput and this field share\n// (`numeric-field.ts`, DUP-10).\n\n/**\n * The figure's colour per {@link AmountInputProps.tone} — public as `AMOUNT_TONE_CLASS`,\n * for a table cell or a test that must paint the same figure the same way (keksdose's\n * receipt lines, dev#556).\n *\n * The consuming app's ONE money palette (`--money-expense` / `--money-income`), not a\n * bespoke rose/emerald pairing: a figure being typed has to wear the same colour the same\n * figure will wear once it is a row in the table behind the form (Keksdose dev#434). The\n * utilities are unlayered and theme-aware, so no `dark:` variant is needed and they win\n * over the field's own text colour regardless of where `cn` puts them.\n */\nconst TONE_CLASS: Readonly<Record<NonNullable<AmountInputProps[\"tone\"]>, string>> = {\n  neutral: \"\",\n  outflow: \"text-money-neg\",\n  inflow: \"text-money-pos\",\n};\n// Exported in 0.52 because keksdose's tests read it out of dist/components/amount-input.js\n// with a regex for `const TONE_CLASS` — the one reach into the kit's dist in three apps,\n// which a rename or a moved module breaks with no public change (MOD-8, refactor audit\n// 2026-10-30; 0.34's move failed 91 of keksdose's test files that way). The local name\n// stays until keksdose imports the export, so the bump itself breaks nothing.\nexport { TONE_CLASS as AMOUNT_TONE_CLASS };\n\n// The shared chrome-less treatment at money size. `tabular-nums` so digits don't\n// reflow the figure as they are typed; FIELD_DISPLAY's own muted placeholder\n// colour is what keeps an EMPTY form from painting its zero in the direction tint\n// (`tone` is computed from 0, which reads as an inflow).\nconst DISPLAY_INPUT_CLASS = cn(FIELD_DISPLAY, \"text-4xl font-semibold leading-tight tracking-tight tabular-nums\");\n\n/**\n * Is `text` the ANSWER to `previous`, or something typed OVER it?\n *\n * \"The old text was a sum and the new one is bare\" cannot tell those apart, and both\n * gestures are ordinary: select-all-and-retype after a typo, or backspacing \"-20+\"\n * back down to a fresh figure. Read as an answer, they move the direction chip — so\n * an outflow of 7 quietly booked +7.00 (live #201 rework).\n *\n * The question that does separate them is arithmetic, not shape: evaluate what the\n * text replaced and see whether this IS that number. \"-12+30\" → \"18\" still is, so a\n * sum that comes out positive still takes the chip with it; \"-20+50\" → \"7\" is not,\n * and \"-20+\" evaluates to nothing at all.\n */\nfunction isResultOf(previous: string, text: string, settle: (text: string) => string): boolean {\n  const n = evaluateExpression(previous);\n  // Compared settled, since the field rounds what the calculator hands it.\n  return n !== null && settle(formatResult(n)) === text.trim();\n}\n\nexport function AmountInput(props: AmountInputProps) {\n  const {\n    ref,\n    value,\n    onChange,\n    currency,\n    onCurrencyChange,\n    placeholder,\n    label,\n    className,\n    inputClassName,\n    id,\n    \"aria-label\": ariaLabel,\n    \"aria-required\": ariaRequired,\n    autoFocus,\n    tone = \"neutral\",\n    negative = false,\n    onNegativeChange,\n    align = \"start\",\n    labels,\n    currencyNames,\n    currencyOptions,\n    digits: digitsProp,\n    min,\n    max,\n    onCommit,\n    disabledReasonDisplay,\n  } = props;\n  const generatedId = useId();\n  const fieldId = id ?? generatedId;\n  // The sign is DISPLAYED, not stored (live #201 rework). `value` is the\n  // magnitude; the minus is glued on here and taken off again in handleText, so\n  // the two can never disagree and the caller can never double-apply it. Only in\n  // front of a bare amount: an expression being typed (\"12-30\") owns its own\n  // minus and has to survive keystroke-for-keystroke.\n  const signOwned = onNegativeChange !== undefined;\n  // The sign is DRAWN whenever `negative` says so, handler or not (keksdose live #366):\n  // a read-only or disabled total (\"−5.18\") used to need a dummy `onNegativeChange`\n  // just to show its minus. Without the handler there is nothing to toggle — a typed\n  // minus simply stays in the text, as in any field without a direction control.\n  const shown = negative && isBareAmount(value) ? `-${value}` : value;\n  // What the user SEES is `shown` with the locale's decimal mark (kastlan 40: a\n  // fr-CH user typed \"1,5\" and watched it turn into \"1.5\" under their fingers). Display only — `value`, `onChange`, the sign split and the settle all\n  // stay dot-decimal, because that string is the contract: RhfMoneyField's\n  // `parseAmount`, every app's `Number(value)` and the calculator's evaluator read\n  // it. The way back is free: {@link sanitizeLive} already folds a typed \",\" into\n  // \".\", so a comma typed, pasted or tapped on the numpad lands as a dot.\n  //\n  // One character for one character, and no digit grouping: the caret stays where\n  // the typist put it, and \"1.000\" cannot be read back as a thousand in one locale\n  // and as one in the other. de-CH and it-CH are \".\" — CLDR says so, and this\n  // follows `Intl` rather than a guess about a country. The field's own `locale`,\n  // else the provider's (0.34, DUP-10).\n  const locale = useKitLocale(props.locale);\n  // Decimals the figure settles to: `digits`, else the currency's minor unit.\n  const digits = digitsProp ?? currencyMinorDigits(currency);\n  const settle = (text: string) => settleAmount(text, digits, min, max);\n  // The engine NumberInput shares (DUP-10): the lock (focusable, `readOnly`, nothing\n  // changes or settles — see `disabledReason`), the hint — a FieldHint is its words at\n  // Large and on touch, §4 — the error, the description's order, the typist's draft\n  // in the locale's mark, the calculator and the numpad. On a phone the OS keyboard\n  // is suppressed for the numpad sheet (feedback #334), and the display shape keys off\n  // the SAME phone layout, so the two can never drift apart on the breakpoint.\n  //\n  // A value the HOST set (not one typed here) is shown at the currency's minor unit\n  // while the field is not being edited: an FX estimate of 93.4213 showed four\n  // decimals (keksdose live #356). Display only — `value` is the host's, untouched.\n  const numeric = useNumericField(props, {\n    settle,\n    display: (focused) => (focused ? shown : settleAmount(shown, digits)),\n  });\n  const { lock, locked, off, isMobile, asDisplay, showCalc, showNumpad, setFocused, mark, draft, setDraft, derived } =\n    numeric;\n  const invalid = numeric.isInvalid;\n  // A locked or disabled chip is a read-out: picking a currency is a change too.\n  const editable = !!onCurrencyChange && !locked && !off;\n  // Room for the trailing controls — the calculator and the currency chip — once\n  // measured, as NumberInput reserves its own (keksdose live #367, DUP-10): their\n  // width, the track's `end-1` inset in the boxed shape, and NumberInput's 4px gap.\n  // Before that (the first paint, and wherever there is no layout) the classes below\n  // stand in. showCalc is always false on a phone, so the display shape only has to\n  // clear the chip, by its own width rather than the boxed shape's room (feedback #430\n  // rework: on a 375px screen 16px decide between a readable figure and a clipped one).\n  const hasEnd = showCalc || Boolean(currency);\n  const [endRef, endWidth] = useEndWidth(hasEnd);\n  const trailingRoom = asDisplay\n    ? currency\n      ? editable\n        ? \"pe-16\"\n        : \"pe-12\"\n      : undefined\n    : showCalc\n      ? currency\n        ? editable\n          ? \"pe-24\"\n          : \"pe-16\"\n        : \"pe-10\"\n      : currency\n        ? editable\n          ? \"pe-20\"\n          : \"pe-14\"\n        : undefined;\n  const innerRef = useRef<HTMLInputElement>(null);\n  const setRefs = useMemo(() => mergeRefs(innerRef, ref), [ref]);\n  // While the typist is typing, the field shows THEIR text (\"1.234,5\" stays exactly\n  // that), not the value re-spelt: re-spelling turned a grouping \".\" into a \",\" under\n  // their fingers, after which no rule could tell the two apart (keksdose G1). The\n  // draft only while it says what the field holds AND holds nothing the live\n  // sanitising would drop — a letter, a second decimal point (see `showsTyped`); a\n  // value set from outside, a calculator result or a commit shows the derived spelling.\n  const display =\n    draft === null\n      ? derived\n      : (numeric.typedFor(shown) ??\n        // The caller owns the sign: the typed \"12\" is shown as the \"-12\" it is.\n        (signOwned && negative && shown.startsWith(\"-\") && numeric.typedFor(shown.slice(1)) !== null\n          ? `-${draft}`\n          : derived));\n  // Every route into the field — typing, the numpad sheet, the desktop\n  // calculator, the blur/Enter commit — funnels through here, so the split is\n  // written once and the four entry paths cannot drift.\n  //\n  // `previous` is the text this one REPLACES, and it is what says whether a bare\n  // figure arriving here is an answer or a magnitude. For the three paths that\n  // edit the field's own text that is simply what the field was showing; the\n  // desktop calculator keeps its expression in a popover the field never sees,\n  // so it passes it in (see `CalculatorButton`'s `onChange`).\n  const handleText = (raw: string, previous: string = shown) => {\n    const text = sanitizeLive(raw);\n    if (!signOwned) {\n      onChange(text);\n      return;\n    }\n    const { sign, rest } = splitLeadingSign(text);\n    if (sign) {\n      // SET, not flip: re-reporting the same sign on every keystroke is a no-op.\n      onNegativeChange(sign === \"-\");\n    } else if (looksLikeExpression(previous) && isBareAmount(text) && isResultOf(previous, text, settle)) {\n      // A calculation that just RESOLVED states its sign in both directions. The\n      // figure it ran on is the SIGNED one the user could see — \"-12+30\" is +18 —\n      // so a positive result has to move the chip too, or the field would answer\n      // that sum with \"-18\" and contradict the arithmetic it just showed.\n      //\n      // Only when it really resolved, though: see {@link isResultOf}. A bare figure\n      // arriving on top of an expression is far more often a replacement than an\n      // answer, and reading it as an answer flips the direction of money.\n      onNegativeChange(false);\n    }\n    onChange(sign ? rest : text);\n  };\n  const commit = () => {\n    setDraft(null);\n    const settled = settle(commitExpression(shown));\n    handleText(settled);\n    onCommit?.(settled);\n  };\n  const typed = (raw: string) => handleText(numeric.read(raw));\n  // The currency list is CurrencySelect's (round 0.34 Wave 2, DUP-4) on the picker\n  // family's core: the chip was a hand copy of it and had drifted (no wrap at Large, no\n  // `options` subset, no check mark, no listbox id, no #308 width), and both were plain\n  // buttons under a listbox promise. `filter: false`: the list filters its own rows.\n  const core = useComboboxCore<string>({ filter: false, backCloses: true });\n  // `chipRef`: the chip the currency list hangs off (Keksdose dev#548: portalled, so the\n  // panel needs a real trigger rect rather than a relative parent). It is also where\n  // Escape and a pick hand focus back (round 0.34 BUG-1): Safari does not focus a\n  // clicked button, so \"whatever held focus\" is not the chip.\n  const { open, setOpen, closeToTrigger, triggerRef: chipRef } = core;\n  const listboxId = `${generatedId}-currencies`;\n  // A lock arriving while the list is up closes it, as on CountrySelect — adjusted\n  // while rendering, so no frame shows a list that can no longer be used.\n  if (!editable && open) setOpen(false);\n\n  // The currency chip's strings are the `currency` namespace — the same two\n  // `CurrencySelect` resolves, under this component's older key names. The\n  // calculator and the numpad resolve `calculator` themselves; `labels.calculator`\n  // and `labels.pad` are handed straight through to them as overrides.\n  // The two strings read out first, so the memo depends on them and not on the\n  // caller's `labels` object (a new one every render) — what the React Compiler infers.\n  const currencyLabel = labels?.currency;\n  const currencySearchLabel = labels?.currencySearch;\n  const currencyOverrides = useMemo(() => {\n    const out: Partial<CurrencyLabels> = {};\n    if (currencyLabel !== undefined) out.currency = currencyLabel;\n    if (currencySearchLabel !== undefined) out.search = currencySearchLabel;\n    return out;\n  }, [currencyLabel, currencySearchLabel]);\n  const currencyText = useKitLabels(\"currency\", DEFAULT_CURRENCY_LABELS, currencyOverrides);\n  const common = useKitLabels(\"common\", DEFAULT_COMMON_LABELS);\n\n  const selected = getCurrency(currency);\n\n  return (\n    <div {...dataAttributes(props)} className={cn(\"w-full\", className)}>\n      {/* Inner relative box holds the input + its absolutely-positioned\n          trailing controls (calculator / currency), so those stay anchored to\n          the INPUT even when the mobile math bar is rendered below (#334). It is\n          the kit's FloatingField, which draws the label — floating, or sr-only in\n          the display shape — and puts a FieldHint on the label's line, as it does\n          for NumberInput. */}\n      {/* Locked, the field sits in the reason's frame (LockedReason: the line, or the\n          Tooltip), as NumberInput does; the root above keeps `className`, so nothing\n          reflows. */}\n      <LockedOrNot lock={lock} display={disabledReasonDisplay}>\n        <FloatingField\n          className=\"w-full\"\n          htmlFor={fieldId}\n          label={label}\n          srOnlyLabel={asDisplay}\n          hint={numeric.hint.labelHint}\n        >\n          <input\n            ref={setRefs}\n            id={fieldId}\n            aria-label={ariaLabel}\n            type=\"text\"\n            // eslint-disable-next-line jsx-a11y/no-autofocus -- opt-in per call site (feedback #70)\n            autoFocus={autoFocus}\n            // On mobile suppress the OS keyboard so our numpad sheet owns entry; the\n            // field keeps focus/caret. Desktop keeps the native decimal keypad.\n            inputMode={isMobile ? \"none\" : \"decimal\"}\n            autoComplete=\"off\"\n            disabled={off}\n            // Locked: focusable, `readOnly`, `aria-disabled` — see `disabledReason`.\n            readOnly={locked || undefined}\n            aria-disabled={locked || undefined}\n            // The floating-label pattern needs a blank placeholder for its\n            // peer-placeholder-shown trick. The display shape has no floating label,\n            // so it spends the placeholder on what an empty borderless form actually\n            // needs: a zero to aim at, at full size. The caller supplies it because\n            // only the app knows the locale's decimal separator.\n            placeholder={asDisplay ? (placeholder ?? \"0\") : label !== undefined ? \" \" : placeholder}\n            value={display}\n            onChange={(e) => {\n              if (!locked) typed(e.target.value);\n            }}\n            onFocus={() => setFocused(true)}\n            onBlur={() => {\n              // Nothing settles under the lock — not even a draft typed before it arrived,\n              // which stays in the field for when it lifts.\n              if (!locked) commit();\n              setFocused(false);\n            }}\n            onKeyDown={(e) => {\n              if (e.key !== \"Enter\") return;\n              // Locked: Enter submits no form and settles nothing.\n              if (locked) e.preventDefault();\n              else commit();\n            }}\n            className={cn(\n              // With a label, use the floating-input padding (pt-4 pb-1) like every\n              // other labelled field so the value sits BELOW the floated label rather\n              // than vertically centred where it overlaps the resting label\n              // (feedback #314). FLOATING_INPUT_CLASS already bundles the peer +\n              // transparent-placeholder bits.\n              asDisplay ? DISPLAY_INPUT_CLASS : label !== undefined ? FLOATING_INPUT_CLASS : FIELD_BASE,\n              // The plain end padding, with nothing trailing: cosmetic, so the caller's\n              // to change (keksdose 0.24 — a symmetric `px-2` in a budget cell).\n              !trailingRoom && (asDisplay ? \"pe-0\" : \"pe-3\"),\n              // Centred display shape: centre in what is LEFT of the currency chip.\n              // `text-center` alone would centre the figure in the whole box, i.e.\n              // partly underneath the chip; the padding below is what takes the chip\n              // out of the centring, and nothing is added at the start because a\n              // mirrored reservation would spend the width twice (see `align`).\n              asDisplay && align === \"center\" && \"text-center\",\n              // Over the base class's own text colour.\n              TONE_CLASS[tone],\n              // The caller's, over all of the above — base, plain padding, alignment and\n              // tone — and under only what the field needs to work (see `inputClassName`).\n              inputClassName,\n              // Room for the trailing controls, after the caller's so a `px-2` cannot run\n              // the digits under the chip (NumberInput's order, which reserves its unit\n              // and calculator the same way).\n              trailingRoom,\n              invalid && FIELD_INVALID,\n              locked && \"cursor-not-allowed\",\n            )}\n            // The classes above are the fallback; once measured the field reserves exactly\n            // its trailing controls' width, inline so it wins over every class (see\n            // `trailingRoom`).\n            style={hasEnd && endWidth != null ? { paddingInlineEnd: endWidth + (asDisplay ? 4 : 8) } : undefined}\n            aria-invalid={invalid || undefined}\n            aria-describedby={numeric.describedBy}\n            aria-required={ariaRequired}\n          />\n          {/* The label is FloatingField's, after these children (the floating trick\n          reads the input through `peer-*`). The display shape drops it VISUALLY,\n          not from the accessibility tree: a 36px tinted figure at the top of a\n          transaction form is legibly the amount, but a screen reader still needs\n          the name, and callers that pass `label` without `aria-label` would\n          otherwise be left with none. */}\n          {/* Trailing controls share one flex track so the calculator icon and the\n          currency suffix/picker sit side by side without overlapping. */}\n          {/* The display shape has no box to inset from, so the controls align to the\n          figure's own end edge and its baseline strip (`bottom-1`, matching the\n          input's pb-1) instead of floating inside a field. */}\n          <div\n            // Measured for the input's end padding (see `trailingRoom`).\n            ref={endRef}\n            className={cn(\n              \"absolute flex items-center gap-0.5\",\n              // Logical `end-*`: the chip and the calculator are the figure's trailing\n              // controls, so a right-to-left form carries them on the left.\n              asDisplay ? \"bottom-1 end-0\" : \"inset-y-1 end-1\",\n            )}\n          >\n            {showCalc && (\n              <CalculatorButton\n                // The mark the field shows but not the typist's grouping: the evaluator\n                // reads either mark, and \"1.234,5\" is two of them. The result comes back\n                // dot-decimal.\n                value={derived}\n                // Live: every result, settled, so the field never shows more decimals than\n                // it will keep. The commit is the session's one (INP-1): its \"=\", or the pad\n                // closing on a newer result — not each figure on the way to the result.\n                onChange={(result, expression) => {\n                  setDraft(null);\n                  handleText(settle(result), expression);\n                }}\n                onCommit={(result) => onCommit?.(settle(result))}\n                className=\"px-1.5\"\n                aria-label={labels?.calculatorTrigger}\n                labels={labels?.calculator}\n              />\n            )}\n            {currency && !editable && (\n              <span\n                aria-hidden\n                className={cn(\n                  \"pointer-events-none px-1 font-medium text-muted\",\n                  // A text-xs chip next to a 36px figure reads as a stray footnote.\n                  asDisplay ? \"text-sm\" : \"text-xs\",\n                )}\n              >\n                {currency}\n              </span>\n            )}\n            {currency && editable && (\n              <button\n                ref={chipRef}\n                type=\"button\"\n                onClick={() => setOpen((v) => !v)}\n                // A button that opens a listbox, and says so: the chip is a control inside\n                // a text field, not a field of its own, so not a combobox.\n                aria-haspopup=\"listbox\"\n                aria-expanded={open}\n                aria-controls={listboxId}\n                aria-label={\n                  // \"Currency: EUR\" through `common.fieldValue`, not a template literal:\n                  // the colon-and-space is punctuation a translation has to own.\n                  selected ? common.fieldValue(currencyText.currency, selected.code) : currencyText.currency\n                }\n                className={cn(\n                  \"flex items-center gap-1 rounded px-2 py-1 font-medium text-secondary hover:bg-hover\",\n                  asDisplay ? \"text-sm\" : \"text-xs\",\n                )}\n              >\n                {currency}\n                <ChevronDown className=\"size-3\" />\n              </button>\n            )}\n          </div>\n          {editable && (\n            <CurrencyOptionList\n              core={core}\n              listboxId={listboxId}\n              value={currency}\n              codes={currencyOptions}\n              currencyNames={currencyNames}\n              locale={locale}\n              searchPlaceholder={currencyText.search}\n              // The phone sheet's title: what the chip is for.\n              sheetTitle={currencyText.currency}\n              onChoose={(code) => {\n                onCurrencyChange?.(code);\n                closeToTrigger();\n              }}\n            />\n          )}\n        </FloatingField>\n      </LockedOrNot>\n      {/* Outside the relative box, as NumberInput's caption is: the trailing\n          controls are `inset-y-1` in it and would stretch down over a second line. */}\n      <FieldCaption parts={numeric.hint} />\n      {/* The news after the standing advice, as Select orders them. The root is\n          already a steady box, so the message coming and going remounts nothing. */}\n      {numeric.errorEl}\n      {showNumpad && (\n        <NumberPadSheet\n          // Localised like the field it mirrors. Keys are typing, read by the\n          // locale's marks like the keyboard's; \"=\" is a result, dot-decimal.\n          value={display}\n          onChange={typed}\n          onResult={(result) => {\n            setDraft(null);\n            const settled = settle(result);\n            handleText(settled);\n            onCommit?.(settled);\n          }}\n          onDone={() => innerRef.current?.blur()}\n          label={label}\n          labels={labels?.pad}\n          decimalMark={mark}\n        />\n      )}\n    </div>\n  );\n}\n\n/** The field in its lock's {@link LockedReason} while locked, as it is otherwise. A\n *  component rather than a ternary so the field's JSX is written once. `block w-full`:\n *  the frame's box stands where the field's own did. */\nfunction LockedOrNot({\n  lock,\n  display,\n  children,\n}: {\n  lock: LockReason;\n  display: DisabledReasonDisplay | undefined;\n  children: ReactNode;\n}) {\n  if (!lock.locked) return <>{children}</>;\n  return (\n    <LockedReason lock={lock} display={display} className=\"block w-full\">\n      {children}\n    </LockedReason>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/calendar-heatmap.js

@@ -4,6 +4,7 @@ import { useEffect, useLayoutEffect, useMemo, useRef, useState } from "react";
 import { cn } from "../lib/cn.js";
 import { dirOf, horizontalStep } from "../lib/direction.js";
 import { addMonthsClamped, localeWeekStart, parseIsoDate, toLocalIso } from "../lib/dates.js";
+import { dateFormatter } from "../lib/intl-cache.js";
 import { useKitLabels, useKitLocale, useKitWeekStart } from "../i18n/kit-labels.js";
 import { lerpHex, textOn } from "../theme/chart-palette.js";
 import { parseHex } from "../theme/color.js";
@@ -16,6 +17,7 @@ const DAY_NAME_FORMAT = {
   month: "long",
   year: "numeric"
 };
+const MONTH_LABEL_FORMAT = { month: "short" };
 const EMPTY_FILL = "color-mix(in oklab, var(--text-primary) 8%, var(--bg-surface))";
 const weekdayIndex = (d, weekStart) => (d.getDay() - weekStart + 7) % 7;
 function heatmapWindowEnd(from, to, anchor, latestData, today = toLocalIso(/* @__PURE__ */ new Date())) {
@@ -146,7 +148,7 @@ function CalendarHeatmap({
       el.removeEventListener("scroll", onScroll);
     };
   }, [layout, firstIso, lastIso]);
-  const formatDay = (d) => d.toLocaleDateString(locale, DAY_NAME_FORMAT);
+  const formatDay = (d) => dateFormatter(locale, DAY_NAME_FORMAT).format(d);
   const weekdayLabels = useMemo(() => {
     const ref = new Date(2024, 0, 7 + weekStart);
     const week = Array.from({ length: 7 }, (_, i) => {
@@ -261,7 +263,7 @@ function CalendarHeatmap({
       for (let r = 0; r < 7; r++) {
         const d = dayAt(w * 7 + r);
         if (d && (d.getDate() === 1 || w === 0 && r === lead && d.getDate() <= 14)) {
-          return d.toLocaleDateString(locale, { month: "short" });
+          return dateFormatter(locale, MONTH_LABEL_FORMAT).format(d);
         }
       }
       return "";

package/dist/components/calendar-heatmap.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/calendar-heatmap.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithRef, CSSProperties, KeyboardEvent, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { dirOf, horizontalStep } from \"../lib/direction\";\nimport { addMonthsClamped, localeWeekStart, parseIsoDate, toLocalIso } from \"../lib/dates\";\nimport { useKitLabels, useKitLocale, useKitWeekStart, type LabelOverride } from \"../i18n/kit-labels\";\nimport { lerpHex, textOn } from \"../theme/chart-palette\";\nimport { parseHex } from \"../theme/color\";\nimport { Tooltip } from \"./tooltip\";\nimport type { WeekDay } from \"./mini-calendar\";\nimport { DEFAULT_CALENDAR_HEATMAP_LABELS } from \"./calendar-heatmap-labels\";\nimport { formatWithMinus } from \"../lib/minus\";\n\n/**\n * Every string the heatmap speaks — the `calendarHeatmap` namespace of\n * `<UiKitProvider labels>`, overridable per instance through `labels`. Dates and\n * values arrive already formatted (in `locale`, and through `formatValue`), so the\n * functions only arrange them.\n */\nexport interface CalendarHeatmapLabels {\n  /** Accessible name of the grid. */\n  grid: string;\n  /**\n   * One day: its accessible name, and the tooltip unless `tooltip` is given. `date`\n   * is the whole date in `locale` (\"Monday, 14 September 2026\"), `value` the day's\n   * figure through `formatValue`.\n   */\n  day: (date: string, value: string) => string;\n  /** The two ends of the legend's scale. */\n  less: string;\n  more: string;\n  /** `maxDays` cut the window: how many of its earliest days are not drawn. */\n  truncated: (count: number) => string;\n}\n\n// Defined in ./calendar-heatmap-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_CALENDAR_HEATMAP_LABELS };\n\n/** One day's figure. Several entries for one date are added up. */\nexport interface CalendarHeatmapDatum {\n  /** \"YYYY-MM-DD\". */\n  date: string;\n  value: number;\n}\n\n/** What `tooltip` is told about the day under the pointer. */\nexport interface CalendarHeatmapDay {\n  iso: string;\n  date: Date;\n  /** The day's figure; `0` when `data` has no entry for it (see `hasData`). */\n  value: number;\n  hasData: boolean;\n  /** `0` = empty … `levels` = the busiest. */\n  level: number;\n  /** The whole date in `locale`. */\n  formattedDate: string;\n  /** `value` through `formatValue`. */\n  formattedValue: string;\n}\n\n/**\n * `onSelect` is omitted from the `<div>` attributes for the reason `MiniCalendar` gives:\n * the DOM event of that name is a text-selection event, and this one answers with a date.\n */\nexport interface CalendarHeatmapProps extends Omit<ComponentPropsWithRef<\"div\">, \"onSelect\"> {\n  data: readonly CalendarHeatmapDatum[];\n  /** The window, inclusive, as \"YYYY-MM-DD\". */\n  from: string;\n  to: string;\n  /**\n   * `\"weeks\"` (default): the contribution-graph shape — one COLUMN per week, the\n   * weekdays down the side, month names along the top; a year fits in ~53 small\n   * squares and scrolls sideways where it does not. `\"month\"`: a 7-column calendar\n   * with day numbers in large square cells, for a single month on a phone (switch on\n   * `useMediaQuery` and narrow `from`/`to` to the month).\n   */\n  layout?: \"weeks\" | \"month\";\n  /** The day shown as selected (\"YYYY-MM-DD\"). */\n  selected?: string;\n  /** Makes each day a button: a click (or Enter/Space) selects it — a drill-down into\n   *  that day's rows, a day panel. Without it the days are focusable but inert. */\n  onSelect?: (iso: string) => void;\n  /** How a value is written in the tooltip and the day's name. Default: `Intl.NumberFormat`\n   *  in `locale`. Pass a currency formatter for money. */\n  formatValue?: (value: number) => string;\n  /** Tooltip content for a day. Default: `labels.day(date, value)`. */\n  tooltip?: (day: CalendarHeatmapDay) => ReactNode;\n  /**\n   * Tag each tooltip `data-private`, so the host's demo-mode rule blurs it (the\n   * attribute `Tooltip redact` and `StatTile sensitive` carry). ON by default: a heatmap\n   * is almost always the user's own figures, and a missing tag is silent — the grid\n   * looks anonymous and the bubble spells the amount out on hover.\n   */\n  sensitive?: boolean;\n  /** The value that reaches the top of the scale. Default: the largest value ON SCREEN,\n   *  so a peak outside the window does not wash the drawn days out to empty. */\n  max?: number;\n  /** How many non-empty intensity steps. Default 4. */\n  levels?: number;\n  /** The scale's colour, as any CSS colour. Default `var(--brand)`; each step is this\n   *  mixed into `--bg-surface`, so the ramp follows the theme. */\n  color?: string;\n  /**\n   * A CONTINUOUS scale from `colorFrom` (the smallest value) to `colorTo` (the busiest\n   * day), instead of `levels` steps of `color` — keksdose's palette-store ramp,\n   * `seqLow` → `seqHigh`. Both are needed; `color` is then unused. Two `#rrggbb`\n   * colours are interpolated in JS, so the fill is a concrete hex and the day number's\n   * ink (in `\"month\"`) is MEASURED against it; anything else (a `var()`) is mixed with\n   * `color-mix()`. `levels` still sets `data-level` and the legend's swatch count.\n   */\n  colorFrom?: string;\n  colorTo?: string;\n  /**\n   * A fill of the caller's own for a day with a value: handed the value and the\n   * scale's `max`, returns any CSS colour. Wins over `color` and `colorFrom`/`colorTo`.\n   * Also paints the legend, at `max × level / levels`.\n   */\n  fill?: (value: number, max: number) => string;\n  /** The fill of a day with no value (or a value of 0). Default: a wash of the text\n   *  colour over the surface, which reads as a cell on both themes. */\n  emptyColor?: string;\n  /**\n   * Where the window ENDS — the day `maxDays` counts back from, and the last one drawn:\n   *\n   * - `\"to\"` (default): on `to`.\n   * - `\"today\"`: on today.\n   * - `\"latest\"`: on the last day that can carry a figure — today, or a later day that\n   *   actually has a value. A window running into the future (a report's \"all\" preset\n   *   ends a year ahead) then spends its cells on the days a person is looking for,\n   *   not on a year of empty ones.\n   * - a `\"YYYY-MM-DD\"`: on that day.\n   *\n   * Always kept inside `from`…`to`.\n   */\n  anchor?: \"to\" | \"today\" | \"latest\" | (string & {});\n  /**\n   * The most days to draw. A longer window keeps its LATEST `maxDays` and says how many\n   * it left out (`labels.truncated`) rather than silently ending. Default: no cap.\n   */\n  maxDays?: number;\n  /** Draw the Less … More legend. Default `true`. */\n  legend?: boolean;\n  /** BCP 47 tag for the dates, month and weekday names and numbers. */\n  locale?: string;\n  /** `0` = Sunday … `6` = Saturday. Default: the provider's, else the locale's. */\n  weekStartsOn?: WeekDay;\n  labels?: LabelOverride<CalendarHeatmapLabels>;\n  className?: string;\n}\n\nconst DAY_NAME_FORMAT: Intl.DateTimeFormatOptions = {\n  weekday: \"long\",\n  day: \"numeric\",\n  month: \"long\",\n  year: \"numeric\",\n};\n\n/** The empty day: a wash of the text colour, like `--bg-hover`, so it reads as a cell\n *  on both themes without claiming any value. */\nconst EMPTY_FILL = \"color-mix(in oklab, var(--text-primary) 8%, var(--bg-surface))\";\n\nconst weekdayIndex = (d: Date, weekStart: WeekDay) => (d.getDay() - weekStart + 7) % 7;\n\n/** Where the window ends for an {@link CalendarHeatmapProps.anchor}, kept in `[from, to]`.\n *  `latestData` is the latest ISO date carrying a value, or `\"\"`. */\nexport function heatmapWindowEnd(\n  from: string,\n  to: string,\n  anchor: string,\n  latestData: string,\n  today: string = toLocalIso(new Date()),\n): string {\n  let end: string;\n  if (anchor === \"today\") end = today;\n  else if (anchor === \"latest\") end = latestData > today ? latestData : today;\n  else if (anchor === \"to\" || !parseIsoDate(anchor)) end = to;\n  else end = anchor;\n  // ISO dates sort as strings, so the clamp is plain comparison.\n  if (end > to) end = to;\n  if (end < from) end = from;\n  return end;\n}\n\n/** The step a value falls on: 0 for nothing, else 1…levels by its share of `max`. */\nexport function heatmapLevel(value: number, max: number, levels: number): number {\n  if (!(value > 0) || !(max > 0) || levels < 1) return 0;\n  return Math.min(levels, Math.max(1, Math.ceil((value / max) * levels)));\n}\n\n/** How much of `color` a step mixes into the surface: 20% for the first step, 100% for\n *  the last — the floor keeps the smallest value visibly apart from an empty day. */\nfunction levelPercent(level: number, levels: number): number {\n  if (levels <= 1) return 100;\n  return Math.round(20 + (80 * (level - 1)) / (levels - 1));\n}\n\nfunction levelFill(level: number, levels: number, color: string): string {\n  if (level === 0) return EMPTY_FILL;\n  return `color-mix(in oklab, ${color} ${levelPercent(level, levels)}%, var(--bg-surface))`;\n}\n\n/**\n * Days as a grid of shaded squares — how much happened on each, at a glance\n * (a contribution graph, a spending calendar).\n *\n * **Every day is a cell you can reach.** The grid is a `role=\"grid\"` with ONE tab\n * stop (the roving tabindex, as in `MiniCalendar`); the arrows move by the grid's own\n * geometry — in `\"weeks\"` ↑/↓ are the previous/next day and ←/→ a week, in `\"month\"`\n * the other way round, mirrored in RTL — PageUp/PageDown move a month and Home/End go\n * to the window's first/last day. Each cell is named with its whole date AND its value,\n * because the colour is not something a screen reader can say, and carries\n * `data-day=\"YYYY-MM-DD\"` as its identity for tests and for the host. Note that in\n * `\"weeks\"` the cells are in DOM order by WEEKDAY ROW (all Mondays, then all\n * Tuesdays…), not by date — query by `data-day`, not by position.\n *\n * The tooltip is portalled (a year of squares always sits in a sideways scroller) and\n * `data-private` unless `sensitive={false}`. Cell size in `\"weeks\"` is the CSS variable\n * `--heatmap-cell` (default `0.75rem`): `style={{ \"--heatmap-cell\": \"1rem\" }}`.\n */\nexport function CalendarHeatmap({\n  data,\n  from,\n  to,\n  layout = \"weeks\",\n  selected,\n  onSelect,\n  formatValue: formatValueProp,\n  tooltip,\n  sensitive = true,\n  max: maxProp,\n  levels = 4,\n  color = \"var(--brand)\",\n  colorFrom,\n  colorTo,\n  fill: fillProp,\n  emptyColor,\n  anchor = \"to\",\n  maxDays,\n  legend = true,\n  locale: localeProp,\n  weekStartsOn,\n  labels: labelsProp,\n  className,\n  \"aria-label\": ariaLabel,\n  ...rest\n}: CalendarHeatmapProps) {\n  const labels = useKitLabels(\"calendarHeatmap\", DEFAULT_CALENDAR_HEATMAP_LABELS, labelsProp);\n  const locale = useKitLocale(localeProp);\n  const providerWeekStart = useKitWeekStart();\n  const weekStart: WeekDay = weekStartsOn ?? providerWeekStart ?? localeWeekStart(locale);\n  const numberFormat = useMemo(() => new Intl.NumberFormat(locale), [locale]);\n  const formatValue = formatValueProp ?? ((v: number) => formatWithMinus(numberFormat, v));\n\n  const values = useMemo(() => {\n    const m = new Map<string, number>();\n    for (const p of data) m.set(p.date, (m.get(p.date) ?? 0) + p.value);\n    return m;\n  }, [data]);\n\n  // The window, trimmed from the FRONT: the days a person looks for are the recent\n  // ones, and a cap that kept the oldest would end the calendar before today.\n  const latestData = useMemo(() => {\n    let latest = \"\";\n    for (const [iso, v] of values) if (v !== 0 && iso > latest) latest = iso;\n    return latest;\n  }, [values]);\n  const windowEnd = heatmapWindowEnd(from, to, anchor, latestData);\n\n  const { days, dropped } = useMemo(() => {\n    const start = parseIsoDate(from);\n    const end = parseIsoDate(windowEnd);\n    const list: Date[] = [];\n    if (!start || !end || end < start) return { days: list, dropped: 0 };\n    const cursor = new Date(end);\n    const cap = maxDays && maxDays > 0 ? maxDays : Infinity;\n    while (cursor >= start && list.length < cap) {\n      list.unshift(new Date(cursor));\n      cursor.setDate(cursor.getDate() - 1);\n    }\n    const first = list[0];\n    const trimmed = first ? Math.round((first.getTime() - start.getTime()) / 86_400_000) : 0;\n    return { days: list, dropped: Math.max(0, trimmed) };\n  }, [from, windowEnd, maxDays]);\n\n  const firstIso = days.length ? toLocalIso(days[0]) : \"\";\n  const lastIso = days.length ? toLocalIso(days[days.length - 1]) : \"\";\n\n  const max = useMemo(() => {\n    if (maxProp !== undefined) return maxProp;\n    let m = 0;\n    for (const d of days) m = Math.max(m, values.get(toLocalIso(d)) ?? 0);\n    return m;\n  }, [maxProp, days, values]);\n\n  const clampIso = (iso: string) => (iso < firstIso ? firstIso : iso > lastIso ? lastIso : iso);\n\n  // The roving tab stop: the selected day, else the latest one.\n  const [activeState, setActiveIso] = useState(() => selected || lastIso);\n  const [lastSelected, setLastSelected] = useState(selected);\n  if (lastSelected !== selected) {\n    setLastSelected(selected);\n    if (selected) setActiveIso(selected);\n  }\n  const activeIso = days.length ? clampIso(activeState || lastIso) : \"\";\n\n  const gridRef = useRef<HTMLDivElement>(null);\n  const scrollerRef = useRef<HTMLDivElement>(null);\n  const pendingFocus = useRef<string | null>(null);\n  useEffect(() => {\n    const iso = pendingFocus.current;\n    if (!iso) return;\n    pendingFocus.current = null;\n    gridRef.current?.querySelector<HTMLElement>(`[data-day=\"${iso}\"]`)?.focus();\n  });\n\n  // Open the sideways scroller on the latest weeks, not the oldest. In RTL the end is\n  // on the left, where browsers count scrollLeft down from 0.\n  //\n  // And KEEP it there while the box changes size — a sidebar or a contents rail that\n  // appears after mount narrows the scroller, which leaves scrollLeft where it was and\n  // so shows older weeks than it opened on. The pin holds only while the view sits at\n  // the end: a user who scrolls back through the year unpins it, and a resize then\n  // leaves their position alone. (Scrolling back to the end pins it again.)\n  useLayoutEffect(() => {\n    const el = scrollerRef.current;\n    if (!el || layout !== \"weeks\") return;\n    const toEnd = () => {\n      el.scrollLeft = dirOf(el) === \"rtl\" ? -el.scrollWidth : el.scrollWidth;\n    };\n    toEnd();\n    if (typeof ResizeObserver === \"undefined\") return;\n    // |scrollLeft| covers both directions: 0 → max in LTR, 0 → -max in RTL.\n    let pinned = true;\n    const onScroll = () => {\n      pinned = Math.abs(el.scrollLeft) >= el.scrollWidth - el.clientWidth - 1;\n    };\n    const ro = new ResizeObserver(() => {\n      if (pinned) toEnd();\n    });\n    el.addEventListener(\"scroll\", onScroll, { passive: true });\n    ro.observe(el);\n    return () => {\n      ro.disconnect();\n      el.removeEventListener(\"scroll\", onScroll);\n    };\n  }, [layout, firstIso, lastIso]);\n\n  const formatDay = (d: Date) => d.toLocaleDateString(locale, DAY_NAME_FORMAT);\n\n  const weekdayLabels = useMemo(() => {\n    const ref = new Date(2024, 0, 7 + weekStart); // 7 January 2024 was a Sunday\n    const week = Array.from({ length: 7 }, (_, i) => {\n      const d = new Date(ref);\n      d.setDate(ref.getDate() + i);\n      return d;\n    });\n    const name = (d: Date, weekday: \"short\" | \"narrow\" | \"long\") => d.toLocaleDateString(locale, { weekday });\n    // The label column is 2rem at 10px type, room for about four characters. Most\n    // locales' \"short\" is three or four (\"Thu\", \"jeu.\", \"czw.\"), but some have no\n    // abbreviation at all — Arabic's short Thursday IS \"الخميس\", which overran the box\n    // and was cut. Such a locale takes the \"narrow\" form (\"خ\") for ALL seven, so the\n    // column never mixes two forms; the full name is on the aria-label either way.\n    const tooLong = week.some((d) => [...name(d, \"short\")].length > 4);\n    return week.map((d) => ({ short: name(d, tooLong ? \"narrow\" : \"short\"), long: name(d, \"long\") }));\n  }, [locale, weekStart]);\n\n  const lead = days.length ? weekdayIndex(days[0], weekStart) : 0;\n  const weekCount = Math.ceil((lead + days.length) / 7);\n  /** The day at position `i` of the week-aligned sequence (blanks before the first). */\n  const dayAt = (i: number): Date | null => (i >= lead && i - lead < days.length ? days[i - lead] : null);\n\n  const move = (e: KeyboardEvent<HTMLElement>) => {\n    const current = parseIsoDate(activeIso);\n    if (!current) return;\n    const next = new Date(current);\n    const step = horizontalStep(e.key, e.currentTarget);\n    // In \"weeks\" a row is a weekday, so sideways is a week and up/down is a day.\n    const across = layout === \"weeks\" ? 7 : 1;\n    const down = layout === \"weeks\" ? 1 : 7;\n    switch (step ? \"horizontal\" : e.key) {\n      case \"horizontal\":\n        next.setDate(next.getDate() + step * across);\n        break;\n      case \"ArrowUp\":\n        next.setDate(next.getDate() - down);\n        break;\n      case \"ArrowDown\":\n        next.setDate(next.getDate() + down);\n        break;\n      case \"PageUp\":\n        next.setTime(addMonthsClamped(next, -1).getTime());\n        break;\n      case \"PageDown\":\n        next.setTime(addMonthsClamped(next, 1).getTime());\n        break;\n      case \"Home\":\n        next.setTime(days[0].getTime());\n        break;\n      case \"End\":\n        next.setTime(days[days.length - 1].getTime());\n        break;\n      default:\n        return;\n    }\n    e.preventDefault();\n    const iso = clampIso(toLocalIso(next));\n    if (iso === activeIso) return;\n    pendingFocus.current = iso;\n    setActiveIso(iso);\n  };\n\n  const legendLevels = Array.from({ length: levels + 1 }, (_, l) => l);\n  const empty = emptyColor ?? EMPTY_FILL;\n  const continuous = colorFrom !== undefined && colorTo !== undefined;\n  const hexRamp = continuous && parseHex(colorFrom) != null && parseHex(colorTo) != null;\n\n  /** A day's fill, and the ink its number is set in (`\"month\"`). */\n  const paint = (value: number, level: number): { fill: string; ink: string } => {\n    if (level === 0) return { fill: empty, ink: \"var(--text-primary)\" };\n    if (fillProp || continuous) {\n      const t = max > 0 ? Math.min(1, Math.max(0, value / max)) : 1;\n      const fill = fillProp\n        ? fillProp(value, max)\n        : hexRamp\n          ? lerpHex(colorFrom!, colorTo!, t)\n          : `color-mix(in oklab, ${colorTo} ${Math.round(t * 100)}%, ${colorFrom})`;\n      // Measured where the fill is a colour; a mix of references cannot be measured,\n      // and the page's own text colour is the safe answer there.\n      const measured = textOn(fill);\n      return { fill, ink: measured === \"currentColor\" ? \"var(--text-primary)\" : measured };\n    }\n    // Light text once the fill is the stronger half of the mix — `--bg-surface` is the\n    // colour the scale is mixed INTO, so it is the one that contrasts with its far end\n    // on either theme.\n    const strong = levelPercent(level, levels) >= 45;\n    return {\n      fill: levelFill(level, levels, color),\n      ink: strong ? \"var(--bg-surface)\" : \"var(--text-primary)\",\n    };\n  };\n  // The legend's swatches: a value that lands on each step (the top one on `max`).\n  const legendFill = (l: number) => paint(((max > 0 ? max : 1) * l) / levels, l).fill;\n\n  const cell = (d: Date, wrapClass: string, cellClass: string, withNumber: boolean) => {\n    const iso = toLocalIso(d);\n    const raw = values.get(iso);\n    const value = raw ?? 0;\n    const level = heatmapLevel(value, max, levels);\n    const { fill, ink } = paint(value, level);\n    const formattedDate = formatDay(d);\n    const formattedValue = formatValue(value);\n    const name = labels.day(formattedDate, formattedValue);\n    const label = tooltip\n      ? tooltip({ iso, date: d, value, hasData: raw !== undefined, level, formattedDate, formattedValue })\n      : name;\n    const isSelected = selected === iso;\n    const shared = {\n      role: \"gridcell\",\n      \"data-day\": iso,\n      \"data-level\": level,\n      tabIndex: iso === activeIso ? 0 : -1,\n      \"aria-label\": name,\n      \"aria-selected\": onSelect ? isSelected : undefined,\n      onKeyDown: move,\n      onFocus: () => {\n        if (iso !== activeIso) setActiveIso(iso);\n      },\n      style: { background: fill, color: ink },\n      className: cn(\n        cellClass,\n        isSelected && \"ring-2 ring-[var(--text-primary)]\",\n        onSelect && \"cursor-pointer hover:ring-1 hover:ring-brand\",\n      ),\n    } as const;\n    const inner = withNumber ? (\n      <span aria-hidden className=\"text-caption leading-none tabular-nums\">\n        {numberFormat.format(d.getDate())}\n      </span>\n    ) : null;\n    return (\n      <Tooltip key={iso} label={label} portal redact={sensitive} role=\"none\" className={wrapClass}>\n        {onSelect ? (\n          <button type=\"button\" {...shared} onClick={() => onSelect(iso)}>\n            {inner}\n          </button>\n        ) : (\n          <div {...shared}>{inner}</div>\n        )}\n      </Tooltip>\n    );\n  };\n\n  const gridName = ariaLabel ?? labels.grid;\n  let body: ReactNode;\n  if (layout === \"weeks\") {\n    const columns = {\n      gridTemplateColumns: `var(--heatmap-label, 2rem) repeat(${weekCount}, var(--heatmap-cell, 0.75rem))`,\n    } as CSSProperties;\n    const cellSize = \"size-[var(--heatmap-cell,0.75rem)]\";\n    // A month's name over the first column that holds its 1st — or over the first\n    // column, when the window opens far enough before the next month for it to fit.\n    const monthLabels = Array.from({ length: weekCount }, (_, w) => {\n      for (let r = 0; r < 7; r++) {\n        const d = dayAt(w * 7 + r);\n        if (d && (d.getDate() === 1 || (w === 0 && r === lead && d.getDate() <= 14))) {\n          return d.toLocaleDateString(locale, { month: \"short\" });\n        }\n      }\n      return \"\";\n    });\n    body = (\n      <div ref={scrollerRef} className=\"overflow-x-auto pb-1\">\n        <div ref={gridRef} role=\"grid\" aria-label={gridName} className=\"inline-grid gap-0.5\">\n          {/* Decoration: every cell's name already carries its month. */}\n          <div aria-hidden className=\"grid gap-0.5 text-micro leading-3 text-muted\" style={columns}>\n            <span />\n            {monthLabels.map((m, w) => (\n              <span key={w} className=\"overflow-visible whitespace-nowrap\">\n                {m}\n              </span>\n            ))}\n          </div>\n          {Array.from({ length: 7 }, (_, r) => (\n            <div key={r} role=\"row\" className=\"grid gap-0.5\" style={columns}>\n              <div\n                role=\"rowheader\"\n                aria-label={weekdayLabels[r].long}\n                className=\"overflow-hidden pe-1 text-micro leading-3 text-muted\"\n              >\n                {/* Every other weekday, as a contribution graph does: seven labels\n                    at this size are a smear. The name is there for all seven. */}\n                {r % 2 === 1 ? weekdayLabels[r].short : \"\"}\n              </div>\n              {Array.from({ length: weekCount }, (_, w) => {\n                const d = dayAt(w * 7 + r);\n                return d ? (\n                  cell(d, cellSize, cn(cellSize, \"block rounded-sm\"), false)\n                ) : (\n                  <div key={`pad-${w}`} role=\"gridcell\" className={cellSize} />\n                );\n              })}\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  } else {\n    const rows = Array.from({ length: weekCount }, (_, w) => w);\n    body = (\n      <div ref={gridRef} role=\"grid\" aria-label={gridName} className=\"grid gap-1\">\n        <div role=\"row\" className=\"grid grid-cols-7 gap-1\">\n          {weekdayLabels.map((w, i) => (\n            <div\n              key={i}\n              role=\"columnheader\"\n              aria-label={w.long}\n              className=\"pb-0.5 text-center text-micro uppercase tracking-wide text-muted\"\n            >\n              {w.short}\n            </div>\n          ))}\n        </div>\n        {rows.map((w) => (\n          <div key={w} role=\"row\" className=\"grid grid-cols-7 gap-1\">\n            {Array.from({ length: 7 }, (_, c) => {\n              const d = dayAt(w * 7 + c);\n              return d ? (\n                cell(d, \"aspect-square w-full\", \"flex h-full w-full items-center justify-center rounded\", true)\n              ) : (\n                <div key={`pad-${c}`} role=\"gridcell\" className=\"aspect-square\" />\n              );\n            })}\n          </div>\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <div {...rest} className={cn(\"min-w-0\", className)}>\n      {dropped > 0 && <div className=\"mb-2 text-xs text-muted\">{labels.truncated(dropped)}</div>}\n      {body}\n      {legend && (\n        <div aria-hidden className=\"mt-2 flex items-center justify-end gap-1 text-micro text-muted\">\n          <span className=\"me-0.5\">{labels.less}</span>\n          {legendLevels.map((l) => (\n            <span key={l} data-legend-level={l} className=\"size-2.5 rounded-sm\" style={{ background: legendFill(l) }} />\n          ))}\n          <span className=\"ms-0.5\">{labels.more}</span>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":["_"]}
+{"version":3,"sources":["../../src/components/calendar-heatmap.tsx"],"sourcesContent":["import { useEffect, useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithRef, CSSProperties, KeyboardEvent, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { dirOf, horizontalStep } from \"../lib/direction\";\nimport { addMonthsClamped, localeWeekStart, parseIsoDate, toLocalIso } from \"../lib/dates\";\nimport { dateFormatter } from \"../lib/intl-cache\";\nimport { useKitLabels, useKitLocale, useKitWeekStart, type LabelOverride } from \"../i18n/kit-labels\";\nimport { lerpHex, textOn } from \"../theme/chart-palette\";\nimport { parseHex } from \"../theme/color\";\nimport { Tooltip } from \"./tooltip\";\nimport type { WeekDay } from \"./mini-calendar\";\nimport { DEFAULT_CALENDAR_HEATMAP_LABELS } from \"./calendar-heatmap-labels\";\nimport { formatWithMinus } from \"../lib/minus\";\n\n/**\n * Every string the heatmap speaks — the `calendarHeatmap` namespace of\n * `<UiKitProvider labels>`, overridable per instance through `labels`. Dates and\n * values arrive already formatted (in `locale`, and through `formatValue`), so the\n * functions only arrange them.\n */\nexport interface CalendarHeatmapLabels {\n  /** Accessible name of the grid. */\n  grid: string;\n  /**\n   * One day: its accessible name, and the tooltip unless `tooltip` is given. `date`\n   * is the whole date in `locale` (\"Monday, 14 September 2026\"), `value` the day's\n   * figure through `formatValue`.\n   */\n  day: (date: string, value: string) => string;\n  /** The two ends of the legend's scale. */\n  less: string;\n  more: string;\n  /** `maxDays` cut the window: how many of its earliest days are not drawn. */\n  truncated: (count: number) => string;\n}\n\n// Defined in ./calendar-heatmap-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_CALENDAR_HEATMAP_LABELS };\n\n/** One day's figure. Several entries for one date are added up. */\nexport interface CalendarHeatmapDatum {\n  /** \"YYYY-MM-DD\". */\n  date: string;\n  value: number;\n}\n\n/** What `tooltip` is told about the day under the pointer. */\nexport interface CalendarHeatmapDay {\n  iso: string;\n  date: Date;\n  /** The day's figure; `0` when `data` has no entry for it (see `hasData`). */\n  value: number;\n  hasData: boolean;\n  /** `0` = empty … `levels` = the busiest. */\n  level: number;\n  /** The whole date in `locale`. */\n  formattedDate: string;\n  /** `value` through `formatValue`. */\n  formattedValue: string;\n}\n\n/**\n * `onSelect` is omitted from the `<div>` attributes for the reason `MiniCalendar` gives:\n * the DOM event of that name is a text-selection event, and this one answers with a date.\n */\nexport interface CalendarHeatmapProps extends Omit<ComponentPropsWithRef<\"div\">, \"onSelect\"> {\n  data: readonly CalendarHeatmapDatum[];\n  /** The window, inclusive, as \"YYYY-MM-DD\". */\n  from: string;\n  to: string;\n  /**\n   * `\"weeks\"` (default): the contribution-graph shape — one COLUMN per week, the\n   * weekdays down the side, month names along the top; a year fits in ~53 small\n   * squares and scrolls sideways where it does not. `\"month\"`: a 7-column calendar\n   * with day numbers in large square cells, for a single month on a phone (switch on\n   * `useMediaQuery` and narrow `from`/`to` to the month).\n   */\n  layout?: \"weeks\" | \"month\";\n  /** The day shown as selected (\"YYYY-MM-DD\"). */\n  selected?: string;\n  /** Makes each day a button: a click (or Enter/Space) selects it — a drill-down into\n   *  that day's rows, a day panel. Without it the days are focusable but inert. */\n  onSelect?: (iso: string) => void;\n  /** How a value is written in the tooltip and the day's name. Default: `Intl.NumberFormat`\n   *  in `locale`. Pass a currency formatter for money. */\n  formatValue?: (value: number) => string;\n  /** Tooltip content for a day. Default: `labels.day(date, value)`. */\n  tooltip?: (day: CalendarHeatmapDay) => ReactNode;\n  /**\n   * Tag each tooltip `data-private`, so the host's demo-mode rule blurs it (the\n   * attribute `Tooltip redact` and `StatTile sensitive` carry). ON by default: a heatmap\n   * is almost always the user's own figures, and a missing tag is silent — the grid\n   * looks anonymous and the bubble spells the amount out on hover.\n   */\n  sensitive?: boolean;\n  /** The value that reaches the top of the scale. Default: the largest value ON SCREEN,\n   *  so a peak outside the window does not wash the drawn days out to empty. */\n  max?: number;\n  /** How many non-empty intensity steps. Default 4. */\n  levels?: number;\n  /** The scale's colour, as any CSS colour. Default `var(--brand)`; each step is this\n   *  mixed into `--bg-surface`, so the ramp follows the theme. */\n  color?: string;\n  /**\n   * A CONTINUOUS scale from `colorFrom` (the smallest value) to `colorTo` (the busiest\n   * day), instead of `levels` steps of `color` — keksdose's palette-store ramp,\n   * `seqLow` → `seqHigh`. Both are needed; `color` is then unused. Two `#rrggbb`\n   * colours are interpolated in JS, so the fill is a concrete hex and the day number's\n   * ink (in `\"month\"`) is MEASURED against it; anything else (a `var()`) is mixed with\n   * `color-mix()`. `levels` still sets `data-level` and the legend's swatch count.\n   */\n  colorFrom?: string;\n  colorTo?: string;\n  /**\n   * A fill of the caller's own for a day with a value: handed the value and the\n   * scale's `max`, returns any CSS colour. Wins over `color` and `colorFrom`/`colorTo`.\n   * Also paints the legend, at `max × level / levels`.\n   */\n  fill?: (value: number, max: number) => string;\n  /** The fill of a day with no value (or a value of 0). Default: a wash of the text\n   *  colour over the surface, which reads as a cell on both themes. */\n  emptyColor?: string;\n  /**\n   * Where the window ENDS — the day `maxDays` counts back from, and the last one drawn:\n   *\n   * - `\"to\"` (default): on `to`.\n   * - `\"today\"`: on today.\n   * - `\"latest\"`: on the last day that can carry a figure — today, or a later day that\n   *   actually has a value. A window running into the future (a report's \"all\" preset\n   *   ends a year ahead) then spends its cells on the days a person is looking for,\n   *   not on a year of empty ones.\n   * - a `\"YYYY-MM-DD\"`: on that day.\n   *\n   * Always kept inside `from`…`to`.\n   */\n  anchor?: \"to\" | \"today\" | \"latest\" | (string & {});\n  /**\n   * The most days to draw. A longer window keeps its LATEST `maxDays` and says how many\n   * it left out (`labels.truncated`) rather than silently ending. Default: no cap.\n   */\n  maxDays?: number;\n  /** Draw the Less … More legend. Default `true`. */\n  legend?: boolean;\n  /** BCP 47 tag for the dates, month and weekday names and numbers. */\n  locale?: string;\n  /** `0` = Sunday … `6` = Saturday. Default: the provider's, else the locale's. */\n  weekStartsOn?: WeekDay;\n  labels?: LabelOverride<CalendarHeatmapLabels>;\n  className?: string;\n}\n\nconst DAY_NAME_FORMAT: Intl.DateTimeFormatOptions = {\n  weekday: \"long\",\n  day: \"numeric\",\n  month: \"long\",\n  year: \"numeric\",\n};\n/** A month's name over its first column (\"Sep\"). */\nconst MONTH_LABEL_FORMAT: Intl.DateTimeFormatOptions = { month: \"short\" };\n\n/** The empty day: a wash of the text colour, like `--bg-hover`, so it reads as a cell\n *  on both themes without claiming any value. */\nconst EMPTY_FILL = \"color-mix(in oklab, var(--text-primary) 8%, var(--bg-surface))\";\n\nconst weekdayIndex = (d: Date, weekStart: WeekDay) => (d.getDay() - weekStart + 7) % 7;\n\n/** Where the window ends for an {@link CalendarHeatmapProps.anchor}, kept in `[from, to]`.\n *  `latestData` is the latest ISO date carrying a value, or `\"\"`. */\nexport function heatmapWindowEnd(\n  from: string,\n  to: string,\n  anchor: string,\n  latestData: string,\n  today: string = toLocalIso(new Date()),\n): string {\n  let end: string;\n  if (anchor === \"today\") end = today;\n  else if (anchor === \"latest\") end = latestData > today ? latestData : today;\n  else if (anchor === \"to\" || !parseIsoDate(anchor)) end = to;\n  else end = anchor;\n  // ISO dates sort as strings, so the clamp is plain comparison.\n  if (end > to) end = to;\n  if (end < from) end = from;\n  return end;\n}\n\n/** The step a value falls on: 0 for nothing, else 1…levels by its share of `max`. */\nexport function heatmapLevel(value: number, max: number, levels: number): number {\n  if (!(value > 0) || !(max > 0) || levels < 1) return 0;\n  return Math.min(levels, Math.max(1, Math.ceil((value / max) * levels)));\n}\n\n/** How much of `color` a step mixes into the surface: 20% for the first step, 100% for\n *  the last — the floor keeps the smallest value visibly apart from an empty day. */\nfunction levelPercent(level: number, levels: number): number {\n  if (levels <= 1) return 100;\n  return Math.round(20 + (80 * (level - 1)) / (levels - 1));\n}\n\nfunction levelFill(level: number, levels: number, color: string): string {\n  if (level === 0) return EMPTY_FILL;\n  return `color-mix(in oklab, ${color} ${levelPercent(level, levels)}%, var(--bg-surface))`;\n}\n\n/**\n * Days as a grid of shaded squares — how much happened on each, at a glance\n * (a contribution graph, a spending calendar).\n *\n * **Every day is a cell you can reach.** The grid is a `role=\"grid\"` with ONE tab\n * stop (the roving tabindex, as in `MiniCalendar`); the arrows move by the grid's own\n * geometry — in `\"weeks\"` ↑/↓ are the previous/next day and ←/→ a week, in `\"month\"`\n * the other way round, mirrored in RTL — PageUp/PageDown move a month and Home/End go\n * to the window's first/last day. Each cell is named with its whole date AND its value,\n * because the colour is not something a screen reader can say, and carries\n * `data-day=\"YYYY-MM-DD\"` as its identity for tests and for the host. Note that in\n * `\"weeks\"` the cells are in DOM order by WEEKDAY ROW (all Mondays, then all\n * Tuesdays…), not by date — query by `data-day`, not by position.\n *\n * The tooltip is portalled (a year of squares always sits in a sideways scroller) and\n * `data-private` unless `sensitive={false}`. Cell size in `\"weeks\"` is the CSS variable\n * `--heatmap-cell` (default `0.75rem`): `style={{ \"--heatmap-cell\": \"1rem\" }}`.\n */\nexport function CalendarHeatmap({\n  data,\n  from,\n  to,\n  layout = \"weeks\",\n  selected,\n  onSelect,\n  formatValue: formatValueProp,\n  tooltip,\n  sensitive = true,\n  max: maxProp,\n  levels = 4,\n  color = \"var(--brand)\",\n  colorFrom,\n  colorTo,\n  fill: fillProp,\n  emptyColor,\n  anchor = \"to\",\n  maxDays,\n  legend = true,\n  locale: localeProp,\n  weekStartsOn,\n  labels: labelsProp,\n  className,\n  \"aria-label\": ariaLabel,\n  ...rest\n}: CalendarHeatmapProps) {\n  const labels = useKitLabels(\"calendarHeatmap\", DEFAULT_CALENDAR_HEATMAP_LABELS, labelsProp);\n  const locale = useKitLocale(localeProp);\n  const providerWeekStart = useKitWeekStart();\n  const weekStart: WeekDay = weekStartsOn ?? providerWeekStart ?? localeWeekStart(locale);\n  const numberFormat = useMemo(() => new Intl.NumberFormat(locale), [locale]);\n  const formatValue = formatValueProp ?? ((v: number) => formatWithMinus(numberFormat, v));\n\n  const values = useMemo(() => {\n    const m = new Map<string, number>();\n    for (const p of data) m.set(p.date, (m.get(p.date) ?? 0) + p.value);\n    return m;\n  }, [data]);\n\n  // The window, trimmed from the FRONT: the days a person looks for are the recent\n  // ones, and a cap that kept the oldest would end the calendar before today.\n  const latestData = useMemo(() => {\n    let latest = \"\";\n    for (const [iso, v] of values) if (v !== 0 && iso > latest) latest = iso;\n    return latest;\n  }, [values]);\n  const windowEnd = heatmapWindowEnd(from, to, anchor, latestData);\n\n  const { days, dropped } = useMemo(() => {\n    const start = parseIsoDate(from);\n    const end = parseIsoDate(windowEnd);\n    const list: Date[] = [];\n    if (!start || !end || end < start) return { days: list, dropped: 0 };\n    const cursor = new Date(end);\n    const cap = maxDays && maxDays > 0 ? maxDays : Infinity;\n    while (cursor >= start && list.length < cap) {\n      list.unshift(new Date(cursor));\n      cursor.setDate(cursor.getDate() - 1);\n    }\n    const first = list[0];\n    const trimmed = first ? Math.round((first.getTime() - start.getTime()) / 86_400_000) : 0;\n    return { days: list, dropped: Math.max(0, trimmed) };\n  }, [from, windowEnd, maxDays]);\n\n  const firstIso = days.length ? toLocalIso(days[0]) : \"\";\n  const lastIso = days.length ? toLocalIso(days[days.length - 1]) : \"\";\n\n  const max = useMemo(() => {\n    if (maxProp !== undefined) return maxProp;\n    let m = 0;\n    for (const d of days) m = Math.max(m, values.get(toLocalIso(d)) ?? 0);\n    return m;\n  }, [maxProp, days, values]);\n\n  const clampIso = (iso: string) => (iso < firstIso ? firstIso : iso > lastIso ? lastIso : iso);\n\n  // The roving tab stop: the selected day, else the latest one.\n  const [activeState, setActiveIso] = useState(() => selected || lastIso);\n  const [lastSelected, setLastSelected] = useState(selected);\n  if (lastSelected !== selected) {\n    setLastSelected(selected);\n    if (selected) setActiveIso(selected);\n  }\n  const activeIso = days.length ? clampIso(activeState || lastIso) : \"\";\n\n  const gridRef = useRef<HTMLDivElement>(null);\n  const scrollerRef = useRef<HTMLDivElement>(null);\n  const pendingFocus = useRef<string | null>(null);\n  useEffect(() => {\n    const iso = pendingFocus.current;\n    if (!iso) return;\n    pendingFocus.current = null;\n    gridRef.current?.querySelector<HTMLElement>(`[data-day=\"${iso}\"]`)?.focus();\n  });\n\n  // Open the sideways scroller on the latest weeks, not the oldest. In RTL the end is\n  // on the left, where browsers count scrollLeft down from 0.\n  //\n  // And KEEP it there while the box changes size — a sidebar or a contents rail that\n  // appears after mount narrows the scroller, which leaves scrollLeft where it was and\n  // so shows older weeks than it opened on. The pin holds only while the view sits at\n  // the end: a user who scrolls back through the year unpins it, and a resize then\n  // leaves their position alone. (Scrolling back to the end pins it again.)\n  useLayoutEffect(() => {\n    const el = scrollerRef.current;\n    if (!el || layout !== \"weeks\") return;\n    const toEnd = () => {\n      el.scrollLeft = dirOf(el) === \"rtl\" ? -el.scrollWidth : el.scrollWidth;\n    };\n    toEnd();\n    if (typeof ResizeObserver === \"undefined\") return;\n    // |scrollLeft| covers both directions: 0 → max in LTR, 0 → -max in RTL.\n    let pinned = true;\n    const onScroll = () => {\n      pinned = Math.abs(el.scrollLeft) >= el.scrollWidth - el.clientWidth - 1;\n    };\n    const ro = new ResizeObserver(() => {\n      if (pinned) toEnd();\n    });\n    el.addEventListener(\"scroll\", onScroll, { passive: true });\n    ro.observe(el);\n    return () => {\n      ro.disconnect();\n      el.removeEventListener(\"scroll\", onScroll);\n    };\n  }, [layout, firstIso, lastIso]);\n\n  // Every day cell names its date, so through the kit's formatter cache, as the month\n  // labels are: `toLocaleDateString` built one per cell and render, 365 for a year's grid\n  // (keksdose audit follow-up, 2026-11-01).\n  const formatDay = (d: Date) => dateFormatter(locale, DAY_NAME_FORMAT).format(d);\n\n  const weekdayLabels = useMemo(() => {\n    const ref = new Date(2024, 0, 7 + weekStart); // 7 January 2024 was a Sunday\n    const week = Array.from({ length: 7 }, (_, i) => {\n      const d = new Date(ref);\n      d.setDate(ref.getDate() + i);\n      return d;\n    });\n    const name = (d: Date, weekday: \"short\" | \"narrow\" | \"long\") => d.toLocaleDateString(locale, { weekday });\n    // The label column is 2rem at 10px type, room for about four characters. Most\n    // locales' \"short\" is three or four (\"Thu\", \"jeu.\", \"czw.\"), but some have no\n    // abbreviation at all — Arabic's short Thursday IS \"الخميس\", which overran the box\n    // and was cut. Such a locale takes the \"narrow\" form (\"خ\") for ALL seven, so the\n    // column never mixes two forms; the full name is on the aria-label either way.\n    const tooLong = week.some((d) => [...name(d, \"short\")].length > 4);\n    return week.map((d) => ({ short: name(d, tooLong ? \"narrow\" : \"short\"), long: name(d, \"long\") }));\n  }, [locale, weekStart]);\n\n  const lead = days.length ? weekdayIndex(days[0], weekStart) : 0;\n  const weekCount = Math.ceil((lead + days.length) / 7);\n  /** The day at position `i` of the week-aligned sequence (blanks before the first). */\n  const dayAt = (i: number): Date | null => (i >= lead && i - lead < days.length ? days[i - lead] : null);\n\n  const move = (e: KeyboardEvent<HTMLElement>) => {\n    const current = parseIsoDate(activeIso);\n    if (!current) return;\n    const next = new Date(current);\n    const step = horizontalStep(e.key, e.currentTarget);\n    // In \"weeks\" a row is a weekday, so sideways is a week and up/down is a day.\n    const across = layout === \"weeks\" ? 7 : 1;\n    const down = layout === \"weeks\" ? 1 : 7;\n    switch (step ? \"horizontal\" : e.key) {\n      case \"horizontal\":\n        next.setDate(next.getDate() + step * across);\n        break;\n      case \"ArrowUp\":\n        next.setDate(next.getDate() - down);\n        break;\n      case \"ArrowDown\":\n        next.setDate(next.getDate() + down);\n        break;\n      case \"PageUp\":\n        next.setTime(addMonthsClamped(next, -1).getTime());\n        break;\n      case \"PageDown\":\n        next.setTime(addMonthsClamped(next, 1).getTime());\n        break;\n      case \"Home\":\n        next.setTime(days[0].getTime());\n        break;\n      case \"End\":\n        next.setTime(days[days.length - 1].getTime());\n        break;\n      default:\n        return;\n    }\n    e.preventDefault();\n    const iso = clampIso(toLocalIso(next));\n    if (iso === activeIso) return;\n    pendingFocus.current = iso;\n    setActiveIso(iso);\n  };\n\n  const legendLevels = Array.from({ length: levels + 1 }, (_, l) => l);\n  const empty = emptyColor ?? EMPTY_FILL;\n  const continuous = colorFrom !== undefined && colorTo !== undefined;\n  const hexRamp = continuous && parseHex(colorFrom) != null && parseHex(colorTo) != null;\n\n  /** A day's fill, and the ink its number is set in (`\"month\"`). */\n  const paint = (value: number, level: number): { fill: string; ink: string } => {\n    if (level === 0) return { fill: empty, ink: \"var(--text-primary)\" };\n    if (fillProp || continuous) {\n      const t = max > 0 ? Math.min(1, Math.max(0, value / max)) : 1;\n      const fill = fillProp\n        ? fillProp(value, max)\n        : hexRamp\n          ? lerpHex(colorFrom!, colorTo!, t)\n          : `color-mix(in oklab, ${colorTo} ${Math.round(t * 100)}%, ${colorFrom})`;\n      // Measured where the fill is a colour; a mix of references cannot be measured,\n      // and the page's own text colour is the safe answer there.\n      const measured = textOn(fill);\n      return { fill, ink: measured === \"currentColor\" ? \"var(--text-primary)\" : measured };\n    }\n    // Light text once the fill is the stronger half of the mix — `--bg-surface` is the\n    // colour the scale is mixed INTO, so it is the one that contrasts with its far end\n    // on either theme.\n    const strong = levelPercent(level, levels) >= 45;\n    return {\n      fill: levelFill(level, levels, color),\n      ink: strong ? \"var(--bg-surface)\" : \"var(--text-primary)\",\n    };\n  };\n  // The legend's swatches: a value that lands on each step (the top one on `max`).\n  const legendFill = (l: number) => paint(((max > 0 ? max : 1) * l) / levels, l).fill;\n\n  const cell = (d: Date, wrapClass: string, cellClass: string, withNumber: boolean) => {\n    const iso = toLocalIso(d);\n    const raw = values.get(iso);\n    const value = raw ?? 0;\n    const level = heatmapLevel(value, max, levels);\n    const { fill, ink } = paint(value, level);\n    const formattedDate = formatDay(d);\n    const formattedValue = formatValue(value);\n    const name = labels.day(formattedDate, formattedValue);\n    const label = tooltip\n      ? tooltip({ iso, date: d, value, hasData: raw !== undefined, level, formattedDate, formattedValue })\n      : name;\n    const isSelected = selected === iso;\n    const shared = {\n      role: \"gridcell\",\n      \"data-day\": iso,\n      \"data-level\": level,\n      tabIndex: iso === activeIso ? 0 : -1,\n      \"aria-label\": name,\n      \"aria-selected\": onSelect ? isSelected : undefined,\n      onKeyDown: move,\n      onFocus: () => {\n        if (iso !== activeIso) setActiveIso(iso);\n      },\n      style: { background: fill, color: ink },\n      className: cn(\n        cellClass,\n        isSelected && \"ring-2 ring-[var(--text-primary)]\",\n        onSelect && \"cursor-pointer hover:ring-1 hover:ring-brand\",\n      ),\n    } as const;\n    const inner = withNumber ? (\n      <span aria-hidden className=\"text-caption leading-none tabular-nums\">\n        {numberFormat.format(d.getDate())}\n      </span>\n    ) : null;\n    return (\n      <Tooltip key={iso} label={label} portal redact={sensitive} role=\"none\" className={wrapClass}>\n        {onSelect ? (\n          <button type=\"button\" {...shared} onClick={() => onSelect(iso)}>\n            {inner}\n          </button>\n        ) : (\n          <div {...shared}>{inner}</div>\n        )}\n      </Tooltip>\n    );\n  };\n\n  const gridName = ariaLabel ?? labels.grid;\n  let body: ReactNode;\n  if (layout === \"weeks\") {\n    const columns = {\n      gridTemplateColumns: `var(--heatmap-label, 2rem) repeat(${weekCount}, var(--heatmap-cell, 0.75rem))`,\n    } as CSSProperties;\n    const cellSize = \"size-[var(--heatmap-cell,0.75rem)]\";\n    // A month's name over the first column that holds its 1st — or over the first\n    // column, when the window opens far enough before the next month for it to fit.\n    const monthLabels = Array.from({ length: weekCount }, (_, w) => {\n      for (let r = 0; r < 7; r++) {\n        const d = dayAt(w * 7 + r);\n        if (d && (d.getDate() === 1 || (w === 0 && r === lead && d.getDate() <= 14))) {\n          return dateFormatter(locale, MONTH_LABEL_FORMAT).format(d);\n        }\n      }\n      return \"\";\n    });\n    body = (\n      <div ref={scrollerRef} className=\"overflow-x-auto pb-1\">\n        <div ref={gridRef} role=\"grid\" aria-label={gridName} className=\"inline-grid gap-0.5\">\n          {/* Decoration: every cell's name already carries its month. */}\n          <div aria-hidden className=\"grid gap-0.5 text-micro leading-3 text-muted\" style={columns}>\n            <span />\n            {monthLabels.map((m, w) => (\n              <span key={w} className=\"overflow-visible whitespace-nowrap\">\n                {m}\n              </span>\n            ))}\n          </div>\n          {Array.from({ length: 7 }, (_, r) => (\n            <div key={r} role=\"row\" className=\"grid gap-0.5\" style={columns}>\n              <div\n                role=\"rowheader\"\n                aria-label={weekdayLabels[r].long}\n                className=\"overflow-hidden pe-1 text-micro leading-3 text-muted\"\n              >\n                {/* Every other weekday, as a contribution graph does: seven labels\n                    at this size are a smear. The name is there for all seven. */}\n                {r % 2 === 1 ? weekdayLabels[r].short : \"\"}\n              </div>\n              {Array.from({ length: weekCount }, (_, w) => {\n                const d = dayAt(w * 7 + r);\n                return d ? (\n                  cell(d, cellSize, cn(cellSize, \"block rounded-sm\"), false)\n                ) : (\n                  <div key={`pad-${w}`} role=\"gridcell\" className={cellSize} />\n                );\n              })}\n            </div>\n          ))}\n        </div>\n      </div>\n    );\n  } else {\n    const rows = Array.from({ length: weekCount }, (_, w) => w);\n    body = (\n      <div ref={gridRef} role=\"grid\" aria-label={gridName} className=\"grid gap-1\">\n        <div role=\"row\" className=\"grid grid-cols-7 gap-1\">\n          {weekdayLabels.map((w, i) => (\n            <div\n              key={i}\n              role=\"columnheader\"\n              aria-label={w.long}\n              className=\"pb-0.5 text-center text-micro uppercase tracking-wide text-muted\"\n            >\n              {w.short}\n            </div>\n          ))}\n        </div>\n        {rows.map((w) => (\n          <div key={w} role=\"row\" className=\"grid grid-cols-7 gap-1\">\n            {Array.from({ length: 7 }, (_, c) => {\n              const d = dayAt(w * 7 + c);\n              return d ? (\n                cell(d, \"aspect-square w-full\", \"flex h-full w-full items-center justify-center rounded\", true)\n              ) : (\n                <div key={`pad-${c}`} role=\"gridcell\" className=\"aspect-square\" />\n              );\n            })}\n          </div>\n        ))}\n      </div>\n    );\n  }\n\n  return (\n    <div {...rest} className={cn(\"min-w-0\", className)}>\n      {dropped > 0 && <div className=\"mb-2 text-xs text-muted\">{labels.truncated(dropped)}</div>}\n      {body}\n      {legend && (\n        <div aria-hidden className=\"mt-2 flex items-center justify-end gap-1 text-micro text-muted\">\n          <span className=\"me-0.5\">{labels.less}</span>\n          {legendLevels.map((l) => (\n            <span key={l} data-legend-level={l} className=\"size-2.5 rounded-sm\" style={{ background: legendFill(l) }} />\n          ))}\n          <span className=\"ms-0.5\">{labels.more}</span>\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":["_"]}

package/dist/components/currency-option-list.d.ts

@@ -28,7 +28,8 @@ export interface CurrencyOptionListProps {
     /** A currency was picked. The host closes the list. */
     onChoose: (code: string) => void;
     /** Only these ISO codes, in this order; codes the kit has no definition for are
-     *  dropped. Default every one of {@link CURRENCIES}. */
+     *  dropped. Default every one of {@link CURRENCIES} that is not `retired` (the chosen
+     *  one too, if it is). A retired code named here stays: the list is the caller's. */
     codes?: readonly string[];
     /** Translated names by code — see {@link currencyName}. */
     currencyNames?: Record<string, string>;

package/dist/components/currency-option-list.js

@@ -46,13 +46,21 @@ function CurrencyOptionList({
   searchPlaceholder,
   sheetTitle
 }) {
+  const held = getCurrency(value);
+  const chosen = held?.code;
+  const heldRetired = held?.retired ? held.code : void 0;
   const codesKey = codes?.join(",");
   const pool = useMemo(
-    () => codesKey === void 0 ? CURRENCIES : (
+    () => codesKey === void 0 ? (
+      // No currency that was replaced (the lev, since Bulgaria's euro: keksdose audit
+      // follow-up, 2026-11-01) — unless the field holds it, which then opens on its
+      // own row, checked, rather than on a list where nothing is chosen.
+      CURRENCIES.filter((c) => !c.retired || c.code === heldRetired)
+    ) : (
       // The caller's order; codes the kit has no definition for are dropped.
       codesKey.split(",").map((code) => getCurrency(code)).filter((c) => c !== void 0)
     ),
-    [codesKey]
+    [codesKey, heldRetired]
   );
   const named = useMemo(
     () => pool.map((c) => ({ c, name: currencyName(c, currencyNames, locale) })),
@@ -69,7 +77,6 @@ function CurrencyOptionList({
       icon: /* @__PURE__ */ jsx(CurrencyFlag, { country: c.country })
     }));
   }, [named, query, locale]);
-  const chosen = getCurrency(value)?.code;
   return /* @__PURE__ */ jsx(
     ComboboxPanel,
     {

package/dist/components/currency-option-list.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/currency-option-list.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport type { ComponentPropsWithRef, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { matchesSearch, searchWords } from \"../lib/text-match\";\nimport { ComboboxPanel, type ComboboxCore, type ComboOption } from \"./combobox-core\";\nimport { CURRENCIES, type CurrencyOption } from \"../currencies\";\n\n// The one list both currency pickers render (round 0.34 Wave 2, DUP-4). CurrencySelect\n// re-exports the data under its own name, as it always has; the list is package-private.\n// Its own module, so AmountInput can render the list without a cycle through\n// currency-select. The data itself is ../currencies since 0.35: an entry of its own that\n// imports nothing, which an app's build can read in Node (keksdose's flag subset).\nexport { CURRENCIES };\nexport type { CurrencyOption };\n\nexport interface CurrencyFlagProps extends ComponentPropsWithRef<\"span\"> {\n  /** ISO 3166-1 alpha-2, lowercase — the class flag-icons keys its sprite by. */\n  country: string;\n}\n\nexport function CurrencyFlag({ country, className, ...rest }: CurrencyFlagProps) {\n  return (\n    <span\n      {...rest}\n      // Stays `aria-hidden` whatever a caller passes: the flag is a picture of the\n      // code printed next to it, and a reader that met both would hear the currency\n      // twice.\n      aria-hidden\n      className={cn(\n        \"fi inline-block w-5 h-[0.9375rem] rounded-sm shadow-[0_0_0_1px_rgba(0,0,0,0.08)] shrink-0\",\n        `fi-${country}`,\n        className,\n      )}\n    />\n  );\n}\n\nconst CURRENCY_BY_CODE = new Map(CURRENCIES.map((c) => [c.code, c]));\n\nexport function getCurrency(code: string | null | undefined): CurrencyOption | undefined {\n  return code ? CURRENCY_BY_CODE.get(code.toUpperCase()) : undefined;\n}\n\n/** The name to SHOW for a currency: the caller's translation if they have one for\n *  that code; else, when a `locale` is known, the name `Intl.DisplayNames` has for\n *  it in that locale; else the English name {@link CURRENCIES} carries. Shared with\n *  AmountInput, which renders the same list from the same data.\n *\n *  `Intl` only when a locale was actually GIVEN (by prop or `<UiKitProvider>`): an\n *  app that never set one keeps the shipped English names it has always shown,\n *  rather than whatever language the test runner or the browser happens to be in. */\nexport function currencyName(c: CurrencyOption, names?: Record<string, string>, locale?: string): string {\n  const own = names?.[c.code];\n  if (own !== undefined) return own;\n  if (locale) {\n    try {\n      const shown = new Intl.DisplayNames([locale], { type: \"currency\" }).of(c.code);\n      if (shown && shown !== c.code) return shown;\n    } catch {\n      // A malformed tag, or a runtime without `DisplayNames`: the shipped name.\n    }\n  }\n  return c.name;\n}\n\nexport interface CurrencyOptionListProps {\n  /** The host's `useComboboxCore`: its trigger, its open state, its query. */\n  core: ComboboxCore<string>;\n  /** What the host's trigger names in `aria-controls`. */\n  listboxId: string;\n  /** The chosen code, if any — selected and checked in the list. */\n  value: string | null | undefined;\n  /** A currency was picked. The host closes the list. */\n  onChoose: (code: string) => void;\n  /** Only these ISO codes, in this order; codes the kit has no definition for are\n   *  dropped. Default every one of {@link CURRENCIES}. */\n  codes?: readonly string[];\n  /** Translated names by code — see {@link currencyName}. */\n  currencyNames?: Record<string, string>;\n  locale?: string;\n  searchPlaceholder: string;\n  /** The phone sheet's title — the field's name. */\n  sheetTitle: ReactNode;\n}\n\n/**\n * The currency list — its filter and its rows — that CurrencySelect and AmountInput's\n * currency chip both render, on the picker family's `ComboboxPanel` (round 0.34 Wave 2,\n * DUP-4 + BUG-12).\n *\n * The chip's list was a hand copy of CurrencySelect's, and it had drifted: the name kept a\n * plain `truncate` where T1 made CurrencySelect's wrap from Large up, it took no `options`\n * subset, it had no check mark and no listbox id, and it was a fixed 16rem where #308 had\n * given CurrencySelect a panel that grows to the full names. And both were lists of plain\n * buttons under a trigger that promised a listbox. On the shared panel they are a listbox\n * of options, the chosen one selected, with the arrow keys, the live result count, the\n * phone sheet (live #200) and portal anchoring (dev#548: an `overflow` ancestor clipped\n * the absolute panel's first third away).\n *\n * The panel hangs from the trigger's END edge and grows toward the start, as wide as the\n * names need up to 20rem and the glass (feedback #308: a field with content after it is\n * not pushed past the page).\n */\nexport function CurrencyOptionList({\n  core,\n  listboxId,\n  value,\n  onChoose,\n  codes,\n  currencyNames,\n  locale,\n  searchPlaceholder,\n  sheetTitle,\n}: CurrencyOptionListProps) {\n  // Keyed on the codes' CONTENTS: an inline `options={[\"EUR\", \"CHF\"]}` is a new array\n  // every render.\n  const codesKey = codes?.join(\",\");\n  const pool = useMemo(\n    () =>\n      codesKey === undefined\n        ? CURRENCIES\n        : // The caller's order; codes the kit has no definition for are dropped.\n          codesKey\n            .split(\",\")\n            .map((code) => getCurrency(code))\n            .filter((c): c is CurrencyOption => c !== undefined),\n    [codesKey],\n  );\n  const named = useMemo(\n    () => pool.map((c) => ({ c, name: currencyName(c, currencyNames, locale) })),\n    [pool, currencyNames, locale],\n  );\n  const byCode = useMemo(() => new Map(named.map((n) => [n.c.code, n])), [named]);\n\n  // The code, the name the row SHOWS (so a translated list is searchable in the language\n  // it is written in) and the symbol — folded as every kit list folds (DUP-5).\n  const query = core.query;\n  const results = useMemo(() => {\n    // Every word of the query, in the code, the name or the symbol (0.51.4).\n    const words = searchWords(query, locale);\n    const hits =\n      words.length > 0 ? named.filter(({ c, name }) => matchesSearch(words, [c.code, name, c.symbol], locale)) : named;\n    return hits.map(({ c, name }): ComboOption<string> => ({\n      value: c.code,\n      label: name,\n      icon: <CurrencyFlag country={c.country} />,\n    }));\n  }, [named, query, locale]);\n\n  const chosen = getCurrency(value)?.code;\n  return (\n    <ComboboxPanel\n      // The core with the currency filter's rows in place of its own.\n      core={{ ...core, results }}\n      listboxId={listboxId}\n      searchPlaceholder={searchPlaceholder}\n      sheetTitle={sheetTitle}\n      isSelected={(code) => code === chosen}\n      onChoose={(o) => onChoose(o.value)}\n      showCreate={false}\n      onCreate={() => {}}\n      createContent={null}\n      width={{ fit: true, maxRem: 20 }}\n      align=\"end\"\n      renderOption={(o) => {\n        const row = byCode.get(o.value);\n        if (!row) return o.label;\n        return (\n          <>\n            <span className=\"w-8 shrink-0 font-mono text-muted\">{row.c.symbol}</span>{\" \"}\n            <span className=\"shrink-0 font-medium text-primary\">{row.c.code}</span>{\" \"}\n            {/* The name wraps from Large up (round 0.34 T1); the code beside it is what a\n                reader scans for, and it never shrinks. */}\n            <span className=\"min-w-0 truncate-until-large text-muted\">{row.name}</span>\n          </>\n        );\n      }}\n    />\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/currency-option-list.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport type { ComponentPropsWithRef, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { matchesSearch, searchWords } from \"../lib/text-match\";\nimport { ComboboxPanel, type ComboboxCore, type ComboOption } from \"./combobox-core\";\nimport { CURRENCIES, type CurrencyOption } from \"../currencies\";\n\n// The one list both currency pickers render (round 0.34 Wave 2, DUP-4). CurrencySelect\n// re-exports the data under its own name, as it always has; the list is package-private.\n// Its own module, so AmountInput can render the list without a cycle through\n// currency-select. The data itself is ../currencies since 0.35: an entry of its own that\n// imports nothing, which an app's build can read in Node (keksdose's flag subset).\nexport { CURRENCIES };\nexport type { CurrencyOption };\n\nexport interface CurrencyFlagProps extends ComponentPropsWithRef<\"span\"> {\n  /** ISO 3166-1 alpha-2, lowercase — the class flag-icons keys its sprite by. */\n  country: string;\n}\n\nexport function CurrencyFlag({ country, className, ...rest }: CurrencyFlagProps) {\n  return (\n    <span\n      {...rest}\n      // Stays `aria-hidden` whatever a caller passes: the flag is a picture of the\n      // code printed next to it, and a reader that met both would hear the currency\n      // twice.\n      aria-hidden\n      className={cn(\n        \"fi inline-block w-5 h-[0.9375rem] rounded-sm shadow-[0_0_0_1px_rgba(0,0,0,0.08)] shrink-0\",\n        `fi-${country}`,\n        className,\n      )}\n    />\n  );\n}\n\nconst CURRENCY_BY_CODE = new Map(CURRENCIES.map((c) => [c.code, c]));\n\nexport function getCurrency(code: string | null | undefined): CurrencyOption | undefined {\n  return code ? CURRENCY_BY_CODE.get(code.toUpperCase()) : undefined;\n}\n\n/** The name to SHOW for a currency: the caller's translation if they have one for\n *  that code; else, when a `locale` is known, the name `Intl.DisplayNames` has for\n *  it in that locale; else the English name {@link CURRENCIES} carries. Shared with\n *  AmountInput, which renders the same list from the same data.\n *\n *  `Intl` only when a locale was actually GIVEN (by prop or `<UiKitProvider>`): an\n *  app that never set one keeps the shipped English names it has always shown,\n *  rather than whatever language the test runner or the browser happens to be in. */\nexport function currencyName(c: CurrencyOption, names?: Record<string, string>, locale?: string): string {\n  const own = names?.[c.code];\n  if (own !== undefined) return own;\n  if (locale) {\n    try {\n      const shown = new Intl.DisplayNames([locale], { type: \"currency\" }).of(c.code);\n      if (shown && shown !== c.code) return shown;\n    } catch {\n      // A malformed tag, or a runtime without `DisplayNames`: the shipped name.\n    }\n  }\n  return c.name;\n}\n\nexport interface CurrencyOptionListProps {\n  /** The host's `useComboboxCore`: its trigger, its open state, its query. */\n  core: ComboboxCore<string>;\n  /** What the host's trigger names in `aria-controls`. */\n  listboxId: string;\n  /** The chosen code, if any — selected and checked in the list. */\n  value: string | null | undefined;\n  /** A currency was picked. The host closes the list. */\n  onChoose: (code: string) => void;\n  /** Only these ISO codes, in this order; codes the kit has no definition for are\n   *  dropped. Default every one of {@link CURRENCIES} that is not `retired` (the chosen\n   *  one too, if it is). A retired code named here stays: the list is the caller's. */\n  codes?: readonly string[];\n  /** Translated names by code — see {@link currencyName}. */\n  currencyNames?: Record<string, string>;\n  locale?: string;\n  searchPlaceholder: string;\n  /** The phone sheet's title — the field's name. */\n  sheetTitle: ReactNode;\n}\n\n/**\n * The currency list — its filter and its rows — that CurrencySelect and AmountInput's\n * currency chip both render, on the picker family's `ComboboxPanel` (round 0.34 Wave 2,\n * DUP-4 + BUG-12).\n *\n * The chip's list was a hand copy of CurrencySelect's, and it had drifted: the name kept a\n * plain `truncate` where T1 made CurrencySelect's wrap from Large up, it took no `options`\n * subset, it had no check mark and no listbox id, and it was a fixed 16rem where #308 had\n * given CurrencySelect a panel that grows to the full names. And both were lists of plain\n * buttons under a trigger that promised a listbox. On the shared panel they are a listbox\n * of options, the chosen one selected, with the arrow keys, the live result count, the\n * phone sheet (live #200) and portal anchoring (dev#548: an `overflow` ancestor clipped\n * the absolute panel's first third away).\n *\n * The panel hangs from the trigger's END edge and grows toward the start, as wide as the\n * names need up to 20rem and the glass (feedback #308: a field with content after it is\n * not pushed past the page).\n */\nexport function CurrencyOptionList({\n  core,\n  listboxId,\n  value,\n  onChoose,\n  codes,\n  currencyNames,\n  locale,\n  searchPlaceholder,\n  sheetTitle,\n}: CurrencyOptionListProps) {\n  const held = getCurrency(value);\n  const chosen = held?.code;\n  // A retired currency the field holds — the one the default list keeps for it. Its own\n  // key, so a change of an ordinary value does not rebuild the rows and their names.\n  const heldRetired = held?.retired ? held.code : undefined;\n  // Keyed on the codes' CONTENTS: an inline `options={[\"EUR\", \"CHF\"]}` is a new array\n  // every render.\n  const codesKey = codes?.join(\",\");\n  const pool = useMemo(\n    () =>\n      codesKey === undefined\n        ? // No currency that was replaced (the lev, since Bulgaria's euro: keksdose audit\n          // follow-up, 2026-11-01) — unless the field holds it, which then opens on its\n          // own row, checked, rather than on a list where nothing is chosen.\n          CURRENCIES.filter((c) => !c.retired || c.code === heldRetired)\n        : // The caller's order; codes the kit has no definition for are dropped.\n          codesKey\n            .split(\",\")\n            .map((code) => getCurrency(code))\n            .filter((c): c is CurrencyOption => c !== undefined),\n    [codesKey, heldRetired],\n  );\n  const named = useMemo(\n    () => pool.map((c) => ({ c, name: currencyName(c, currencyNames, locale) })),\n    [pool, currencyNames, locale],\n  );\n  const byCode = useMemo(() => new Map(named.map((n) => [n.c.code, n])), [named]);\n\n  // The code, the name the row SHOWS (so a translated list is searchable in the language\n  // it is written in) and the symbol — folded as every kit list folds (DUP-5).\n  const query = core.query;\n  const results = useMemo(() => {\n    // Every word of the query, in the code, the name or the symbol (0.51.4).\n    const words = searchWords(query, locale);\n    const hits =\n      words.length > 0 ? named.filter(({ c, name }) => matchesSearch(words, [c.code, name, c.symbol], locale)) : named;\n    return hits.map(({ c, name }): ComboOption<string> => ({\n      value: c.code,\n      label: name,\n      icon: <CurrencyFlag country={c.country} />,\n    }));\n  }, [named, query, locale]);\n\n  return (\n    <ComboboxPanel\n      // The core with the currency filter's rows in place of its own.\n      core={{ ...core, results }}\n      listboxId={listboxId}\n      searchPlaceholder={searchPlaceholder}\n      sheetTitle={sheetTitle}\n      isSelected={(code) => code === chosen}\n      onChoose={(o) => onChoose(o.value)}\n      showCreate={false}\n      onCreate={() => {}}\n      createContent={null}\n      width={{ fit: true, maxRem: 20 }}\n      align=\"end\"\n      renderOption={(o) => {\n        const row = byCode.get(o.value);\n        if (!row) return o.label;\n        return (\n          <>\n            <span className=\"w-8 shrink-0 font-mono text-muted\">{row.c.symbol}</span>{\" \"}\n            <span className=\"shrink-0 font-medium text-primary\">{row.c.code}</span>{\" \"}\n            {/* The name wraps from Large up (round 0.34 T1); the code beside it is what a\n                reader scans for, and it never shrinks. */}\n            <span className=\"min-w-0 truncate-until-large text-muted\">{row.name}</span>\n          </>\n        );\n      }}\n    />\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/currency-select.d.ts

@@ -14,7 +14,9 @@ export interface CurrencySelectProps extends Omit<ComponentPropsWithoutRef<"div"
     /**
      * Restrict the pickable currencies to these ISO codes (e.g. only the
      * currencies actually present in a budget). Order is preserved. Defaults to
-     * the full {@link CURRENCIES} list.
+     * the full {@link CURRENCIES} list but a `retired` currency (the lev, since
+     * Bulgaria's euro), which only a field that holds it lists. A retired code named
+     * here is offered: the list is the caller's.
      */
     options?: string[];
     /** Required and unanswered — {@link FIELD_INVALID}, the same rose border the