@eifi1/ui-kit 0.14.1 → 0.15.0

package/dist/components/measured-grid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/measured-grid.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithoutRef, KeyboardEvent, ReactNode } from \"react\";\nimport { ClipboardPaste, Eraser, Plus, Trash2 } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { horizontalStep } from \"../lib/direction\";\n// The cell pair reads ONE cell, where a comma has no columns to separate and so is\n// always a decimal mark; `splitRow` and `parseRows` read a pasted table, where it may\n// be either and the line decides. See the three named rules at the top of table-text.\nimport { cellNumber, isCellNumber, parseRows, splitRow } from \"../lib/table-text\";\nimport { useKitLabels, useKitLocale } from \"../i18n/kit-labels\";\nimport { useWindowedRows } from \"../hooks/use-windowed-rows\";\nimport { ToggleGroup } from \"./toggle-group\";\nimport { Button, FIELD_INVALID, Textarea } from \"./ui\";\n\n/**\n * A measured table: a fixed set of numeric columns, typed cell by cell or pasted as a\n * block out of a spreadsheet — and the hook that holds it as a draft.\n *\n * Moved from Lenkbank (`shared/ui/measured-grid.tsx`), where four gear editors and a\n * setpoint dialog type rig measurements into it. Nothing in it knows what a column\n * holds: the caller passes `{ label, unit }[]`, and the vocabulary of this file is\n * cells, rows, a caret and a paste. The lexing under it is `@eifi1/ui-kit/table-text`.\n *\n * What it is NOT: a `DataTable` mode (that one finds rows among many; this one types\n * numbers into columns), a spreadsheet (no formulas, no multi-cell selection, no undo\n * beyond the browser's per-input one), or typed columns — every cell is a string that\n * should read as a number.\n */\n\n/**\n * Every string the grid can speak — the `measuredGrid` namespace of\n * `<UiKitProvider labels>`, overridable per instance through the `labels` prop. The\n * ones that carry a number are functions of it, for the reason `DataTableLabels` gives:\n * the grammar around a count moves with it in most languages.\n */\nexport interface MeasuredGridLabels {\n  /** Accessible name of the cells/text toggle. */\n  view: string;\n  cellsView: string;\n  textView: string;\n  addRow: string;\n  /** The row's remove button, given its 1-based number. */\n  removeRow: (row: number) => string;\n  /** Empties the whole table. */\n  clear: string;\n  /** The footer's standing note that a block can be pasted into any cell. */\n  pasteHint: string;\n  /**\n   * Accessible name of one cell's input, given its column's label and 1-based row.\n   * A screen reader in a grid announces the headers on its own when the caret crosses\n   * one; this is what it reads when the caret lands on an input with no crossing — and\n   * what a voice-control user says to reach it.\n   */\n  cell: (column: string, row: number) => string;\n  /** The row-number column's header, which shows only \"#\". */\n  rowNumber: string;\n  /** The remove-button column's header, which shows nothing. */\n  rowActions: string;\n  /** The grid's description: how its keyboard works. Read once, on entry. */\n  keyboardHint: string;\n  /** The text view could not read this 1-based line of what was typed or pasted. */\n  lineError: (line: number) => string;\n  /** How many filled rows (measured points) the table holds. */\n  points: (count: number) => string;\n  /** How many cells are typed but are not numbers. */\n  problems: (count: number) => string;\n}\n\n/** English defaults. Exported as the `measuredGrid` namespace of `UiKitLabels`\n *  (src/i18n), the complete reference a translation is written against. */\nexport const DEFAULT_MEASURED_GRID_LABELS: MeasuredGridLabels = {\n  view: \"Table view\",\n  cellsView: \"Cells\",\n  textView: \"Text\",\n  addRow: \"Add row\",\n  removeRow: (row) => `Remove row ${row}`,\n  clear: \"Clear table\",\n  pasteHint: \"Paste a block from a spreadsheet into any cell\",\n  cell: (column, row) => `${column}, row ${row}`,\n  rowNumber: \"Row\",\n  rowActions: \"Row actions\",\n  keyboardHint:\n    \"Arrow keys move between cells. Type to replace a cell, F2 to edit it, Escape to undo the edit. Enter moves down and adds a row at the end.\",\n  lineError: (line) => `Line ${line} could not be read`,\n  points: (count) => (count === 1 ? \"1 point\" : `${count} points`),\n  problems: (count) => (count === 1 ? \"1 cell is not a number\" : `${count} cells are not numbers`),\n};\n\n/** One column of a measured table: what it holds and what it is measured in. The unit\n *  is separate from the name because the header shows it small and underneath, and\n *  because a column with no unit (a count, an index) should not render empty brackets. */\nexport interface MeasuredGridColumn {\n  label: string;\n  unit?: string;\n}\n\n/** The two ways to look at the same table. */\nexport type MeasuredGridView = \"cells\" | \"text\";\n\n/** A cell that has not been typed into yet. Distinguished from `\"0\"` on purpose: an\n *  empty cell is a hole in the measurement, and a table with a hole is not one to save. */\nconst BLANK = \"\";\n\n/** Height of one grid row, in pixels. Fixed, which is what lets the windowing be\n *  arithmetic rather than measurement. */\nconst DEFAULT_ROW_HEIGHT = 28;\n\nconst ALL_VIEWS: readonly MeasuredGridView[] = [\"cells\", \"text\"];\n\n/** The locale's decimal mark, as far as a cell can hold it: \",\" or \".\". A mark outside\n *  those two (Arabic's \"٫\") is not one `cellNumber` reads, so those locales keep the\n *  dot. The same answer `NumberField` gives, for the same reason. */\nfunction decimalMark(locale: string | undefined): \",\" | \".\" {\n  try {\n    const part = new Intl.NumberFormat(locale).formatToParts(1.5).find((p) => p.type === \"decimal\");\n    return part?.value === \",\" ? \",\" : \".\";\n  } catch {\n    // An invalid tag throws a RangeError; a typo in a locale must not take the grid down.\n    return \".\";\n  }\n}\n\n/** A number-shaped cell written with the locale's mark. The lexer hands back points;\n *  a German user typed commas and should read commas back. Anything that is not a\n *  number is left exactly as it was, so the mistake stays visible where it was made. */\nconst withMark = (cell: string, mark: \",\" | \".\") =>\n  mark === \",\" && isCellNumber(cell) ? cell.replace(\".\", \",\") : cell;\n\n/** A computed number as a draft cell: rounded to `digits`, with no trailing zeros. */\nconst formatCell = (value: number, digits: number, mark: \",\" | \".\") =>\n  withMark(String(Number(value.toFixed(digits))), mark);\n\nconst hasContent = (row: readonly string[]) => row.some((cell) => cell.trim() !== \"\");\n\nexport interface UseMeasuredRowsOptions {\n  /** Decimals a computed number is rounded to on its way into a cell. Default 4. */\n  digits?: number;\n  /** BCP 47 tag whose decimal mark the cells are written with, else the\n   *  `<UiKitProvider locale>`, else the runtime's. */\n  locale?: string;\n}\n\nexport interface MeasuredRows {\n  /** The draft, as text — what the grid shows and edits. */\n  cells: string[][];\n  setCells: (next: string[][]) => void;\n  /** The filled rows as numbers — EMPTY until the table is `ready`. */\n  rows: number[][];\n  /** Replace the whole table with computed numbers (a generated shape, say). */\n  setRows: (next: number[][]) => void;\n  /** At least two filled rows, and every cell in them is a number. */\n  ready: boolean;\n  /** How many cells are typed but are not numbers — what the grid marks invalid. */\n  problems: number;\n  /** Everything `MeasuredGrid` needs, so a caller spreads it in one line. */\n  props: { cells: string[][]; onCells: (next: string[][]) => void };\n}\n\n/**\n * The draft a measured table is edited as.\n *\n * **Strings, not numbers.** A cell is text while it is being typed — `\"-\"`, `\"1.\"` and\n * `\"1e\"` are all states a number passes through on its way to being one, and a grid\n * that parses on every keystroke turns each of them into a `NaN` and then into a `0`.\n * So the draft is text, and the numbers are what falls out when every cell is one.\n *\n * **\"Whole\" is a question this answers**, because every editor asks it before it\n * offers to save: `ready` wants at least two filled rows with a number in every cell.\n * An empty cell is a hole in the measurement, not a zero; a wholly empty row is not a\n * row at all (it is what walking off the bottom of the grid leaves behind).\n *\n * `initial` is read once, like `useState`'s.\n */\nexport function useMeasuredRows(\n  initial: number[][] | (() => number[][]),\n  options: UseMeasuredRowsOptions = {},\n): MeasuredRows {\n  const { digits = 4 } = options;\n  const mark = decimalMark(useKitLocale(options.locale));\n  const [cells, setCells] = useState<string[][]>(() =>\n    (typeof initial === \"function\" ? initial() : initial).map((row) =>\n      row.map((value) => formatCell(value, digits, mark)),\n    ),\n  );\n\n  const { rows, ready, problems } = useMemo(() => {\n    const filled = cells.filter(hasContent);\n    const whole = filled.length >= 2 && filled.every((row) => row.every(isCellNumber));\n    return {\n      rows: whole ? filled.map((row) => row.map(cellNumber)) : [],\n      ready: whole,\n      problems: filled.flat().filter((cell) => cell.trim() !== \"\" && !isCellNumber(cell)).length,\n    };\n  }, [cells]);\n\n  const setRows = useCallback(\n    (next: number[][]) => setCells(next.map((row) => row.map((value) => formatCell(value, digits, mark)))),\n    [digits, mark],\n  );\n  const props = useMemo(() => ({ cells, onCells: setCells }), [cells]);\n\n  return { cells, setCells, rows, setRows, ready, problems, props };\n}\n\nexport interface MeasuredGridProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"onChange\"> {\n  /** What the table is — shown above it, and the grid's accessible name. */\n  label: string;\n  /** A note under the table (which columns a layout expects, say). Also the grid's\n   *  description. */\n  hint?: ReactNode;\n  columns: MeasuredGridColumn[];\n  /** The draft — typically `useMeasuredRows().props`. */\n  cells: string[][];\n  onCells: (next: string[][]) => void;\n  /** Read-only: the cells can still be walked and read, nothing can be changed. */\n  disabled?: boolean;\n  /** Which views the toggle offers, the first being where it opens. Default both;\n   *  one view hides the toggle. */\n  views?: ReadonlyArray<MeasuredGridView>;\n  /** Row height in pixels, for the windowing. Fixed on purpose. Default 28. */\n  rowHeight?: number;\n  /** BCP 47 tag for the decimal mark of cells written by a paste or the text view,\n   *  and for the row numbers; else the `<UiKitProvider locale>`. */\n  locale?: string;\n  labels?: Partial<MeasuredGridLabels>;\n}\n\n/**\n * A measured table as a grid of cells, one number each, with a text view beside it.\n *\n * The grid is the primary form because a linkage typed off a drawing arrives as\n * numbers somebody reads out loud, and a textarea made that an exercise in counting\n * tab characters. The paste still works: a block pasted into any cell fills from that\n * cell outwards, growing the table to fit. The text view is kept for what a grid is\n * worst at — reading a thousand-row export back in one piece.\n *\n * **It is a grid in the APG sense**, which the Lenkbank original was not (a `<table>`\n * of inputs, fifteen tab stops per row). One tab stop — the roving tabindex — and the\n * keyboard inside it, as a spreadsheet has it:\n *\n *   - **Arrows** move between cells. Left/Right flip under `dir=\"rtl\"`.\n *   - **Home/End** go to the first/last column; with Ctrl (or ⌘), to the first/last\n *     cell of the table. **PageUp/PageDown** move a screenful.\n *   - **Enter** (and ArrowDown) move down a column, and past the last row ADD one —\n *     typing down a column is how measured data is entered, and stopping at the last\n *     row to reach for a button is what makes people paste instead. Shift+Enter moves up.\n *   - **Typing** replaces the cell: arriving by keyboard selects its text, so the first\n *     key overwrites it. That is the edit mode data entry wants, entered without a key.\n *     **F2** edits in place instead (caret at the end). Either way the cell is then\n *     *editing*: Left/Right move the caret, and cross to the next cell only at the edge\n *     of the text; Home/End stay in the text. **Escape** puts back what the cell held\n *     when the caret arrived, and leaves editing.\n *\n * APG's grid pattern pairs Enter with F2 as the keys that start editing. Enter is\n * spent on \"next row\" here on purpose — it is the one key a person typing a column of\n * numbers presses between every one of them, and every spreadsheet spends it the same\n * way — and typing-to-replace makes an explicit \"start editing\" key unnecessary for\n * the common case. F2 remains for the uncommon one.\n */\nexport function MeasuredGrid({\n  label,\n  hint,\n  columns,\n  cells,\n  onCells,\n  disabled,\n  views = ALL_VIEWS,\n  rowHeight = DEFAULT_ROW_HEIGHT,\n  locale: localeProp,\n  labels: labelsProp,\n  className,\n  ...rest\n}: MeasuredGridProps) {\n  const labels = useKitLabels(\"measuredGrid\", DEFAULT_MEASURED_GRID_LABELS, labelsProp);\n  const locale = useKitLocale(localeProp);\n  const mark = decimalMark(locale);\n  const id = useId();\n  const labelId = `${id}-label`;\n  const hintId = `${id}-hint`;\n  const keysId = `${id}-keys`;\n  const offered = views.length ? views : ALL_VIEWS;\n  const [chosen, setChosen] = useState<MeasuredGridView>(offered[0]);\n  const view = offered.includes(chosen) ? chosen : offered[0];\n\n  return (\n    // `relative` so the keyboard description below can be `sr-only` without escaping\n    // to the initial containing block (see sr-only-containment.test).\n    <div {...rest} className={cn(\"relative\", className)}>\n      <div className=\"mb-1 flex flex-wrap items-center justify-between gap-2\">\n        <span id={labelId} className=\"text-[11px] font-medium text-[var(--text-muted)]\">\n          {label}\n        </span>\n        {offered.length > 1 && (\n          <ToggleGroup\n            className=\"w-auto\"\n            aria-label={labels.view}\n            value={view}\n            onChange={setChosen}\n            options={offered.map((value) => ({\n              value,\n              label: value === \"cells\" ? labels.cellsView : labels.textView,\n            }))}\n          />\n        )}\n      </div>\n      {view === \"cells\" ? (\n        <CellGrid\n          columns={columns}\n          cells={cells}\n          onCells={onCells}\n          disabled={disabled}\n          rowHeight={rowHeight}\n          locale={locale}\n          mark={mark}\n          labels={labels}\n          labelledBy={labelId}\n          describedBy={hint ? `${keysId} ${hintId}` : keysId}\n        />\n      ) : (\n        <TextView\n          columns={columns}\n          cells={cells}\n          onCells={onCells}\n          disabled={disabled}\n          mark={mark}\n          labels={labels}\n          labelledBy={labelId}\n          describedBy={hint ? hintId : undefined}\n        />\n      )}\n      {hint && (\n        <p id={hintId} className=\"mt-1 px-1 text-[11px] text-[var(--text-muted)]\">\n          {hint}\n        </p>\n      )}\n      {view === \"cells\" && (\n        <span id={keysId} className=\"sr-only\">\n          {labels.keyboardHint}\n        </span>\n      )}\n    </div>\n  );\n}\n\n/** Where the caret is. Held in state rather than read off `document`, because a\n *  windowed grid unmounts the cell being walked towards: the move is decided first and\n *  focused after the row it lands on has been rendered. */\ninterface Caret {\n  row: number;\n  column: number;\n}\n\ninterface ViewProps {\n  columns: MeasuredGridColumn[];\n  cells: string[][];\n  onCells: (next: string[][]) => void;\n  disabled?: boolean;\n  mark: \",\" | \".\";\n  labels: MeasuredGridLabels;\n  labelledBy: string;\n  describedBy?: string;\n}\n\nfunction CellGrid({\n  columns,\n  cells,\n  onCells,\n  disabled,\n  rowHeight,\n  locale,\n  mark,\n  labels,\n  labelledBy,\n  describedBy,\n}: ViewProps & { rowHeight: number; locale: string | undefined }) {\n  const scrollRef = useRef<HTMLDivElement>(null);\n  const headRef = useRef<HTMLDivElement>(null);\n  const width = columns.length;\n  const blankRow = () => columns.map(() => BLANK);\n  // At least one row to type into: a grid with nothing in it has nowhere to put the\n  // first number, and \"add a row\" is not the first thing to ask of someone who has\n  // just opened an empty table. It is not written back until something is typed.\n  const grid = cells.length ? cells : [blankRow()];\n  const { first, last, totalHeight } = useWindowedRows(grid.length, rowHeight, scrollRef);\n  const rowNumber = useMemo(() => new Intl.NumberFormat(locale), [locale]);\n\n  // The remove buttons are the last column of the grid, reachable by the arrows like\n  // any cell — except where they are disabled (a read-only grid, or the placeholder\n  // row of an empty one), because a disabled button cannot hold the tab stop.\n  const removable = !disabled && cells.length > 0;\n  const lastColumn = removable ? width : width - 1;\n\n  const [caret, setCaret] = useState<Caret>({ row: 0, column: 0 });\n  // Clamped on read, not corrected in an effect: rows removed or columns changed from\n  // outside must never leave the tab stop on a cell that is not there.\n  const at = { row: Math.min(caret.row, grid.length - 1), column: Math.min(caret.column, lastColumn) };\n  /** Whether the caret cell is being edited in place (see the component note). */\n  const [editing, setEditing] = useState(false);\n  /** A cell that has to take focus once it exists — one commit away when the move\n   *  crossed the edge of the window. `select` is arrival by keyboard. */\n  const pending = useRef<(Caret & { select: boolean }) | null>(null);\n  /** What the caret cell held when the caret arrived: what Escape puts back. */\n  const origin = useRef(BLANK);\n  /** The next focus was a pointer's: place the caret where it was clicked, edit. */\n  const pointer = useRef(false);\n\n  useEffect(() => {\n    const target = pending.current;\n    if (!target) return;\n    const element = scrollRef.current?.querySelector<HTMLElement>(\n      `[data-cell=\"${target.row}:${target.column}\"]`,\n    );\n    if (!element) return;\n    pending.current = null;\n    // `preventScroll`: `reveal` already scrolled the row clear of the sticky header,\n    // which the browser's own scroll-into-view does not know is there.\n    element.focus({ preventScroll: true });\n    if (target.select && element instanceof HTMLInputElement) element.select();\n  });\n\n  const pad = (row: readonly string[] | undefined) =>\n    Array.from({ length: width }, (_, index) => row?.[index] ?? BLANK);\n\n  const setCell = (row: number, column: number, value: string) => {\n    const next = grid.map(pad);\n    next[row][column] = value;\n    onCells(next);\n  };\n\n  /** Scroll `row` into the band below the sticky header. */\n  const reveal = (row: number) => {\n    const element = scrollRef.current;\n    if (!element) return;\n    const room = element.clientHeight - (headRef.current?.offsetHeight ?? 0);\n    if (room <= 0) return;\n    const top = row * rowHeight;\n    if (top < element.scrollTop) element.scrollTop = top;\n    else if (top + rowHeight > element.scrollTop + room) element.scrollTop = top + rowHeight - room;\n  };\n\n  const focusCell = (row: number, column: number) => {\n    reveal(row);\n    pending.current = { row, column, select: true };\n    setCaret({ row, column });\n    setEditing(false);\n  };\n\n  const go = (row: number, column: number) => {\n    const target = {\n      row: Math.max(0, Math.min(row, grid.length - 1)),\n      column: Math.max(0, Math.min(column, lastColumn)),\n    };\n    if (target.row === at.row && target.column === at.column) return;\n    focusCell(target.row, target.column);\n  };\n\n  /** Down a column — and off the bottom, a new row, unless the last one is still\n   *  empty: holding ArrowDown should not leave a trail of blank rows behind it. */\n  const down = (row: number, column: number) => {\n    if (row + 1 < grid.length) return go(row + 1, column);\n    if (disabled || !hasContent(grid[row])) return;\n    onCells([...grid.map(pad), blankRow()]);\n    focusCell(row + 1, Math.min(column, width - 1));\n  };\n\n  const page = () => {\n    const element = scrollRef.current;\n    const room = element ? element.clientHeight - (headRef.current?.offsetHeight ?? 0) : 0;\n    // No layout (a hidden pane, jsdom): a fixed ten rather than one row at a time.\n    return room > 0 ? Math.max(1, Math.floor(room / rowHeight) - 1) : 10;\n  };\n\n  /**\n   * On each cell rather than once on the grid, for the reason `MiniCalendar` gives:\n   * the cell is where focus is, and a container listening for keys it cannot receive\n   * is the shape `jsx-a11y/interactive-supports-focus` objects to.\n   */\n  const onCellKeyDown = (event: KeyboardEvent<HTMLElement>, row: number, column: number) => {\n    const input = event.currentTarget instanceof HTMLInputElement ? event.currentTarget : null;\n    const inText = Boolean(input) && editing;\n    const modified = event.ctrlKey || event.metaKey;\n    switch (event.key) {\n      case \"ArrowUp\":\n        event.preventDefault();\n        return go(row - 1, column);\n      case \"ArrowDown\":\n        event.preventDefault();\n        return down(row, column);\n      case \"Enter\":\n        // On the remove button Enter is the button's own.\n        if (!input) return;\n        event.preventDefault();\n        return event.shiftKey ? go(row - 1, column) : down(row, column);\n      case \"ArrowLeft\":\n      case \"ArrowRight\": {\n        // Along the reading direction: ArrowLeft is \"next column\" in RTL.\n        const forward = horizontalStep(event.key, event.currentTarget) === 1;\n        if (inText && input) {\n          const edge = forward ? input.value.length : 0;\n          // Inside the text the caret moves; only at its edge does it leave the cell.\n          if (input.selectionStart !== edge || input.selectionEnd !== edge) return;\n        }\n        event.preventDefault();\n        return go(row, column + (forward ? 1 : -1));\n      }\n      case \"Home\":\n      case \"End\": {\n        if (inText && !modified) return;\n        event.preventDefault();\n        const home = event.key === \"Home\";\n        if (modified) return go(home ? 0 : grid.length - 1, home ? 0 : width - 1);\n        return go(row, home ? 0 : width - 1);\n      }\n      case \"PageUp\":\n        event.preventDefault();\n        return go(row - page(), column);\n      case \"PageDown\":\n        event.preventDefault();\n        return go(row + page(), column);\n      case \"F2\":\n        if (!input || disabled) return;\n        event.preventDefault();\n        setEditing(true);\n        input.setSelectionRange(input.value.length, input.value.length);\n        return;\n      case \"Escape\":\n        // Not editing: nothing of ours to undo, so the key belongs to whatever the\n        // grid sits in — the dialog it is in closes, as it should.\n        if (!input || !editing) return;\n        event.preventDefault();\n        event.stopPropagation();\n        if (input.value !== origin.current) setCell(row, column, origin.current);\n        pending.current = { row, column, select: true };\n        setEditing(false);\n        return;\n    }\n  };\n\n  /**\n   * A pasted block, written in from the cell it was pasted into.\n   *\n   * Rows past the end grow the table; columns past the last are dropped, because a\n   * paste wider than the measurement is a paste with a trailing timestamp column and\n   * not an error worth refusing. One header line is skipped — pasted data almost\n   * always has one. Each line is read on its own evidence (`splitRow`, the per-line\n   * comma rule), so one line cannot change what another means.\n   */\n  const paste = (row: number, column: number, text: string) => {\n    const lines = text.split(/\\r?\\n/).filter((line) => line.trim() !== \"\");\n    if (!lines.length) return;\n    const block = lines.map(splitRow);\n    if (block.length > 1 && block[0].some((cell) => !isCellNumber(cell))) block.shift();\n\n    const height = Math.max(grid.length, row + block.length);\n    const next = Array.from({ length: height }, (_, index) => pad(grid[index]));\n    block.forEach((line, downwards) => {\n      line.forEach((cell, across) => {\n        const target = column + across;\n        if (target < width) next[row + downwards][target] = withMark(cell.trim(), mark);\n      });\n    });\n    onCells(next);\n    pending.current = { row, column, select: true };\n    setEditing(false);\n  };\n\n  const template = `2.5rem repeat(${width}, minmax(5.5rem, 1fr)) 2rem`;\n  // The caret's row is mounted even when it has been scrolled out of the window: it\n  // holds the grid's only tab stop, and a tab stop that is not in the DOM is a grid\n  // Tab walks straight past.\n  const mounted: number[] = [];\n  for (let index = first; index < last; index += 1) mounted.push(index);\n  if (at.row < first || at.row >= last) mounted.push(at.row);\n\n  const filled = cells.filter(hasContent);\n  const problems = filled.flat().filter((cell) => cell.trim() !== \"\" && !isCellNumber(cell)).length;\n\n  return (\n    <div className=\"rounded-md border border-[var(--border)] bg-[var(--bg-surface)]\">\n      <div ref={scrollRef} className=\"max-h-72 overflow-auto\">\n        <div\n          role=\"grid\"\n          aria-labelledby={labelledBy}\n          aria-describedby={describedBy}\n          // The true size, not the mounted one: a screen reader otherwise reports the\n          // thirty rows in the window as the whole table.\n          aria-rowcount={grid.length + 1}\n          aria-colcount={width + 2}\n          aria-readonly={disabled || undefined}\n          className=\"text-xs\"\n          style={{ minWidth: `calc(4.5rem + ${width} * 5.5rem)` }}\n        >\n          {/* The header stays put vertically and scrolls sideways with the body, so a\n              fifteen-column linkage can be read without losing which column is which. */}\n          <div ref={headRef} role=\"rowgroup\" className=\"sticky top-0 z-10 bg-[var(--bg-surface-2)]\">\n            <div\n              role=\"row\"\n              aria-rowindex={1}\n              className=\"grid border-b border-[var(--border)]\"\n              style={{ gridTemplateColumns: template }}\n            >\n              <div\n                role=\"columnheader\"\n                aria-label={labels.rowNumber}\n                className=\"flex items-end justify-end px-1 py-1 text-[10px] text-[var(--text-placeholder)]\"\n              >\n                #\n              </div>\n              {columns.map((column, index) => (\n                <div\n                  key={index}\n                  role=\"columnheader\"\n                  className=\"min-w-0 border-s border-[var(--border)] px-2 py-1 text-end\"\n                >\n                  <span className=\"block truncate font-medium text-[var(--text-primary)]\">\n                    {column.label}\n                  </span>\n                  {column.unit && (\n                    <span className=\"block truncate text-[10px] text-[var(--text-muted)]\">\n                      {column.unit}\n                    </span>\n                  )}\n                </div>\n              ))}\n              <div\n                role=\"columnheader\"\n                aria-label={labels.rowActions}\n                className=\"border-s border-[var(--border)]\"\n              />\n            </div>\n          </div>\n          {/* Only the rows in the window are mounted — a swept linkage is thousands of\n              them across fifteen inputs — each placed at its own offset, so mounting\n              one more (the caret's) costs nothing in the arithmetic. */}\n          <div role=\"rowgroup\" className=\"relative\" style={{ height: totalHeight }}>\n            {mounted.map((index) => {\n              const row = grid[index];\n              return (\n                <div\n                  key={index}\n                  role=\"row\"\n                  aria-rowindex={index + 2}\n                  className=\"absolute inset-x-0 grid hover:bg-[var(--bg-hover)]\"\n                  style={{ top: index * rowHeight, height: rowHeight, gridTemplateColumns: template }}\n                >\n                  <div\n                    role=\"rowheader\"\n                    className=\"flex items-center justify-end px-1 text-[10px] tabular-nums text-[var(--text-placeholder)]\"\n                  >\n                    {rowNumber.format(index + 1)}\n                  </div>\n                  {columns.map((column, columnIndex) => {\n                    const value = row[columnIndex] ?? BLANK;\n                    const bad = value.trim() !== \"\" && !isCellNumber(value);\n                    const isCaret = at.row === index && at.column === columnIndex;\n                    return (\n                      <div key={columnIndex} role=\"gridcell\" className=\"min-w-0 border-s border-[var(--border)]\">\n                        <input\n                          data-cell={`${index}:${columnIndex}`}\n                          value={value}\n                          // `readOnly`, not `disabled`: a disabled input cannot take\n                          // focus, and a read-only table should still be walkable.\n                          readOnly={disabled}\n                          tabIndex={isCaret ? 0 : -1}\n                          inputMode=\"decimal\"\n                          spellCheck={false}\n                          autoComplete=\"off\"\n                          aria-label={labels.cell(column.label, index + 1)}\n                          // Said, not only painted: the ring is what a sighted user\n                          // sees, `aria-invalid` is what a screen reader reads.\n                          aria-invalid={bad || undefined}\n                          className={cn(\n                            \"block size-full bg-transparent px-2 text-end tabular-nums text-[var(--text-primary)] outline-none\",\n                            // Arriving selects the text (typing replaces it); editing\n                            // in place is the plain surface with a caret in it.\n                            \"focus:bg-[var(--brand-bg)] focus:ring-2 focus:ring-inset focus:ring-[var(--brand)]\",\n                            isCaret && editing && \"focus:bg-[var(--bg-surface)]\",\n                            disabled && \"text-[var(--text-muted)]\",\n                            bad && cn(FIELD_INVALID, \"ring-inset\"),\n                          )}\n                          onMouseDown={(event) => {\n                            // A click places a caret, which is editing. On the cell\n                            // already focused there is no focus event to say so.\n                            if (document.activeElement === event.currentTarget) setEditing(!disabled);\n                            else pointer.current = true;\n                          }}\n                          onFocus={(event) => {\n                            origin.current = event.currentTarget.value;\n                            if (!isCaret) setCaret({ row: index, column: columnIndex });\n                            const byPointer = pointer.current;\n                            pointer.current = false;\n                            setEditing(byPointer && !disabled);\n                            if (!byPointer) event.currentTarget.select();\n                          }}\n                          onBlur={() => setEditing(false)}\n                          onChange={(event) => {\n                            setCell(index, columnIndex, event.target.value);\n                            setEditing(true);\n                          }}\n                          onPaste={(event) => {\n                            if (disabled) return;\n                            const text = event.clipboardData.getData(\"text/plain\");\n                            // One cell's worth of text is an ordinary paste, and the\n                            // browser does it better than this would; only a block is\n                            // the grid's business.\n                            if (!/[\\t\\n;]/.test(text)) return;\n                            event.preventDefault();\n                            paste(index, columnIndex, text);\n                          }}\n                          onKeyDown={(event) => onCellKeyDown(event, index, columnIndex)}\n                        />\n                      </div>\n                    );\n                  })}\n                  <div\n                    role=\"gridcell\"\n                    className=\"flex items-center justify-center border-s border-[var(--border)]\"\n                  >\n                    <button\n                      type=\"button\"\n                      data-cell={`${index}:${width}`}\n                      disabled={!removable}\n                      tabIndex={at.row === index && at.column === width ? 0 : -1}\n                      aria-label={labels.removeRow(index + 1)}\n                      className=\"rounded p-1 text-[var(--text-placeholder)] outline-none hover:text-[var(--danger)] focus-visible:ring-2 focus-visible:ring-[var(--brand)] disabled:cursor-default disabled:hover:text-[var(--text-placeholder)]\"\n                      onKeyDown={(event) => onCellKeyDown(event, index, width)}\n                      onFocus={() => {\n                        if (at.row !== index || at.column !== width) setCaret({ row: index, column: width });\n                      }}\n                      onClick={() => {\n                        const next = grid.filter((_, other) => other !== index);\n                        onCells(next);\n                        // Focus stays in the column, on the row that moved up into\n                        // this one; an emptied table sends it to the first cell.\n                        if (next.length) focusCell(Math.min(index, next.length - 1), width);\n                        else focusCell(0, 0);\n                      }}\n                    >\n                      <Trash2 aria-hidden className=\"size-3.5\" />\n                    </button>\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        </div>\n      </div>\n      <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1 border-t border-[var(--border)] px-2 py-1.5\">\n        <Button\n          variant=\"ghost\"\n          className=\"px-2 py-1 text-xs\"\n          disabled={disabled}\n          onClick={() => {\n            onCells([...grid.map(pad), blankRow()]);\n            focusCell(grid.length, 0);\n          }}\n        >\n          <Plus aria-hidden className=\"size-3.5\" /> {labels.addRow}\n        </Button>\n        <Button\n          variant=\"ghost\"\n          className=\"px-2 py-1 text-xs text-[var(--text-muted)]\"\n          disabled={disabled || !cells.length}\n          onClick={() => {\n            onCells([]);\n            // The button is about to disable itself; focus must not go down with it.\n            focusCell(0, 0);\n          }}\n        >\n          <Eraser aria-hidden className=\"size-3.5\" /> {labels.clear}\n        </Button>\n        <span className=\"text-[11px] tabular-nums text-[var(--text-muted)]\">\n          {labels.points(filled.length)}\n        </span>\n        {problems > 0 && (\n          <span className=\"text-[11px] text-[var(--danger)]\">{labels.problems(problems)}</span>\n        )}\n        <span className=\"ms-auto flex items-center gap-1 text-[11px] text-[var(--text-muted)]\">\n          <ClipboardPaste aria-hidden className=\"size-3.5\" /> {labels.pasteHint}\n        </span>\n      </div>\n    </div>\n  );\n}\n\nconst textOf = (cells: string[][]) => cells.map((row) => row.join(\"\\t\")).join(\"\\n\");\n\n/**\n * The same table as text.\n *\n * Kept because the grid is worst at exactly what a textarea is best at: reading a long\n * export back in one piece. It commits on blur — through `parseRows`, the paste door —\n * and a line it cannot read is NAMED rather than dropped: half a sweep saved as a\n * measurement is worse than a refusal.\n */\nfunction TextView({ columns, cells, onCells, disabled, mark, labels, labelledBy, describedBy }: ViewProps) {\n  const text = textOf(cells);\n  const [draft, setDraft] = useState(text);\n  const [errorLine, setErrorLine] = useState<number | null>(null);\n  // Follow the table when it changes from outside (a generated shape, a cleared form).\n  // Compared as text, so a caller that rebuilds the same cells every render does not\n  // wipe what is being typed.\n  const [seen, setSeen] = useState(text);\n  if (seen !== text) {\n    setSeen(text);\n    setDraft(text);\n    setErrorLine(null);\n  }\n\n  const commit = () => {\n    // Untouched: nothing to read back, and re-reading would rewrite every cell in the\n    // lexer's spelling of it.\n    if (draft === text) return;\n    if (!draft.trim()) {\n      setErrorLine(null);\n      onCells([]);\n      return;\n    }\n    const parsed = parseRows(draft, columns.length);\n    if (\"error\" in parsed) {\n      setErrorLine(parsed.error);\n      return;\n    }\n    setErrorLine(null);\n    onCells(parsed.rows.map((row) => row.map((value) => withMark(String(value), mark))));\n  };\n\n  const lines = draft.split(\"\\n\").filter((line) => line.trim()).length;\n\n  return (\n    <div>\n      <Textarea\n        aria-labelledby={labelledBy}\n        aria-describedby={describedBy}\n        rows={10}\n        value={draft}\n        readOnly={disabled}\n        spellCheck={false}\n        className=\"font-mono text-xs\"\n        error={errorLine !== null ? labels.lineError(errorLine) : undefined}\n        onChange={(event) => setDraft(event.target.value)}\n        onBlur={commit}\n      />\n      <p className=\"mt-1 px-1 text-[11px] text-[var(--text-muted)]\">\n        {columns.map((column) => column.label).join(\" · \")}\n        {\" — \"}\n        {labels.points(lines)}\n      </p>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/measured-grid.tsx"],"sourcesContent":["import { useCallback, useEffect, useId, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithoutRef, KeyboardEvent, ReactNode } from \"react\";\nimport { ClipboardPaste, Eraser, Plus, Trash2 } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { horizontalStep } from \"../lib/direction\";\n// The cell pair reads ONE cell, where a comma has no columns to separate and so is\n// always a decimal mark; `splitRow` and `parseRows` read a pasted table, where it may\n// be either and the line decides. See the three named rules at the top of table-text.\nimport { cellNumber, isCellNumber, parseRows, splitRow } from \"../lib/table-text\";\nimport { useKitLabels, useKitLocale } from \"../i18n/kit-labels\";\nimport { useWindowedRows } from \"../hooks/use-windowed-rows\";\nimport { ToggleGroup } from \"./toggle-group\";\nimport { Button, FIELD_INVALID, Textarea } from \"./ui\";\n\n/**\n * A measured table: a fixed set of numeric columns, typed cell by cell or pasted as a\n * block out of a spreadsheet — and the hook that holds it as a draft.\n *\n * Moved from Lenkbank (`shared/ui/measured-grid.tsx`), where four gear editors and a\n * setpoint dialog type rig measurements into it. Nothing in it knows what a column\n * holds: the caller passes `{ label, unit }[]`, and the vocabulary of this file is\n * cells, rows, a caret and a paste. The lexing under it is `@eifi1/ui-kit/table-text`.\n *\n * What it is NOT: a `DataTable` mode (that one finds rows among many; this one types\n * numbers into columns), a spreadsheet (no formulas, no multi-cell selection, no undo\n * beyond the browser's per-input one), or typed columns — every cell is a string that\n * should read as a number.\n */\n\n/**\n * Every string the grid can speak — the `measuredGrid` namespace of\n * `<UiKitProvider labels>`, overridable per instance through the `labels` prop. The\n * ones that carry a number are functions of it, for the reason `DataTableLabels` gives:\n * the grammar around a count moves with it in most languages.\n */\nexport interface MeasuredGridLabels {\n  /** Accessible name of the cells/text toggle. */\n  view: string;\n  cellsView: string;\n  textView: string;\n  addRow: string;\n  /** The row's remove button, given its 1-based number. */\n  removeRow: (row: number) => string;\n  /** Empties the whole table. */\n  clear: string;\n  /** The footer's standing note that a block can be pasted into any cell. */\n  pasteHint: string;\n  /**\n   * Accessible name of one cell's input, given its column's label and 1-based row.\n   * A screen reader in a grid announces the headers on its own when the caret crosses\n   * one; this is what it reads when the caret lands on an input with no crossing — and\n   * what a voice-control user says to reach it.\n   */\n  cell: (column: string, row: number) => string;\n  /** The row-number column's header, which shows only \"#\". */\n  rowNumber: string;\n  /** The remove-button column's header, which shows nothing. */\n  rowActions: string;\n  /** The grid's description: how its keyboard works. Read once, on entry. */\n  keyboardHint: string;\n  /** The text view could not read this 1-based line of what was typed or pasted. */\n  lineError: (line: number) => string;\n  /** How many filled rows (measured points) the table holds. */\n  points: (count: number) => string;\n  /** How many cells are typed but are not numbers. */\n  problems: (count: number) => string;\n}\n\n/** English defaults. Exported as the `measuredGrid` namespace of `UiKitLabels`\n *  (src/i18n), the complete reference a translation is written against. */\nexport const DEFAULT_MEASURED_GRID_LABELS: MeasuredGridLabels = {\n  view: \"Table view\",\n  cellsView: \"Cells\",\n  textView: \"Text\",\n  addRow: \"Add row\",\n  removeRow: (row) => `Remove row ${row}`,\n  clear: \"Clear table\",\n  pasteHint: \"Paste a block from a spreadsheet into any cell\",\n  cell: (column, row) => `${column}, row ${row}`,\n  rowNumber: \"Row\",\n  rowActions: \"Row actions\",\n  keyboardHint:\n    \"Arrow keys move between cells. Type to replace a cell, F2 to edit it, Escape to undo the edit. Enter moves down and adds a row at the end.\",\n  lineError: (line) => `Line ${line} could not be read`,\n  points: (count) => (count === 1 ? \"1 point\" : `${count} points`),\n  problems: (count) => (count === 1 ? \"1 cell is not a number\" : `${count} cells are not numbers`),\n};\n\n/** One column of a measured table: what it holds and what it is measured in. The unit\n *  is separate from the name because the header shows it small and underneath, and\n *  because a column with no unit (a count, an index) should not render empty brackets. */\nexport interface MeasuredGridColumn {\n  label: string;\n  unit?: string;\n}\n\n/** The two ways to look at the same table. */\nexport type MeasuredGridView = \"cells\" | \"text\";\n\n/** A cell that has not been typed into yet. Distinguished from `\"0\"` on purpose: an\n *  empty cell is a hole in the measurement, and a table with a hole is not one to save. */\nconst BLANK = \"\";\n\n/** Height of one grid row, in pixels. Fixed, which is what lets the windowing be\n *  arithmetic rather than measurement. */\nconst DEFAULT_ROW_HEIGHT = 28;\n\nconst ALL_VIEWS: readonly MeasuredGridView[] = [\"cells\", \"text\"];\n\n/** The locale's decimal mark, as far as a cell can hold it: \",\" or \".\". A mark outside\n *  those two (Arabic's \"٫\") is not one `cellNumber` reads, so those locales keep the\n *  dot. The same answer `NumberField` gives, for the same reason. */\nfunction decimalMark(locale: string | undefined): \",\" | \".\" {\n  try {\n    const part = new Intl.NumberFormat(locale).formatToParts(1.5).find((p) => p.type === \"decimal\");\n    return part?.value === \",\" ? \",\" : \".\";\n  } catch {\n    // An invalid tag throws a RangeError; a typo in a locale must not take the grid down.\n    return \".\";\n  }\n}\n\n/** A number-shaped cell written with the locale's mark. The lexer hands back points;\n *  a German user typed commas and should read commas back. Anything that is not a\n *  number is left exactly as it was, so the mistake stays visible where it was made. */\nconst withMark = (cell: string, mark: \",\" | \".\") =>\n  mark === \",\" && isCellNumber(cell) ? cell.replace(\".\", \",\") : cell;\n\n/** A computed number as a draft cell: rounded to `digits`, with no trailing zeros. */\nconst formatCell = (value: number, digits: number, mark: \",\" | \".\") =>\n  withMark(String(Number(value.toFixed(digits))), mark);\n\nconst hasContent = (row: readonly string[]) => row.some((cell) => cell.trim() !== \"\");\n\nexport interface UseMeasuredRowsOptions {\n  /** Decimals a computed number is rounded to on its way into a cell. Default 4. */\n  digits?: number;\n  /** BCP 47 tag whose decimal mark the cells are written with, else the\n   *  `<UiKitProvider locale>`, else the runtime's. */\n  locale?: string;\n}\n\nexport interface MeasuredRows {\n  /** The draft, as text — what the grid shows and edits. */\n  cells: string[][];\n  setCells: (next: string[][]) => void;\n  /** The filled rows as numbers — EMPTY until the table is `ready`. */\n  rows: number[][];\n  /** Replace the whole table with computed numbers (a generated shape, say). */\n  setRows: (next: number[][]) => void;\n  /** At least two filled rows, and every cell in them is a number. */\n  ready: boolean;\n  /** How many cells are typed but are not numbers — what the grid marks invalid. */\n  problems: number;\n  /** Everything `MeasuredGrid` needs, so a caller spreads it in one line. */\n  props: { cells: string[][]; onCells: (next: string[][]) => void };\n}\n\n/**\n * The draft a measured table is edited as.\n *\n * **Strings, not numbers.** A cell is text while it is being typed — `\"-\"`, `\"1.\"` and\n * `\"1e\"` are all states a number passes through on its way to being one, and a grid\n * that parses on every keystroke turns each of them into a `NaN` and then into a `0`.\n * So the draft is text, and the numbers are what falls out when every cell is one.\n *\n * **\"Whole\" is a question this answers**, because every editor asks it before it\n * offers to save: `ready` wants at least two filled rows with a number in every cell.\n * An empty cell is a hole in the measurement, not a zero; a wholly empty row is not a\n * row at all (it is what walking off the bottom of the grid leaves behind).\n *\n * `initial` is read once, like `useState`'s.\n */\nexport function useMeasuredRows(\n  initial: number[][] | (() => number[][]),\n  options: UseMeasuredRowsOptions = {},\n): MeasuredRows {\n  const { digits = 4 } = options;\n  const mark = decimalMark(useKitLocale(options.locale));\n  const [cells, setCells] = useState<string[][]>(() =>\n    (typeof initial === \"function\" ? initial() : initial).map((row) =>\n      row.map((value) => formatCell(value, digits, mark)),\n    ),\n  );\n\n  const { rows, ready, problems } = useMemo(() => {\n    const filled = cells.filter(hasContent);\n    const whole = filled.length >= 2 && filled.every((row) => row.every(isCellNumber));\n    return {\n      rows: whole ? filled.map((row) => row.map(cellNumber)) : [],\n      ready: whole,\n      problems: filled.flat().filter((cell) => cell.trim() !== \"\" && !isCellNumber(cell)).length,\n    };\n  }, [cells]);\n\n  const setRows = useCallback(\n    (next: number[][]) => setCells(next.map((row) => row.map((value) => formatCell(value, digits, mark)))),\n    [digits, mark],\n  );\n  const props = useMemo(() => ({ cells, onCells: setCells }), [cells]);\n\n  return { cells, setCells, rows, setRows, ready, problems, props };\n}\n\nexport interface MeasuredGridProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"children\" | \"onChange\"> {\n  /** What the table is — shown above it, and the grid's accessible name. */\n  label: string;\n  /** A note under the table (which columns a layout expects, say). Also the grid's\n   *  description. */\n  hint?: ReactNode;\n  columns: MeasuredGridColumn[];\n  /** The draft — typically `useMeasuredRows().props`. */\n  cells: string[][];\n  onCells: (next: string[][]) => void;\n  /** Read-only: the cells can still be walked and read, nothing can be changed. */\n  disabled?: boolean;\n  /** Which views the toggle offers, the first being where it opens. Default both;\n   *  one view hides the toggle. */\n  views?: ReadonlyArray<MeasuredGridView>;\n  /** Row height in pixels, for the windowing. Fixed on purpose. Default 28. */\n  rowHeight?: number;\n  /** BCP 47 tag for the decimal mark of cells written by a paste or the text view,\n   *  and for the row numbers; else the `<UiKitProvider locale>`. */\n  locale?: string;\n  labels?: Partial<MeasuredGridLabels>;\n}\n\n/**\n * A measured table as a grid of cells, one number each, with a text view beside it.\n *\n * The grid is the primary form because a linkage typed off a drawing arrives as\n * numbers somebody reads out loud, and a textarea made that an exercise in counting\n * tab characters. The paste still works: a block pasted into any cell fills from that\n * cell outwards, growing the table to fit. The text view is kept for what a grid is\n * worst at — reading a thousand-row export back in one piece.\n *\n * **It is a grid in the APG sense**, which the Lenkbank original was not (a `<table>`\n * of inputs, fifteen tab stops per row). One tab stop — the roving tabindex — and the\n * keyboard inside it, as a spreadsheet has it:\n *\n *   - **Arrows** move between cells. Left/Right flip under `dir=\"rtl\"`.\n *   - **Home/End** go to the first/last column; with Ctrl (or ⌘), to the first/last\n *     cell of the table. **PageUp/PageDown** move a screenful.\n *   - **Enter** (and ArrowDown) move down a column, and past the last row ADD one —\n *     typing down a column is how measured data is entered, and stopping at the last\n *     row to reach for a button is what makes people paste instead. Shift+Enter moves up.\n *   - **Typing** replaces the cell: arriving by keyboard selects its text, so the first\n *     key overwrites it. That is the edit mode data entry wants, entered without a key.\n *     **F2** edits in place instead (caret at the end). Either way the cell is then\n *     *editing*: Left/Right move the caret, and cross to the next cell only at the edge\n *     of the text; Home/End stay in the text. **Escape** puts back what the cell held\n *     when the caret arrived, and leaves editing.\n *\n * APG's grid pattern pairs Enter with F2 as the keys that start editing. Enter is\n * spent on \"next row\" here on purpose — it is the one key a person typing a column of\n * numbers presses between every one of them, and every spreadsheet spends it the same\n * way — and typing-to-replace makes an explicit \"start editing\" key unnecessary for\n * the common case. F2 remains for the uncommon one.\n */\nexport function MeasuredGrid({\n  label,\n  hint,\n  columns,\n  cells,\n  onCells,\n  disabled,\n  views = ALL_VIEWS,\n  rowHeight = DEFAULT_ROW_HEIGHT,\n  locale: localeProp,\n  labels: labelsProp,\n  className,\n  ...rest\n}: MeasuredGridProps) {\n  const labels = useKitLabels(\"measuredGrid\", DEFAULT_MEASURED_GRID_LABELS, labelsProp);\n  const locale = useKitLocale(localeProp);\n  const mark = decimalMark(locale);\n  const id = useId();\n  const labelId = `${id}-label`;\n  const hintId = `${id}-hint`;\n  const keysId = `${id}-keys`;\n  const offered = views.length ? views : ALL_VIEWS;\n  const [chosen, setChosen] = useState<MeasuredGridView>(offered[0]);\n  const view = offered.includes(chosen) ? chosen : offered[0];\n\n  return (\n    // `relative` so the keyboard description below can be `sr-only` without escaping\n    // to the initial containing block (see sr-only-containment.test).\n    <div {...rest} className={cn(\"relative\", className)}>\n      <div className=\"mb-1 flex flex-wrap items-center justify-between gap-2\">\n        <span id={labelId} className=\"text-[11px] font-medium text-[var(--text-muted)]\">\n          {label}\n        </span>\n        {offered.length > 1 && (\n          <ToggleGroup\n            className=\"w-auto\"\n            aria-label={labels.view}\n            value={view}\n            onChange={setChosen}\n            options={offered.map((value) => ({\n              value,\n              label: value === \"cells\" ? labels.cellsView : labels.textView,\n            }))}\n          />\n        )}\n      </div>\n      {view === \"cells\" ? (\n        <CellGrid\n          columns={columns}\n          cells={cells}\n          onCells={onCells}\n          disabled={disabled}\n          rowHeight={rowHeight}\n          locale={locale}\n          mark={mark}\n          labels={labels}\n          labelledBy={labelId}\n          describedBy={hint ? `${keysId} ${hintId}` : keysId}\n        />\n      ) : (\n        <TextView\n          columns={columns}\n          cells={cells}\n          onCells={onCells}\n          disabled={disabled}\n          mark={mark}\n          labels={labels}\n          labelledBy={labelId}\n          describedBy={hint ? hintId : undefined}\n        />\n      )}\n      {hint && (\n        <p id={hintId} className=\"mt-1 px-1 text-[11px] text-[var(--text-muted)]\">\n          {hint}\n        </p>\n      )}\n      {view === \"cells\" && (\n        <span id={keysId} className=\"sr-only\">\n          {labels.keyboardHint}\n        </span>\n      )}\n    </div>\n  );\n}\n\n/** Where the caret is. Held in state rather than read off `document`, because a\n *  windowed grid unmounts the cell being walked towards: the move is decided first and\n *  focused after the row it lands on has been rendered. */\ninterface Caret {\n  row: number;\n  column: number;\n}\n\ninterface ViewProps {\n  columns: MeasuredGridColumn[];\n  cells: string[][];\n  onCells: (next: string[][]) => void;\n  disabled?: boolean;\n  mark: \",\" | \".\";\n  labels: MeasuredGridLabels;\n  labelledBy: string;\n  describedBy?: string;\n}\n\nfunction CellGrid({\n  columns,\n  cells,\n  onCells,\n  disabled,\n  rowHeight,\n  locale,\n  mark,\n  labels,\n  labelledBy,\n  describedBy,\n}: ViewProps & { rowHeight: number; locale: string | undefined }) {\n  const scrollRef = useRef<HTMLDivElement>(null);\n  const headRef = useRef<HTMLDivElement>(null);\n  const width = columns.length;\n  const blankRow = () => columns.map(() => BLANK);\n  // At least one row to type into: a grid with nothing in it has nowhere to put the\n  // first number, and \"add a row\" is not the first thing to ask of someone who has\n  // just opened an empty table. It is not written back until something is typed.\n  const grid = cells.length ? cells : [blankRow()];\n  const { first, last, totalHeight } = useWindowedRows(grid.length, rowHeight, scrollRef);\n  const rowNumber = useMemo(() => new Intl.NumberFormat(locale), [locale]);\n\n  // The remove buttons are the last column of the grid, reachable by the arrows like\n  // any cell — except where they are disabled (a read-only grid, or the placeholder\n  // row of an empty one), because a disabled button cannot hold the tab stop.\n  const removable = !disabled && cells.length > 0;\n  const lastColumn = removable ? width : width - 1;\n\n  const [caret, setCaret] = useState<Caret>({ row: 0, column: 0 });\n  // Clamped on read, not corrected in an effect: rows removed or columns changed from\n  // outside must never leave the tab stop on a cell that is not there.\n  const at = { row: Math.min(caret.row, grid.length - 1), column: Math.min(caret.column, lastColumn) };\n  /** Whether the caret cell is being edited in place (see the component note). */\n  const [editing, setEditing] = useState(false);\n  /** A cell that has to take focus once it exists — one commit away when the move\n   *  crossed the edge of the window. `select` is arrival by keyboard. */\n  const pending = useRef<(Caret & { select: boolean }) | null>(null);\n  /** What the caret cell held when the caret arrived: what Escape puts back. */\n  const origin = useRef(BLANK);\n  /** The next focus was a pointer's: place the caret where it was clicked, edit. */\n  const pointer = useRef(false);\n\n  useEffect(() => {\n    const target = pending.current;\n    if (!target) return;\n    const element = scrollRef.current?.querySelector<HTMLElement>(\n      `[data-cell=\"${target.row}:${target.column}\"]`,\n    );\n    if (!element) return;\n    pending.current = null;\n    // `preventScroll`: `reveal` already scrolled the row clear of the sticky header,\n    // which the browser's own scroll-into-view does not know is there.\n    element.focus({ preventScroll: true });\n    if (target.select && element instanceof HTMLInputElement) element.select();\n  });\n\n  const pad = (row: readonly string[] | undefined) =>\n    Array.from({ length: width }, (_, index) => row?.[index] ?? BLANK);\n\n  const setCell = (row: number, column: number, value: string) => {\n    const next = grid.map(pad);\n    next[row][column] = value;\n    onCells(next);\n  };\n\n  /** Scroll `row` into the band below the sticky header. */\n  const reveal = (row: number) => {\n    const element = scrollRef.current;\n    if (!element) return;\n    const room = element.clientHeight - (headRef.current?.offsetHeight ?? 0);\n    if (room <= 0) return;\n    const top = row * rowHeight;\n    if (top < element.scrollTop) element.scrollTop = top;\n    else if (top + rowHeight > element.scrollTop + room) element.scrollTop = top + rowHeight - room;\n  };\n\n  const focusCell = (row: number, column: number) => {\n    reveal(row);\n    pending.current = { row, column, select: true };\n    setCaret({ row, column });\n    setEditing(false);\n  };\n\n  const go = (row: number, column: number) => {\n    const target = {\n      row: Math.max(0, Math.min(row, grid.length - 1)),\n      column: Math.max(0, Math.min(column, lastColumn)),\n    };\n    if (target.row === at.row && target.column === at.column) return;\n    focusCell(target.row, target.column);\n  };\n\n  /** Down a column — and off the bottom, a new row, unless the last one is still\n   *  empty: holding ArrowDown should not leave a trail of blank rows behind it. */\n  const down = (row: number, column: number) => {\n    if (row + 1 < grid.length) return go(row + 1, column);\n    if (disabled || !hasContent(grid[row])) return;\n    onCells([...grid.map(pad), blankRow()]);\n    focusCell(row + 1, Math.min(column, width - 1));\n  };\n\n  const page = () => {\n    const element = scrollRef.current;\n    const room = element ? element.clientHeight - (headRef.current?.offsetHeight ?? 0) : 0;\n    // No layout (a hidden pane, jsdom): a fixed ten rather than one row at a time.\n    return room > 0 ? Math.max(1, Math.floor(room / rowHeight) - 1) : 10;\n  };\n\n  /**\n   * On each cell rather than once on the grid, for the reason `MiniCalendar` gives:\n   * the cell is where focus is, and a container listening for keys it cannot receive\n   * is the shape `jsx-a11y/interactive-supports-focus` objects to.\n   */\n  const onCellKeyDown = (event: KeyboardEvent<HTMLElement>, row: number, column: number) => {\n    const input = event.currentTarget instanceof HTMLInputElement ? event.currentTarget : null;\n    const inText = Boolean(input) && editing;\n    const modified = event.ctrlKey || event.metaKey;\n    switch (event.key) {\n      case \"ArrowUp\":\n        event.preventDefault();\n        return go(row - 1, column);\n      case \"ArrowDown\":\n        event.preventDefault();\n        return down(row, column);\n      case \"Enter\":\n        // On the remove button Enter is the button's own.\n        if (!input) return;\n        event.preventDefault();\n        return event.shiftKey ? go(row - 1, column) : down(row, column);\n      case \"ArrowLeft\":\n      case \"ArrowRight\": {\n        // Along the reading direction: ArrowLeft is \"next column\" in RTL.\n        const forward = horizontalStep(event.key, event.currentTarget) === 1;\n        if (inText && input) {\n          const edge = forward ? input.value.length : 0;\n          // Inside the text the caret moves; only at its edge does it leave the cell.\n          if (input.selectionStart !== edge || input.selectionEnd !== edge) return;\n        }\n        event.preventDefault();\n        return go(row, column + (forward ? 1 : -1));\n      }\n      case \"Home\":\n      case \"End\": {\n        if (inText && !modified) return;\n        event.preventDefault();\n        const home = event.key === \"Home\";\n        if (modified) return go(home ? 0 : grid.length - 1, home ? 0 : width - 1);\n        return go(row, home ? 0 : width - 1);\n      }\n      case \"PageUp\":\n        event.preventDefault();\n        return go(row - page(), column);\n      case \"PageDown\":\n        event.preventDefault();\n        return go(row + page(), column);\n      case \"F2\":\n        if (!input || disabled) return;\n        event.preventDefault();\n        setEditing(true);\n        input.setSelectionRange(input.value.length, input.value.length);\n        return;\n      case \"Escape\":\n        // Not editing: nothing of ours to undo, so the key belongs to whatever the\n        // grid sits in — the dialog it is in closes, as it should.\n        if (!input || !editing) return;\n        event.preventDefault();\n        event.stopPropagation();\n        if (input.value !== origin.current) setCell(row, column, origin.current);\n        pending.current = { row, column, select: true };\n        setEditing(false);\n        return;\n    }\n  };\n\n  /**\n   * A pasted block, written in from the cell it was pasted into.\n   *\n   * Rows past the end grow the table; columns past the last are dropped, because a\n   * paste wider than the measurement is a paste with a trailing timestamp column and\n   * not an error worth refusing. One header line is skipped — pasted data almost\n   * always has one. Each line is read on its own evidence (`splitRow`, the per-line\n   * comma rule), so one line cannot change what another means.\n   */\n  const paste = (row: number, column: number, text: string) => {\n    const lines = text.split(/\\r?\\n/).filter((line) => line.trim() !== \"\");\n    if (!lines.length) return;\n    const block = lines.map(splitRow);\n    if (block.length > 1 && block[0].some((cell) => !isCellNumber(cell))) block.shift();\n\n    const height = Math.max(grid.length, row + block.length);\n    const next = Array.from({ length: height }, (_, index) => pad(grid[index]));\n    block.forEach((line, downwards) => {\n      line.forEach((cell, across) => {\n        const target = column + across;\n        if (target < width) next[row + downwards][target] = withMark(cell.trim(), mark);\n      });\n    });\n    onCells(next);\n    pending.current = { row, column, select: true };\n    setEditing(false);\n  };\n\n  const template = `2.5rem repeat(${width}, minmax(5.5rem, 1fr)) 2rem`;\n  // The caret's row is mounted even when it has been scrolled out of the window: it\n  // holds the grid's only tab stop, and a tab stop that is not in the DOM is a grid\n  // Tab walks straight past.\n  const mounted: number[] = [];\n  for (let index = first; index < last; index += 1) mounted.push(index);\n  if (at.row < first || at.row >= last) mounted.push(at.row);\n\n  const filled = cells.filter(hasContent);\n  const problems = filled.flat().filter((cell) => cell.trim() !== \"\" && !isCellNumber(cell)).length;\n\n  return (\n    <div className=\"rounded-md border border-[var(--border)] bg-[var(--bg-surface)]\">\n      <div ref={scrollRef} className=\"max-h-72 overflow-auto\">\n        <div\n          role=\"grid\"\n          aria-labelledby={labelledBy}\n          aria-describedby={describedBy}\n          // The true size, not the mounted one: a screen reader otherwise reports the\n          // thirty rows in the window as the whole table.\n          aria-rowcount={grid.length + 1}\n          aria-colcount={width + 2}\n          aria-readonly={disabled || undefined}\n          className=\"text-xs\"\n          style={{ minWidth: `calc(4.5rem + ${width} * 5.5rem)` }}\n        >\n          {/* The header stays put vertically and scrolls sideways with the body, so a\n              fifteen-column linkage can be read without losing which column is which. */}\n          <div ref={headRef} role=\"rowgroup\" className=\"sticky top-0 z-10 bg-[var(--bg-surface-2)]\">\n            <div\n              role=\"row\"\n              aria-rowindex={1}\n              className=\"grid border-b border-[var(--border)]\"\n              style={{ gridTemplateColumns: template }}\n            >\n              <div\n                role=\"columnheader\"\n                aria-label={labels.rowNumber}\n                className=\"flex items-end justify-end px-1 py-1 text-[10px] text-[var(--text-placeholder)]\"\n              >\n                #\n              </div>\n              {columns.map((column, index) => (\n                <div\n                  key={index}\n                  role=\"columnheader\"\n                  className=\"min-w-0 border-s border-[var(--border)] px-2 py-1 text-end\"\n                >\n                  <span className=\"block truncate font-medium text-[var(--text-primary)]\">\n                    {column.label}\n                  </span>\n                  {column.unit && (\n                    <span className=\"block truncate text-[10px] text-[var(--text-muted)]\">\n                      {column.unit}\n                    </span>\n                  )}\n                </div>\n              ))}\n              <div\n                role=\"columnheader\"\n                aria-label={labels.rowActions}\n                className=\"border-s border-[var(--border)]\"\n              />\n            </div>\n          </div>\n          {/* Only the rows in the window are mounted — a swept linkage is thousands of\n              them across fifteen inputs — each placed at its own offset, so mounting\n              one more (the caret's) costs nothing in the arithmetic. */}\n          <div role=\"rowgroup\" className=\"relative\" style={{ height: totalHeight }}>\n            {mounted.map((index) => {\n              const row = grid[index];\n              return (\n                <div\n                  key={index}\n                  role=\"row\"\n                  aria-rowindex={index + 2}\n                  className=\"absolute inset-x-0 grid hover:bg-[var(--bg-hover)]\"\n                  style={{ top: index * rowHeight, height: rowHeight, gridTemplateColumns: template }}\n                >\n                  <div\n                    role=\"rowheader\"\n                    className=\"flex items-center justify-end px-1 text-[10px] tabular-nums text-[var(--text-placeholder)]\"\n                  >\n                    {rowNumber.format(index + 1)}\n                  </div>\n                  {columns.map((column, columnIndex) => {\n                    const value = row[columnIndex] ?? BLANK;\n                    const bad = value.trim() !== \"\" && !isCellNumber(value);\n                    const isCaret = at.row === index && at.column === columnIndex;\n                    return (\n                      <div key={columnIndex} role=\"gridcell\" className=\"min-w-0 border-s border-[var(--border)]\">\n                        <input\n                          data-cell={`${index}:${columnIndex}`}\n                          value={value}\n                          // `readOnly`, not `disabled`: a disabled input cannot take\n                          // focus, and a read-only table should still be walkable.\n                          readOnly={disabled}\n                          tabIndex={isCaret ? 0 : -1}\n                          inputMode=\"decimal\"\n                          spellCheck={false}\n                          autoComplete=\"off\"\n                          aria-label={labels.cell(column.label, index + 1)}\n                          // Said, not only painted: the ring is what a sighted user\n                          // sees, `aria-invalid` is what a screen reader reads.\n                          aria-invalid={bad || undefined}\n                          className={cn(\n                            \"block size-full bg-transparent px-2 text-end tabular-nums text-[var(--text-primary)] outline-none\",\n                            // Arriving selects the text (typing replaces it); editing\n                            // in place is the plain surface with a caret in it.\n                            \"focus:bg-[var(--brand-bg)] focus:ring-2 focus:ring-inset focus:ring-[var(--brand)]\",\n                            isCaret && editing && \"focus:bg-[var(--bg-surface)]\",\n                            disabled && \"text-[var(--text-muted)]\",\n                            bad && cn(FIELD_INVALID, \"ring-inset\"),\n                          )}\n                          onMouseDown={(event) => {\n                            // A click places a caret, which is editing. On the cell\n                            // already focused there is no focus event to say so.\n                            if (document.activeElement === event.currentTarget) setEditing(!disabled);\n                            else pointer.current = true;\n                          }}\n                          onFocus={(event) => {\n                            origin.current = event.currentTarget.value;\n                            if (!isCaret) setCaret({ row: index, column: columnIndex });\n                            const byPointer = pointer.current;\n                            pointer.current = false;\n                            setEditing(byPointer && !disabled);\n                            if (!byPointer) event.currentTarget.select();\n                          }}\n                          onBlur={() => setEditing(false)}\n                          onChange={(event) => {\n                            setCell(index, columnIndex, event.target.value);\n                            setEditing(true);\n                          }}\n                          onPaste={(event) => {\n                            if (disabled) return;\n                            const text = event.clipboardData.getData(\"text/plain\");\n                            // One cell's worth of text is an ordinary paste, and the\n                            // browser does it better than this would; only a block is\n                            // the grid's business.\n                            if (!/[\\t\\n;]/.test(text)) return;\n                            event.preventDefault();\n                            paste(index, columnIndex, text);\n                          }}\n                          onKeyDown={(event) => onCellKeyDown(event, index, columnIndex)}\n                        />\n                      </div>\n                    );\n                  })}\n                  <div\n                    role=\"gridcell\"\n                    className=\"flex items-center justify-center border-s border-[var(--border)]\"\n                  >\n                    <button\n                      type=\"button\"\n                      data-cell={`${index}:${width}`}\n                      disabled={!removable}\n                      tabIndex={at.row === index && at.column === width ? 0 : -1}\n                      aria-label={labels.removeRow(index + 1)}\n                      className=\"rounded p-1 text-[var(--text-placeholder)] outline-none hover:text-[var(--danger)] focus-visible:ring-2 focus-visible:ring-[var(--brand)] disabled:cursor-default disabled:hover:text-[var(--text-placeholder)]\"\n                      onKeyDown={(event) => onCellKeyDown(event, index, width)}\n                      onFocus={() => {\n                        if (at.row !== index || at.column !== width) setCaret({ row: index, column: width });\n                      }}\n                      onClick={() => {\n                        const next = grid.filter((_, other) => other !== index);\n                        onCells(next);\n                        // Focus stays in the column, on the row that moved up into\n                        // this one; an emptied table sends it to the first cell.\n                        if (next.length) focusCell(Math.min(index, next.length - 1), width);\n                        else focusCell(0, 0);\n                      }}\n                    >\n                      <Trash2 aria-hidden className=\"size-3.5\" />\n                    </button>\n                  </div>\n                </div>\n              );\n            })}\n          </div>\n        </div>\n      </div>\n      <div className=\"flex flex-wrap items-center gap-x-2 gap-y-1 border-t border-[var(--border)] px-2 py-1.5\">\n        <Button\n          variant=\"ghost\"\n          className=\"px-2 py-1 text-xs\"\n          disabled={disabled}\n          onClick={() => {\n            onCells([...grid.map(pad), blankRow()]);\n            focusCell(grid.length, 0);\n          }}\n        >\n          <Plus aria-hidden className=\"size-3.5\" /> {labels.addRow}\n        </Button>\n        <Button\n          variant=\"ghost\"\n          className=\"px-2 py-1 text-xs text-[var(--text-muted)]\"\n          disabled={disabled || !cells.length}\n          onClick={() => {\n            onCells([]);\n            // The button is about to disable itself; focus must not go down with it.\n            focusCell(0, 0);\n          }}\n        >\n          <Eraser aria-hidden className=\"size-3.5\" /> {labels.clear}\n        </Button>\n        <span className=\"text-[11px] tabular-nums text-[var(--text-muted)]\">\n          {/* bdi: an LTR label (\"3 points\") in an RTL grid would reorder to \"points 3\". */}\n          <bdi>{labels.points(filled.length)}</bdi>\n        </span>\n        {problems > 0 && (\n          <span className=\"text-[11px] text-[var(--danger)]\">{labels.problems(problems)}</span>\n        )}\n        <span className=\"ms-auto flex items-center gap-1 text-[11px] text-[var(--text-muted)]\">\n          <ClipboardPaste aria-hidden className=\"size-3.5\" /> {labels.pasteHint}\n        </span>\n      </div>\n    </div>\n  );\n}\n\nconst textOf = (cells: string[][]) => cells.map((row) => row.join(\"\\t\")).join(\"\\n\");\n\n/**\n * The same table as text.\n *\n * Kept because the grid is worst at exactly what a textarea is best at: reading a long\n * export back in one piece. It commits on blur — through `parseRows`, the paste door —\n * and a line it cannot read is NAMED rather than dropped: half a sweep saved as a\n * measurement is worse than a refusal.\n */\nfunction TextView({ columns, cells, onCells, disabled, mark, labels, labelledBy, describedBy }: ViewProps) {\n  const text = textOf(cells);\n  const [draft, setDraft] = useState(text);\n  const [errorLine, setErrorLine] = useState<number | null>(null);\n  // Follow the table when it changes from outside (a generated shape, a cleared form).\n  // Compared as text, so a caller that rebuilds the same cells every render does not\n  // wipe what is being typed.\n  const [seen, setSeen] = useState(text);\n  if (seen !== text) {\n    setSeen(text);\n    setDraft(text);\n    setErrorLine(null);\n  }\n\n  const commit = () => {\n    // Untouched: nothing to read back, and re-reading would rewrite every cell in the\n    // lexer's spelling of it.\n    if (draft === text) return;\n    if (!draft.trim()) {\n      setErrorLine(null);\n      onCells([]);\n      return;\n    }\n    const parsed = parseRows(draft, columns.length);\n    if (\"error\" in parsed) {\n      setErrorLine(parsed.error);\n      return;\n    }\n    setErrorLine(null);\n    onCells(parsed.rows.map((row) => row.map((value) => withMark(String(value), mark))));\n  };\n\n  const lines = draft.split(\"\\n\").filter((line) => line.trim()).length;\n\n  return (\n    <div>\n      <Textarea\n        aria-labelledby={labelledBy}\n        aria-describedby={describedBy}\n        rows={10}\n        value={draft}\n        readOnly={disabled}\n        spellCheck={false}\n        className=\"font-mono text-xs\"\n        error={errorLine !== null ? labels.lineError(errorLine) : undefined}\n        onChange={(event) => setDraft(event.target.value)}\n        onBlur={commit}\n      />\n      <p className=\"mt-1 px-1 text-[11px] text-[var(--text-muted)]\">\n        {columns.map((column) => column.label).join(\" · \")}\n        {\" — \"}\n        <bdi>{labels.points(lines)}</bdi>\n      </p>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/money-field.d.ts

@@ -0,0 +1,92 @@
+import * as react from 'react';
+import { ComponentProps, Ref } from 'react';
+import { AmountInput } from './amount-input.js';
+import './calculator.js';
+import '../kit-labels-BHfRBbHs.js';
+import './data-table-labels.js';
+import './mini-calendar.js';
+import './calendar-heatmap.js';
+import './popover.js';
+import './chip.js';
+import 'lucide-react';
+import './field-sync.js';
+import './tooltip.js';
+import '../hooks/use-anchored-rect.js';
+import '../lib/clipping.js';
+import '../wizard/types.js';
+import '../tour/tour.js';
+import '../search/command-palette.js';
+import '../search/global-search.js';
+import '../search/search-index.js';
+import './month-picker.js';
+import './page-contents.js';
+import './series-chart-labels.js';
+import './pie-chart-labels.js';
+import './sparkline.js';
+import './stat-tile.js';
+import './signature-pad.js';
+import './password-strength.js';
+import './danger-confirm.js';
+import './swatch-picker.js';
+import './tile-radio.js';
+import './icon-picker.js';
+import './dialog-frame.js';
+import './modal.js';
+import '../hooks/use-search-param-state.js';
+import './measured-grid.js';
+import '../feedback/feedback-attachment.js';
+import '../feedback/feedback-dialog.js';
+import '../feedback/feedback-thread.js';
+import '../feedback/feedback-inbox.js';
+import './account-settings-labels.js';
+import './confirm-dialog.js';
+import './floating-panel.js';
+import './bulk-action-bar.js';
+import './list.js';
+import './breadcrumbs.js';
+import './toast.js';
+import './description-list.js';
+import './line-items.js';
+import './progress-bar.js';
+import './signed-amount.js';
+import './error-boundary.js';
+import './authed-image.js';
+import '../hooks/use-authed-src.js';
+import './image-grid.js';
+import './lightbox.js';
+import './numpad-sheet.js';
+
+type AmountInputProps = ComponentProps<typeof AmountInput>;
+interface MoneyFieldProps extends Omit<AmountInputProps, "value" | "onChange" | "onCommit" | "negative" | "onNegativeChange" | "ref"> {
+    /** The amount, or `null` for an empty field. */
+    value: number | null;
+    /**
+     * The settled amount — on blur, on Enter, on the numpad's "=" and on a calculator
+     * result; never a half-typed "1200+". Rounded to the currency's minor unit (or
+     * `digits`) and clamped to `min` / `max`, like {@link AmountInput}. `null` when the
+     * field was emptied. Not fired when the settled amount equals `value`, so an
+     * Enter-then-blur saves once.
+     */
+    onCommit: (value: number | null) => void;
+    ref?: Ref<HTMLInputElement>;
+}
+/**
+ * {@link AmountInput} with a NUMBER in and a number out, for money edited outside a
+ * form — a budget row, a table cell (kastlan 52: new-budget-page edited a CHF amount per
+ * row with `NumberField` because AmountInput is string-valued and reports every
+ * keystroke, "1200+" included, so a number-state row needed its own parse-and-settle
+ * glue). This is that glue, the same one `RhfMoneyField` has: the text being typed
+ * lives here, and only a settled figure reaches `onCommit`.
+ *
+ * The currency chip, the calculator, the numpad, the locale's decimal mark, the
+ * rounding to the currency's minor unit and `min` / `max` are AmountInput's. A caller-
+ * owned sign (`negative`) is not offered: the figure here carries its own minus.
+ *
+ * ```tsx
+ * <MoneyField ariaLabel="Amount" currency="CHF" value={row.amount}
+ *   onCommit={(amount) => updateRow(row.id, { amount })} />
+ * ```
+ */
+declare function MoneyField({ value, onCommit, ref, ...props }: MoneyFieldProps): react.JSX.Element;
+
+export { MoneyField, type MoneyFieldProps };

package/dist/components/money-field.js

@@ -0,0 +1,40 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { useState } from "react";
+import { AmountInput } from "./amount-input.js";
+function parseSettled(text) {
+  const t = text.trim();
+  if (t === "") return null;
+  const n = Number(t);
+  return Number.isFinite(n) ? n : void 0;
+}
+function MoneyField({ value, onCommit, ref, ...props }) {
+  const external = value === null ? "" : String(value);
+  const [draft, setDraft] = useState(external);
+  const [seen, setSeen] = useState(value);
+  if (seen !== value) {
+    setSeen(value);
+    if (parseSettled(draft) !== value) setDraft(external);
+  }
+  return /* @__PURE__ */ jsx(
+    AmountInput,
+    {
+      ...props,
+      ref,
+      value: draft,
+      onChange: setDraft,
+      onCommit: (text) => {
+        const next = parseSettled(text);
+        if (next === void 0) {
+          setDraft(external);
+          return;
+        }
+        if (next !== value) onCommit(next);
+      }
+    }
+  );
+}
+export {
+  MoneyField
+};
+//# sourceMappingURL=money-field.js.map

package/dist/components/money-field.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/money-field.tsx"],"sourcesContent":["import { useState, type ComponentProps, type Ref } from \"react\";\nimport { AmountInput } from \"./amount-input\";\n\ntype AmountInputProps = ComponentProps<typeof AmountInput>;\n\nexport interface MoneyFieldProps\n  extends Omit<AmountInputProps, \"value\" | \"onChange\" | \"onCommit\" | \"negative\" | \"onNegativeChange\" | \"ref\"> {\n  /** The amount, or `null` for an empty field. */\n  value: number | null;\n  /**\n   * The settled amount — on blur, on Enter, on the numpad's \"=\" and on a calculator\n   * result; never a half-typed \"1200+\". Rounded to the currency's minor unit (or\n   * `digits`) and clamped to `min` / `max`, like {@link AmountInput}. `null` when the\n   * field was emptied. Not fired when the settled amount equals `value`, so an\n   * Enter-then-blur saves once.\n   */\n  onCommit: (value: number | null) => void;\n  ref?: Ref<HTMLInputElement>;\n}\n\n/** The number a settled text reads as: `null` for empty, `undefined` for no number\n *  (a lone \"-\" or \".\"). */\nfunction parseSettled(text: string): number | null | undefined {\n  const t = text.trim();\n  if (t === \"\") return null;\n  const n = Number(t);\n  return Number.isFinite(n) ? n : undefined;\n}\n\n/**\n * {@link AmountInput} with a NUMBER in and a number out, for money edited outside a\n * form — a budget row, a table cell (kastlan 52: new-budget-page edited a CHF amount per\n * row with `NumberField` because AmountInput is string-valued and reports every\n * keystroke, \"1200+\" included, so a number-state row needed its own parse-and-settle\n * glue). This is that glue, the same one `RhfMoneyField` has: the text being typed\n * lives here, and only a settled figure reaches `onCommit`.\n *\n * The currency chip, the calculator, the numpad, the locale's decimal mark, the\n * rounding to the currency's minor unit and `min` / `max` are AmountInput's. A caller-\n * owned sign (`negative`) is not offered: the figure here carries its own minus.\n *\n * ```tsx\n * <MoneyField ariaLabel=\"Amount\" currency=\"CHF\" value={row.amount}\n *   onCommit={(amount) => updateRow(row.id, { amount })} />\n * ```\n */\nexport function MoneyField({ value, onCommit, ref, ...props }: MoneyFieldProps) {\n  const external = value === null ? \"\" : String(value);\n  // The draft is re-read from `value` only when `value` moves away from what the draft\n  // already says (a reset, another row's save), so a commit's own echo keeps the\n  // typist's spelling (\"12.50\" stays \"12.50\" when 12.5 comes back).\n  const [draft, setDraft] = useState(external);\n  const [seen, setSeen] = useState(value);\n  if (seen !== value) {\n    setSeen(value);\n    if (parseSettled(draft) !== value) setDraft(external);\n  }\n  return (\n    <AmountInput\n      {...props}\n      ref={ref}\n      value={draft}\n      onChange={setDraft}\n      onCommit={(text) => {\n        const next = parseSettled(text);\n        // No number (\"-\" alone): back to the stored amount rather than a guess.\n        if (next === undefined) {\n          setDraft(external);\n          return;\n        }\n        if (next !== value) onCommit(next);\n      }}\n    />\n  );\n}\n"],"mappings":";AA0DI;AA1DJ,SAAS,gBAA+C;AACxD,SAAS,mBAAmB;AAqB5B,SAAS,aAAa,MAAyC;AAC7D,QAAM,IAAI,KAAK,KAAK;AACpB,MAAI,MAAM,GAAI,QAAO;AACrB,QAAM,IAAI,OAAO,CAAC;AAClB,SAAO,OAAO,SAAS,CAAC,IAAI,IAAI;AAClC;AAmBO,SAAS,WAAW,EAAE,OAAO,UAAU,KAAK,GAAG,MAAM,GAAoB;AAC9E,QAAM,WAAW,UAAU,OAAO,KAAK,OAAO,KAAK;AAInD,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,QAAQ;AAC3C,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,MAAI,SAAS,OAAO;AAClB,YAAQ,KAAK;AACb,QAAI,aAAa,KAAK,MAAM,MAAO,UAAS,QAAQ;AAAA,EACtD;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ;AAAA,MACA,OAAO;AAAA,MACP,UAAU;AAAA,MACV,UAAU,CAAC,SAAS;AAClB,cAAM,OAAO,aAAa,IAAI;AAE9B,YAAI,SAAS,QAAW;AACtB,mBAAS,QAAQ;AACjB;AAAA,QACF;AACA,YAAI,SAAS,MAAO,UAAS,IAAI;AAAA,MACnC;AAAA;AAAA,EACF;AAEJ;","names":[]}

package/dist/components/multi-select.js

@@ -123,6 +123,9 @@ function MultiSelect({
             label !== void 0 && FIELD_FLOATING_PAD,
             // FIELD_TRIGGER's hover would still light a trigger nothing can open.
             "disabled:hover:bg-[var(--bg-surface-2)]",
+            // Dimmed like EntityCombobox's and MultiEntityCombobox's disabled triggers;
+            // only the label was, so a disabled MultiSelect read as live (showcase audit).
+            "disabled:cursor-not-allowed disabled:opacity-50",
             field.isInvalid && FIELD_INVALID
           ),
           children: [

package/dist/components/multi-select.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/multi-select.tsx"],"sourcesContent":["import { useId, useMemo, useState } from \"react\";\nimport type {\n  ComponentPropsWithoutRef,\n  KeyboardEvent as ReactKeyboardEvent,\n  ReactNode,\n} from \"react\";\nimport { Check } from \"lucide-react\";\nimport { FieldChevron, FieldLabel, FIELD_TRIGGER, FIELD_INVALID, FIELD_FLOATING_PAD } from \"./ui\";\nimport { cn } from \"../lib/cn\";\nimport { DropdownPanel, DropdownSearchHeader, useDropdownSearch } from \"./dropdown\";\nimport { useActiveOptionScroll, useComboboxFieldError } from \"./combobox-core\";\nimport {\n  DEFAULT_COMMON_LABELS,\n  DEFAULT_MULTI_SELECT_LABELS,\n  useKitLabels,\n} from \"../i18n/kit-labels\";\n\nexport interface MultiSelectOption {\n  value: string | number;\n  label: string;\n  hint?: string;\n}\n\n/** `onChange` is the kit's — \"the selection changed\", carrying the new values —\n *  rather than the div's form event. */\nexport interface MultiSelectProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n  options: MultiSelectOption[];\n  values: (string | number)[];\n  onChange: (next: (string | number)[]) => void;\n  /** Displayed when no value is selected (i.e. \"all\"). Defaults to `placeholder`,\n   * then to `multiSelect.all` from the {@link UiKitProvider}, then \"All\". */\n  allLabel?: string;\n  /** Singular/plural countable label, used when 1+ items are selected. Default:\n   *  `multiSelect.selectedCount` from the provider — the bare count in English. */\n  itemLabel?: (count: number) => string;\n  placeholder?: string;\n  /** Embedded top-boundary label, matching the native Input/Select fields. */\n  label?: ReactNode;\n  /** Search-box placeholder. Default: `multiSelect.search` from the provider, else \"Search\". */\n  searchLabel?: string;\n  /** \"Select all\" action label. Default: `multiSelect.selectAll`, else \"Select all\". */\n  selectAllLabel?: string;\n  /** \"Clear\" action label. Default: `multiSelect.clear`, else \"Clear\". */\n  clearLabel?: string;\n  /** Extra classes for the open dropdown PANEL — the way to widen it past its\n   *  16rem default when the rows carry more than a label (Keksdose feedback #147). */\n  panelClassName?: string;\n  /** Required and unanswered — {@link FIELD_INVALID}, the same rose border the\n   *  native `Select` has worn since feedback #235. Every field-styled control in\n   *  this package carries it now, so a form can mark any of its fields rather than\n   *  only the one that happened to have it first. */\n  invalid?: boolean;\n  /** What is wrong with the selection, in the caller's words. Rendered under the\n   *  field, pointed at by the trigger's `aria-describedby` (merged with any the\n   *  caller passed) and implies `invalid` — {@link Input}'s `error`, on the same\n   *  rules. */\n  error?: ReactNode;\n  /** The trigger cannot be opened: FIELD_BASE's settled grey, no chevron (as a\n   *  disabled {@link Select} drops its own), and a dimmed label. */\n  disabled?: boolean;\n}\n\nexport function MultiSelect({\n  options,\n  values,\n  onChange,\n  allLabel,\n  itemLabel,\n  placeholder,\n  label,\n  searchLabel,\n  selectAllLabel,\n  clearLabel,\n  className,\n  panelClassName,\n  invalid,\n  error,\n  disabled,\n  \"aria-label\": ariaLabel,\n  \"aria-describedby\": ariaDescribedBy,\n  ...rest\n}: MultiSelectProps) {\n  const { open, setOpen, wrapperRef, triggerRef, closeToTrigger, query, setQuery, inputRef } =\n    useDropdownSearch();\n  // `allLabel` is deliberately NOT folded in here: between it and the provider's\n  // `all` sits `placeholder`, which has always doubled as the \"nothing picked\" text,\n  // and a caller who set it must keep seeing it.\n  const labels = useKitLabels(\"multiSelect\", DEFAULT_MULTI_SELECT_LABELS, {\n    search: searchLabel,\n    selectAll: selectAllLabel,\n    clear: clearLabel,\n    selectedCount: itemLabel,\n  });\n  const common = useKitLabels(\"common\", DEFAULT_COMMON_LABELS);\n  const field = useComboboxFieldError(error, invalid, ariaDescribedBy);\n  // One id per instance: `aria-controls` on the trigger names the list while the\n  // list is still closed.\n  const uid = useId();\n  const listboxId = `${uid}-listbox`;\n  const optionId = (index: number) => `${uid}-option-${index}`;\n  // Which row the arrow keys are on. Reset from the handlers that change what the\n  // list contains rather than from an effect — a render pass is not where this\n  // decision belongs, and the two callers that move the list are right here.\n  const [active, setActive] = useState(0);\n\n  const filtered = useMemo(() => {\n    const q = query.trim().toLowerCase();\n    if (!q) return options;\n    return options.filter(\n      (o) =>\n        o.label.toLowerCase().includes(q) ||\n        (o.hint ?? \"\").toLowerCase().includes(q),\n    );\n  }, [options, query]);\n\n  const valueSet = useMemo(() => new Set(values), [values]);\n  const allChecked = options.length > 0 && options.every((o) => valueSet.has(o.value));\n  const anyChecked = values.length > 0;\n  const selectedSummary = (() => {\n    if (!anyChecked || allChecked) return allLabel ?? placeholder ?? labels.all;\n    return labels.selectedCount(values.length);\n  })();\n\n  const toggle = (val: string | number) => {\n    if (valueSet.has(val)) onChange(values.filter((v) => v !== val));\n    else onChange([...values, val]);\n  };\n\n  const selectAll = () => onChange(options.map((o) => o.value));\n  const clearAll = () => onChange([]);\n\n  const activeId = active >= 0 && active < filtered.length ? optionId(active) : undefined;\n  useActiveOptionScroll(activeId);\n\n  // The WAI-ARIA APG's listbox keyboard, handled on the search box because that is\n  // where focus is while the panel is up. Escape is `useDropdown`'s, on the document.\n  const onListKeyDown = (e: ReactKeyboardEvent<HTMLInputElement>) => {\n    if (e.key === \"ArrowDown\") {\n      e.preventDefault();\n      setActive((i) => Math.min(i + 1, filtered.length - 1));\n    } else if (e.key === \"ArrowUp\") {\n      e.preventDefault();\n      setActive((i) => Math.max(i - 1, 0));\n    } else if (e.key === \"Home\") {\n      e.preventDefault();\n      setActive(0);\n    } else if (e.key === \"End\") {\n      e.preventDefault();\n      setActive(filtered.length - 1);\n    } else if (e.key === \"Enter\") {\n      e.preventDefault();\n      // Toggling keeps the panel open, exactly as clicking a row does: this control\n      // exists to answer \"which of these\", which is rarely one of them.\n      if (filtered[active]) toggle(filtered[active].value);\n    } else if (e.key === \"Tab\") {\n      e.preventDefault();\n      closeToTrigger();\n    }\n  };\n\n  return (\n    // `rest` dresses the wrapper; the name belongs to the trigger below it, which is\n    // the thing with a role. Spread FIRST so the ARIA the trigger composes, and the\n    // handlers that open the list, cannot be replaced by accident from outside.\n    <div {...rest} ref={wrapperRef} className={cn(\"relative\", className)}>\n      {label !== undefined && <FieldLabel className={disabled ? \"opacity-50\" : undefined}>{label}</FieldLabel>}\n      <button\n        ref={triggerRef}\n        type=\"button\"\n        disabled={disabled}\n        // A combobox, not a bare button: this trigger carried `aria-invalid`, which\n        // `button` does not support, so a required-and-empty filter painted its rose\n        // border and announced nothing (ESLint's `role-supports-aria-props`, the\n        // audit's §a11y). The role that describes it is the one that also supports\n        // the attribute.\n        role=\"combobox\"\n        aria-expanded={open}\n        aria-controls={listboxId}\n        aria-haspopup=\"listbox\"\n        // The label is a floating <span>, not a <label for>, so without this the\n        // trigger announces only its summary — \"3 selected\", with nothing saying\n        // three of WHAT. The label AND the summary, because `aria-label` replaces\n        // the content rather than adding to it; the same composition its two\n        // siblings use, so a form row of pickers reads the same way throughout.\n        // A caller's own name wins: two filters labelled \"Accounts\" on one screen have\n        // to be told apart, and only the caller knows by what.\n        aria-label={\n          ariaLabel ?? (typeof label === \"string\" ? common.fieldValue(label, selectedSummary) : undefined)\n        }\n        onClick={() => {\n          setOpen((v) => !v);\n          setActive(0);\n        }}\n        // Down/Up opens the list from the closed trigger, per the APG; Enter and\n        // Space already do through the button's own click.\n        onKeyDown={(e) => {\n          if (e.key === \"ArrowDown\" || e.key === \"ArrowUp\") {\n            e.preventDefault();\n            setOpen(true);\n            setActive(0);\n          }\n        }}\n        aria-invalid={field.isInvalid || undefined}\n        // On the TRIGGER, where focus lands — the `aria-describedby` a caller put on\n        // the component is taken off the wrapper for the same reason.\n        aria-describedby={field.describedBy}\n        className={cn(\n          FIELD_TRIGGER,\n          \"pe-9\",\n          label !== undefined && FIELD_FLOATING_PAD,\n          // FIELD_TRIGGER's hover would still light a trigger nothing can open.\n          \"disabled:hover:bg-[var(--bg-surface-2)]\",\n          field.isInvalid && FIELD_INVALID,\n        )}\n      >\n        {/* The summary IS the field's value, so it inherits FIELD_BASE's ink rather\n            than restating a lighter one (Keksdose dev#477). */}\n        <span className=\"truncate\">{selectedSummary}</span>\n        {!disabled && <FieldChevron />}\n      </button>\n      {open && !disabled && (\n        <DropdownPanel\n          // 16rem by default; `panelClassName` is how a caller widens it (Keksdose\n          // feedback #147: the market picker's rows carry a postcode, a town, a\n          // distance and a receipt count, all of which were being truncated). The\n          // override used to be applied from the OUTSIDE with a\n          // `[&>div]:w-full` descendant selector, which worked and was a hack —\n          // \"change the package\" was the right call.\n          className={cn(\"w-64\", panelClassName)}\n          empty={filtered.length === 0}\n          // The rows below are options, so the list around them has to be a listbox\n          // — and one that says several answers are allowed, which is the only thing\n          // that made the trigger's \"3 selected\" make sense to a reader.\n          listProps={{ id: listboxId, role: \"listbox\", \"aria-multiselectable\": true }}\n          header={\n            <>\n              <DropdownSearchHeader\n                query={query}\n                onQueryChange={(v) => {\n                  setQuery(v);\n                  // The list under the highlight just changed; keeping the old index\n                  // would point `aria-activedescendant` at a different option than\n                  // the one the user was on.\n                  setActive(0);\n                }}\n                inputRef={inputRef}\n                placeholder={labels.search}\n                listboxId={listboxId}\n                activeId={activeId}\n                onKeyDown={onListKeyDown}\n              />\n              <div className=\"flex items-center justify-between gap-2 px-2 py-1.5 text-xs\">\n                <button\n                  type=\"button\"\n                  onClick={selectAll}\n                  disabled={allChecked}\n                  className=\"rounded px-2 py-0.5 text-[var(--text-secondary)] hover:bg-[var(--bg-hover)] disabled:opacity-40\"\n                >\n                  {labels.selectAll}\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={clearAll}\n                  disabled={!anyChecked}\n                  className=\"rounded px-2 py-0.5 text-[var(--text-secondary)] hover:bg-[var(--bg-hover)] disabled:opacity-40\"\n                >\n                  {labels.clear}\n                </button>\n              </div>\n            </>\n          }\n        >\n          {filtered.map((o, i) => {\n              const checked = valueSet.has(o.value);\n              return (\n                <li key={o.value} role=\"presentation\">\n                  <button\n                    type=\"button\"\n                    id={optionId(i)}\n                    // The checked state used to exist ONLY as the decorative span\n                    // below (the audit's §a11y): the row said its label and nothing\n                    // else, so \"selected\" was imperceptible without sight. This is\n                    // the same state, in the one place a reader looks for it.\n                    role=\"option\"\n                    aria-selected={checked}\n                    // Focus stays in the search box — that is what\n                    // `aria-activedescendant` is for — so the rows are not tab stops.\n                    tabIndex={-1}\n                    onClick={() => toggle(o.value)}\n                    onMouseEnter={() => setActive(i)}\n                    className={cn(\n                      \"flex w-full items-center justify-between gap-2 px-3 py-1.5 text-sm text-start hover:bg-[var(--bg-hover)]\",\n                      checked && \"bg-[var(--bg-active)]\",\n                      i === active && \"bg-[var(--bg-hover)]\",\n                    )}\n                  >\n                    <span className=\"flex items-center gap-2 min-w-0\">\n                      <span\n                        // A picture of `aria-selected` above; a reader that met both\n                        // would be told twice.\n                        aria-hidden\n                        className={cn(\n                          \"flex size-4 shrink-0 items-center justify-center rounded border\",\n                          checked\n                            ? \"border-[var(--bg-inverse)] bg-[var(--bg-inverse)] text-[var(--text-inverse)]\"\n                            : \"border-[var(--border-strong)] bg-[var(--bg-surface)]\",\n                        )}\n                      >\n                        {checked && <Check className=\"size-3\" />}\n                      </span>\n                      <span className=\"truncate text-[var(--text-primary)]\">{o.label}</span>\n                      {o.hint && (\n                        <span className=\"truncate text-xs text-[var(--text-placeholder)]\">\n                          {o.hint}\n                        </span>\n                      )}\n                    </span>\n                  </button>\n                </li>\n              );\n            })}\n        </DropdownPanel>\n      )}\n      {/* After the panel, not before it: the panel is `absolute` with no `top`, so it\n          opens at its place in the flow — under the message, had the message come\n          first. */}\n      {field.errorEl}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/multi-select.tsx"],"sourcesContent":["import { useId, useMemo, useState } from \"react\";\nimport type {\n  ComponentPropsWithoutRef,\n  KeyboardEvent as ReactKeyboardEvent,\n  ReactNode,\n} from \"react\";\nimport { Check } from \"lucide-react\";\nimport { FieldChevron, FieldLabel, FIELD_TRIGGER, FIELD_INVALID, FIELD_FLOATING_PAD } from \"./ui\";\nimport { cn } from \"../lib/cn\";\nimport { DropdownPanel, DropdownSearchHeader, useDropdownSearch } from \"./dropdown\";\nimport { useActiveOptionScroll, useComboboxFieldError } from \"./combobox-core\";\nimport {\n  DEFAULT_COMMON_LABELS,\n  DEFAULT_MULTI_SELECT_LABELS,\n  useKitLabels,\n} from \"../i18n/kit-labels\";\n\nexport interface MultiSelectOption {\n  value: string | number;\n  label: string;\n  hint?: string;\n}\n\n/** `onChange` is the kit's — \"the selection changed\", carrying the new values —\n *  rather than the div's form event. */\nexport interface MultiSelectProps extends Omit<ComponentPropsWithoutRef<\"div\">, \"onChange\"> {\n  options: MultiSelectOption[];\n  values: (string | number)[];\n  onChange: (next: (string | number)[]) => void;\n  /** Displayed when no value is selected (i.e. \"all\"). Defaults to `placeholder`,\n   * then to `multiSelect.all` from the {@link UiKitProvider}, then \"All\". */\n  allLabel?: string;\n  /** Singular/plural countable label, used when 1+ items are selected. Default:\n   *  `multiSelect.selectedCount` from the provider — the bare count in English. */\n  itemLabel?: (count: number) => string;\n  placeholder?: string;\n  /** Embedded top-boundary label, matching the native Input/Select fields. */\n  label?: ReactNode;\n  /** Search-box placeholder. Default: `multiSelect.search` from the provider, else \"Search\". */\n  searchLabel?: string;\n  /** \"Select all\" action label. Default: `multiSelect.selectAll`, else \"Select all\". */\n  selectAllLabel?: string;\n  /** \"Clear\" action label. Default: `multiSelect.clear`, else \"Clear\". */\n  clearLabel?: string;\n  /** Extra classes for the open dropdown PANEL — the way to widen it past its\n   *  16rem default when the rows carry more than a label (Keksdose feedback #147). */\n  panelClassName?: string;\n  /** Required and unanswered — {@link FIELD_INVALID}, the same rose border the\n   *  native `Select` has worn since feedback #235. Every field-styled control in\n   *  this package carries it now, so a form can mark any of its fields rather than\n   *  only the one that happened to have it first. */\n  invalid?: boolean;\n  /** What is wrong with the selection, in the caller's words. Rendered under the\n   *  field, pointed at by the trigger's `aria-describedby` (merged with any the\n   *  caller passed) and implies `invalid` — {@link Input}'s `error`, on the same\n   *  rules. */\n  error?: ReactNode;\n  /** The trigger cannot be opened: FIELD_BASE's settled grey, no chevron (as a\n   *  disabled {@link Select} drops its own), and a dimmed label. */\n  disabled?: boolean;\n}\n\nexport function MultiSelect({\n  options,\n  values,\n  onChange,\n  allLabel,\n  itemLabel,\n  placeholder,\n  label,\n  searchLabel,\n  selectAllLabel,\n  clearLabel,\n  className,\n  panelClassName,\n  invalid,\n  error,\n  disabled,\n  \"aria-label\": ariaLabel,\n  \"aria-describedby\": ariaDescribedBy,\n  ...rest\n}: MultiSelectProps) {\n  const { open, setOpen, wrapperRef, triggerRef, closeToTrigger, query, setQuery, inputRef } =\n    useDropdownSearch();\n  // `allLabel` is deliberately NOT folded in here: between it and the provider's\n  // `all` sits `placeholder`, which has always doubled as the \"nothing picked\" text,\n  // and a caller who set it must keep seeing it.\n  const labels = useKitLabels(\"multiSelect\", DEFAULT_MULTI_SELECT_LABELS, {\n    search: searchLabel,\n    selectAll: selectAllLabel,\n    clear: clearLabel,\n    selectedCount: itemLabel,\n  });\n  const common = useKitLabels(\"common\", DEFAULT_COMMON_LABELS);\n  const field = useComboboxFieldError(error, invalid, ariaDescribedBy);\n  // One id per instance: `aria-controls` on the trigger names the list while the\n  // list is still closed.\n  const uid = useId();\n  const listboxId = `${uid}-listbox`;\n  const optionId = (index: number) => `${uid}-option-${index}`;\n  // Which row the arrow keys are on. Reset from the handlers that change what the\n  // list contains rather than from an effect — a render pass is not where this\n  // decision belongs, and the two callers that move the list are right here.\n  const [active, setActive] = useState(0);\n\n  const filtered = useMemo(() => {\n    const q = query.trim().toLowerCase();\n    if (!q) return options;\n    return options.filter(\n      (o) =>\n        o.label.toLowerCase().includes(q) ||\n        (o.hint ?? \"\").toLowerCase().includes(q),\n    );\n  }, [options, query]);\n\n  const valueSet = useMemo(() => new Set(values), [values]);\n  const allChecked = options.length > 0 && options.every((o) => valueSet.has(o.value));\n  const anyChecked = values.length > 0;\n  const selectedSummary = (() => {\n    if (!anyChecked || allChecked) return allLabel ?? placeholder ?? labels.all;\n    return labels.selectedCount(values.length);\n  })();\n\n  const toggle = (val: string | number) => {\n    if (valueSet.has(val)) onChange(values.filter((v) => v !== val));\n    else onChange([...values, val]);\n  };\n\n  const selectAll = () => onChange(options.map((o) => o.value));\n  const clearAll = () => onChange([]);\n\n  const activeId = active >= 0 && active < filtered.length ? optionId(active) : undefined;\n  useActiveOptionScroll(activeId);\n\n  // The WAI-ARIA APG's listbox keyboard, handled on the search box because that is\n  // where focus is while the panel is up. Escape is `useDropdown`'s, on the document.\n  const onListKeyDown = (e: ReactKeyboardEvent<HTMLInputElement>) => {\n    if (e.key === \"ArrowDown\") {\n      e.preventDefault();\n      setActive((i) => Math.min(i + 1, filtered.length - 1));\n    } else if (e.key === \"ArrowUp\") {\n      e.preventDefault();\n      setActive((i) => Math.max(i - 1, 0));\n    } else if (e.key === \"Home\") {\n      e.preventDefault();\n      setActive(0);\n    } else if (e.key === \"End\") {\n      e.preventDefault();\n      setActive(filtered.length - 1);\n    } else if (e.key === \"Enter\") {\n      e.preventDefault();\n      // Toggling keeps the panel open, exactly as clicking a row does: this control\n      // exists to answer \"which of these\", which is rarely one of them.\n      if (filtered[active]) toggle(filtered[active].value);\n    } else if (e.key === \"Tab\") {\n      e.preventDefault();\n      closeToTrigger();\n    }\n  };\n\n  return (\n    // `rest` dresses the wrapper; the name belongs to the trigger below it, which is\n    // the thing with a role. Spread FIRST so the ARIA the trigger composes, and the\n    // handlers that open the list, cannot be replaced by accident from outside.\n    <div {...rest} ref={wrapperRef} className={cn(\"relative\", className)}>\n      {label !== undefined && <FieldLabel className={disabled ? \"opacity-50\" : undefined}>{label}</FieldLabel>}\n      <button\n        ref={triggerRef}\n        type=\"button\"\n        disabled={disabled}\n        // A combobox, not a bare button: this trigger carried `aria-invalid`, which\n        // `button` does not support, so a required-and-empty filter painted its rose\n        // border and announced nothing (ESLint's `role-supports-aria-props`, the\n        // audit's §a11y). The role that describes it is the one that also supports\n        // the attribute.\n        role=\"combobox\"\n        aria-expanded={open}\n        aria-controls={listboxId}\n        aria-haspopup=\"listbox\"\n        // The label is a floating <span>, not a <label for>, so without this the\n        // trigger announces only its summary — \"3 selected\", with nothing saying\n        // three of WHAT. The label AND the summary, because `aria-label` replaces\n        // the content rather than adding to it; the same composition its two\n        // siblings use, so a form row of pickers reads the same way throughout.\n        // A caller's own name wins: two filters labelled \"Accounts\" on one screen have\n        // to be told apart, and only the caller knows by what.\n        aria-label={\n          ariaLabel ?? (typeof label === \"string\" ? common.fieldValue(label, selectedSummary) : undefined)\n        }\n        onClick={() => {\n          setOpen((v) => !v);\n          setActive(0);\n        }}\n        // Down/Up opens the list from the closed trigger, per the APG; Enter and\n        // Space already do through the button's own click.\n        onKeyDown={(e) => {\n          if (e.key === \"ArrowDown\" || e.key === \"ArrowUp\") {\n            e.preventDefault();\n            setOpen(true);\n            setActive(0);\n          }\n        }}\n        aria-invalid={field.isInvalid || undefined}\n        // On the TRIGGER, where focus lands — the `aria-describedby` a caller put on\n        // the component is taken off the wrapper for the same reason.\n        aria-describedby={field.describedBy}\n        className={cn(\n          FIELD_TRIGGER,\n          \"pe-9\",\n          label !== undefined && FIELD_FLOATING_PAD,\n          // FIELD_TRIGGER's hover would still light a trigger nothing can open.\n          \"disabled:hover:bg-[var(--bg-surface-2)]\",\n          // Dimmed like EntityCombobox's and MultiEntityCombobox's disabled triggers;\n          // only the label was, so a disabled MultiSelect read as live (showcase audit).\n          \"disabled:cursor-not-allowed disabled:opacity-50\",\n          field.isInvalid && FIELD_INVALID,\n        )}\n      >\n        {/* The summary IS the field's value, so it inherits FIELD_BASE's ink rather\n            than restating a lighter one (Keksdose dev#477). */}\n        <span className=\"truncate\">{selectedSummary}</span>\n        {!disabled && <FieldChevron />}\n      </button>\n      {open && !disabled && (\n        <DropdownPanel\n          // 16rem by default; `panelClassName` is how a caller widens it (Keksdose\n          // feedback #147: the market picker's rows carry a postcode, a town, a\n          // distance and a receipt count, all of which were being truncated). The\n          // override used to be applied from the OUTSIDE with a\n          // `[&>div]:w-full` descendant selector, which worked and was a hack —\n          // \"change the package\" was the right call.\n          className={cn(\"w-64\", panelClassName)}\n          empty={filtered.length === 0}\n          // The rows below are options, so the list around them has to be a listbox\n          // — and one that says several answers are allowed, which is the only thing\n          // that made the trigger's \"3 selected\" make sense to a reader.\n          listProps={{ id: listboxId, role: \"listbox\", \"aria-multiselectable\": true }}\n          header={\n            <>\n              <DropdownSearchHeader\n                query={query}\n                onQueryChange={(v) => {\n                  setQuery(v);\n                  // The list under the highlight just changed; keeping the old index\n                  // would point `aria-activedescendant` at a different option than\n                  // the one the user was on.\n                  setActive(0);\n                }}\n                inputRef={inputRef}\n                placeholder={labels.search}\n                listboxId={listboxId}\n                activeId={activeId}\n                onKeyDown={onListKeyDown}\n              />\n              <div className=\"flex items-center justify-between gap-2 px-2 py-1.5 text-xs\">\n                <button\n                  type=\"button\"\n                  onClick={selectAll}\n                  disabled={allChecked}\n                  className=\"rounded px-2 py-0.5 text-[var(--text-secondary)] hover:bg-[var(--bg-hover)] disabled:opacity-40\"\n                >\n                  {labels.selectAll}\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={clearAll}\n                  disabled={!anyChecked}\n                  className=\"rounded px-2 py-0.5 text-[var(--text-secondary)] hover:bg-[var(--bg-hover)] disabled:opacity-40\"\n                >\n                  {labels.clear}\n                </button>\n              </div>\n            </>\n          }\n        >\n          {filtered.map((o, i) => {\n              const checked = valueSet.has(o.value);\n              return (\n                <li key={o.value} role=\"presentation\">\n                  <button\n                    type=\"button\"\n                    id={optionId(i)}\n                    // The checked state used to exist ONLY as the decorative span\n                    // below (the audit's §a11y): the row said its label and nothing\n                    // else, so \"selected\" was imperceptible without sight. This is\n                    // the same state, in the one place a reader looks for it.\n                    role=\"option\"\n                    aria-selected={checked}\n                    // Focus stays in the search box — that is what\n                    // `aria-activedescendant` is for — so the rows are not tab stops.\n                    tabIndex={-1}\n                    onClick={() => toggle(o.value)}\n                    onMouseEnter={() => setActive(i)}\n                    className={cn(\n                      \"flex w-full items-center justify-between gap-2 px-3 py-1.5 text-sm text-start hover:bg-[var(--bg-hover)]\",\n                      checked && \"bg-[var(--bg-active)]\",\n                      i === active && \"bg-[var(--bg-hover)]\",\n                    )}\n                  >\n                    <span className=\"flex items-center gap-2 min-w-0\">\n                      <span\n                        // A picture of `aria-selected` above; a reader that met both\n                        // would be told twice.\n                        aria-hidden\n                        className={cn(\n                          \"flex size-4 shrink-0 items-center justify-center rounded border\",\n                          checked\n                            ? \"border-[var(--bg-inverse)] bg-[var(--bg-inverse)] text-[var(--text-inverse)]\"\n                            : \"border-[var(--border-strong)] bg-[var(--bg-surface)]\",\n                        )}\n                      >\n                        {checked && <Check className=\"size-3\" />}\n                      </span>\n                      <span className=\"truncate text-[var(--text-primary)]\">{o.label}</span>\n                      {o.hint && (\n                        <span className=\"truncate text-xs text-[var(--text-placeholder)]\">\n                          {o.hint}\n                        </span>\n                      )}\n                    </span>\n                  </button>\n                </li>\n              );\n            })}\n        </DropdownPanel>\n      )}\n      {/* After the panel, not before it: the panel is `absolute` with no `top`, so it\n          opens at its place in the flow — under the message, had the message come\n          first. */}\n      {field.errorEl}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/number-field.d.ts

@@ -2,7 +2,7 @@ import * as react from 'react';
 import { ComponentProps, ReactNode } from 'react';
 import { NumberInput } from './number-input.js';
 import './calculator.js';
-import '../kit-labels-Mz8zZHIF.js';
+import '../kit-labels-BHfRBbHs.js';
 import './data-table-labels.js';
 import './mini-calendar.js';
 import './calendar-heatmap.js';
@@ -163,5 +163,16 @@ interface NumberFieldProps extends Omit<NumberInputProps, "value" | "onChange" |
  * and a field that parses its own display back must not have that ambiguity.
  */
 declare function NumberField({ value, onCommit, onValueChange, digits, min, max, nullable, unit, unitPlacement, locale: localeProp, label, invalid, error, id, "aria-describedby": ariaDescribedBy, "aria-invalid": ariaInvalid, "aria-required": ariaRequired, ...rest }: NumberFieldProps): react.JSX.Element;
+/**
+ * A {@link NumberField} for whole numbers: `digits={0}` and `calculator={false}` as
+ * defaults, each overridable — the preset `RhfIntegerField` (`@eifi1/ui-kit/rhf`) applies to a
+ * form-bound field, for the plain one (kastlan 51: a building's construction year in a
+ * wizard's local state, an entity id in the document upload spelled the two props out
+ * by hand).
+ *
+ * `??` rather than a spread over the defaults, so a wrapper forwarding its own optional
+ * `digits={props.digits}` still gets the preset.
+ */
+declare function IntegerField(props: NumberFieldProps): react.JSX.Element;
 
-export { NumberField, type NumberFieldProps };
+export { IntegerField, NumberField, type NumberFieldProps };

package/dist/components/number-field.js

@@ -135,7 +135,11 @@ function NumberField({
     /* @__PURE__ */ jsx("p", { id: errorId, className: FIELD_ERROR_CLASS, children: error })
   ] });
 }
+function IntegerField(props) {
+  return /* @__PURE__ */ jsx(NumberField, { ...props, digits: props.digits ?? 0, calculator: props.calculator ?? false });
+}
 export {
+  IntegerField,
   NumberField
 };
 //# sourceMappingURL=number-field.js.map