@eifi1/ui-kit 0.50.0 → 0.51.0

package/dist/components/combobox.js

@@ -7,6 +7,7 @@ import { cn } from "../lib/cn.js";
 import { useDropdown } from "./dropdown.js";
 import { takeEscape, useDismissLayer } from "../hooks/use-dismiss.js";
 import { isImeEnter } from "../lib/ime.js";
+import { isQuietFocus } from "../lib/quiet-focus.js";
 import { usePhoneLayout } from "../hooks/use-breakpoint.js";
 import { PickerSheet, SHEET_ROW_CLASS } from "./picker-sheet.js";
 import { ComboboxFieldLabel, endHintRowProps, GROUP_HEADING_STICKY, useActiveOptionScroll } from "./combobox-core.js";
@@ -169,8 +170,9 @@ function Combobox(props) {
               autoFocus,
               onBlur,
               onMouseDown: primaryOnly.onMouseDown,
-              onFocus: () => {
+              onFocus: (e) => {
                 if (primaryOnly.fromAuxButton() || locked) return;
+                if (isQuietFocus(e.currentTarget)) return;
                 setOpen(true);
                 setTyping(false);
                 if (isPhone) sheetInputRef.current?.focus();

package/dist/components/combobox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/combobox.tsx"],"sourcesContent":["import { Fragment, useId, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode, Ref } from \"react\";\nimport { ChevronDown } from \"lucide-react\";\nimport { FIELD_BASE, FIELD_FLOATING_PAD, FIELD_INVALID } from \"./field-base\";\nimport { cn } from \"../lib/cn\";\nimport { useDropdown } from \"./dropdown\";\nimport { takeEscape, useDismissLayer } from \"../hooks/use-dismiss\";\nimport { isImeEnter } from \"../lib/ime\";\nimport { usePhoneLayout } from \"../hooks/use-breakpoint\";\nimport { PickerSheet, SHEET_ROW_CLASS } from \"./picker-sheet\";\nimport { ComboboxFieldLabel, endHintRowProps, GROUP_HEADING_STICKY, useActiveOptionScroll } from \"./combobox-core\";\nimport { useKitLocale } from \"../i18n/kit-labels\";\nimport { rankMatch } from \"../lib/text-match\";\nimport {\n  EndHintRow,\n  FieldCaption,\n  LABEL_IN_ROW,\n  LockedReason,\n  mergeDescribedBy,\n  StaticLabelRow,\n  useFieldError,\n  useFieldHint,\n  useLockReason,\n  type DisabledReasonDisplay,\n  type FieldHelpProps,\n} from \"./field-parts\";\nimport type { CommitScope } from \"./write-lock\";\nimport { lockedKeyDown, rowClass, SuggestionList, usePrimaryPressOnly } from \"./combobox-suggestions\";\n// The id-keyed sibling lives in inline-entity-combobox.tsx (MOD-9), the list both share\n// in combobox-suggestions.tsx; its public names are still this module's.\nexport { InlineEntityCombobox } from \"./inline-entity-combobox\";\nexport type { InlineEntityComboboxProps } from \"./inline-entity-combobox\";\n\n/**\n * Four of the div's own attributes are omitted because this component already owns\n * the name, with a different meaning: `id` is the INPUT's (a caller labels or\n * automates the field, not the box around it), and `onChange`/`onBlur`/`onSubmit`\n * are the field's — a value, a departure, and \"I mean what I typed\" — rather than\n * the DOM events of the wrapper. Everything else a wrapper needs reaches the root.\n */\nexport interface ComboboxProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"id\" | \"onChange\" | \"onBlur\" | \"onSubmit\">,\n    FieldHelpProps {\n  value: string;\n  onChange: (v: string) => void;\n  /** Suggestion pool (e.g. existing payee names). */\n  options: string[];\n  /** The visible label, a `<label for>` above the field: a ReactNode, as on every kit\n   *  field (a string until 0.34, refactor audit 2026-10, API-9). Without one, name the\n   *  field with `aria-label`. */\n  label?: ReactNode;\n  id?: string;\n  placeholder?: string;\n  className?: string;\n  /** Required and unanswered — see {@link Input}'s `invalid`. Set on the `<input>`\n   *  itself rather than on the wrapper, which is what let Keksdose's account picker\n   *  delete the `[&_input]:…` copy of {@link FIELD_INVALID} it had been carrying\n   *  because this component had no `invalid` of its own. */\n  invalid?: boolean;\n  /** What is wrong with the value, as {@link Input}'s `error`: rendered under the\n   *  field, on the `<input>`'s `aria-describedby`, and implies `invalid` (lenkbank's\n   *  scope fields, which moved here off `<Input list>` + `<datalist>`). */\n  error?: ReactNode;\n  /**\n   * Standing advice for the field — {@link Input}'s `hint`, so the combobox family\n   * reads like every other field (keksdose K4: the family had `error` and no `hint`, so\n   * the app's pickers carried their captions outside the component, attached to\n   * nothing). Plain TEXT is a caption under the field on the input's\n   * `aria-describedby`, before any error; a {@link FieldHint} \"?\" rides the label line,\n   * or with no label sits at the field's end edge, outside the box.\n   */\n  hint?: ReactNode;\n  /** As `<input disabled>`: no focus, no list, the field's settled look. The chevron\n   *  stops toggling with it — it is a mouse target the input's own `disabled` does\n   *  not reach. */\n  disabled?: boolean;\n  /**\n   * Why the value cannot be changed — {@link Button}'s `disabledReason`, for a field\n   * that SAVES itself (an inline editor whose blur writes). The input stays focusable\n   * and `aria-disabled`, is `readOnly`, opens no list and calls neither `onChange` nor\n   * `onSubmit`; the reason is in the kit {@link Tooltip} and on its `aria-describedby`.\n   * Wins over `disabled`. The family's lock (keksdose G2) — see {@link InlineEntityCombobox}.\n   */\n  disabledReason?: ReactNode;\n  /** This field COMMITS. Under a locked {@link WriteLockProvider} it is locked the\n   *  `disabledReason` way with the lock's reason; inside a form with its own Save, leave\n   *  it off and put `commit` on the Save. No provider, or an unlocked one: no effect. */\n  commit?: CommitScope;\n  /** Where the reason shows — {@link Button}'s `disabledReasonDisplay`: a line under the\n   *  field at Large and on a touch screen by default, the tooltip otherwise (DUP-3). */\n  disabledReasonDisplay?: DisabledReasonDisplay;\n  /** Heading an option belongs under. Supplying it makes this list read exactly\n   *  like {@link InlineEntityCombobox}'s — one heading per group with its rows\n   *  indented beneath — instead of a flat list (feedback #136 rework: the payee\n   *  field sat next to the newly-grouped category field and no longer matched).\n   *  Omit for a plain list. */\n  groupBy?: (option: string) => string;\n  /**\n   * Something to show at the far end of an option's row — a badge saying what the\n   * option IS, as distinct from what it is called.\n   *\n   * Keksdose's category-name field is the case: its proposals carry per-locale\n   * names, so picking one stores a category that follows the UI language, and\n   * picking a look-alike custom name does not. That difference is invisible in the\n   * label and decides what the row DOES, so the row has to show it. Returning\n   * `null` for an option renders nothing and costs no layout.\n   *\n   * Not rendered in the create row, which by definition names nothing in the pool.\n   */\n  optionAdornment?: (option: string) => ReactNode;\n  /** Focus on mount, the way `<input autoFocus>` does — and, through `onFocus`, open\n   *  the list with it. A click-the-value inline editor needs it: the cell the user\n   *  clicked names the field the caret should land in. {@link InlineEntityCombobox}\n   *  has had it since live #218. */\n  autoFocus?: boolean;\n  /** Focus genuinely LEFT the field. Not fired by picking a row — the rows suppress\n   *  `mousedown`, so the input never blurs — which is what makes it usable as a\n   *  \"close the inline editor\" signal. */\n  onBlur?: () => void;\n  /** Enter pressed with no row highlighted, i.e. \"I mean what I typed\". The list\n   *  closes either way; this is for a caller whose Enter also submits a row editor. */\n  onSubmit?: () => void;\n  /** Rows to offer when the field is empty. 8 on a dropdown, where that is all\n   *  that fits; the phone sheet asks for more because it has a screen. */\n  maxSuggestions?: number;\n  searchPlaceholder?: string;\n  closeLabel?: string;\n  /**\n   * The phone sheet's heading — and, as a string, the dialog's accessible name — for a\n   * field whose label is drawn by someone else: a bound field's label above it,\n   * which `RhfTextCombobox` hands over here (0.24). Default: `label`. Without either, the\n   * full-screen sheet opened untitled and unnamed, the one screen on a phone that has to\n   * say what it is asking for (live #200).\n   */\n  sheetTitle?: ReactNode;\n  /**\n   * Label for the row that COMMITS a value the list does not contain — e.g.\n   * `(v) => \\`Add \"${v}\" as payee\\``. Supplying it turns the free text into\n   * something you confirm rather than something you leave behind.\n   *\n   * Keksdose live #212: *\"For the payee input have an apply button, when input is\n   * placed like 'add xxx as payee' to confirm. Now it can be put in and closed with\n   * the right top X, which seems not intuitive.\"* On the phone sheet the search box\n   * IS the value, so typing a brand-new name and dismissing the sheet did commit it —\n   * but the only control on offer was the close X, which reads as \"discard\". A named\n   * affordance says what the typing did.\n   *\n   * Omit and the row is not rendered, which is the right default for a list whose\n   * values are all supposed to already exist.\n   */\n  createLabel?: (value: string) => string;\n  /**\n   * The `<input>` — the control a reader types in and the one focus belongs on — as a\n   * React 19 ref prop, the way {@link CountrySelect} takes its trigger's (0.24, kastlan:\n   * react-hook-form's focus-on-error calls `focus()` on whatever `field.ref` is handed,\n   * and a combobox with no ref inside a hand-wired `RhfField` gave it nothing, so a\n   * failed submit could not take the user to it). Not the wrapper: a ref is for focus,\n   * measurement and selection, and all three are the input's. `RhfTextCombobox` passes it.\n   */\n  ref?: Ref<HTMLInputElement>;\n}\n\n/**\n * Free-text combobox that looks like the shared {@link Select} (same FIELD_BASE\n * styling, chevron and static floating label) but lets the user type a value\n * that isn't in the list — e.g. naming a brand-new payee. Picking from the\n * filtered suggestion list fills the value; typing keeps whatever was entered.\n *\n * Use this instead of an `<Input list=\"…\">` + `<datalist>` so the control is\n * visually and behaviourally consistent with the other dropdowns (feedback\n * #230 — the payee field looked/behaved differently from every other select).\n */\nexport function Combobox(props: ComboboxProps) {\n  const {\n    value,\n    onChange,\n    options,\n    label,\n    id,\n    placeholder,\n    className,\n    groupBy,\n    maxSuggestions,\n    searchPlaceholder,\n    closeLabel,\n    sheetTitle,\n    createLabel,\n    invalid,\n    error,\n    hint,\n    help,\n    disabled,\n    disabledReason,\n    disabledReasonDisplay,\n    commit,\n    optionAdornment,\n    autoFocus,\n    onBlur,\n    onSubmit,\n    ref,\n    \"aria-label\": ariaLabel,\n    // Off `rest` and onto the <input>, which is the combobox a reader meets: `Field`'s\n    // render-prop spreads `{ id, aria-describedby, aria-invalid, aria-required }`, and\n    // on the wrapper div the hint and required state described nothing.\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-invalid\": ariaInvalid,\n    \"aria-required\": ariaRequired,\n    ...rest\n  } = props;\n  const hintParts = useFieldHint(hint, ariaDescribedBy, { help, name: label ?? ariaLabel });\n  const field = useFieldError(error, invalid, hintParts.describedBy, ariaInvalid);\n  const generated = useId();\n  const fieldId = id ?? generated;\n  // Derived from the GENERATED id, never from `id`: a caller's id is theirs to\n  // collide with, and `aria-controls` has to resolve.\n  const listboxId = `${generated}-listbox`;\n  const optionId = (index: number) => `${generated}-option-${index}`;\n  // `backCloses` is the desktop half of live #309: the phone's list IS a\n  // {@link PickerSheet}, which registers its own history entry, so registering a\n  // second one here would cost two Back presses to dismiss one sheet. Its Escape\n  // layer is this field's own, below — the list can be open with nothing to show.\n  const isPhone = usePhoneLayout();\n  const { open, setOpen, wrapperRef, panelRef } = useDropdown({ backCloses: !isPhone, escapeLayer: false });\n  const primaryOnly = usePrimaryPressOnly();\n  const [active, setActive] = useState(-1);\n  // The lock (see `lockedKeyDown`): a lock arriving while the list is up closes it,\n  // adjusted while rendering so no frame offers a row that can no longer be taken.\n  const lock = useLockReason(commit, disabledReason);\n  const locked = lock.locked;\n  const inert = locked || Boolean(disabled);\n  if (locked && open) setOpen(false);\n  // A phone opens the list as a full-screen sheet with its own input, the way a\n  // native <select> does — live #200: \"Paid as full screen dialog with input.\n  // Similar to the account select that already appears as full screen.\" The\n  // anchored list stays for pointer devices, where it is the better shape.\n  const sheetInputRef = useRef<HTMLInputElement | null>(null);\n  // The box the portalled list hangs off — the inner wrapper, which hugs the input,\n  // not the outer one (a grid item that can be taller than the field).\n  const fieldRef = useRef<HTMLDivElement>(null);\n\n  /**\n   * Is the text in the field a QUERY, or just what was picked last time?\n   *\n   * Keksdose dev#549, filed against the category-name field: *\"Currently it acts kind\n   * of a filter and clicking again does not open anything since the previous text is\n   * still there likely filtering all other options out.\"* A combobox whose filter is\n   * its own value can only ever re-offer the answer it already has — after picking\n   * \"REWE\" the list reopens holding one row, the one you are looking at, and changing\n   * your mind means clearing the field by hand first.\n   *\n   * So the text filters only while it is being TYPED; opening the list, by focus or\n   * by clicking the field again, puts the whole pool back. {@link InlineEntityCombobox}\n   * below has had this since it was written (see its `typedQuery`) and the app's\n   * category-name field grew its own copy to get it — this one, the payee field, was\n   * the one left with the bug.\n   *\n   * Not derived from \"does the text exactly match an option\": a custom value that\n   * happens to collide with one would then behave differently from every other, and\n   * what is being tracked is what the user just did, which is not a property of the\n   * string.\n   */\n  const [typing, setTyping] = useState(false);\n\n  const query = typing ? value.trim() : \"\";\n  // Folded as every kit list folds (DUP-5): \"zurich\" finds Zürich, by the locale's case.\n  const locale = useKitLocale();\n  const matches = useMemo(() => {\n    const seen = new Set<string>();\n    const uniq = options.filter((o) => o && !seen.has(o) && seen.add(o));\n    let ranked: string[];\n    const cap = maxSuggestions ?? (isPhone ? 50 : 8);\n    if (!query) {\n      ranked = uniq.slice(0, cap);\n    } else {\n      // The whole name, then prefix matches, then substring matches — most relevant on\n      // top (`rankMatch`; a stable sort keeps the pool's order within a rank).\n      ranked = uniq\n        .map((o) => ({ o, rank: rankMatch(o, query, { locale }) }))\n        .filter((x) => x.rank >= 0)\n        .sort((a, b) => a.rank - b.rank)\n        .map((x) => x.o)\n        .slice(0, cap);\n    }\n    if (!groupBy) return ranked;\n    // Keep each group contiguous so a heading appears once instead of every time\n    // the ranking interleaves two groups — while preserving \"best match first\":\n    // a Map keeps insertion order, so groups come out ordered by their best-ranked\n    // member and members keep their rank order inside the group.\n    const byGroup = new Map<string, string[]>();\n    for (const o of ranked) {\n      const key = groupBy(o);\n      if (!byGroup.has(key)) byGroup.set(key, []);\n      byGroup.get(key)!.push(o);\n    }\n    return [...byGroup.values()].flat();\n  }, [options, query, groupBy, maxSuggestions, isPhone, locale]);\n\n  /**\n   * Which rows OPEN a group, and with what heading — computed once for both lists.\n   *\n   * The desktop list had this as `matches[i - 1]`, which is free; the sheet had it as\n   * `matches[matches.indexOf(o) - 1]`, which is a scan of the list per row and another\n   * per heading test. That is quadratic in the sheet's own cap of 50, on the branch\n   * that runs on the slowest hardware we ship to — and it answers the wrong question\n   * besides: `indexOf` finds the FIRST row with that string, so a duplicated option\n   * would have compared against a neighbour it is not next to. (`matches` de-duplicates\n   * today; that is a property of the memo above, not of the row being rendered.)\n   */\n  const groupHeadings = useMemo(() => {\n    if (!groupBy) return null;\n    const heads = new Map<number, string>();\n    let prev: string | undefined;\n    matches.forEach((o, i) => {\n      const group = groupBy(o);\n      if (group != null && group !== prev) heads.set(i, group);\n      prev = group;\n    });\n    return heads;\n  }, [matches, groupBy]);\n\n  const take = (v: string) => {\n    if (locked) return;\n    onChange(v);\n    setOpen(false);\n    setActive(-1);\n    // What is in the field is now an ANSWER, not a query — so reopening offers the\n    // whole pool again rather than a one-row filter of the value just chosen.\n    setTyping(false);\n  };\n\n  // Offered only when the typed text is genuinely NOT in the pool: an exact\n  // (case-insensitive) match is an existing entry the list is already showing, and a\n  // second way to pick it would be noise. Compared against `options`, not `matches` —\n  // `matches` is capped, so a pool of 300 payees would otherwise offer to \"add\" one\n  // that exists but fell off the end of the list.\n  // What the field claims the keyboard is on. Only on a pointer device: the phone\n  // renders its rows in a {@link PickerSheet} whose own search box owns focus, and a\n  // field pointing at an id that is not there is worse than one pointing nowhere.\n  const activeId = !isPhone && active >= 0 && active < matches.length ? optionId(active) : undefined;\n  useActiveOptionScroll(activeId);\n\n  // While locked the field sits in the reason's Tooltip — in a fragment with a hidden\n  // copy of the reason, Button's anatomy; `block` so a full-width field stays full width.\n  const withLock = (box: ReactNode) =>\n    locked ? (\n      <LockedReason lock={lock} display={disabledReasonDisplay} className=\"block\">\n        {box}\n      </LockedReason>\n    ) : (\n      box\n    );\n\n  const typed = value.trim();\n  const createRow =\n    createLabel && typed.length > 0 && !options.some((o) => o.toLowerCase() === typed.toLowerCase())\n      ? createLabel(typed)\n      : null;\n\n  // The list is a layer on the Escape stack while it SHOWS (Wave 2, DUP-1): an Escape\n  // over an empty \"open\" list is the dialog's, as it always was. On a phone the sheet\n  // is the layer.\n  const showing = !isPhone && open && !inert && (matches.length > 0 || Boolean(createRow));\n  useDismissLayer(showing, () => {\n    setOpen(false);\n    setActive(-1);\n  });\n\n  return (\n    // `rest` dresses the outer box — a `data-tour` anchor, a test id. Not the NAME,\n    // description, invalid or required state: those belong on the <input> below,\n    // which is the combobox a reader meets. Spread FIRST, so the field's ARIA and the\n    // handlers carrying live #309 and dev#549 cannot be replaced from outside.\n    <div {...rest} ref={wrapperRef} className={cn(\"relative\", className)}>\n      {/* A real <label for> since lenkbank's tests met a field `getByLabelText` could\n          not find: it used to be a <span>, with the text copied onto `aria-label`. The\n          name a reader hears is the same words either way. With a \"?\" it moves into a\n          row after the field, below. */}\n      {label !== undefined && hintParts.labelHint === undefined && (\n        <ComboboxFieldLabel htmlFor={fieldId} className={inert ? \"opacity-50\" : undefined}>\n          {label}\n        </ComboboxFieldLabel>\n      )}\n      <EndHintRow {...endHintRowProps(\"hint\" in props, label !== undefined, hintParts.labelHint)}>\n        {withLock(\n          /* The chevron centers against this inner wrapper, which hugs the input.\n              The outer div can be taller than the input (as a grid item it\n              stretches to the row height, e.g. next to the editor's category cell\n              with its split button), which used to drag a top-1/2 chevron down to\n              the input's bottom edge (feedback #248).\n              Dimmed as a whole when disabled (or locked), the way EntityCombobox dims its\n              trigger. FIELD_BASE's grey alone left a disabled picker looking like a\n              filled-in one beside the pickers that do dim (the label is not the input's\n              `peer`, so it is dimmed by hand above). */\n          <div ref={fieldRef} className={cn(\"relative\", inert && \"cursor-not-allowed opacity-50\")}>\n            <input\n              ref={ref}\n              id={fieldId}\n              value={value}\n              placeholder={placeholder}\n              // The caller's name, over the <label for> above — which is what names the\n              // field otherwise (dev#477: a field with neither announces only its text).\n              aria-label={ariaLabel}\n              role=\"combobox\"\n              aria-expanded={open}\n              // The list this field is the mouth of. Required by the role, and the half\n              // that was missing: the field said it was expanded and never said what it\n              // had expanded, so a reader had no way from the box to the options\n              // (ESLint's `role-has-required-aria-props`, the audit's §a11y).\n              aria-controls={listboxId}\n              aria-activedescendant={activeId}\n              aria-autocomplete=\"list\"\n              aria-invalid={field.isInvalid || undefined}\n              aria-describedby={mergeDescribedBy(field.describedBy, locked && lock.reasonId)}\n              aria-required={ariaRequired}\n              autoComplete=\"off\"\n              // Locked: focusable, `readOnly`, `aria-disabled` — see `lockedKeyDown`.\n              disabled={locked ? undefined : disabled}\n              readOnly={locked || undefined}\n              aria-disabled={locked || undefined}\n              // eslint-disable-next-line jsx-a11y/no-autofocus -- a documented prop the caller opts into (off by default); the field never takes focus on its own.\n              autoFocus={autoFocus}\n              onBlur={onBlur}\n              onMouseDown={primaryOnly.onMouseDown}\n              onFocus={() => {\n                // A back/forward mouse button focuses this field on its way to\n                // navigating; it is not a request to open anything (live #309 rework).\n                // A locked field takes focus to say why, and opens nothing.\n                if (primaryOnly.fromAuxButton() || locked) return;\n                setOpen(true);\n                setTyping(false);\n                // The sheet carries its own input, so the field behind it must not also\n                // pull up the keyboard and scroll the page under the dialog.\n                if (isPhone) sheetInputRef.current?.focus();\n              }}\n              // A CLICK as well as focus — the other half of dev#549. Picking a suggestion\n              // closes the list without moving focus (the rows suppress `mousedown` on\n              // purpose, so the input never blurred), which means clicking the field again\n              // fires no `focus` event at all and the list stayed shut. \"Does not open\n              // anything\" was literally true.\n              onClick={() => {\n                if (locked) return;\n                setOpen(true);\n                setTyping(false);\n              }}\n              // `inputMode=\"none\"` rather than readOnly: the field must not look\n              // uneditable (FIELD_BASE greys a read-only field since dev#468) and must\n              // still take focus — it just has no keyboard of its own, the same trick\n              // the amount field uses for the numpad.\n              inputMode={isPhone ? \"none\" : undefined}\n              onChange={(e) => {\n                if (locked) return;\n                onChange(e.target.value);\n                setOpen(true);\n                setActive(-1);\n                setTyping(true);\n              }}\n              onKeyDown={(e) => {\n                if (locked) return lockedKeyDown(e);\n                if (e.key === \"ArrowDown\") {\n                  e.preventDefault();\n                  setOpen(true);\n                  setActive((i) => Math.min(i + 1, matches.length - 1));\n                } else if (e.key === \"ArrowUp\") {\n                  e.preventDefault();\n                  setActive((i) => Math.max(i - 1, 0));\n                } else if (e.key === \"Enter\") {\n                  // The Enter that confirms an IME composition is the IME's: it picks no\n                  // row and submits nothing (BUG-9).\n                  if (isImeEnter(e)) return;\n                  if (open && active >= 0 && active < matches.length) {\n                    e.preventDefault();\n                    take(matches[active]);\n                  } else {\n                    // No row highlighted: the typed text is the answer. `preventDefault`\n                    // only when a caller is taking Enter, so a plain form submit is\n                    // otherwise left alone.\n                    if (onSubmit) e.preventDefault();\n                    setOpen(false);\n                    onSubmit?.();\n                  }\n                } else if (e.key === \"Escape\") {\n                  // A list that is SHOWING is the top of the Escape stack, and the key\n                  // closes it and stops here: a Modal or FullBleedDialog around the field\n                  // otherwise closed with it, form and all (round 0.34 BUG-1). With no\n                  // list on screen the key goes on to whoever wants it.\n                  if (showing && takeEscape(e)) return;\n                  setOpen(false);\n                  setActive(-1);\n                } else if (e.key === \"Tab\") {\n                  // Closes, and lets the browser take the Tab: focus is in THIS input,\n                  // which is staying, so there is nothing to catch — unlike the pickers\n                  // whose focus sits inside a portalled panel.\n                  setOpen(false);\n                  setActive(-1);\n                }\n                // Home/End are deliberately absent. The APG gives them to the list only\n                // where the combobox is not editable; here the text IS the value, a\n                // payee name is long enough to want the caret moved to its start, and\n                // the desktop list is capped at 8 rows — so jumping it would be worth\n                // almost nothing and would cost the one gesture that field is used with.\n              }}\n              className={cn(\n                FIELD_BASE,\n                label !== undefined && FIELD_FLOATING_PAD,\n                \"pe-9\",\n                field.isInvalid && FIELD_INVALID,\n              )}\n            />\n            <ChevronDown\n              aria-hidden\n              onMouseDown={(e) => {\n                // Toggle on the chevron without stealing focus from the input.\n                e.preventDefault();\n                if (!inert) setOpen((o) => !o);\n              }}\n              className={cn(\n                \"absolute end-2.5 top-1/2 size-4 -translate-y-1/2 text-placeholder\",\n                // The box above does the dimming; dimming here too would halve it again.\n                !inert && \"cursor-pointer\",\n              )}\n            />\n          </div>,\n        )}\n      </EndHintRow>\n      {/* The label and its \"?\" share the top strip — after the field in the DOM, so the\n          \"?\" follows the control in the tab order, as it does on Input and Select. */}\n      {label !== undefined && hintParts.labelHint !== undefined && (\n        <StaticLabelRow hint={hintParts.labelHint}>\n          <ComboboxFieldLabel htmlFor={fieldId} className={cn(LABEL_IN_ROW, inert && \"opacity-50\")}>\n            {label}\n          </ComboboxFieldLabel>\n        </StaticLabelRow>\n      )}\n      <FieldCaption parts={hintParts} />\n      {field.errorEl}\n      {isPhone && (\n        <PickerSheet\n          open={open && !inert}\n          onClose={() => setOpen(false)}\n          title={sheetTitle ?? label}\n          // The sheet's input IS the field: this is a free-text control, so what is\n          // typed here is the value (a brand-new payee is just a name nothing\n          // matches), and the list below narrows as it changes.\n          query={value}\n          onQueryChange={(v) => {\n            onChange(v);\n            setTyping(true);\n          }}\n          searchPlaceholder={searchPlaceholder ?? placeholder}\n          inputRef={sheetInputRef}\n          closeLabel={closeLabel}\n        >\n          <ul id={listboxId} role=\"listbox\">\n            {createRow && (\n              // `role=\"option\"` rides the BUTTON, not the <li> around it: an option\n              // may not contain a separately focusable control, and the button is\n              // what a pointer presses. Same shape `CommandPalette` has always had.\n              <li role=\"presentation\">\n                <button\n                  type=\"button\"\n                  role=\"option\"\n                  aria-selected={false}\n                  onClick={() => take(typed)}\n                  className={cn(SHEET_ROW_CLASS, \"font-medium text-brand\")}\n                >\n                  {createRow}\n                </button>\n              </li>\n            )}\n            {matches.map((o, i) => {\n              const group = groupHeadings?.get(i);\n              return (\n                <Fragment key={o}>\n                  {group !== undefined && (\n                    <li\n                      role=\"presentation\"\n                      className={cn(\n                        GROUP_HEADING_STICKY,\n                        \"px-4 pb-0.5 pt-3 text-caption font-semibold uppercase tracking-wide text-muted\",\n                      )}\n                    >\n                      {group}\n                    </li>\n                  )}\n                  <li role=\"presentation\">\n                    <button\n                      type=\"button\"\n                      role=\"option\"\n                      aria-selected={o === value}\n                      onClick={() => take(o)}\n                      className={cn(\n                        SHEET_ROW_CLASS,\n                        optionAdornment && \"flex items-center justify-between gap-2\",\n                      )}\n                    >\n                      {optionAdornment ? <span className=\"truncate-until-large\">{o}</span> : o}\n                      {optionAdornment?.(o)}\n                    </button>\n                  </li>\n                </Fragment>\n              );\n            })}\n          </ul>\n        </PickerSheet>\n      )}\n      {showing && (\n        <SuggestionList id={listboxId} anchorRef={fieldRef} panelRef={panelRef}>\n          {createRow && (\n            <li role=\"presentation\">\n              <button\n                type=\"button\"\n                role=\"option\"\n                aria-selected={false}\n                tabIndex={-1}\n                onMouseDown={(e) => {\n                  // mousedown, like the rows below: the input's blur would otherwise\n                  // close the list before the click landed.\n                  e.preventDefault();\n                  take(typed);\n                }}\n                className={cn(rowClass(false), \"font-medium text-brand\")}\n              >\n                {createRow}\n              </button>\n            </li>\n          )}\n          {matches.map((o, i) => {\n            // Heading at each group boundary only — `matches` is group-contiguous, so\n            // the boundaries are a property of the list rather than of the branch\n            // drawing it. See `groupHeadings`.\n            const group = groupHeadings?.get(i);\n            return (\n              <Fragment key={o}>\n                {group !== undefined && (\n                  <li\n                    role=\"presentation\"\n                    className={cn(\n                      GROUP_HEADING_STICKY,\n                      \"px-3 pb-0.5 pt-2 text-caption font-semibold uppercase tracking-wide text-muted first:pt-1\",\n                    )}\n                  >\n                    {group}\n                  </li>\n                )}\n                <li role=\"presentation\">\n                  <button\n                    type=\"button\"\n                    id={optionId(i)}\n                    role=\"option\"\n                    // CHOSEN, not highlighted. The row the arrows are on is named by\n                    // the field's `aria-activedescendant`; saying \"selected\" for it\n                    // would tell a reader that the row they are passing over is\n                    // already the answer.\n                    aria-selected={o === value}\n                    // Focus stays in the field — that is what\n                    // `aria-activedescendant` is for — so the rows are not tab stops.\n                    tabIndex={-1}\n                    onMouseDown={(e) => {\n                      // mousedown (not click) so the blur from the input firing first\n                      // doesn't close the list before the selection registers.\n                      e.preventDefault();\n                      take(o);\n                    }}\n                    onMouseEnter={() => setActive(i)}\n                    className={cn(\n                      rowClass(i === active),\n                      group != null && \"ps-6\",\n                      // A row with a badge is a flex row so the label truncates and the\n                      // badge keeps its width; without one it stays the plain block the\n                      // other lists render, so nothing shifts for callers that pass none.\n                      // From Large up the label wraps instead (`truncate-until-large`,\n                      // text size §10.17, round 0.34 T1), as the badge-less row does.\n                      optionAdornment && \"flex items-center justify-between gap-2\",\n                    )}\n                  >\n                    {optionAdornment ? <span className=\"truncate-until-large\">{o}</span> : o}\n                    {optionAdornment?.(o)}\n                  </button>\n                </li>\n              </Fragment>\n            );\n          })}\n        </SuggestionList>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/combobox.tsx"],"sourcesContent":["import { Fragment, useId, useMemo, useRef, useState } from \"react\";\nimport type { ComponentPropsWithoutRef, ReactNode, Ref } from \"react\";\nimport { ChevronDown } from \"lucide-react\";\nimport { FIELD_BASE, FIELD_FLOATING_PAD, FIELD_INVALID } from \"./field-base\";\nimport { cn } from \"../lib/cn\";\nimport { useDropdown } from \"./dropdown\";\nimport { takeEscape, useDismissLayer } from \"../hooks/use-dismiss\";\nimport { isImeEnter } from \"../lib/ime\";\nimport { isQuietFocus } from \"../lib/quiet-focus\";\nimport { usePhoneLayout } from \"../hooks/use-breakpoint\";\nimport { PickerSheet, SHEET_ROW_CLASS } from \"./picker-sheet\";\nimport { ComboboxFieldLabel, endHintRowProps, GROUP_HEADING_STICKY, useActiveOptionScroll } from \"./combobox-core\";\nimport { useKitLocale } from \"../i18n/kit-labels\";\nimport { rankMatch } from \"../lib/text-match\";\nimport {\n  EndHintRow,\n  FieldCaption,\n  LABEL_IN_ROW,\n  LockedReason,\n  mergeDescribedBy,\n  StaticLabelRow,\n  useFieldError,\n  useFieldHint,\n  useLockReason,\n  type DisabledReasonDisplay,\n  type FieldHelpProps,\n} from \"./field-parts\";\nimport type { CommitScope } from \"./write-lock\";\nimport { lockedKeyDown, rowClass, SuggestionList, usePrimaryPressOnly } from \"./combobox-suggestions\";\n// The id-keyed sibling lives in inline-entity-combobox.tsx (MOD-9), the list both share\n// in combobox-suggestions.tsx; its public names are still this module's.\nexport { InlineEntityCombobox } from \"./inline-entity-combobox\";\nexport type { InlineEntityComboboxProps } from \"./inline-entity-combobox\";\n\n/**\n * Four of the div's own attributes are omitted because this component already owns\n * the name, with a different meaning: `id` is the INPUT's (a caller labels or\n * automates the field, not the box around it), and `onChange`/`onBlur`/`onSubmit`\n * are the field's — a value, a departure, and \"I mean what I typed\" — rather than\n * the DOM events of the wrapper. Everything else a wrapper needs reaches the root.\n */\nexport interface ComboboxProps\n  extends Omit<ComponentPropsWithoutRef<\"div\">, \"id\" | \"onChange\" | \"onBlur\" | \"onSubmit\">,\n    FieldHelpProps {\n  value: string;\n  onChange: (v: string) => void;\n  /** Suggestion pool (e.g. existing payee names). */\n  options: string[];\n  /** The visible label, a `<label for>` above the field: a ReactNode, as on every kit\n   *  field (a string until 0.34, refactor audit 2026-10, API-9). Without one, name the\n   *  field with `aria-label`. */\n  label?: ReactNode;\n  id?: string;\n  placeholder?: string;\n  className?: string;\n  /** Required and unanswered — see {@link Input}'s `invalid`. Set on the `<input>`\n   *  itself rather than on the wrapper, which is what let Keksdose's account picker\n   *  delete the `[&_input]:…` copy of {@link FIELD_INVALID} it had been carrying\n   *  because this component had no `invalid` of its own. */\n  invalid?: boolean;\n  /** What is wrong with the value, as {@link Input}'s `error`: rendered under the\n   *  field, on the `<input>`'s `aria-describedby`, and implies `invalid` (lenkbank's\n   *  scope fields, which moved here off `<Input list>` + `<datalist>`). */\n  error?: ReactNode;\n  /**\n   * Standing advice for the field — {@link Input}'s `hint`, so the combobox family\n   * reads like every other field (keksdose K4: the family had `error` and no `hint`, so\n   * the app's pickers carried their captions outside the component, attached to\n   * nothing). Plain TEXT is a caption under the field on the input's\n   * `aria-describedby`, before any error; a {@link FieldHint} \"?\" rides the label line,\n   * or with no label sits at the field's end edge, outside the box.\n   */\n  hint?: ReactNode;\n  /** As `<input disabled>`: no focus, no list, the field's settled look. The chevron\n   *  stops toggling with it — it is a mouse target the input's own `disabled` does\n   *  not reach. */\n  disabled?: boolean;\n  /**\n   * Why the value cannot be changed — {@link Button}'s `disabledReason`, for a field\n   * that SAVES itself (an inline editor whose blur writes). The input stays focusable\n   * and `aria-disabled`, is `readOnly`, opens no list and calls neither `onChange` nor\n   * `onSubmit`; the reason is in the kit {@link Tooltip} and on its `aria-describedby`.\n   * Wins over `disabled`. The family's lock (keksdose G2) — see {@link InlineEntityCombobox}.\n   */\n  disabledReason?: ReactNode;\n  /** This field COMMITS. Under a locked {@link WriteLockProvider} it is locked the\n   *  `disabledReason` way with the lock's reason; inside a form with its own Save, leave\n   *  it off and put `commit` on the Save. No provider, or an unlocked one: no effect. */\n  commit?: CommitScope;\n  /** Where the reason shows — {@link Button}'s `disabledReasonDisplay`: a line under the\n   *  field at Large and on a touch screen by default, the tooltip otherwise (DUP-3). */\n  disabledReasonDisplay?: DisabledReasonDisplay;\n  /** Heading an option belongs under. Supplying it makes this list read exactly\n   *  like {@link InlineEntityCombobox}'s — one heading per group with its rows\n   *  indented beneath — instead of a flat list (feedback #136 rework: the payee\n   *  field sat next to the newly-grouped category field and no longer matched).\n   *  Omit for a plain list. */\n  groupBy?: (option: string) => string;\n  /**\n   * Something to show at the far end of an option's row — a badge saying what the\n   * option IS, as distinct from what it is called.\n   *\n   * Keksdose's category-name field is the case: its proposals carry per-locale\n   * names, so picking one stores a category that follows the UI language, and\n   * picking a look-alike custom name does not. That difference is invisible in the\n   * label and decides what the row DOES, so the row has to show it. Returning\n   * `null` for an option renders nothing and costs no layout.\n   *\n   * Not rendered in the create row, which by definition names nothing in the pool.\n   */\n  optionAdornment?: (option: string) => ReactNode;\n  /** Focus on mount, the way `<input autoFocus>` does — and, through `onFocus`, open\n   *  the list with it. A click-the-value inline editor needs it: the cell the user\n   *  clicked names the field the caret should land in. {@link InlineEntityCombobox}\n   *  has had it since live #218. */\n  autoFocus?: boolean;\n  /** Focus genuinely LEFT the field. Not fired by picking a row — the rows suppress\n   *  `mousedown`, so the input never blurs — which is what makes it usable as a\n   *  \"close the inline editor\" signal. */\n  onBlur?: () => void;\n  /** Enter pressed with no row highlighted, i.e. \"I mean what I typed\". The list\n   *  closes either way; this is for a caller whose Enter also submits a row editor. */\n  onSubmit?: () => void;\n  /** Rows to offer when the field is empty. 8 on a dropdown, where that is all\n   *  that fits; the phone sheet asks for more because it has a screen. */\n  maxSuggestions?: number;\n  searchPlaceholder?: string;\n  closeLabel?: string;\n  /**\n   * The phone sheet's heading — and, as a string, the dialog's accessible name — for a\n   * field whose label is drawn by someone else: a bound field's label above it,\n   * which `RhfTextCombobox` hands over here (0.24). Default: `label`. Without either, the\n   * full-screen sheet opened untitled and unnamed, the one screen on a phone that has to\n   * say what it is asking for (live #200).\n   */\n  sheetTitle?: ReactNode;\n  /**\n   * Label for the row that COMMITS a value the list does not contain — e.g.\n   * `(v) => \\`Add \"${v}\" as payee\\``. Supplying it turns the free text into\n   * something you confirm rather than something you leave behind.\n   *\n   * Keksdose live #212: *\"For the payee input have an apply button, when input is\n   * placed like 'add xxx as payee' to confirm. Now it can be put in and closed with\n   * the right top X, which seems not intuitive.\"* On the phone sheet the search box\n   * IS the value, so typing a brand-new name and dismissing the sheet did commit it —\n   * but the only control on offer was the close X, which reads as \"discard\". A named\n   * affordance says what the typing did.\n   *\n   * Omit and the row is not rendered, which is the right default for a list whose\n   * values are all supposed to already exist.\n   */\n  createLabel?: (value: string) => string;\n  /**\n   * The `<input>` — the control a reader types in and the one focus belongs on — as a\n   * React 19 ref prop, the way {@link CountrySelect} takes its trigger's (0.24, kastlan:\n   * react-hook-form's focus-on-error calls `focus()` on whatever `field.ref` is handed,\n   * and a combobox with no ref inside a hand-wired `RhfField` gave it nothing, so a\n   * failed submit could not take the user to it). Not the wrapper: a ref is for focus,\n   * measurement and selection, and all three are the input's. `RhfTextCombobox` passes it.\n   */\n  ref?: Ref<HTMLInputElement>;\n}\n\n/**\n * Free-text combobox that looks like the shared {@link Select} (same FIELD_BASE\n * styling, chevron and static floating label) but lets the user type a value\n * that isn't in the list — e.g. naming a brand-new payee. Picking from the\n * filtered suggestion list fills the value; typing keeps whatever was entered.\n *\n * Use this instead of an `<Input list=\"…\">` + `<datalist>` so the control is\n * visually and behaviourally consistent with the other dropdowns (feedback\n * #230 — the payee field looked/behaved differently from every other select).\n */\nexport function Combobox(props: ComboboxProps) {\n  const {\n    value,\n    onChange,\n    options,\n    label,\n    id,\n    placeholder,\n    className,\n    groupBy,\n    maxSuggestions,\n    searchPlaceholder,\n    closeLabel,\n    sheetTitle,\n    createLabel,\n    invalid,\n    error,\n    hint,\n    help,\n    disabled,\n    disabledReason,\n    disabledReasonDisplay,\n    commit,\n    optionAdornment,\n    autoFocus,\n    onBlur,\n    onSubmit,\n    ref,\n    \"aria-label\": ariaLabel,\n    // Off `rest` and onto the <input>, which is the combobox a reader meets: `Field`'s\n    // render-prop spreads `{ id, aria-describedby, aria-invalid, aria-required }`, and\n    // on the wrapper div the hint and required state described nothing.\n    \"aria-describedby\": ariaDescribedBy,\n    \"aria-invalid\": ariaInvalid,\n    \"aria-required\": ariaRequired,\n    ...rest\n  } = props;\n  const hintParts = useFieldHint(hint, ariaDescribedBy, { help, name: label ?? ariaLabel });\n  const field = useFieldError(error, invalid, hintParts.describedBy, ariaInvalid);\n  const generated = useId();\n  const fieldId = id ?? generated;\n  // Derived from the GENERATED id, never from `id`: a caller's id is theirs to\n  // collide with, and `aria-controls` has to resolve.\n  const listboxId = `${generated}-listbox`;\n  const optionId = (index: number) => `${generated}-option-${index}`;\n  // `backCloses` is the desktop half of live #309: the phone's list IS a\n  // {@link PickerSheet}, which registers its own history entry, so registering a\n  // second one here would cost two Back presses to dismiss one sheet. Its Escape\n  // layer is this field's own, below — the list can be open with nothing to show.\n  const isPhone = usePhoneLayout();\n  const { open, setOpen, wrapperRef, panelRef } = useDropdown({ backCloses: !isPhone, escapeLayer: false });\n  const primaryOnly = usePrimaryPressOnly();\n  const [active, setActive] = useState(-1);\n  // The lock (see `lockedKeyDown`): a lock arriving while the list is up closes it,\n  // adjusted while rendering so no frame offers a row that can no longer be taken.\n  const lock = useLockReason(commit, disabledReason);\n  const locked = lock.locked;\n  const inert = locked || Boolean(disabled);\n  if (locked && open) setOpen(false);\n  // A phone opens the list as a full-screen sheet with its own input, the way a\n  // native <select> does — live #200: \"Paid as full screen dialog with input.\n  // Similar to the account select that already appears as full screen.\" The\n  // anchored list stays for pointer devices, where it is the better shape.\n  const sheetInputRef = useRef<HTMLInputElement | null>(null);\n  // The box the portalled list hangs off — the inner wrapper, which hugs the input,\n  // not the outer one (a grid item that can be taller than the field).\n  const fieldRef = useRef<HTMLDivElement>(null);\n\n  /**\n   * Is the text in the field a QUERY, or just what was picked last time?\n   *\n   * Keksdose dev#549, filed against the category-name field: *\"Currently it acts kind\n   * of a filter and clicking again does not open anything since the previous text is\n   * still there likely filtering all other options out.\"* A combobox whose filter is\n   * its own value can only ever re-offer the answer it already has — after picking\n   * \"REWE\" the list reopens holding one row, the one you are looking at, and changing\n   * your mind means clearing the field by hand first.\n   *\n   * So the text filters only while it is being TYPED; opening the list, by focus or\n   * by clicking the field again, puts the whole pool back. {@link InlineEntityCombobox}\n   * below has had this since it was written (see its `typedQuery`) and the app's\n   * category-name field grew its own copy to get it — this one, the payee field, was\n   * the one left with the bug.\n   *\n   * Not derived from \"does the text exactly match an option\": a custom value that\n   * happens to collide with one would then behave differently from every other, and\n   * what is being tracked is what the user just did, which is not a property of the\n   * string.\n   */\n  const [typing, setTyping] = useState(false);\n\n  const query = typing ? value.trim() : \"\";\n  // Folded as every kit list folds (DUP-5): \"zurich\" finds Zürich, by the locale's case.\n  const locale = useKitLocale();\n  const matches = useMemo(() => {\n    const seen = new Set<string>();\n    const uniq = options.filter((o) => o && !seen.has(o) && seen.add(o));\n    let ranked: string[];\n    const cap = maxSuggestions ?? (isPhone ? 50 : 8);\n    if (!query) {\n      ranked = uniq.slice(0, cap);\n    } else {\n      // The whole name, then prefix matches, then substring matches — most relevant on\n      // top (`rankMatch`; a stable sort keeps the pool's order within a rank).\n      ranked = uniq\n        .map((o) => ({ o, rank: rankMatch(o, query, { locale }) }))\n        .filter((x) => x.rank >= 0)\n        .sort((a, b) => a.rank - b.rank)\n        .map((x) => x.o)\n        .slice(0, cap);\n    }\n    if (!groupBy) return ranked;\n    // Keep each group contiguous so a heading appears once instead of every time\n    // the ranking interleaves two groups — while preserving \"best match first\":\n    // a Map keeps insertion order, so groups come out ordered by their best-ranked\n    // member and members keep their rank order inside the group.\n    const byGroup = new Map<string, string[]>();\n    for (const o of ranked) {\n      const key = groupBy(o);\n      if (!byGroup.has(key)) byGroup.set(key, []);\n      byGroup.get(key)!.push(o);\n    }\n    return [...byGroup.values()].flat();\n  }, [options, query, groupBy, maxSuggestions, isPhone, locale]);\n\n  /**\n   * Which rows OPEN a group, and with what heading — computed once for both lists.\n   *\n   * The desktop list had this as `matches[i - 1]`, which is free; the sheet had it as\n   * `matches[matches.indexOf(o) - 1]`, which is a scan of the list per row and another\n   * per heading test. That is quadratic in the sheet's own cap of 50, on the branch\n   * that runs on the slowest hardware we ship to — and it answers the wrong question\n   * besides: `indexOf` finds the FIRST row with that string, so a duplicated option\n   * would have compared against a neighbour it is not next to. (`matches` de-duplicates\n   * today; that is a property of the memo above, not of the row being rendered.)\n   */\n  const groupHeadings = useMemo(() => {\n    if (!groupBy) return null;\n    const heads = new Map<number, string>();\n    let prev: string | undefined;\n    matches.forEach((o, i) => {\n      const group = groupBy(o);\n      if (group != null && group !== prev) heads.set(i, group);\n      prev = group;\n    });\n    return heads;\n  }, [matches, groupBy]);\n\n  const take = (v: string) => {\n    if (locked) return;\n    onChange(v);\n    setOpen(false);\n    setActive(-1);\n    // What is in the field is now an ANSWER, not a query — so reopening offers the\n    // whole pool again rather than a one-row filter of the value just chosen.\n    setTyping(false);\n  };\n\n  // Offered only when the typed text is genuinely NOT in the pool: an exact\n  // (case-insensitive) match is an existing entry the list is already showing, and a\n  // second way to pick it would be noise. Compared against `options`, not `matches` —\n  // `matches` is capped, so a pool of 300 payees would otherwise offer to \"add\" one\n  // that exists but fell off the end of the list.\n  // What the field claims the keyboard is on. Only on a pointer device: the phone\n  // renders its rows in a {@link PickerSheet} whose own search box owns focus, and a\n  // field pointing at an id that is not there is worse than one pointing nowhere.\n  const activeId = !isPhone && active >= 0 && active < matches.length ? optionId(active) : undefined;\n  useActiveOptionScroll(activeId);\n\n  // While locked the field sits in the reason's Tooltip — in a fragment with a hidden\n  // copy of the reason, Button's anatomy; `block` so a full-width field stays full width.\n  const withLock = (box: ReactNode) =>\n    locked ? (\n      <LockedReason lock={lock} display={disabledReasonDisplay} className=\"block\">\n        {box}\n      </LockedReason>\n    ) : (\n      box\n    );\n\n  const typed = value.trim();\n  const createRow =\n    createLabel && typed.length > 0 && !options.some((o) => o.toLowerCase() === typed.toLowerCase())\n      ? createLabel(typed)\n      : null;\n\n  // The list is a layer on the Escape stack while it SHOWS (Wave 2, DUP-1): an Escape\n  // over an empty \"open\" list is the dialog's, as it always was. On a phone the sheet\n  // is the layer.\n  const showing = !isPhone && open && !inert && (matches.length > 0 || Boolean(createRow));\n  useDismissLayer(showing, () => {\n    setOpen(false);\n    setActive(-1);\n  });\n\n  return (\n    // `rest` dresses the outer box — a `data-tour` anchor, a test id. Not the NAME,\n    // description, invalid or required state: those belong on the <input> below,\n    // which is the combobox a reader meets. Spread FIRST, so the field's ARIA and the\n    // handlers carrying live #309 and dev#549 cannot be replaced from outside.\n    <div {...rest} ref={wrapperRef} className={cn(\"relative\", className)}>\n      {/* A real <label for> since lenkbank's tests met a field `getByLabelText` could\n          not find: it used to be a <span>, with the text copied onto `aria-label`. The\n          name a reader hears is the same words either way. With a \"?\" it moves into a\n          row after the field, below. */}\n      {label !== undefined && hintParts.labelHint === undefined && (\n        <ComboboxFieldLabel htmlFor={fieldId} className={inert ? \"opacity-50\" : undefined}>\n          {label}\n        </ComboboxFieldLabel>\n      )}\n      <EndHintRow {...endHintRowProps(\"hint\" in props, label !== undefined, hintParts.labelHint)}>\n        {withLock(\n          /* The chevron centers against this inner wrapper, which hugs the input.\n              The outer div can be taller than the input (as a grid item it\n              stretches to the row height, e.g. next to the editor's category cell\n              with its split button), which used to drag a top-1/2 chevron down to\n              the input's bottom edge (feedback #248).\n              Dimmed as a whole when disabled (or locked), the way EntityCombobox dims its\n              trigger. FIELD_BASE's grey alone left a disabled picker looking like a\n              filled-in one beside the pickers that do dim (the label is not the input's\n              `peer`, so it is dimmed by hand above). */\n          <div ref={fieldRef} className={cn(\"relative\", inert && \"cursor-not-allowed opacity-50\")}>\n            <input\n              ref={ref}\n              id={fieldId}\n              value={value}\n              placeholder={placeholder}\n              // The caller's name, over the <label for> above — which is what names the\n              // field otherwise (dev#477: a field with neither announces only its text).\n              aria-label={ariaLabel}\n              role=\"combobox\"\n              aria-expanded={open}\n              // The list this field is the mouth of. Required by the role, and the half\n              // that was missing: the field said it was expanded and never said what it\n              // had expanded, so a reader had no way from the box to the options\n              // (ESLint's `role-has-required-aria-props`, the audit's §a11y).\n              aria-controls={listboxId}\n              aria-activedescendant={activeId}\n              aria-autocomplete=\"list\"\n              aria-invalid={field.isInvalid || undefined}\n              aria-describedby={mergeDescribedBy(field.describedBy, locked && lock.reasonId)}\n              aria-required={ariaRequired}\n              autoComplete=\"off\"\n              // Locked: focusable, `readOnly`, `aria-disabled` — see `lockedKeyDown`.\n              disabled={locked ? undefined : disabled}\n              readOnly={locked || undefined}\n              aria-disabled={locked || undefined}\n              // eslint-disable-next-line jsx-a11y/no-autofocus -- a documented prop the caller opts into (off by default); the field never takes focus on its own.\n              autoFocus={autoFocus}\n              onBlur={onBlur}\n              onMouseDown={primaryOnly.onMouseDown}\n              onFocus={(e) => {\n                // A back/forward mouse button focuses this field on its way to\n                // navigating; it is not a request to open anything (live #309 rework).\n                // A locked field takes focus to say why, and opens nothing.\n                if (primaryOnly.fromAuxButton() || locked) return;\n                // The tour's focus on arrival (§11.8) opens nothing: the list would cover\n                // its card (0.50.1). The click handler below still opens on a click.\n                if (isQuietFocus(e.currentTarget)) return;\n                setOpen(true);\n                setTyping(false);\n                // The sheet carries its own input, so the field behind it must not also\n                // pull up the keyboard and scroll the page under the dialog.\n                if (isPhone) sheetInputRef.current?.focus();\n              }}\n              // A CLICK as well as focus — the other half of dev#549. Picking a suggestion\n              // closes the list without moving focus (the rows suppress `mousedown` on\n              // purpose, so the input never blurred), which means clicking the field again\n              // fires no `focus` event at all and the list stayed shut. \"Does not open\n              // anything\" was literally true.\n              onClick={() => {\n                if (locked) return;\n                setOpen(true);\n                setTyping(false);\n              }}\n              // `inputMode=\"none\"` rather than readOnly: the field must not look\n              // uneditable (FIELD_BASE greys a read-only field since dev#468) and must\n              // still take focus — it just has no keyboard of its own, the same trick\n              // the amount field uses for the numpad.\n              inputMode={isPhone ? \"none\" : undefined}\n              onChange={(e) => {\n                if (locked) return;\n                onChange(e.target.value);\n                setOpen(true);\n                setActive(-1);\n                setTyping(true);\n              }}\n              onKeyDown={(e) => {\n                if (locked) return lockedKeyDown(e);\n                if (e.key === \"ArrowDown\") {\n                  e.preventDefault();\n                  setOpen(true);\n                  setActive((i) => Math.min(i + 1, matches.length - 1));\n                } else if (e.key === \"ArrowUp\") {\n                  e.preventDefault();\n                  setActive((i) => Math.max(i - 1, 0));\n                } else if (e.key === \"Enter\") {\n                  // The Enter that confirms an IME composition is the IME's: it picks no\n                  // row and submits nothing (BUG-9).\n                  if (isImeEnter(e)) return;\n                  if (open && active >= 0 && active < matches.length) {\n                    e.preventDefault();\n                    take(matches[active]);\n                  } else {\n                    // No row highlighted: the typed text is the answer. `preventDefault`\n                    // only when a caller is taking Enter, so a plain form submit is\n                    // otherwise left alone.\n                    if (onSubmit) e.preventDefault();\n                    setOpen(false);\n                    onSubmit?.();\n                  }\n                } else if (e.key === \"Escape\") {\n                  // A list that is SHOWING is the top of the Escape stack, and the key\n                  // closes it and stops here: a Modal or FullBleedDialog around the field\n                  // otherwise closed with it, form and all (round 0.34 BUG-1). With no\n                  // list on screen the key goes on to whoever wants it.\n                  if (showing && takeEscape(e)) return;\n                  setOpen(false);\n                  setActive(-1);\n                } else if (e.key === \"Tab\") {\n                  // Closes, and lets the browser take the Tab: focus is in THIS input,\n                  // which is staying, so there is nothing to catch — unlike the pickers\n                  // whose focus sits inside a portalled panel.\n                  setOpen(false);\n                  setActive(-1);\n                }\n                // Home/End are deliberately absent. The APG gives them to the list only\n                // where the combobox is not editable; here the text IS the value, a\n                // payee name is long enough to want the caret moved to its start, and\n                // the desktop list is capped at 8 rows — so jumping it would be worth\n                // almost nothing and would cost the one gesture that field is used with.\n              }}\n              className={cn(\n                FIELD_BASE,\n                label !== undefined && FIELD_FLOATING_PAD,\n                \"pe-9\",\n                field.isInvalid && FIELD_INVALID,\n              )}\n            />\n            <ChevronDown\n              aria-hidden\n              onMouseDown={(e) => {\n                // Toggle on the chevron without stealing focus from the input.\n                e.preventDefault();\n                if (!inert) setOpen((o) => !o);\n              }}\n              className={cn(\n                \"absolute end-2.5 top-1/2 size-4 -translate-y-1/2 text-placeholder\",\n                // The box above does the dimming; dimming here too would halve it again.\n                !inert && \"cursor-pointer\",\n              )}\n            />\n          </div>,\n        )}\n      </EndHintRow>\n      {/* The label and its \"?\" share the top strip — after the field in the DOM, so the\n          \"?\" follows the control in the tab order, as it does on Input and Select. */}\n      {label !== undefined && hintParts.labelHint !== undefined && (\n        <StaticLabelRow hint={hintParts.labelHint}>\n          <ComboboxFieldLabel htmlFor={fieldId} className={cn(LABEL_IN_ROW, inert && \"opacity-50\")}>\n            {label}\n          </ComboboxFieldLabel>\n        </StaticLabelRow>\n      )}\n      <FieldCaption parts={hintParts} />\n      {field.errorEl}\n      {isPhone && (\n        <PickerSheet\n          open={open && !inert}\n          onClose={() => setOpen(false)}\n          title={sheetTitle ?? label}\n          // The sheet's input IS the field: this is a free-text control, so what is\n          // typed here is the value (a brand-new payee is just a name nothing\n          // matches), and the list below narrows as it changes.\n          query={value}\n          onQueryChange={(v) => {\n            onChange(v);\n            setTyping(true);\n          }}\n          searchPlaceholder={searchPlaceholder ?? placeholder}\n          inputRef={sheetInputRef}\n          closeLabel={closeLabel}\n        >\n          <ul id={listboxId} role=\"listbox\">\n            {createRow && (\n              // `role=\"option\"` rides the BUTTON, not the <li> around it: an option\n              // may not contain a separately focusable control, and the button is\n              // what a pointer presses. Same shape `CommandPalette` has always had.\n              <li role=\"presentation\">\n                <button\n                  type=\"button\"\n                  role=\"option\"\n                  aria-selected={false}\n                  onClick={() => take(typed)}\n                  className={cn(SHEET_ROW_CLASS, \"font-medium text-brand\")}\n                >\n                  {createRow}\n                </button>\n              </li>\n            )}\n            {matches.map((o, i) => {\n              const group = groupHeadings?.get(i);\n              return (\n                <Fragment key={o}>\n                  {group !== undefined && (\n                    <li\n                      role=\"presentation\"\n                      className={cn(\n                        GROUP_HEADING_STICKY,\n                        \"px-4 pb-0.5 pt-3 text-caption font-semibold uppercase tracking-wide text-muted\",\n                      )}\n                    >\n                      {group}\n                    </li>\n                  )}\n                  <li role=\"presentation\">\n                    <button\n                      type=\"button\"\n                      role=\"option\"\n                      aria-selected={o === value}\n                      onClick={() => take(o)}\n                      className={cn(\n                        SHEET_ROW_CLASS,\n                        optionAdornment && \"flex items-center justify-between gap-2\",\n                      )}\n                    >\n                      {optionAdornment ? <span className=\"truncate-until-large\">{o}</span> : o}\n                      {optionAdornment?.(o)}\n                    </button>\n                  </li>\n                </Fragment>\n              );\n            })}\n          </ul>\n        </PickerSheet>\n      )}\n      {showing && (\n        <SuggestionList id={listboxId} anchorRef={fieldRef} panelRef={panelRef}>\n          {createRow && (\n            <li role=\"presentation\">\n              <button\n                type=\"button\"\n                role=\"option\"\n                aria-selected={false}\n                tabIndex={-1}\n                onMouseDown={(e) => {\n                  // mousedown, like the rows below: the input's blur would otherwise\n                  // close the list before the click landed.\n                  e.preventDefault();\n                  take(typed);\n                }}\n                className={cn(rowClass(false), \"font-medium text-brand\")}\n              >\n                {createRow}\n              </button>\n            </li>\n          )}\n          {matches.map((o, i) => {\n            // Heading at each group boundary only — `matches` is group-contiguous, so\n            // the boundaries are a property of the list rather than of the branch\n            // drawing it. See `groupHeadings`.\n            const group = groupHeadings?.get(i);\n            return (\n              <Fragment key={o}>\n                {group !== undefined && (\n                  <li\n                    role=\"presentation\"\n                    className={cn(\n                      GROUP_HEADING_STICKY,\n                      \"px-3 pb-0.5 pt-2 text-caption font-semibold uppercase tracking-wide text-muted first:pt-1\",\n                    )}\n                  >\n                    {group}\n                  </li>\n                )}\n                <li role=\"presentation\">\n                  <button\n                    type=\"button\"\n                    id={optionId(i)}\n                    role=\"option\"\n                    // CHOSEN, not highlighted. The row the arrows are on is named by\n                    // the field's `aria-activedescendant`; saying \"selected\" for it\n                    // would tell a reader that the row they are passing over is\n                    // already the answer.\n                    aria-selected={o === value}\n                    // Focus stays in the field — that is what\n                    // `aria-activedescendant` is for — so the rows are not tab stops.\n                    tabIndex={-1}\n                    onMouseDown={(e) => {\n                      // mousedown (not click) so the blur from the input firing first\n                      // doesn't close the list before the selection registers.\n                      e.preventDefault();\n                      take(o);\n                    }}\n                    onMouseEnter={() => setActive(i)}\n                    className={cn(\n                      rowClass(i === active),\n                      group != null && \"ps-6\",\n                      // A row with a badge is a flex row so the label truncates and the\n                      // badge keeps its width; without one it stays the plain block the\n                      // other lists render, so nothing shifts for callers that pass none.\n                      // From Large up the label wraps instead (`truncate-until-large`,\n                      // text size §10.17, round 0.34 T1), as the badge-less row does.\n                      optionAdornment && \"flex items-center justify-between gap-2\",\n                    )}\n                  >\n                    {optionAdornment ? <span className=\"truncate-until-large\">{o}</span> : o}\n                    {optionAdornment?.(o)}\n                  </button>\n                </li>\n              </Fragment>\n            );\n          })}\n        </SuggestionList>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/data-table-fit.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-fit.ts"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport type { DataTableColumn } from \"./data-table\";\n\n// DataTable's fit to its own width (0.48, keksdose live #451: \"On expanded sidebar for\n// desktop the table scrolls horizontally. On collapsed sidebar it fits […] Compute the\n// width selectively\"). Two column options, both opt-in:\n//\n// - `grow`: the column takes what the others leave and ellipsises (`w-full max-w-0` on\n//   its cells: in an auto table layout that is \"the rest of the row\", never its content's\n//   width), so one long title can no longer widen the table.\n// - `fitPriority`: while the table is wider than its scroller — or, with a `grow` column,\n//   while that column would get less than {@link GROW_MIN_REM} — the table leaves out\n//   its `fitPriority` columns, the LOWEST number first (ties: the later column first),\n//   and brings them back in the reverse order as soon as the table, as it is NOW, has\n//   room for them (its need re-measured, plus the column's own header width from when\n//   it was left out), so narrower content (a filter, another page) counts as much as a\n//   wider scroller. The scroller's own width, through a ResizeObserver: a sidebar, a\n//   narrower window, the Columns drawer and Large text all count the same. A column\n//   whose return the very next measure undoes stays out until the table has more room\n//   for it than it had then (0.48.3, keksdose B2: see the bring-back in `measure`).\n\n/** The least a `grow` column keeps before the table starts leaving columns out: about\n *  a sentence of a title. In rem, so Large text asks for more. */\nexport const GROW_MIN_REM = 10;\n\n/** The `<th>`/`<td>` classes of a `grow` column. `truncate-until-large`: one line and an\n *  ellipsis at Normal, a wrap from Large up (text size §10.17), as every kit title. The\n *  header's `min-w-[10rem]` ({@link GROW_MIN_REM}) is the floor once no `fitPriority`\n *  column is left to leave out: the table then scrolls sideways rather than crushing the\n *  column it exists for (Kurvenschmiede S1, 0.48: Subject was 24px at 1100px). */\nexport const GROW_HEAD_CLASS = \"w-full max-w-0 min-w-[10rem]\";\nexport const GROW_CELL_CLASS = \"w-full max-w-0 truncate-until-large\";\n\n/** Every OTHER cell of a table with a `grow` column (kastlan S2, 0.48). A `w-full` column\n *  squeezes the rest to their min-content width, so any text with a space broke in two\n *  even at 1920px (\"CHF 2'568.38\", \"Peter Mueller\", a date with its time). One line at\n *  Normal, so a column is never narrower than its text and `fitPriority` measures what\n *  the columns really need; from Large up the cell wraps as before (§10.17). The headers\n *  are `whitespace-nowrap` already. A column whose prose should wrap anyway passes\n *  `not-large:whitespace-normal` in its `className`. */\nexport const GROW_PEER_CELL_CLASS = \"not-large:whitespace-nowrap\";\n\n// A cell's own flex-wrap row (chips) is left to wrap beside a `grow` column: a row of\n// badges reads as well stacked, and held to one line it widened the user roster's Status\n// until kastlan's admin pane scrolled 21px at 1280px (0.48 build review 2, kastlan S1).\n\n/** The auto-hide order: lowest `fitPriority` first, the later column first on a tie. */\nexport function fitHideOrder<T>(columns: DataTableColumn<T>[]): DataTableColumn<T>[] {\n  return columns\n    .map((col, index) => ({ col, index }))\n    .filter(({ col }) => col.fitPriority != null)\n    .sort((a, b) => a.col.fitPriority! - b.col.fitPriority! || b.index - a.index)\n    .map(({ col }) => col);\n}\n\n/**\n * Which columns the table leaves out for width, and the Columns panel's \"keep it\".\n *\n * A column the user TICKS in the Columns panel is theirs: it is never left out for width\n * again while the table is mounted (`keep`): the table makes room by leaving out the next\n * candidate, and scrolls sideways once none is left — what they asked for. Unticking it hides it as before (the persisted `hiddenCols`) and\n * drops the keep. Keeps are not persisted: on the next visit the table fits again.\n */\nexport function useColumnFit<T>({\n  columns,\n  hiddenCols,\n  headRefs,\n  scroller,\n  enabled,\n  content,\n}: {\n  columns: DataTableColumn<T>[];\n  /** The user's hidden columns: never candidates (they are out already). */\n  hiddenCols: Set<string>;\n  headRefs: Map<string, HTMLTableCellElement>;\n  /** The desktop scroller, read after render (it is declared below the call). */\n  scroller: () => HTMLElement | null;\n  /** The wide layout. On a phone (the card list) nothing is left out for width. */\n  enabled: boolean;\n  /**\n   * What can change the columns' widths besides the scroller (0.48.2): the rows on\n   * screen, the columns, the stored widths, the text size. Compared item by item after\n   * each render, and the table is measured only when one changed — a selection tick no\n   * longer forces a layout of the whole table. Without it, every render measures.\n   */\n  content?: readonly unknown[];\n}): {\n  /** The columns left out for width now — empty while off. */\n  autoHidden: Set<string>;\n  /** The user's choice in the Columns panel: `true` keeps the column in whatever the width. */\n  keep: (key: string, on: boolean) => void;\n} {\n  const [kept, setKept] = useState<ReadonlySet<string>>(() => new Set());\n  const [hidden, setHidden] = useState<string[]>([]);\n  // A column's own header width, written when it is left out: it comes back once the\n  // table's need as it is now, plus this, fits the scroller (keksdose S3, 0.48: not the\n  // whole table's need at hide time, which went stale when the content narrowed).\n  const ownWidth = useRef(new Map<string, number>());\n  // A column whose return the very next measure undid, at the same scroller width: the\n  // room the table had for it when it came back (keksdose B2, 0.48.3). It stays out\n  // until the table has more. Dropped once the column is no longer left out for width.\n  const stuck = useRef(new Map<string, number>());\n  // What the last measure brought back, each column with the room it had then, and at\n  // which scroller width: read (and cleared) by the measure right after it.\n  const lastShown = useRef<{ avail: number; rooms: Map<string, number> } | null>(null);\n\n  const hasFit = columns.some((c) => c.fitPriority != null);\n  const active = enabled && hasFit;\n  const order = useMemo(\n    () => fitHideOrder(columns).filter((c) => !hiddenCols.has(c.key) && !kept.has(c.key)),\n    [columns, hiddenCols, kept],\n  );\n  // Only the candidates still in play, in hide order — a column the user hid or kept\n  // since, or one the app dropped, is no longer \"hidden for width\".\n  const current = useMemo(\n    () => (active ? order.filter((c) => hidden.includes(c.key)).map((c) => c.key) : []),\n    [active, order, hidden],\n  );\n  const growKey = columns.find((c) => c.grow && !hiddenCols.has(c.key))?.key;\n\n  // What `measure` reads, refreshed after each render (before the measure below runs):\n  // the ResizeObserver's callback is set up once and must see the current columns.\n  const latest = useRef({ order, current, growKey, active, scroller });\n  useLayoutEffect(() => {\n    latest.current = { order, current, growKey, active, scroller };\n  });\n\n  const measure = useCallback(() => {\n    const { order, current, growKey, active, scroller } = latest.current;\n    // Only the measure right after a bring-back can undo it.\n    const flip = lastShown.current;\n    lastShown.current = null;\n    for (const k of stuck.current.keys()) if (!current.includes(k)) stuck.current.delete(k);\n    const el = scroller();\n    if (!active || !el) return;\n    const table = el.querySelector(\"table\");\n    const avail = el.clientWidth;\n    // Not laid out (display:none, jsdom): nothing to fit to.\n    if (!table || avail <= 0) return;\n    const growTh = growKey ? headRefs.get(growKey) : undefined;\n    const rem = parseFloat(getComputedStyle(document.documentElement).fontSize) || 16;\n    let need = growTh\n      ? table.offsetWidth - growTh.offsetWidth + GROW_MIN_REM * rem\n      : table.offsetWidth;\n    if (!growTh && need <= avail + 0.5 && current.length > 0) {\n      // A `w-full` table is at least the scroller's width, which says nothing about how\n      // much room its content leaves: probe its content's width (what it takes once it\n      // overflows) for the bring-back below. Read and put back in one layout pass.\n      const before = table.style.width;\n      table.style.width = \"min-content\";\n      need = table.offsetWidth;\n      table.style.width = before;\n    }\n    if (need > avail + 0.5) {\n      // Leave out, in order, until the rest fits: each column saves its header's width\n      // (the others are at their content's width while a `grow` column takes the rest).\n      const next = [...current];\n      for (const col of order) {\n        if (need <= avail + 0.5) break;\n        if (next.includes(col.key)) continue;\n        const w = headRefs.get(col.key)?.offsetWidth ?? 0;\n        ownWidth.current.set(col.key, w);\n        need -= w;\n        next.push(col.key);\n      }\n      if (next.length === current.length) return;\n      // The last measure brought these back at this same width, and the table cannot\n      // hold them: their header width fell short of what they cost drawn (see below).\n      if (flip && Math.abs(flip.avail - avail) <= 0.5)\n        for (const k of next.slice(current.length)) {\n          const room = flip.rooms.get(k);\n          if (room != null) stuck.current.set(k, room);\n        }\n      setHidden(next);\n      return;\n    }\n    // Bring back, the last left out first, while the table as it is now has room for\n    // them by their recorded header width. A column that costs more drawn than that is\n    // left out again by the next measure, before paint. That alone does not settle it:\n    // the re-hide records its header's width again, and the header can measure the same\n    // while the column costs more (`virtualize`'s locked widths, keksdose B2, 0.48.3: the\n    // drawn column cost the table ~80–110px more than its header), so it came back, went, came back … until React's\n    // update limit (#185). So a column whose return the next measure undid, at the same\n    // scroller width, waits for more room than it had then: a wider scroller or narrower\n    // content. Whatever the error in its width, that is one invisible flip per room it is\n    // tried at.\n    let n = current.length;\n    const rooms = new Map<string, number>();\n    while (n > 0) {\n      const k = current[n - 1];\n      const w = ownWidth.current.get(k);\n      if (w == null || need + w > avail + 0.5) break;\n      const room = stuck.current.get(k);\n      if (room != null && avail - need <= room + 0.5) break;\n      rooms.set(k, avail - need);\n      need += w;\n      n--;\n    }\n    if (n === current.length) return;\n    lastShown.current = { avail, rooms };\n    setHidden(current.slice(0, n));\n  }, [headRefs]);\n\n  // After a render that changed what is drawn: rows, a filter or a page can widen a\n  // column as much as a resize. Before paint, so a column the table cannot hold is never\n  // drawn first. A render that changed none of it (a ticked box, a focused row) skips the\n  // measure, which forces a layout of the whole table (0.48.2, keksdose dev #632).\n  const lastContent = useRef<readonly unknown[] | null>(null);\n  useLayoutEffect(() => {\n    const now = content ? [...content, order, current, growKey, active] : null;\n    const prev = lastContent.current;\n    lastContent.current = now;\n    if (now && prev && prev.length === now.length && prev.every((v, i) => Object.is(v, now[i]))) return;\n    measure();\n  });\n\n  useEffect(() => {\n    const el = latest.current.scroller();\n    if (!active || !el || typeof ResizeObserver === \"undefined\") return;\n    const ro = new ResizeObserver(() => measure());\n    ro.observe(el);\n    return () => ro.disconnect();\n  }, [active, measure]);\n\n  const keep = useCallback((key: string, on: boolean) => {\n    setKept((s) => {\n      if (s.has(key) === on) return s;\n      const next = new Set(s);\n      if (on) next.add(key);\n      else next.delete(key);\n      return next;\n    });\n  }, []);\n\n  const autoHidden = useMemo(() => new Set(current), [current]);\n  return { autoHidden, keep };\n}\n"],"mappings":"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","names":["order","current","growKey","active","scroller"]}
+{"version":3,"sources":["../../src/components/data-table-fit.ts"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport type { DataTableColumn } from \"./data-table\";\n\n// DataTable's fit to its own width (0.48, keksdose live #451: \"On expanded sidebar for\n// desktop the table scrolls horizontally. On collapsed sidebar it fits […] Compute the\n// width selectively\"). Two column options, both opt-in:\n//\n// - `grow`: the column takes what the others leave and ellipsises (`w-full max-w-0` on\n//   its cells: in an auto table layout that is \"the rest of the row\", never its content's\n//   width), so one long title can no longer widen the table.\n// - `fitPriority`: while the table is wider than its scroller — or, with a `grow` column,\n//   while that column would get less than {@link GROW_MIN_REM} — the table leaves out\n//   its `fitPriority` columns, the LOWEST number first (ties: the later column first),\n//   and brings them back in the reverse order as soon as the table, as it is NOW, has\n//   room for them (its need re-measured, plus the column's own header width from when\n//   it was left out), so narrower content (a filter, another page) counts as much as a\n//   wider scroller. The scroller's own width, through a ResizeObserver: a sidebar, a\n//   narrower window, the Columns drawer and Large text all count the same. A column\n//   whose return the very next measure undoes stays out until the table has more room\n//   for it than it had then (0.48.3, keksdose B2: see the bring-back in `measure`).\n\n/** The least a `grow` column keeps before the table starts leaving columns out: about\n *  a sentence of a title. In rem, so Large text asks for more. */\nexport const GROW_MIN_REM = 10;\n\n/** The `<th>`/`<td>` classes of a `grow` column. `truncate-until-large`: one line and an\n *  ellipsis at Normal, a wrap from Large up (text size §10.17), as every kit title. The\n *  header's `min-w-[10rem]` ({@link GROW_MIN_REM}) is the floor once no `fitPriority`\n *  column is left to leave out: the table then scrolls sideways rather than crushing the\n *  column it exists for (Kurvenschmiede S1, 0.48: Subject was 24px at 1100px). */\nexport const GROW_HEAD_CLASS = \"w-full max-w-0 min-w-[10rem]\";\nexport const GROW_CELL_CLASS = \"w-full max-w-0 truncate-until-large\";\n\n/** Every OTHER cell of a table with a `grow` column (kastlan S2, 0.48). A `w-full` column\n *  squeezes the rest to their min-content width, so any text with a space broke in two\n *  even at 1920px (\"CHF 2'568.38\", \"Peter Mueller\", a date with its time). One line at\n *  Normal, so a column is never narrower than its text and `fitPriority` measures what\n *  the columns really need; from Large up the cell wraps as before (§10.17). The headers\n *  are `whitespace-nowrap` already. A column whose prose should wrap anyway passes\n *  `not-large:whitespace-normal` in its `className`. */\nexport const GROW_PEER_CELL_CLASS = \"not-large:whitespace-nowrap\";\n\n// A cell's own flex-wrap row (chips) is left to wrap beside a `grow` column: a row of\n// badges reads as well stacked, and held to one line it widened the user roster's Status\n// until kastlan's admin pane scrolled 21px at 1280px (0.48 build review 2, kastlan S1).\n\n/** The auto-hide order: lowest `fitPriority` first, the later column first on a tie. */\nexport function fitHideOrder<T>(columns: DataTableColumn<T>[]): DataTableColumn<T>[] {\n  return columns\n    .map((col, index) => ({ col, index }))\n    .filter(({ col }) => col.fitPriority != null)\n    .sort((a, b) => a.col.fitPriority! - b.col.fitPriority! || b.index - a.index)\n    .map(({ col }) => col);\n}\n\n/**\n * Which columns the table leaves out for width, and the Columns panel's \"keep it\".\n *\n * A column the user TICKS in the Columns panel is theirs: it is never left out for width\n * again while the table is mounted (`keep`): the table makes room by leaving out the next\n * candidate, and scrolls sideways once none is left — what they asked for. Unticking it hides it as before (the persisted `hiddenCols`) and\n * drops the keep. Keeps are not persisted: on the next visit the table fits again.\n */\nexport function useColumnFit<T>({\n  columns,\n  hiddenCols,\n  headRefs,\n  scroller,\n  enabled,\n  content,\n}: {\n  columns: DataTableColumn<T>[];\n  /** The user's hidden columns: never candidates (they are out already). */\n  hiddenCols: Set<string>;\n  headRefs: Map<string, HTMLTableCellElement>;\n  /** The desktop scroller, read after render (it is declared below the call). */\n  scroller: () => HTMLElement | null;\n  /** The wide layout. On a phone (the card list) nothing is left out for width. */\n  enabled: boolean;\n  /**\n   * What can change the columns' widths besides the scroller (0.48.2): the rows on\n   * screen, the columns, the stored widths, the text size. Compared item by item after\n   * each render, and the table is measured only when one changed — a selection tick no\n   * longer forces a layout of the whole table. Without it, every render measures.\n   */\n  content?: readonly unknown[];\n}): {\n  /** The columns left out for width now — empty while off. */\n  autoHidden: Set<string>;\n  /** The user's choice in the Columns panel: `true` keeps the column in whatever the width. */\n  keep: (key: string, on: boolean) => void;\n} {\n  const [kept, setKept] = useState<ReadonlySet<string>>(() => new Set());\n  const [hidden, setHidden] = useState<string[]>([]);\n  // A column's own header width, written when it is left out: it comes back once the\n  // table's need as it is now, plus this, fits the scroller (keksdose S3, 0.48: not the\n  // whole table's need at hide time, which went stale when the content narrowed).\n  const ownWidth = useRef(new Map<string, number>());\n  // A column whose return the very next measure undid, at the same scroller width: the\n  // room the table had for it when it came back (keksdose B2, 0.48.3). It stays out\n  // until the table has more. Dropped once the column is no longer left out for width.\n  const stuck = useRef(new Map<string, number>());\n  // What the last measure brought back, each column with the room it had then, and at\n  // which scroller width: read (and cleared) by the measure right after it.\n  const lastShown = useRef<{ avail: number; rooms: Map<string, number> } | null>(null);\n\n  const hasFit = columns.some((c) => c.fitPriority != null);\n  const active = enabled && hasFit;\n  const order = useMemo(\n    () => fitHideOrder(columns).filter((c) => !hiddenCols.has(c.key) && !kept.has(c.key)),\n    [columns, hiddenCols, kept],\n  );\n  // Only the candidates still in play, in hide order — a column the user hid or kept\n  // since, or one the app dropped, is no longer \"hidden for width\".\n  const current = useMemo(\n    () => (active ? order.filter((c) => hidden.includes(c.key)).map((c) => c.key) : []),\n    [active, order, hidden],\n  );\n  const growKey = columns.find((c) => c.grow && !hiddenCols.has(c.key))?.key;\n\n  // What `measure` reads, refreshed after each render (before the measure below runs):\n  // the ResizeObserver's callback is set up once and must see the current columns.\n  const latest = useRef({ order, current, growKey, active, scroller });\n  useLayoutEffect(() => {\n    latest.current = { order, current, growKey, active, scroller };\n  });\n\n  const measure = useCallback(() => {\n    const { order, current, growKey, active, scroller } = latest.current;\n    // Only the measure right after a bring-back can undo it.\n    const flip = lastShown.current;\n    lastShown.current = null;\n    for (const k of stuck.current.keys()) if (!current.includes(k)) stuck.current.delete(k);\n    const el = scroller();\n    if (!active || !el) return;\n    const table = el.querySelector(\"table\");\n    const avail = el.clientWidth;\n    // Not laid out (display:none, jsdom): nothing to fit to.\n    if (!table || avail <= 0) return;\n    const growTh = growKey ? headRefs.get(growKey) : undefined;\n    const rem = parseFloat(getComputedStyle(document.documentElement).fontSize) || 16;\n    let need = growTh\n      ? table.offsetWidth - growTh.offsetWidth + GROW_MIN_REM * rem\n      : table.offsetWidth;\n    if (!growTh && need <= avail + 0.5 && current.length > 0) {\n      // A `w-full` table is at least the scroller's width, which says nothing about how\n      // much room its content leaves: probe its content's width (what it takes once it\n      // overflows) for the bring-back below. Read and put back in one layout pass.\n      const before = table.style.width;\n      table.style.width = \"min-content\";\n      need = table.offsetWidth;\n      table.style.width = before;\n    }\n    if (need > avail + 0.5) {\n      // Leave out, in order, until the rest fits: each column saves its header's width\n      // (the others are at their content's width while a `grow` column takes the rest).\n      const next = [...current];\n      for (const col of order) {\n        if (need <= avail + 0.5) break;\n        if (next.includes(col.key)) continue;\n        const w = headRefs.get(col.key)?.offsetWidth ?? 0;\n        ownWidth.current.set(col.key, w);\n        need -= w;\n        next.push(col.key);\n      }\n      if (next.length === current.length) return;\n      // The last measure brought these back at this same width, and the table cannot\n      // hold them: their header width fell short of what they cost drawn (see below).\n      if (flip && Math.abs(flip.avail - avail) <= 0.5)\n        for (const k of next.slice(current.length)) {\n          const room = flip.rooms.get(k);\n          if (room != null) stuck.current.set(k, room);\n        }\n      setHidden(next);\n      return;\n    }\n    // Bring back, the last left out first, while the table as it is now has room for\n    // them by their recorded header width. A column that costs more drawn than that is\n    // left out again by the next measure, before paint. That alone does not settle it:\n    // the re-hide records its header's width again, and the header can measure the same\n    // while the column costs more (`virtualize`'s locked widths, keksdose B2, 0.48.3: the\n    // drawn column cost the table ~80–110px more than its header), so it came back, went, came back … until React's\n    // update limit (#185). So a column whose return the next measure undid, at the same\n    // scroller width, waits for more room than it had then: a wider scroller or narrower\n    // content. Whatever the error in its width, that is one invisible flip per room it is\n    // tried at. (0.51, keksdose N2: under `virtualize` that excess was the table coming\n    // back at an OLD lock's ratcheted widths, not the ones measured here; the lock now goes\n    // when the columns change, data-table-virtual.ts. The guard stays for the rest: a\n    // column whose drawn cells are wider than its header.)\n    let n = current.length;\n    const rooms = new Map<string, number>();\n    while (n > 0) {\n      const k = current[n - 1];\n      const w = ownWidth.current.get(k);\n      if (w == null || need + w > avail + 0.5) break;\n      const room = stuck.current.get(k);\n      if (room != null && avail - need <= room + 0.5) break;\n      rooms.set(k, avail - need);\n      need += w;\n      n--;\n    }\n    if (n === current.length) return;\n    lastShown.current = { avail, rooms };\n    setHidden(current.slice(0, n));\n  }, [headRefs]);\n\n  // After a render that changed what is drawn: rows, a filter or a page can widen a\n  // column as much as a resize. Before paint, so a column the table cannot hold is never\n  // drawn first. A render that changed none of it (a ticked box, a focused row) skips the\n  // measure, which forces a layout of the whole table (0.48.2, keksdose dev #632).\n  const lastContent = useRef<readonly unknown[] | null>(null);\n  useLayoutEffect(() => {\n    const now = content ? [...content, order, current, growKey, active] : null;\n    const prev = lastContent.current;\n    lastContent.current = now;\n    if (now && prev && prev.length === now.length && prev.every((v, i) => Object.is(v, now[i]))) return;\n    measure();\n  });\n\n  useEffect(() => {\n    const el = latest.current.scroller();\n    if (!active || !el || typeof ResizeObserver === \"undefined\") return;\n    const ro = new ResizeObserver(() => measure());\n    ro.observe(el);\n    return () => ro.disconnect();\n  }, [active, measure]);\n\n  const keep = useCallback((key: string, on: boolean) => {\n    setKept((s) => {\n      if (s.has(key) === on) return s;\n      const next = new Set(s);\n      if (on) next.add(key);\n      else next.delete(key);\n      return next;\n    });\n  }, []);\n\n  const autoHidden = useMemo(() => new Set(current), [current]);\n  return { autoHidden, keep };\n}\n"],"mappings":"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","names":["order","current","growKey","active","scroller"]}

package/dist/components/data-table-virtual.js

@@ -154,6 +154,7 @@ function useRowWindow({
     [model, groups, start, end, pinnedSig]
   );
   const lockSig = `${resetKey}|${scrollerWidth}|${colKeys.join(",")}`;
+  if (lock !== null && lock.sig !== lockSig) setLock(null);
   const colWidths = lock && lock.sig === lockSig ? lock.widths : null;
   const latest = useRef({ model, colWidths, lockSig, colKeys, lockable, overscan });
   useLayoutEffect(() => {

package/dist/components/data-table-virtual.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-virtual.ts"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport type { RefObject } from \"react\";\n\n// DataTable's row windowing (0.48.2, keksdose dev #632 — Marcel: \"The table is extremely\n// slow. Is it virtualised or is everytime the whole table rendered?\"). Opt-in through\n// `virtualize`: the desktop table renders the rows near the visible part of its scroller\n// (plus `overscan`) and stands spacer rows in for the rest, inside each group's own\n// `<tbody>`, so the sticky group bands keep working as they do on a full table — a band\n// cell's sticky containing block is the TABLE, and the latest band of each level that has\n// scrolled past is the one drawn (Chromium, checked with a probe at the group's middle,\n// its end and the next group's start).\n//\n// What it keeps rendered whatever the scroll: the header, the leading row, the band rows\n// of every group that has a rendered row (and the first day of the period the window\n// starts in, whose band is the period's), every OPEN row (`isExpanded`, so an inline\n// editor keeps its state), the roving tab stop, a row holding the focus, and the row the\n// keyboard is moving to.\n//\n// Heights: each rendered row is measured after render (the distance to the next row's\n// top, which is exact under collapsed borders where a row's own box is half a border\n// short) and remembered by its key; a row never rendered counts as the average of the\n// measured ones, or `estimateRowHeight` before any. The spacers are the sums, so the\n// scroll height settles as rows are seen. Scroll anchoring (the browser's) keeps the rows\n// in view still while a spacer above them is corrected.\n//\n// Column widths: in an auto table layout a column is as wide as its widest RENDERED\n// cell, so rows coming and going would move the columns. The header cells' widths are\n// read after the first render and locked into a `<colgroup>`, only ever growing while the\n// rows scroll (a wider cell arriving widens its column once; one leaving narrows\n// nothing). Re-measured from scratch when the data, the columns, a user width, the text\n// size or the scroller's width change — and when a grown column would push the table\n// past its scroller, which it fit before. A `grow` column and a user-resized one are not\n// locked (the first takes the rest, the second is pinned already).\n\n/** {@link DataTableProps.virtualize}'s options. */\nexport interface DataTableVirtualize {\n  /** Rows rendered beyond each edge of the visible part. Default 12. */\n  overscan?: number;\n  /** A row's height in px before it has been measured. Default: 37 (`comfortable`) /\n   *  29 (`compact`) — the kit's one-line rows. */\n  estimateRowHeight?: number;\n}\n\n/** One innermost group's run of rows, `[start, end)` in the rows on screen, with the\n *  band levels its `<tbody>` opens with. `first` is the index of the innermost group that\n *  opens its level-1 group (itself with one level). Ungrouped: one run with no bands. */\nexport interface VirtualGroup {\n  start: number;\n  end: number;\n  bands: readonly (1 | 2)[];\n  first: number;\n}\n\n/** A row, or a spacer standing in for the rows between two rendered ones. */\nexport type VirtualItem = { kind: \"row\"; index: number } | { kind: \"gap\"; key: string; height: number };\n\n/** A group's `<tbody>` with its rendered rows, or one spacer `<tbody>` for a run of\n *  groups of which nothing is rendered. */\nexport type VirtualBody =\n  | { kind: \"spacer\"; key: string; height: number }\n  | { kind: \"group\"; group: number; items: VirtualItem[] };\n\nexport interface RowWindow {\n  bodies: VirtualBody[];\n  /** `aria-rowcount`: every row of the table, header, bands, details and footer included. */\n  rowCount: number;\n  /** `aria-rowindex` of data row `i`; its detail row (open) is the next one. */\n  ariaRow: (i: number) => number;\n  /** `aria-rowindex` of group `g`'s band of `level`. */\n  ariaBand: (g: number, level: 1 | 2) => number;\n  /** The locked widths for the `<colgroup>`, by column key; null while measuring. */\n  colWidths: Record<string, number> | null;\n  /** Move the focus to row `i`, rendering it first when it is not. */\n  focusRow: (i: number) => void;\n}\n\n/** The heights measured so far, by row key; the bands' by level. */\ninterface Measured {\n  heights: Map<string | number, number>;\n  details: Map<string | number, number>;\n  sum: number;\n  count: number;\n  band: [number, number];\n}\n\nconst SELECT_KEY = \"\\u0000select\";\n/** The `<colgroup>` key of the selection column. */\nexport const VIRTUAL_SELECT_COL = SELECT_KEY;\n\ninterface Model {\n  n: number;\n  keys: (string | number)[];\n  /** Top of row i, from the top of the first group's `<tbody>`. */\n  tops: Float64Array;\n  /** Full height of row i (its detail row included while open). */\n  h: Float64Array;\n  /** Top of group g's `<tbody>`; [groups.length] is the total. */\n  gTop: Float64Array;\n  total: number;\n  ariaRows: Int32Array;\n  ariaBands: Int32Array;\n  rowCount: number;\n}\n\n/** First index whose bottom is below `y` (n when none). */\nfunction firstBelow(m: Model, y: number): number {\n  let lo = 0;\n  let hi = m.n;\n  while (lo < hi) {\n    const mid = (lo + hi) >> 1;\n    if (m.tops[mid] + m.h[mid] > y) hi = mid;\n    else lo = mid + 1;\n  }\n  return lo;\n}\n\n/** One past the last index whose top is above `y`. */\nfunction lastAbove(m: Model, y: number): number {\n  let lo = 0;\n  let hi = m.n;\n  while (lo < hi) {\n    const mid = (lo + hi) >> 1;\n    if (m.tops[mid] < y) lo = mid + 1;\n    else hi = mid;\n  }\n  return lo;\n}\n\n/** The `<tbody>`s to render: the groups holding a rendered row (or the period's first\n *  day, for its band), and one spacer for each run of groups in between. Pure. */\nexport function planBodies(\n  m: Pick<Model, \"n\" | \"tops\" | \"h\" | \"gTop\">,\n  groups: readonly VirtualGroup[],\n  start: number,\n  end: number,\n  pinned: readonly number[],\n): VirtualBody[] {\n  const rendered = new Set<number>();\n  for (let i = Math.max(0, start); i < Math.min(m.n, end); i++) rendered.add(i);\n  for (const p of pinned) if (p >= 0 && p < m.n) rendered.add(p);\n  const sorted = [...rendered].sort((a, b) => a - b);\n  // The group the window starts in, and the first day of its period.\n  let anchor = -1;\n  if (sorted.length > 0 && start < m.n) {\n    const s = Math.max(0, start);\n    const g = groups.findIndex((gr) => s >= gr.start && s < gr.end);\n    if (g >= 0) anchor = groups[g].first;\n  }\n  const bottom = (i: number) => m.tops[i] + m.h[i];\n  const out: VirtualBody[] = [];\n  let k = 0;\n  let skippedFrom = -1;\n  const flushSkipped = (upTo: number) => {\n    if (skippedFrom < 0) return;\n    out.push({ kind: \"spacer\", key: `vs:${skippedFrom}`, height: m.gTop[upTo] - m.gTop[skippedFrom] });\n    skippedFrom = -1;\n  };\n  groups.forEach((g, gi) => {\n    while (k < sorted.length && sorted[k] < g.start) k++;\n    const items: VirtualItem[] = [];\n    let prevBottom = m.tops[g.start] ?? m.gTop[gi + 1];\n    let any = false;\n    while (k < sorted.length && sorted[k] < g.end) {\n      const i = sorted[k++];\n      const gap = m.tops[i] - prevBottom;\n      if (gap > 0.01) items.push({ kind: \"gap\", key: `gap:${i}`, height: gap });\n      items.push({ kind: \"row\", index: i });\n      prevBottom = bottom(i);\n      any = true;\n    }\n    if (!any && gi !== anchor) {\n      if (skippedFrom < 0) skippedFrom = gi;\n      return;\n    }\n    flushSkipped(gi);\n    const rest = m.gTop[gi + 1] - prevBottom;\n    if (rest > 0.01) items.push({ kind: \"gap\", key: `gap:end:${gi}`, height: rest });\n    out.push({ kind: \"group\", group: gi, items });\n  });\n  flushSkipped(groups.length);\n  return out;\n}\n\nexport function useRowWindow<T>({\n  enabled,\n  rows,\n  rowKey,\n  groups,\n  expanded,\n  pinnedKeys,\n  scrollerRef,\n  tableRef,\n  options,\n  compact,\n  rowsBefore,\n  rowsAfter,\n  colKeys,\n  lockable,\n  resetKey,\n}: {\n  enabled: boolean;\n  /** The rows on screen, in order. */\n  rows: T[];\n  rowKey: (row: T) => string | number;\n  groups: readonly VirtualGroup[];\n  /** Indices of the open rows: always rendered, their detail rows counted. */\n  expanded: readonly number[];\n  /** Keys always rendered (the roving tab stop). */\n  pinnedKeys: readonly (string | number | null)[];\n  scrollerRef: RefObject<HTMLElement | null>;\n  tableRef: RefObject<HTMLTableElement | null>;\n  options: DataTableVirtualize;\n  compact: boolean;\n  /** Rows above the first group: the header, the leading row. */\n  rowsBefore: number;\n  /** Rows after the last: the totals row. */\n  rowsAfter: number;\n  /** The header cells' keys, in order (the selection column as {@link VIRTUAL_SELECT_COL}). */\n  colKeys: readonly string[];\n  /** The keys whose width is locked (not a `grow` column, not a user-resized one). */\n  lockable: ReadonlySet<string>;\n  /** Anything that re-measures the column widths from scratch when it changes. */\n  resetKey: string;\n}): RowWindow | null {\n  const overscan = Math.max(1, options.overscan ?? 12);\n  const estimate = options.estimateRowHeight ?? (compact ? 29 : 37);\n  const n = rows.length;\n\n  const [measured, setMeasured] = useState<Measured>(() => ({\n    heights: new Map(),\n    details: new Map(),\n    sum: 0,\n    count: 0,\n    band: [estimate, estimate * 0.8],\n  }));\n  const initialEnd = () =>\n    Math.min(n, Math.ceil((typeof window === \"undefined\" ? 800 : Math.min(window.innerHeight || 800, 1600)) / estimate) + overscan);\n  const [range, setRange] = useState(() => ({ start: 0, end: initialEnd() }));\n  const [focusTarget, setFocusTarget] = useState<number | null>(null);\n  const [focusKey, setFocusKey] = useState<string | number | null>(null);\n  const [scrollerWidth, setScrollerWidth] = useState(0);\n  const [lock, setLock] = useState<{ sig: string; widths: Record<string, number> } | null>(null);\n  const naturalOverflow = useRef(false);\n\n  const expandedSig = expanded.join(\",\");\n  const model = useMemo<Model | null>(() => {\n    if (!enabled) return null;\n    const keys = rows.map(rowKey);\n    const avg = measured.count > 0 ? measured.sum / measured.count : estimate;\n    const open = new Set(expanded);\n    const h = new Float64Array(n);\n    for (let i = 0; i < n; i++) {\n      h[i] = (measured.heights.get(keys[i]) ?? avg) + (open.has(i) ? (measured.details.get(keys[i]) ?? 0) : 0);\n    }\n    const tops = new Float64Array(n + 1);\n    const gTop = new Float64Array(groups.length + 1);\n    const ariaRows = new Int32Array(n);\n    const ariaBands = new Int32Array(groups.length * 2);\n    let y = 0;\n    let aria = rowsBefore + 1;\n    groups.forEach((g, gi) => {\n      gTop[gi] = y;\n      for (const level of g.bands) {\n        y += measured.band[level - 1];\n        ariaBands[gi * 2 + level - 1] = aria++;\n      }\n      for (let i = g.start; i < g.end; i++) {\n        tops[i] = y;\n        y += h[i];\n        ariaRows[i] = aria++;\n        if (open.has(i)) aria++;\n      }\n    });\n    gTop[groups.length] = y;\n    tops[n] = y;\n    return { n, keys, tops, h, gTop, total: y, ariaRows, ariaBands, rowCount: aria - 1 + rowsAfter };\n    // `expanded` by its signature.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [enabled, rows, rowKey, groups, expandedSig, measured, estimate, n, rowsBefore, rowsAfter]);\n\n  // The rows outside the range that stay: open rows, the tab stop, the focused row and\n  // the keyboard's target.\n  const pinned = useMemo(() => {\n    if (!model) return [];\n    const out = [...expanded];\n    for (const key of [...pinnedKeys, focusKey]) {\n      if (key === null) continue;\n      const i = model.keys.indexOf(key);\n      if (i >= 0) out.push(i);\n    }\n    if (focusTarget !== null) out.push(focusTarget);\n    return out;\n  }, [model, expanded, pinnedKeys, focusKey, focusTarget]);\n  const pinnedSig = pinned.join(\",\");\n\n  const start = Math.min(range.start, n);\n  const end = Math.min(range.end, n);\n  const bodies = useMemo(\n    () => (model ? planBodies(model, groups, start, end, pinned) : []),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [model, groups, start, end, pinnedSig],\n  );\n\n  const lockSig = `${resetKey}|${scrollerWidth}|${colKeys.join(\",\")}`;\n  const colWidths = lock && lock.sig === lockSig ? lock.widths : null;\n\n  // What the scroll handler and the frame's measure read: this render's model and lock.\n  const latest = useRef({ model, colWidths, lockSig, colKeys, lockable, overscan });\n  useLayoutEffect(() => {\n    latest.current = { model, colWidths, lockSig, colKeys, lockable, overscan };\n  });\n\n  // Which rows the visible part of the scroller (and of the window, for a table in a page\n  // that scrolls) shows, and a new range around them when the rendered one no longer\n  // covers them. Read from the client rects, which a scroll leaves laid out.\n  const update = useCallback(() => {\n    const { model: m, overscan: over } = latest.current;\n    const sc = scrollerRef.current;\n    const table = tableRef.current;\n    if (!m || !sc || !table) return;\n    const origin = table.querySelector<HTMLElement>(\"tbody[data-vt-body]\");\n    if (!origin) return;\n    const sr = sc.getBoundingClientRect();\n    const top = Math.max(sr.top, 0);\n    const bottom = Math.min(sr.bottom, window.innerHeight || sr.bottom);\n    if (!(bottom > top)) return;\n    const o = origin.getBoundingClientRect().top;\n    const a = Math.min(firstBelow(m, top - o), m.n);\n    const b = Math.max(a, Math.min(lastAbove(m, bottom - o), m.n));\n    setRange((prev) =>\n      prev.start <= a && prev.end >= b && prev.end <= m.n && prev.end - prev.start <= b - a + 4 * over\n        ? prev\n        : { start: Math.max(0, a - over), end: Math.min(m.n, b + over) },\n    );\n  }, [scrollerRef, tableRef]);\n\n  // After a render that changed what is drawn: measure the rendered rows and bands, and\n  // the header cells for the lock. Not after a render that only ticked a box. In the next\n  // animation frame rather than in the commit: there the browser lays the table out once\n  // for the frame anyway, where a read in the commit forced a layout of its own, and the\n  // re-render the heights cause forced another (Chromium, 3000 rows: 35–130 ms of forced\n  // layout per scrolled step, against one layout per frame now).\n  const measure = useCallback(() => {\n    const { model: m, colWidths: locked, lockSig: sig, colKeys: cols, lockable: lockKeys } = latest.current;\n    const table = tableRef.current;\n    const sc = scrollerRef.current;\n    if (!m || !table || !sc) return;\n    const trs = table.rows;\n    const rects = Array.from(trs, (tr) => tr.getBoundingClientRect());\n    const rowSamples: [string | number, number][] = [];\n    const detailSamples: [string | number, number][] = [];\n    const bandSamples: [0 | 1, number][] = [];\n    for (let k = 0; k < trs.length; k++) {\n      const own = rects[k];\n      const next = rects[k + 1];\n      // The distance to the next row's top: exact under collapsed borders.\n      const h = next && next.top > own.top ? next.top - own.top : own.height;\n      if (!(h > 0)) continue;\n      const ds = trs[k].dataset;\n      if (ds.rowIndex !== undefined) {\n        const key = m.keys[Number(ds.rowIndex)];\n        if (key !== undefined) rowSamples.push([key, h]);\n      } else if (ds.rowDetail !== undefined) {\n        const key = m.keys[Number(ds.rowDetail)];\n        if (key !== undefined) detailSamples.push([key, h]);\n      } else if (ds.groupRow === \"1\" || ds.groupRow === \"2\") {\n        bandSamples.push([ds.groupRow === \"1\" ? 0 : 1, h]);\n      }\n    }\n    if (rowSamples.length + detailSamples.length + bandSamples.length > 0) {\n      setMeasured((prev) => {\n        let { heights, details, sum, count } = prev;\n        let band = prev.band;\n        for (const [key, h] of rowSamples) {\n          const old = heights.get(key);\n          if (old !== undefined && Math.abs(old - h) <= 0.5) continue;\n          if (heights === prev.heights) heights = new Map(heights);\n          heights.set(key, h);\n          sum += h - (old ?? 0);\n          if (old === undefined) count++;\n        }\n        for (const [key, h] of detailSamples) {\n          const old = details.get(key);\n          if (old !== undefined && Math.abs(old - h) <= 0.5) continue;\n          if (details === prev.details) details = new Map(details);\n          details.set(key, h);\n        }\n        for (const [level, h] of bandSamples) {\n          if (Math.abs(band[level] - h) <= 0.5) continue;\n          band = level === 0 ? [h, band[1]] : [band[0], h];\n        }\n        return heights === prev.heights && details === prev.details && band === prev.band\n          ? prev\n          : { heights, details, sum, count, band };\n      });\n    }\n    // The column lock.\n    const cells = table.tHead?.rows[0]?.cells;\n    if (!cells || cells.length !== cols.length) return;\n    const widths: Record<string, number> = {};\n    let anyWidth = false;\n    for (let c = 0; c < cells.length; c++) {\n      if (!lockKeys.has(cols[c])) continue;\n      const w = cells[c].getBoundingClientRect().width;\n      if (w > 0) {\n        widths[cols[c]] = w;\n        anyWidth = true;\n      }\n    }\n    if (!anyWidth) return;\n    const over = table.getBoundingClientRect().width > sc.clientWidth + 1;\n    if (!locked) {\n      naturalOverflow.current = over;\n      setLock({ sig, widths });\n    } else if (over && !naturalOverflow.current) {\n      // A grown column pushed the table past a scroller it fit: measure afresh.\n      setLock(null);\n    } else {\n      let grew = false;\n      const merged = { ...locked };\n      for (const [key, w] of Object.entries(widths)) {\n        if (w > (merged[key] ?? 0) + 0.5) {\n          merged[key] = w;\n          grew = true;\n        }\n      }\n      if (grew) setLock({ sig, widths: merged });\n    }\n  }, [scrollerRef, tableRef]);\n\n  const frame = useRef(0);\n  const schedule = useCallback(() => {\n    if (frame.current) return;\n    const run = () => {\n      frame.current = 0;\n      measure();\n      update();\n    };\n    frame.current =\n      typeof requestAnimationFrame === \"undefined\" ? -(setTimeout(run, 16) as unknown as number) : requestAnimationFrame(run);\n  }, [measure, update]);\n  useEffect(\n    () => () => {\n      if (frame.current > 0) cancelAnimationFrame(frame.current);\n      else if (frame.current < 0) clearTimeout(-frame.current);\n      frame.current = 0;\n    },\n    [],\n  );\n\n  useEffect(() => {\n    if (!enabled) return;\n    const onScroll = () => update();\n    window.addEventListener(\"scroll\", onScroll, { capture: true, passive: true });\n    window.addEventListener(\"resize\", onScroll, { passive: true });\n    const sc = scrollerRef.current;\n    let ro: ResizeObserver | undefined;\n    if (sc && typeof ResizeObserver !== \"undefined\") {\n      ro = new ResizeObserver(() => {\n        setScrollerWidth(Math.round(sc.clientWidth));\n        update();\n      });\n      ro.observe(sc);\n    }\n    return () => {\n      window.removeEventListener(\"scroll\", onScroll, { capture: true });\n      window.removeEventListener(\"resize\", onScroll);\n      ro?.disconnect();\n    };\n  }, [enabled, update, scrollerRef]);\n\n  // The row holding the focus (a row, or a control in it or in its open detail) stays.\n  useEffect(() => {\n    const table = tableRef.current;\n    if (!enabled || !table) return;\n    const onIn = (e: FocusEvent) => {\n      const tr = (e.target as Element | null)?.closest?.<HTMLElement>(\"tr[data-row-index], tr[data-row-detail]\");\n      const index = tr ? Number(tr.dataset.rowIndex ?? tr.dataset.rowDetail) : NaN;\n      const key = Number.isNaN(index) ? undefined : latest.current.model?.keys[index];\n      setFocusKey(key ?? null);\n      setFocusTarget(null);\n    };\n    const onOut = (e: FocusEvent) => {\n      const to = e.relatedTarget as Node | null;\n      if (!to || !table.contains(to)) setFocusKey(null);\n    };\n    table.addEventListener(\"focusin\", onIn);\n    table.addEventListener(\"focusout\", onOut);\n    return () => {\n      table.removeEventListener(\"focusin\", onIn);\n      table.removeEventListener(\"focusout\", onOut);\n    };\n  }, [enabled, tableRef]);\n\n  const dataSig = n > 0 && model ? `${n}:${String(model.keys[0])}:${String(model.keys[n - 1])}` : \"0\";\n  const renderSig = `${start}:${end}:${dataSig}:${expandedSig}:${pinnedSig}:${lockSig}:${colWidths ? 1 : 0}`;\n  const lastRender = useRef(\"\");\n  useLayoutEffect(() => {\n    if (!enabled || lastRender.current === renderSig) return;\n    lastRender.current = renderSig;\n    schedule();\n  });\n\n  // A new layout (heights measured, rows added): the range may no longer cover the view.\n  const total = model?.total ?? 0;\n  useLayoutEffect(() => {\n    if (enabled) schedule();\n  }, [enabled, schedule, total, n]);\n\n  // The keyboard's target: rendered (pinned), then focused — its focus scrolls it into\n  // view, and the scroll renders the rows around it.\n  useLayoutEffect(() => {\n    if (focusTarget === null) return;\n    // Released by the focus it receives (the `focusin` above), which pins it as the\n    // focused row from then on.\n    tableRef.current?.querySelector<HTMLElement>(`tr[data-row-index=\"${focusTarget}\"]`)?.focus();\n  }, [focusTarget, bodies, tableRef]);\n\n  const focusRow = useCallback(\n    (i: number) => {\n      const el = tableRef.current?.querySelector<HTMLElement>(`tr[data-row-index=\"${i}\"]`);\n      if (el) el.focus();\n      else setFocusTarget(i);\n    },\n    [tableRef],\n  );\n\n  if (!enabled || !model) return null;\n  return {\n    bodies,\n    rowCount: model.rowCount,\n    ariaRow: (i) => model.ariaRows[i],\n    ariaBand: (g, level) => model.ariaBands[g * 2 + level - 1],\n    colWidths,\n    focusRow,\n  };\n}\n\n/** The roving rows' Arrow/Home/End target over ALL the rows, rendered or not. */\nexport function rowNavTarget(from: number, key: string, n: number): number | null {\n  if (n === 0) return null;\n  if (key === \"ArrowDown\") return Math.min(n - 1, from + 1);\n  if (key === \"ArrowUp\") return Math.max(0, from - 1);\n  if (key === \"Home\") return 0;\n  if (key === \"End\") return n - 1;\n  return null;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/data-table-virtual.ts"],"sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState } from \"react\";\nimport type { RefObject } from \"react\";\n\n// DataTable's row windowing (0.48.2, keksdose dev #632 — Marcel: \"The table is extremely\n// slow. Is it virtualised or is everytime the whole table rendered?\"). Opt-in through\n// `virtualize`: the desktop table renders the rows near the visible part of its scroller\n// (plus `overscan`) and stands spacer rows in for the rest, inside each group's own\n// `<tbody>`, so the sticky group bands keep working as they do on a full table — a band\n// cell's sticky containing block is the TABLE, and the latest band of each level that has\n// scrolled past is the one drawn (Chromium, checked with a probe at the group's middle,\n// its end and the next group's start).\n//\n// What it keeps rendered whatever the scroll: the header, the leading row, the band rows\n// of every group that has a rendered row (and the first day of the period the window\n// starts in, whose band is the period's), every OPEN row (`isExpanded`, so an inline\n// editor keeps its state), the roving tab stop, a row holding the focus, and the row the\n// keyboard is moving to.\n//\n// Heights: each rendered row is measured after render (the distance to the next row's\n// top, which is exact under collapsed borders where a row's own box is half a border\n// short) and remembered by its key; a row never rendered counts as the average of the\n// measured ones, or `estimateRowHeight` before any. The spacers are the sums, so the\n// scroll height settles as rows are seen. Scroll anchoring (the browser's) keeps the rows\n// in view still while a spacer above them is corrected.\n//\n// Column widths: in an auto table layout a column is as wide as its widest RENDERED\n// cell, so rows coming and going would move the columns. The header cells' widths are\n// read after the first render and locked into a `<colgroup>`, only ever growing while the\n// rows scroll (a wider cell arriving widens its column once; one leaving narrows\n// nothing). Re-measured from scratch when the data, the columns, a user width, the text\n// size or the scroller's width change — and when a grown column would push the table\n// past its scroller, which it fit before. A `grow` column and a user-resized one are not\n// locked (the first takes the rest, the second is pinned already). A lock replaced is\n// gone: changing back (a column the fit leaves out and brings back) measures again\n// (0.51, keksdose N2).\n\n/** {@link DataTableProps.virtualize}'s options. */\nexport interface DataTableVirtualize {\n  /** Rows rendered beyond each edge of the visible part. Default 12. */\n  overscan?: number;\n  /** A row's height in px before it has been measured. Default: 37 (`comfortable`) /\n   *  29 (`compact`) — the kit's one-line rows. */\n  estimateRowHeight?: number;\n}\n\n/** One innermost group's run of rows, `[start, end)` in the rows on screen, with the\n *  band levels its `<tbody>` opens with. `first` is the index of the innermost group that\n *  opens its level-1 group (itself with one level). Ungrouped: one run with no bands. */\nexport interface VirtualGroup {\n  start: number;\n  end: number;\n  bands: readonly (1 | 2)[];\n  first: number;\n}\n\n/** A row, or a spacer standing in for the rows between two rendered ones. */\nexport type VirtualItem = { kind: \"row\"; index: number } | { kind: \"gap\"; key: string; height: number };\n\n/** A group's `<tbody>` with its rendered rows, or one spacer `<tbody>` for a run of\n *  groups of which nothing is rendered. */\nexport type VirtualBody =\n  | { kind: \"spacer\"; key: string; height: number }\n  | { kind: \"group\"; group: number; items: VirtualItem[] };\n\nexport interface RowWindow {\n  bodies: VirtualBody[];\n  /** `aria-rowcount`: every row of the table, header, bands, details and footer included. */\n  rowCount: number;\n  /** `aria-rowindex` of data row `i`; its detail row (open) is the next one. */\n  ariaRow: (i: number) => number;\n  /** `aria-rowindex` of group `g`'s band of `level`. */\n  ariaBand: (g: number, level: 1 | 2) => number;\n  /** The locked widths for the `<colgroup>`, by column key; null while measuring. */\n  colWidths: Record<string, number> | null;\n  /** Move the focus to row `i`, rendering it first when it is not. */\n  focusRow: (i: number) => void;\n}\n\n/** The heights measured so far, by row key; the bands' by level. */\ninterface Measured {\n  heights: Map<string | number, number>;\n  details: Map<string | number, number>;\n  sum: number;\n  count: number;\n  band: [number, number];\n}\n\nconst SELECT_KEY = \"\\u0000select\";\n/** The `<colgroup>` key of the selection column. */\nexport const VIRTUAL_SELECT_COL = SELECT_KEY;\n\ninterface Model {\n  n: number;\n  keys: (string | number)[];\n  /** Top of row i, from the top of the first group's `<tbody>`. */\n  tops: Float64Array;\n  /** Full height of row i (its detail row included while open). */\n  h: Float64Array;\n  /** Top of group g's `<tbody>`; [groups.length] is the total. */\n  gTop: Float64Array;\n  total: number;\n  ariaRows: Int32Array;\n  ariaBands: Int32Array;\n  rowCount: number;\n}\n\n/** First index whose bottom is below `y` (n when none). */\nfunction firstBelow(m: Model, y: number): number {\n  let lo = 0;\n  let hi = m.n;\n  while (lo < hi) {\n    const mid = (lo + hi) >> 1;\n    if (m.tops[mid] + m.h[mid] > y) hi = mid;\n    else lo = mid + 1;\n  }\n  return lo;\n}\n\n/** One past the last index whose top is above `y`. */\nfunction lastAbove(m: Model, y: number): number {\n  let lo = 0;\n  let hi = m.n;\n  while (lo < hi) {\n    const mid = (lo + hi) >> 1;\n    if (m.tops[mid] < y) lo = mid + 1;\n    else hi = mid;\n  }\n  return lo;\n}\n\n/** The `<tbody>`s to render: the groups holding a rendered row (or the period's first\n *  day, for its band), and one spacer for each run of groups in between. Pure. */\nexport function planBodies(\n  m: Pick<Model, \"n\" | \"tops\" | \"h\" | \"gTop\">,\n  groups: readonly VirtualGroup[],\n  start: number,\n  end: number,\n  pinned: readonly number[],\n): VirtualBody[] {\n  const rendered = new Set<number>();\n  for (let i = Math.max(0, start); i < Math.min(m.n, end); i++) rendered.add(i);\n  for (const p of pinned) if (p >= 0 && p < m.n) rendered.add(p);\n  const sorted = [...rendered].sort((a, b) => a - b);\n  // The group the window starts in, and the first day of its period.\n  let anchor = -1;\n  if (sorted.length > 0 && start < m.n) {\n    const s = Math.max(0, start);\n    const g = groups.findIndex((gr) => s >= gr.start && s < gr.end);\n    if (g >= 0) anchor = groups[g].first;\n  }\n  const bottom = (i: number) => m.tops[i] + m.h[i];\n  const out: VirtualBody[] = [];\n  let k = 0;\n  let skippedFrom = -1;\n  const flushSkipped = (upTo: number) => {\n    if (skippedFrom < 0) return;\n    out.push({ kind: \"spacer\", key: `vs:${skippedFrom}`, height: m.gTop[upTo] - m.gTop[skippedFrom] });\n    skippedFrom = -1;\n  };\n  groups.forEach((g, gi) => {\n    while (k < sorted.length && sorted[k] < g.start) k++;\n    const items: VirtualItem[] = [];\n    let prevBottom = m.tops[g.start] ?? m.gTop[gi + 1];\n    let any = false;\n    while (k < sorted.length && sorted[k] < g.end) {\n      const i = sorted[k++];\n      const gap = m.tops[i] - prevBottom;\n      if (gap > 0.01) items.push({ kind: \"gap\", key: `gap:${i}`, height: gap });\n      items.push({ kind: \"row\", index: i });\n      prevBottom = bottom(i);\n      any = true;\n    }\n    if (!any && gi !== anchor) {\n      if (skippedFrom < 0) skippedFrom = gi;\n      return;\n    }\n    flushSkipped(gi);\n    const rest = m.gTop[gi + 1] - prevBottom;\n    if (rest > 0.01) items.push({ kind: \"gap\", key: `gap:end:${gi}`, height: rest });\n    out.push({ kind: \"group\", group: gi, items });\n  });\n  flushSkipped(groups.length);\n  return out;\n}\n\nexport function useRowWindow<T>({\n  enabled,\n  rows,\n  rowKey,\n  groups,\n  expanded,\n  pinnedKeys,\n  scrollerRef,\n  tableRef,\n  options,\n  compact,\n  rowsBefore,\n  rowsAfter,\n  colKeys,\n  lockable,\n  resetKey,\n}: {\n  enabled: boolean;\n  /** The rows on screen, in order. */\n  rows: T[];\n  rowKey: (row: T) => string | number;\n  groups: readonly VirtualGroup[];\n  /** Indices of the open rows: always rendered, their detail rows counted. */\n  expanded: readonly number[];\n  /** Keys always rendered (the roving tab stop). */\n  pinnedKeys: readonly (string | number | null)[];\n  scrollerRef: RefObject<HTMLElement | null>;\n  tableRef: RefObject<HTMLTableElement | null>;\n  options: DataTableVirtualize;\n  compact: boolean;\n  /** Rows above the first group: the header, the leading row. */\n  rowsBefore: number;\n  /** Rows after the last: the totals row. */\n  rowsAfter: number;\n  /** The header cells' keys, in order (the selection column as {@link VIRTUAL_SELECT_COL}). */\n  colKeys: readonly string[];\n  /** The keys whose width is locked (not a `grow` column, not a user-resized one). */\n  lockable: ReadonlySet<string>;\n  /** Anything that re-measures the column widths from scratch when it changes. */\n  resetKey: string;\n}): RowWindow | null {\n  const overscan = Math.max(1, options.overscan ?? 12);\n  const estimate = options.estimateRowHeight ?? (compact ? 29 : 37);\n  const n = rows.length;\n\n  const [measured, setMeasured] = useState<Measured>(() => ({\n    heights: new Map(),\n    details: new Map(),\n    sum: 0,\n    count: 0,\n    band: [estimate, estimate * 0.8],\n  }));\n  const initialEnd = () =>\n    Math.min(n, Math.ceil((typeof window === \"undefined\" ? 800 : Math.min(window.innerHeight || 800, 1600)) / estimate) + overscan);\n  const [range, setRange] = useState(() => ({ start: 0, end: initialEnd() }));\n  const [focusTarget, setFocusTarget] = useState<number | null>(null);\n  const [focusKey, setFocusKey] = useState<string | number | null>(null);\n  const [scrollerWidth, setScrollerWidth] = useState(0);\n  const [lock, setLock] = useState<{ sig: string; widths: Record<string, number> } | null>(null);\n  const naturalOverflow = useRef(false);\n\n  const expandedSig = expanded.join(\",\");\n  const model = useMemo<Model | null>(() => {\n    if (!enabled) return null;\n    const keys = rows.map(rowKey);\n    const avg = measured.count > 0 ? measured.sum / measured.count : estimate;\n    const open = new Set(expanded);\n    const h = new Float64Array(n);\n    for (let i = 0; i < n; i++) {\n      h[i] = (measured.heights.get(keys[i]) ?? avg) + (open.has(i) ? (measured.details.get(keys[i]) ?? 0) : 0);\n    }\n    const tops = new Float64Array(n + 1);\n    const gTop = new Float64Array(groups.length + 1);\n    const ariaRows = new Int32Array(n);\n    const ariaBands = new Int32Array(groups.length * 2);\n    let y = 0;\n    let aria = rowsBefore + 1;\n    groups.forEach((g, gi) => {\n      gTop[gi] = y;\n      for (const level of g.bands) {\n        y += measured.band[level - 1];\n        ariaBands[gi * 2 + level - 1] = aria++;\n      }\n      for (let i = g.start; i < g.end; i++) {\n        tops[i] = y;\n        y += h[i];\n        ariaRows[i] = aria++;\n        if (open.has(i)) aria++;\n      }\n    });\n    gTop[groups.length] = y;\n    tops[n] = y;\n    return { n, keys, tops, h, gTop, total: y, ariaRows, ariaBands, rowCount: aria - 1 + rowsAfter };\n    // `expanded` by its signature.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [enabled, rows, rowKey, groups, expandedSig, measured, estimate, n, rowsBefore, rowsAfter]);\n\n  // The rows outside the range that stay: open rows, the tab stop, the focused row and\n  // the keyboard's target.\n  const pinned = useMemo(() => {\n    if (!model) return [];\n    const out = [...expanded];\n    for (const key of [...pinnedKeys, focusKey]) {\n      if (key === null) continue;\n      const i = model.keys.indexOf(key);\n      if (i >= 0) out.push(i);\n    }\n    if (focusTarget !== null) out.push(focusTarget);\n    return out;\n  }, [model, expanded, pinnedKeys, focusKey, focusTarget]);\n  const pinnedSig = pinned.join(\",\");\n\n  const start = Math.min(range.start, n);\n  const end = Math.min(range.end, n);\n  const bodies = useMemo(\n    () => (model ? planBodies(model, groups, start, end, pinned) : []),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [model, groups, start, end, pinnedSig],\n  );\n\n  const lockSig = `${resetKey}|${scrollerWidth}|${colKeys.join(\",\")}`;\n  // A lock is the table it was measured on, so it goes as soon as the signature moves on\n  // — not merely set aside until the signature comes BACK (0.51, keksdose N2). The fit\n  // leaves a column out and, measuring the table afresh without it, brings it back in the\n  // same frame, before this hook measures anything: the signature was then the old one\n  // again, and the column came back at the widths that had ratcheted up while rows\n  // scrolled (a wider cell widens its column once), 80–110px more than the fit had just\n  // measured (606 + 93 estimated, 778–812 drawn, at 757), and B2's guard kept it out\n  // although it fitted. Dropped here, the table it comes back to is drawn as measured,\n  // and the next frame locks that. Adjusted during render, as React's \"storing\n  // information from previous renders\": an effect would draw the stale widths first.\n  if (lock !== null && lock.sig !== lockSig) setLock(null);\n  const colWidths = lock && lock.sig === lockSig ? lock.widths : null;\n\n  // What the scroll handler and the frame's measure read: this render's model and lock.\n  const latest = useRef({ model, colWidths, lockSig, colKeys, lockable, overscan });\n  useLayoutEffect(() => {\n    latest.current = { model, colWidths, lockSig, colKeys, lockable, overscan };\n  });\n\n  // Which rows the visible part of the scroller (and of the window, for a table in a page\n  // that scrolls) shows, and a new range around them when the rendered one no longer\n  // covers them. Read from the client rects, which a scroll leaves laid out.\n  const update = useCallback(() => {\n    const { model: m, overscan: over } = latest.current;\n    const sc = scrollerRef.current;\n    const table = tableRef.current;\n    if (!m || !sc || !table) return;\n    const origin = table.querySelector<HTMLElement>(\"tbody[data-vt-body]\");\n    if (!origin) return;\n    const sr = sc.getBoundingClientRect();\n    const top = Math.max(sr.top, 0);\n    const bottom = Math.min(sr.bottom, window.innerHeight || sr.bottom);\n    if (!(bottom > top)) return;\n    const o = origin.getBoundingClientRect().top;\n    const a = Math.min(firstBelow(m, top - o), m.n);\n    const b = Math.max(a, Math.min(lastAbove(m, bottom - o), m.n));\n    setRange((prev) =>\n      prev.start <= a && prev.end >= b && prev.end <= m.n && prev.end - prev.start <= b - a + 4 * over\n        ? prev\n        : { start: Math.max(0, a - over), end: Math.min(m.n, b + over) },\n    );\n  }, [scrollerRef, tableRef]);\n\n  // After a render that changed what is drawn: measure the rendered rows and bands, and\n  // the header cells for the lock. Not after a render that only ticked a box. In the next\n  // animation frame rather than in the commit: there the browser lays the table out once\n  // for the frame anyway, where a read in the commit forced a layout of its own, and the\n  // re-render the heights cause forced another (Chromium, 3000 rows: 35–130 ms of forced\n  // layout per scrolled step, against one layout per frame now).\n  const measure = useCallback(() => {\n    const { model: m, colWidths: locked, lockSig: sig, colKeys: cols, lockable: lockKeys } = latest.current;\n    const table = tableRef.current;\n    const sc = scrollerRef.current;\n    if (!m || !table || !sc) return;\n    const trs = table.rows;\n    const rects = Array.from(trs, (tr) => tr.getBoundingClientRect());\n    const rowSamples: [string | number, number][] = [];\n    const detailSamples: [string | number, number][] = [];\n    const bandSamples: [0 | 1, number][] = [];\n    for (let k = 0; k < trs.length; k++) {\n      const own = rects[k];\n      const next = rects[k + 1];\n      // The distance to the next row's top: exact under collapsed borders.\n      const h = next && next.top > own.top ? next.top - own.top : own.height;\n      if (!(h > 0)) continue;\n      const ds = trs[k].dataset;\n      if (ds.rowIndex !== undefined) {\n        const key = m.keys[Number(ds.rowIndex)];\n        if (key !== undefined) rowSamples.push([key, h]);\n      } else if (ds.rowDetail !== undefined) {\n        const key = m.keys[Number(ds.rowDetail)];\n        if (key !== undefined) detailSamples.push([key, h]);\n      } else if (ds.groupRow === \"1\" || ds.groupRow === \"2\") {\n        bandSamples.push([ds.groupRow === \"1\" ? 0 : 1, h]);\n      }\n    }\n    if (rowSamples.length + detailSamples.length + bandSamples.length > 0) {\n      setMeasured((prev) => {\n        let { heights, details, sum, count } = prev;\n        let band = prev.band;\n        for (const [key, h] of rowSamples) {\n          const old = heights.get(key);\n          if (old !== undefined && Math.abs(old - h) <= 0.5) continue;\n          if (heights === prev.heights) heights = new Map(heights);\n          heights.set(key, h);\n          sum += h - (old ?? 0);\n          if (old === undefined) count++;\n        }\n        for (const [key, h] of detailSamples) {\n          const old = details.get(key);\n          if (old !== undefined && Math.abs(old - h) <= 0.5) continue;\n          if (details === prev.details) details = new Map(details);\n          details.set(key, h);\n        }\n        for (const [level, h] of bandSamples) {\n          if (Math.abs(band[level] - h) <= 0.5) continue;\n          band = level === 0 ? [h, band[1]] : [band[0], h];\n        }\n        return heights === prev.heights && details === prev.details && band === prev.band\n          ? prev\n          : { heights, details, sum, count, band };\n      });\n    }\n    // The column lock.\n    const cells = table.tHead?.rows[0]?.cells;\n    if (!cells || cells.length !== cols.length) return;\n    const widths: Record<string, number> = {};\n    let anyWidth = false;\n    for (let c = 0; c < cells.length; c++) {\n      if (!lockKeys.has(cols[c])) continue;\n      const w = cells[c].getBoundingClientRect().width;\n      if (w > 0) {\n        widths[cols[c]] = w;\n        anyWidth = true;\n      }\n    }\n    if (!anyWidth) return;\n    const over = table.getBoundingClientRect().width > sc.clientWidth + 1;\n    if (!locked) {\n      naturalOverflow.current = over;\n      setLock({ sig, widths });\n    } else if (over && !naturalOverflow.current) {\n      // A grown column pushed the table past a scroller it fit: measure afresh.\n      setLock(null);\n    } else {\n      let grew = false;\n      const merged = { ...locked };\n      for (const [key, w] of Object.entries(widths)) {\n        if (w > (merged[key] ?? 0) + 0.5) {\n          merged[key] = w;\n          grew = true;\n        }\n      }\n      if (grew) setLock({ sig, widths: merged });\n    }\n  }, [scrollerRef, tableRef]);\n\n  const frame = useRef(0);\n  const schedule = useCallback(() => {\n    if (frame.current) return;\n    const run = () => {\n      frame.current = 0;\n      measure();\n      update();\n    };\n    frame.current =\n      typeof requestAnimationFrame === \"undefined\" ? -(setTimeout(run, 16) as unknown as number) : requestAnimationFrame(run);\n  }, [measure, update]);\n  useEffect(\n    () => () => {\n      if (frame.current > 0) cancelAnimationFrame(frame.current);\n      else if (frame.current < 0) clearTimeout(-frame.current);\n      frame.current = 0;\n    },\n    [],\n  );\n\n  useEffect(() => {\n    if (!enabled) return;\n    const onScroll = () => update();\n    window.addEventListener(\"scroll\", onScroll, { capture: true, passive: true });\n    window.addEventListener(\"resize\", onScroll, { passive: true });\n    const sc = scrollerRef.current;\n    let ro: ResizeObserver | undefined;\n    if (sc && typeof ResizeObserver !== \"undefined\") {\n      ro = new ResizeObserver(() => {\n        setScrollerWidth(Math.round(sc.clientWidth));\n        update();\n      });\n      ro.observe(sc);\n    }\n    return () => {\n      window.removeEventListener(\"scroll\", onScroll, { capture: true });\n      window.removeEventListener(\"resize\", onScroll);\n      ro?.disconnect();\n    };\n  }, [enabled, update, scrollerRef]);\n\n  // The row holding the focus (a row, or a control in it or in its open detail) stays.\n  useEffect(() => {\n    const table = tableRef.current;\n    if (!enabled || !table) return;\n    const onIn = (e: FocusEvent) => {\n      const tr = (e.target as Element | null)?.closest?.<HTMLElement>(\"tr[data-row-index], tr[data-row-detail]\");\n      const index = tr ? Number(tr.dataset.rowIndex ?? tr.dataset.rowDetail) : NaN;\n      const key = Number.isNaN(index) ? undefined : latest.current.model?.keys[index];\n      setFocusKey(key ?? null);\n      setFocusTarget(null);\n    };\n    const onOut = (e: FocusEvent) => {\n      const to = e.relatedTarget as Node | null;\n      if (!to || !table.contains(to)) setFocusKey(null);\n    };\n    table.addEventListener(\"focusin\", onIn);\n    table.addEventListener(\"focusout\", onOut);\n    return () => {\n      table.removeEventListener(\"focusin\", onIn);\n      table.removeEventListener(\"focusout\", onOut);\n    };\n  }, [enabled, tableRef]);\n\n  const dataSig = n > 0 && model ? `${n}:${String(model.keys[0])}:${String(model.keys[n - 1])}` : \"0\";\n  const renderSig = `${start}:${end}:${dataSig}:${expandedSig}:${pinnedSig}:${lockSig}:${colWidths ? 1 : 0}`;\n  const lastRender = useRef(\"\");\n  useLayoutEffect(() => {\n    if (!enabled || lastRender.current === renderSig) return;\n    lastRender.current = renderSig;\n    schedule();\n  });\n\n  // A new layout (heights measured, rows added): the range may no longer cover the view.\n  const total = model?.total ?? 0;\n  useLayoutEffect(() => {\n    if (enabled) schedule();\n  }, [enabled, schedule, total, n]);\n\n  // The keyboard's target: rendered (pinned), then focused — its focus scrolls it into\n  // view, and the scroll renders the rows around it.\n  useLayoutEffect(() => {\n    if (focusTarget === null) return;\n    // Released by the focus it receives (the `focusin` above), which pins it as the\n    // focused row from then on.\n    tableRef.current?.querySelector<HTMLElement>(`tr[data-row-index=\"${focusTarget}\"]`)?.focus();\n  }, [focusTarget, bodies, tableRef]);\n\n  const focusRow = useCallback(\n    (i: number) => {\n      const el = tableRef.current?.querySelector<HTMLElement>(`tr[data-row-index=\"${i}\"]`);\n      if (el) el.focus();\n      else setFocusTarget(i);\n    },\n    [tableRef],\n  );\n\n  if (!enabled || !model) return null;\n  return {\n    bodies,\n    rowCount: model.rowCount,\n    ariaRow: (i) => model.ariaRows[i],\n    ariaBand: (g, level) => model.ariaBands[g * 2 + level - 1],\n    colWidths,\n    focusRow,\n  };\n}\n\n/** The roving rows' Arrow/Home/End target over ALL the rows, rendered or not. */\nexport function rowNavTarget(from: number, key: string, n: number): number | null {\n  if (n === 0) return null;\n  if (key === \"ArrowDown\") return Math.min(n - 1, from + 1);\n  if (key === \"ArrowUp\") return Math.max(0, from - 1);\n  if (key === \"Home\") return 0;\n  if (key === \"End\") return n - 1;\n  return null;\n}\n"],"mappings":"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","names":[]}

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

@@ -9,7 +9,8 @@ import { DEFAULT_CHARACTER_COUNT_LABELS, DEFAULT_PASSWORD_REVEAL_LABELS } from "
  * `useFieldError`, every field's.
  *
  * Public through ./ui by name. `FieldGroup`, the counter and the placeholder helpers are
- * the three fields' shared parts (`@internal`).
+ * the three fields' shared parts (`@internal`), as are the Select's own classes and its
+ * `SelectWidthFloor` (0.51).
  */
 /**
  * The 16 px floor on touch (docs/text-size-harmonization.md §10.1). iOS zooms the page
@@ -78,6 +79,35 @@ export type FieldChevronProps = Omit<ComponentPropsWithRef<"svg">, "children">;
  * and a chevron parked on top of its first word hid exactly the part that says
  * what was picked. */
 export declare function FieldChevron({ className, ...rest }: FieldChevronProps): import("react").JSX.Element;
+/** A native dropdown Select's dress: no native arrow, and `pe-9`, the room the
+ *  {@link FieldChevron} takes. Shared with {@link SelectWidthFloor}. `@internal` */
+export declare const SELECT_MENU_DRESS = "appearance-none pe-9";
+/** The compact Select (`size="sm"`): the field's colours, a toolbar button's height.
+ *  `py-0` and a fixed height rather than a smaller padding, so the box is 28px whatever
+ *  line height the caller's type brings with it. Shared with {@link SelectWidthFloor}.
+ *  `@internal` */
+export declare const SELECT_SM = "h-7 py-0 ps-2 pe-7 text-xs";
+/**
+ * The width an UNLABELLED Select needs to show the widest of `values` whole: an invisible,
+ * zero-height line under it, in the select's own type, padding, chevron room and border
+ * (the same classes), one value per line. Placed beside the Select in the box that sizes
+ * it, it holds that box to the widest value, and the `w-full` select fills it. `@internal`
+ *
+ * Why it takes a sizer (0.51, Kurvenschmiede N5). A `<select>` with a percentage width
+ * is a "compressible" element: its min-content contribution is ZERO (CSS Sizing 3
+ * §5.2.2), so the auto table layout squeezes its column to the header, and beside a
+ * `grow` column every other column IS squeezed to its min-content (data-table-fit.ts).
+ * The user roster's role select stood 92px and read "Meml…" and "Admi…" (KS review,
+ * 0.49 and 0.50). `min-width: max-content` on the select would hold it instead — but to
+ * its widest OPTION, and an unavailable role's option carries its reason ("Customer (owns
+ * work)", RoleSelect's `optionDisabledReason`): the column would widen for a text that is
+ * never the selected value. So the caller says which values can be selected, in the
+ * current language.
+ */
+export declare function SelectWidthFloor({ values, size }: {
+    values: readonly string[];
+    size?: "sm" | "md";
+}): import("react").JSX.Element | null;
 export declare const FLOATING_LABEL_CLASS: string;
 /**
  * The one place that assembles a labelled field: a `relative` wrapper around the

package/dist/components/field-base.js

@@ -38,6 +38,31 @@ function FieldChevron({ className, ...rest }) {
     }
   );
 }
+const SELECT_MENU_DRESS = "appearance-none pe-9";
+const SELECT_SM = "h-7 py-0 ps-2 pe-7 text-xs";
+function SelectWidthFloor({ values, size = "md" }) {
+  if (values.length === 0) return null;
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      "aria-hidden": true,
+      "data-select-floor": "",
+      className: cn(
+        FIELD_BASE,
+        SELECT_MENU_DRESS,
+        size === "sm" && SELECT_SM,
+        // The horizontal box only: no height, no vertical padding or border, not painted.
+        "invisible h-0 overflow-hidden border-y-0 py-0 whitespace-nowrap shadow-none"
+      ),
+      children: values.map((value, i) => (
+        // The value as generated content, not as text: it is laid out (and so measured)
+        // the same, but a test's `getByText("Member")` still finds the one option, and a
+        // find-in-page or a copied row does not meet a word nobody sees.
+        /* @__PURE__ */ jsx("span", { "data-value": value, className: "block before:content-[attr(data-value)]" }, i)
+      ))
+    }
+  );
+}
 const LABEL_FLOATED_AT_LARGE = "large:text-caption large:leading-tight large:text-secondary large:transition-none";
 const FLOATING_LABEL_CLASS = cn(
   "pointer-events-none absolute start-3 top-2.5 text-sm text-placeholder transition-all",
@@ -215,6 +240,9 @@ export {
   FieldGroup,
   FloatingField,
   Label,
+  SELECT_MENU_DRESS,
+  SELECT_SM,
+  SelectWidthFloor,
   fieldBelow,
   hasPlaceholderText,
   useCharacterCountLabels,