@eifi1/ui-kit 0.34.0 → 0.36.0

package/dist/components/danger-confirm.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/danger-confirm.tsx"],"sourcesContent":["import { Children, useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { ChangeEvent, ComponentPropsWithRef, FormEvent, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { hasContent } from \"../lib/presence\";\nimport { useKitLabels, type LabelOverride } from \"../i18n/kit-labels\";\nimport { Button } from \"./button\";\nimport { Input } from \"./input\";\nimport { Label } from \"./field-base\";\nimport { Spinner } from \"./spinner\";\nimport type { ButtonVariant } from \"./button-look\";\nimport type { InputProps } from \"./input\";\nimport { Checkbox } from \"./checkbox\";\nimport { Tooltip } from \"./tooltip\";\nimport { useCommitReason, type CommitScope } from \"./write-lock\";\nimport { DEFAULT_DANGER_CONFIRM_LABELS } from \"./danger-confirm-labels\";\n\n/**\n * How typed text is compared with the text it has to repeat — shared by\n * `DangerConfirm`'s `phraseMatch` and `useConfirm`'s `typedMatch`.\n *\n * - `\"trim\"` ignores spaces around the typed text — a phone keyboard's autocomplete\n *   likes to add one. Case counts: \"delete\" is not \"DELETE\".\n * - `\"exact\"` compares character for character, spaces included.\n * - `\"caseless\"` trims AND ignores case: for an e-mail address, whose domain is\n *   case-insensitive and whose local part every real mail server treats so. Both apps'\n *   \"type the account's address\" rules (keksdose's `TYPE_EMAIL`, Kurvenschmiede's\n *   `TypedConfirm`) compared `trim().toLowerCase()`, and a capital the user's keyboard\n *   put at the start must not make the right row look like the wrong one.\n */\nexport type TypedMatch = \"trim\" | \"exact\" | \"caseless\";\n\n/** Whether `typed` repeats `target` under `mode` — see {@link TypedMatch}. Exported for\n *  a caller that draws its own field (a dialog that also picks a recipient) and wants\n *  the same rule as the kit's. */\nexport function typedMatches(typed: string, target: string, mode: TypedMatch = \"trim\"): boolean {\n  if (mode === \"exact\") return typed === target;\n  if (mode === \"trim\") return typed.trim() === target;\n  // `toLowerCase`, not `toLocaleLowerCase`: the comparison must not change with the\n  // reader's locale (a Turkish dotless i would otherwise fail an ASCII address).\n  return typed.trim().toLowerCase() === target.trim().toLowerCase();\n}\n\n/**\n * Busy-while-a-promise-runs, for an action that MAY return one: `run(result, onResolved)`\n * marks the caller pending until `result` settles, calls `onResolved` if it fulfilled,\n * and only clears the flag if it rejected — the caller shows why and the user retries.\n * Nothing runs after unmount. Shared by `DangerConfirm` and `ReauthDialog`, whose\n * contract is the same: resolve = done, reject = stay put.\n *\n * @internal\n */\nexport function usePromisePending() {\n  const [pending, setPending] = useState(false);\n  const mounted = useRef(true);\n  useEffect(() => {\n    mounted.current = true;\n    return () => {\n      mounted.current = false;\n    };\n  }, []);\n  const run = useCallback((result: unknown, onResolved: () => void): boolean => {\n    if (!result || typeof (result as Promise<unknown>).then !== \"function\") return false;\n    setPending(true);\n    (result as Promise<unknown>).then(\n      () => {\n        if (!mounted.current) return;\n        setPending(false);\n        onResolved();\n      },\n      () => {\n        if (mounted.current) setPending(false);\n      },\n    );\n    return true;\n  }, []);\n  return { pending, run };\n}\n\n\n/** The one word {@link CurrentPasswordInput} says on its own behalf — the\n *  `dangerConfirm.password` label, shared with DangerConfirm's password field, so an\n *  app translates \"Password\" once. */\nexport type CurrentPasswordInputLabels = Pick<DangerConfirmLabels, \"password\">;\n\n/**\n * Everything {@link Input} takes except what makes this field what it is: `type` is\n * always `\"password\"` and `autoComplete` always `\"current-password\"`.\n */\nexport interface CurrentPasswordInputProps extends Omit<InputProps, \"type\" | \"autoComplete\" | \"label\"> {\n  /**\n   * The visible label. Default `dangerConfirm.password` (\"Password\") — unless the field\n   * is named another way (`aria-label` / `aria-labelledby`), which then stays the only\n   * name. Pass the app's own word on a sign-in form (\"Password\", \"Your password\"), or\n   * `null` for a field whose `<label htmlFor>` is drawn elsewhere (a form library's\n   * `FormLabel`), which would otherwise be labelled twice.\n   */\n  label?: ReactNode;\n  /** The value as a string — the `(next) => …` shape, so a caller holding it in\n   *  `useState` need not unwrap `event.target.value`. Fires alongside `onChange`,\n   *  never instead of it, so a form library's `onChange` keeps working. */\n  onValueChange?: (value: string) => void;\n  /**\n   * A check is running (the sign-in request, the re-auth). The field turns `readOnly`,\n   * NOT `disabled`: the field being submitted is usually the focused one (Enter was\n   * pressed in it), and disabling a focused field drops focus to `<body>` — the user\n   * lands nowhere when the \"wrong password\" answer comes back.\n   */\n  busy?: boolean;\n  /** Per-instance override of `dangerConfirm.password`. */\n  labels?: LabelOverride<CurrentPasswordInputLabels>;\n}\n\n/**\n * The \"prove it is you\" field: a password input that a password manager fills with\n * the CURRENT password and never offers to generate a new one for.\n *\n * It is the field of a sign-in form, a re-auth step ({@link ReauthDialog} draws the same\n * field), and {@link DangerConfirm}'s `requirePassword`. Public since 0.22 for kastlan's\n * sign-in and re-auth (kastlan 1), which wrote `type=\"password\"` +\n * `autoComplete=\"current-password\"` by hand — and a sign-in field that forgets the\n * second half gets the browser's \"suggest a strong password\" offer on the one form where\n * a NEW password is never what is wanted. The reverse matters as much: a field that sets\n * a NEW password (a passphrase, a sign-up) must NOT be this one — keksdose #170 keeps\n * its passphrase doors on `new-password` / `off` for that reason.\n *\n * Everything else is {@link Input}: the reveal toggle, `error` (under the field,\n * `aria-describedby`, `aria-invalid`), `invalid`, `name`, `id`, `autoFocus`, `required`.\n * The ref is the `<input>`, so it works with `@eifi1/ui-kit/rhf`'s `FormControl` /\n * a `register()` spread, and controlled or uncontrolled.\n *\n * ```tsx\n * <CurrentPasswordInput name=\"password\" label={t(\"password\")} error={errors.password?.message}\n *   busy={isSubmitting} {...register(\"password\")} />\n * ```\n */\nexport function CurrentPasswordInput({\n  label,\n  onValueChange,\n  onChange,\n  busy,\n  readOnly,\n  labels: labelsProp,\n  ...rest\n}: CurrentPasswordInputProps) {\n  const labels = useKitLabels(\"dangerConfirm\", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);\n  const namedOtherwise = rest[\"aria-label\"] !== undefined || rest[\"aria-labelledby\"] !== undefined;\n  return (\n    <Input\n      // `ref` (the `<input>`) rides along: a React 19 ref prop since 0.34 (MOD-4, refactor\n      // audit 2026-10), where this was `forwardRef`.\n      {...rest}\n      // After the spread: a props object spread at the field must not turn it into a\n      // text field, or into one the password manager offers a new password for.\n      type=\"password\"\n      autoComplete=\"current-password\"\n      label={label === undefined ? (namedOtherwise ? undefined : labels.password) : hasContent(label) ? label : undefined}\n      readOnly={Boolean(busy) || readOnly}\n      onChange={(e) => {\n        onChange?.(e);\n        onValueChange?.(e.target.value);\n      }}\n    />\n  );\n}\n\n/** The words {@link TypedConfirmField} says on its own behalf — the `dangerConfirm`\n *  namespace's `phrase` and `phrasePlaceholder`, shared with DangerConfirm's own field,\n *  so the sentence \"Type “X” to confirm\" is translated once. */\nexport type TypedConfirmFieldLabels = Pick<DangerConfirmLabels, \"phrase\" | \"phrasePlaceholder\">;\n\nexport interface TypedConfirmFieldProps\n  extends Omit<InputProps, \"type\" | \"value\" | \"defaultValue\" | \"label\" | \"placeholder\"> {\n  /** The text to repeat — a word (\"DELETE\"), a name, an e-mail address. */\n  target: string;\n  /** How the typed text is compared with `target` — {@link TypedMatch}. Default\n   *  `\"trim\"`, as {@link typedMatches}; `\"caseless\"` for an address or an\n   *  acknowledgement word a user may type in any case. */\n  match?: TypedMatch;\n  /** Controlled value. Left out, the field keeps its own (start: `defaultValue`). */\n  value?: string;\n  defaultValue?: string;\n  /** The typed text as a string, on every keystroke. Fires alongside `onChange`. */\n  onValueChange?: (value: string) => void;\n  /**\n   * The typed text started or stopped matching `target` — fired from the keystroke\n   * that flipped it, so an uncontrolled field can still drive the button it guards. A\n   * controlled caller that resets the value itself (on a close) knows the answer\n   * already, and gets no call for that; it can also compute it with {@link typedMatches}.\n   */\n  onMatchedChange?: (matched: boolean) => void;\n  /** The label. Default `dangerConfirm.phrase(target)` — \"Type “DELETE” to confirm\". */\n  label?: ReactNode;\n  /** Text inside the empty field. Default `dangerConfirm.phrasePlaceholder` (unset).\n   *  Given, the label moves ABOVE the field: a floating label occupies the empty\n   *  field, which is exactly where a placeholder shows. `\"\"` means none. */\n  placeholder?: string;\n  /** The guarded action is running: the field turns `readOnly` (not `disabled`, which\n   *  would drop the focus Enter left in it). */\n  busy?: boolean;\n  labels?: LabelOverride<TypedConfirmFieldLabels>;\n}\n\n/**\n * The \"type this to confirm\" field — {@link DangerConfirm}'s `phrase` field and\n * `useConfirm({ requireTyped })`'s, on its own (keksdose K7).\n *\n * keksdose writes it by hand four times: the privacy enrol, upgrade and sweep dialogs\n * (type the acknowledgement word, then the key doors appear) and the admin's \"type the\n * user's address\" (`UserActionConfirm`), each an `Input` plus its own\n * `trim().toUpperCase()` / `toLowerCase()` comparison. None of those places is an\n * arm → confirm tile or a modal confirm — what is guarded is a whole form, or the\n * next step of a dialog — so the field had to stand alone. What it brings over a plain\n * `Input`: one match rule ({@link typedMatches}, which lower-cases locale-independently\n * on purpose), the label worded from the target in the app's language, and the\n * attributes a phone keyboard needs to leave the text alone (no autocomplete, no\n * auto-capital, no autocorrect, no spellcheck — a keyboard that \"corrects\" an e-mail\n * address makes the guard unpassable).\n *\n * The field reports whether it matches (`onMatchedChange`, and `data-matched` on the\n * `<input>` for styling); what the match unlocks is the caller's. The ref is the\n * `<input>`.\n *\n * ```tsx\n * const [ok, setOk] = useState(false);\n * <TypedConfirmField target={t(\"privacy.enroll_ack_word\")} match=\"caseless\" onMatchedChange={setOk} />\n * {ok && <KeyDoorsForm … />}\n * ```\n */\nexport function TypedConfirmField({\n  ref,\n  target,\n  match = \"trim\",\n  value: valueProp,\n  defaultValue = \"\",\n  onValueChange,\n  onMatchedChange,\n  onChange,\n  label: labelProp,\n  placeholder: placeholderProp,\n  busy,\n  readOnly,\n  labels: labelsProp,\n  id,\n  className,\n  ...rest\n}: TypedConfirmFieldProps) {\n  const labels = useKitLabels(\"dangerConfirm\", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);\n  const [own, setOwn] = useState(defaultValue);\n  const value = valueProp ?? own;\n  const matched = typedMatches(value, target, match);\n  const generated = useId();\n  const fieldId = id ?? generated;\n  const label =\n    labelProp !== undefined\n      ? labelProp\n      : typeof labels.phrase === \"function\"\n        ? labels.phrase(target)\n        : labels.phrase;\n  const fromLabels =\n    labels.phrasePlaceholder === undefined\n      ? undefined\n      : typeof labels.phrasePlaceholder === \"function\"\n        ? labels.phrasePlaceholder(target)\n        : labels.phrasePlaceholder;\n  const placeholder = placeholderProp ?? fromLabels;\n\n  const fieldProps = {\n    ...rest,\n    ref,\n    id: fieldId,\n    value,\n    autoComplete: \"off\",\n    autoCapitalize: \"off\",\n    autoCorrect: \"off\",\n    spellCheck: false,\n    readOnly: Boolean(busy) || readOnly,\n    \"data-matched\": matched || undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      onChange?.(e);\n      const next = e.target.value;\n      if (valueProp === undefined) setOwn(next);\n      onValueChange?.(next);\n      const nextMatched = typedMatches(next, target, match);\n      if (nextMatched !== matched) onMatchedChange?.(nextMatched);\n    },\n  };\n\n  if (placeholder) {\n    return (\n      // A static label above, so the placeholder has the empty field to itself.\n      <div className={cn(\"space-y-1.5\", className)}>\n        <Label htmlFor={fieldId}>{label}</Label>\n        <Input {...fieldProps} placeholder={placeholder} />\n      </div>\n    );\n  }\n  return <Input {...fieldProps} label={label} className={className} />;\n}\n\n/**\n * Every string the tile renders — the `dangerConfirm` namespace of\n * `<UiKitProvider labels>`, overridable per instance through `labels`. The arm and\n * confirm buttons are usually worded per action (\"Delete budget\"), which is what the\n * `armLabel` / `confirmLabel` props are for; these are the fallbacks.\n */\nexport interface DangerConfirmLabels {\n  /** The button that arms the tile. */\n  arm: string;\n  /** The button that runs the action once the guards are satisfied. */\n  confirm: string;\n  cancel: string;\n  /** The warning above the fields, when no `prompt` is given. */\n  prompt: string;\n  /** Label of the password field (`requirePassword`). */\n  password: string;\n  /** Label of the type-to-confirm field. A FUNCTION of the phrase by default, like\n   *  every message that carries a value: where the phrase sits in the sentence moves\n   *  with the language. A plain STRING is taken as the finished label — for an app\n   *  whose catalogue already words it (\"Type DELETE to confirm\") and would otherwise\n   *  wrap it as `() => label`. */\n  phrase: string | ((phrase: string) => string);\n  /** Placeholder of the type-to-confirm field — a string, or a function of the\n   *  phrase (`(p) => p` echoes it). Optional and unset by default: the field keeps its\n   *  floating label, as before. Given, the label moves ABOVE the field (a floating\n   *  label occupies the empty field, which is exactly where a placeholder shows) and\n   *  the placeholder fills the field. An empty string means none. */\n  phrasePlaceholder?: string | ((phrase: string) => string);\n  /** 0.22: the checkbox `requireAcknowledge={true}` shows — \"I have read what this does\n   *  and want to continue\" (keksdose's `admin.users.confirm_ack`). */\n  acknowledge: string;\n  /**\n   * 0.23: why the armed confirm is held while the typed phrase does not match yet — in\n   * the confirm's tooltip and its description (keksdose G4a). A FUNCTION of the phrase\n   * by default (\"Type “DELETE” to confirm\"), or a finished STRING, as `phrase`.\n   */\n  needsPhrase: string | ((phrase: string) => string);\n  /** 0.23: why the armed confirm is held while the `requireAcknowledge` box is unticked\n   *  — \"Tick the box to confirm\". */\n  needsAcknowledge: string;\n  /** 0.23: why the armed confirm is held while the `requirePassword` field is empty —\n   *  \"Enter your password to confirm\". */\n  needsPassword: string;\n}\n\n// Defined in ./danger-confirm-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_DANGER_CONFIRM_LABELS };\n\n/**\n * What the guards were answered with — the second argument of\n * {@link DangerConfirmProps.onConfirm} (0.23, keksdose G4b). A key is there only when its\n * guard was asked for, so the object can go into a request body as it is.\n */\nexport interface DangerConfirmValues {\n  /**\n   * The text typed into the `phrase` field — as the match rule compared it: trimmed\n   * under `phraseMatch` `\"trim\"` and `\"caseless\"` (the spaces a phone keyboard adds are\n   * not part of it), exactly as typed under `\"exact\"`. The case is the user's, even\n   * under `\"caseless\"`: a server that re-checks applies its own rule to it. Absent\n   * without a `phrase`.\n   */\n  typed?: string;\n  /** The entered password — the same value as the first argument. Absent without\n   *  `requirePassword`. */\n  password?: string;\n  /** `true` when the `requireAcknowledge` box was shown — it was ticked, since the\n   *  confirm is held until it is. Absent without one. */\n  acknowledged?: true;\n}\n\n/**\n * One line of {@link DangerConfirmProps.consequences}: what the action will do. A plain\n * string, or this, for a key of its own and the `severe` mark.\n */\nexport interface DangerConsequence {\n  /** React key — keksdose keys its lines by what they say (\"api_tokens\", \"only_door\").\n   *  Default: the text when it is a string, else the position. */\n  key?: string;\n  text: ReactNode;\n  /** \"There is no way back\" — painted in the danger colour rather than the list's\n   *  muted one. keksdose reserves it for the one line that loses something for good. */\n  severe?: boolean;\n}\n\nexport interface DangerConfirmProps extends Omit<ComponentPropsWithRef<\"div\">, \"onChange\"> {\n  /**\n   * Runs the action, with the entered password when `requirePassword` is on.\n   *\n   * Return a promise and the tile manages itself: busy until it settles, disarmed\n   * (fields wiped) when it resolves, still armed when it rejects — so the user can\n   * correct a wrong password and retry. The rejection is not swallowed for you to\n   * miss: handle it (and show why) in the caller, as with any mutation.\n   *\n   * 0.23: the second argument is what every guard was answered with — the typed phrase,\n   * the password, the tick ({@link DangerConfirmValues}). keksdose G4b: its admin\n   * actions send the address the admin TYPED, and the server re-checks it against the\n   * account (`assert_confirmed`), so a client that put the wrong row's id in the request\n   * is refused rather than obeyed; the tile kept the text to itself.\n   *\n   *     onConfirm={(_password, { typed }) =>\n   *       reset.mutateAsync({ id, confirm: { acknowledged: true, confirm_email: typed ?? null } })}\n   *\n   * A second argument rather than one object in place of the password: every\n   * `(password) => …` and `() => …` handler, and a `mutation.mutate` passed as it is,\n   * keeps working unchanged, and a handler that needs one guard's answer names it.\n   */\n  onConfirm: (password: string | undefined, values: DangerConfirmValues) => void | Promise<unknown>;\n  /** Show a password field; confirm is held until it is filled. */\n  requirePassword?: boolean;\n  /**\n   * Show an \"I understand\" checkbox; confirm is held until it is ticked\n   * (keksdose K7). `true` words it with `labels.acknowledge`; any other node IS the\n   * checkbox's label (\"I understand Anna will be signed out everywhere\").\n   *\n   * The guard for an action whose risk is MIS-TARGETING less than carelessness:\n   * keksdose's admin password reset asks for a typed address when the account has an\n   * encrypted door to lose, and a tick otherwise (`UserActionConfirm`), and its plan\n   * editor asks for the tick alone (`UserPlanEditor`). Both were hand-built beside this\n   * tile because it had no tick. It combines with `phrase` and `requirePassword`: every\n   * guard given must be satisfied.\n   */\n  requireAcknowledge?: ReactNode;\n  /**\n   * What the action will do, said before it happens — a list under the prompt, shown\n   * once armed (keksdose K7, `UserActionConfirm`'s consequences). Strings, or\n   * {@link DangerConsequence}s for a `severe` line in the danger colour.\n   *\n   * Derive them from the row's own facts rather than reciting the worst case: an admin\n   * who reads the same paragraph on every row stops reading it (keksdose dev#488).\n   */\n  consequences?: readonly (string | DangerConsequence)[];\n  /** Show a \"type <phrase> to confirm\" field; confirm is held until the field matches\n   *  (case-sensitive; surrounding spaces ignored unless `phraseMatch=\"exact\"`). */\n  phrase?: string;\n  /**\n   * How the typed text is compared with `phrase`. `\"trim\"` (default) ignores spaces\n   * around it — a phone keyboard's autocomplete likes to add one. `\"exact\"` compares\n   * character for character, spaces included, for an app whose contract is \"type\n   * exactly this\". `\"caseless\"` (0.18) also ignores case — for a phrase that is an\n   * e-mail address (keksdose's \"type the user's address\" admin rule). See\n   * {@link TypedMatch}.\n   */\n  phraseMatch?: TypedMatch;\n  /** The warning above the fields. Defaults to `labels.prompt`. */\n  prompt?: ReactNode;\n  /** `\"danger\"` (default) for what cannot be undone; `\"warning\"` for what can, at a\n   *  cost (loading demo data over your own). Colours the prompt, and picks the arm\n   *  button's variant and — unless {@link DangerConfirmProps.confirmVariant} is\n   *  given — the confirm's. */\n  tone?: \"danger\" | \"warning\";\n  /**\n   * The confirm button's variant, apart from `tone` (0.24, keksdose). Default: what\n   * `tone` picks, as before — `\"danger\"` for `\"danger\"`, `\"primary\"` for `\"warning\"`.\n   *\n   * `tone` says how bad the outcome is; this says how loud the last press is, and the two\n   * need not agree. keksdose's `UserActionConfirm` (an admin resets somebody else's\n   * password) asks an AMBER question — what it guards against is mis-targeting, not data\n   * loss, so the danger colour stays its one `severe` consequence's — and ends in a RED\n   * Go, as its hand-built panel did before it moved onto this tile in 0.23; with only\n   * `tone`, the amber question made Go the neutral primary fill. `tone=\"warning\"\n   * confirmVariant=\"danger\"` is that panel again.\n   */\n  confirmVariant?: ButtonVariant;\n  /**\n   * Hold the armed confirm for a reason of the CALLER's own (0.24, keksdose) — the\n   * tile's counterpart of FormActions' `submitDisabledReason`. While it has content the\n   * confirm is held exactly as by the built-in guards: `aria-disabled` but focusable,\n   * the reason in the kit {@link Tooltip} and its description, a press — or Enter in a\n   * field — does nothing. Nothing else changes: the arm button stays usable, and no\n   * line is printed under the buttons.\n   *\n   * keksdose's `UserPlanEditor` (\"move this account onto another plan\") must not confirm\n   * the plan the account already holds — the request would only write FREE → FREE into\n   * the audit trail. With no guard of its own to give, it passed \"Pick a different plan\"\n   * as `lockedReason`, which is a LOCK: documented as \"the action is not available\",\n   * spelled out under the buttons as well as in the tooltip, and meant for a write the\n   * user cannot make land. A guard the user lifts by changing a field is this prop.\n   *\n   * Which reason the held confirm names: a write lock's first (`lockedReason`, `commit`\n   * — nothing in the tile lifts it), then this one, then the built-in guards in the\n   * order they are drawn (the tick, the phrase, the password). This one before the\n   * built-ins because it is usually about a field in\n   * {@link DangerConfirmProps.children}, which is drawn ABOVE them — the rule since 0.23\n   * is \"the first open guard in the order the user meets it\" — and because it is about\n   * WHAT is being confirmed (which plan), which has to be settled before acknowledging\n   * it means anything. It is also the order keksdose's plan editor had, its\n   * `lockedReason` winning over the tick.\n   */\n  confirmDisabledReason?: ReactNode;\n  /**\n   * Fields of the caller's own, drawn INSIDE the armed tile (0.24, keksdose): after the\n   * prompt and the consequences, before the tick, the typed phrase and the password —\n   * the order is \"what this does, what to do it with, then prove you mean it\". Nothing\n   * is drawn for them while the tile is disarmed, and nothing at all without them, so a\n   * tile without children is laid out exactly as before.\n   *\n   * keksdose's `UserPlanEditor` asks WHICH plan before it asks for the tick; with no\n   * place inside the tile for the picker, the `Select` sat above it, and the tile's\n   * prompt — the panel's title by rights — became the \"FREE → PRO\" line under the\n   * picker. With the picker here, the prompt is the title again.\n   *\n   * The fields are the caller's: their values are not wiped on disarm (an uncontrolled\n   * field starts over anyway — the slot unmounts), not passed to `onConfirm`, and a\n   * guard on them is {@link DangerConfirmProps.confirmDisabledReason}. Arming moves\n   * focus to their first form field (an input, a select, a combobox, a radio…), else to\n   * the tile's own first field as before; Tab then goes on through the tick, the phrase\n   * and the password to Cancel and the confirm. They sit inside the tile's `<form>`:\n   * Enter in a text field confirms once every guard allows, and a {@link Button} among\n   * them needs `type=\"button\"` — without one it SUBMITS the form, as a native button\n   * does.\n   */\n  children?: ReactNode;\n  /** Visible text of the arm button; defaults to `labels.arm`. */\n  armLabel?: ReactNode;\n  /** Visible text of the confirm button; defaults to `labels.confirm`. */\n  confirmLabel?: ReactNode;\n  /**\n   * The action is running: confirm shows a spinner and nothing can be pressed — Cancel\n   * included. For a caller that tracks the mutation itself (a `useMutation`'s\n   * `isPending`); a promise returned from `onConfirm` does the same on its own.\n   *\n   * Cancel stays disabled ON PURPOSE, unlike FormActions' (keksdose asked in 0.24 why the\n   * two differ). Once the request has left, nothing on the client can call it back —\n   * not even an `AbortSignal`, which only stops the waiting, not the server — so a usable\n   * Cancel could only collapse the tile while the action went on: \"Cancel\" pressed, and\n   * the account reset anyway. Every way of settling what comes back is wrong somewhere: a\n   * resolve after the Cancel did what the user called off; a reject finds the fields\n   * wiped (a collapsed tile holds no password), so the 0.23 \"stay armed and retry\" is\n   * gone; and re-arming while the first request runs is either a busy tile with empty\n   * fields or — if the busy state went with the Cancel — a second destructive request\n   * beside the first. FormActions' Cancel leaves an editor whose save is the user's own\n   * edit landing, and a form can be edited again; the tile's action is the one that\n   * cannot be undone, so it says nothing it cannot keep and waits — the wait is one\n   * request long.\n   *\n   * When the action settles still armed (it failed) and the press on the confirm had\n   * dropped the focus — a natively disabled button loses it — focus comes back to the\n   * confirm, so a keyboard user can retry or Shift+Tab to the field to correct (0.24).\n   */\n  busy?: boolean;\n  /** The arm button is disabled. */\n  disabled?: boolean;\n  /**\n   * Why the action is not available — a read-only demo, a write lock, a missing\n   * permission. Disables the arm button like `disabled`, and SAYS so: the sentence is\n   * shown under the button and attached to it with `aria-describedby`, and the button\n   * stays focusable (`aria-disabled`) so a keyboard user can land on it and hear why.\n   *\n   * On the ARM button rather than the confirm: arming asks for a password, and asking\n   * for a password for a write that can never land is the worse of the two. A tile that\n   * is ALREADY armed when the reason arrives (controlled `armed`, or a lock that landed\n   * while it was open) keeps its fields but its confirm takes the reason the same way\n   * — focusable, `aria-disabled`, the reason in its tooltip — and Enter does nothing.\n   */\n  lockedReason?: ReactNode;\n  /**\n   * This tile COMMITS — the 0.18 write-lock opt-in that {@link Button} has (keksdose\n   * K3). Under a locked {@link WriteLockProvider} the lock's reason becomes\n   * `lockedReason` (and wins over one of the tile's own), so a page that mounts the\n   * provider no longer threads `lockedReason={lock.locked ? lock.reason : undefined}`\n   * into every tile. No provider, or an unlocked one: no effect.\n   */\n  commit?: CommitScope;\n  /** Controlled armed state. The parent can then collapse the tile from a mutation's\n   *  own `onSuccess` without returning a promise. */\n  armed?: boolean;\n  /** Called with the next armed state — on arm, cancel, and a resolved `onConfirm`. */\n  onArmedChange?: (armed: boolean) => void;\n  /** User-facing strings; see {@link DangerConfirmLabels}. */\n  labels?: LabelOverride<DangerConfirmLabels>;\n}\n\n/** What counts as a FIELD among the caller's `children` — what arming focuses. Not\n *  any tabbable element: a \"see the plans\" link or a disclosure button before the\n *  picker is not where the user starts. `[tabindex=\"-1\"]` is a roving radio group's\n *  unselected option; the selected one (`0`) is the group's stop. */\nconst SLOT_FIELD = [\n  'input:not([type=\"hidden\"])',\n  \"select\",\n  \"textarea\",\n  ...[\"combobox\", \"listbox\", \"radio\", \"checkbox\", \"switch\", \"slider\", \"spinbutton\", \"textbox\"].map(\n    (role) => `[role=\"${role}\"]`,\n  ),\n]\n  .map((selector) => `${selector}:not(:disabled):not([tabindex=\"-1\"]):not([aria-hidden=\"true\"])`)\n  .join(\", \");\n\n/** The first field among the caller's `children`, skipping a native radio that is not\n *  the checked one of its group (Tab lands on the checked one). */\nfunction firstSlotField(slot: HTMLElement | null): HTMLElement | null {\n  if (!slot) return null;\n  for (const el of slot.querySelectorAll<HTMLElement>(SLOT_FIELD)) {\n    if (el.closest(\"[hidden], [inert]\")) continue;\n    if (el instanceof HTMLInputElement && el.type === \"radio\" && !el.checked && el.name) {\n      const group = el.form?.elements.namedItem(el.name);\n      const checked =\n        group instanceof RadioNodeList && Array.from(group).some((r) => r instanceof HTMLInputElement && r.checked);\n      if (checked) continue;\n    }\n    return el;\n  }\n  return null;\n}\n\n/**\n * An \"arm → confirm\" tile for destructive actions: one button, which expands into a\n * warning, an optional list of consequences, optional fields of the caller's own\n * (`children`, 0.24), an optional \"I understand\" tick, an optional type-to-confirm\n * field, an optional password field and a confirm that is held until every guard is\n * satisfied — the built-in ones, and the caller's `confirmDisabledReason` (0.24).\n *\n * A held confirm SAYS which guard is still open (0.23, keksdose G4a): it is\n * `aria-disabled` rather than `disabled` — still focusable, so a keyboard user can land\n * on it — with the reason in the kit {@link Tooltip} and its description (\"Type\n * “DELETE” to confirm\", \"Tick the box to confirm\", \"Enter your password to confirm\";\n * `labels.needs*`), the first open guard in the order they are drawn. FormActions'\n * `submitDisabledReason` does the same for a form's Save. Pressing it, or Enter in a\n * field, does nothing. A lock's reason wins over a guard's, the caller's guard over the\n * built-in ones; while the action runs the confirm is plainly disabled, its spinner\n * saying why — and so is Cancel, which cannot call back a request that has left (see\n * `busy`).\n *\n * Keksdose hand-rolled it three times (load demo data, wipe everything, reset a\n * budget) and then as `shared/components/danger-confirm.tsx`; the only app-specific\n * part was its write-lock hook, which is `lockedReason` here.\n *\n * The fields are a `<form>`, so Enter confirms once the guards allow it. They are\n * wiped every time the tile disarms — a password must not sit in a collapsed tile.\n * Arming moves focus to the first field (or Cancel, when there is none — never to the\n * destructive button itself), and disarming moves it back to the arm button, so the\n * keyboard user is never left on an element that just vanished.\n */\nexport function DangerConfirm({\n  onConfirm,\n  requirePassword,\n  requireAcknowledge,\n  consequences,\n  phrase,\n  phraseMatch = \"trim\",\n  prompt,\n  tone = \"danger\",\n  confirmVariant,\n  confirmDisabledReason,\n  children,\n  armLabel,\n  confirmLabel,\n  busy: busyProp,\n  disabled,\n  lockedReason: ownLockedReason,\n  commit,\n  armed: armedProp,\n  onArmedChange,\n  labels: labelsProp,\n  className,\n  ...rest\n}: DangerConfirmProps) {\n  const labels = useKitLabels(\"dangerConfirm\", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);\n  const lockedReason = useCommitReason(commit, ownLockedReason);\n  const [armedState, setArmedState] = useState(false);\n  const armed = armedProp ?? armedState;\n  const [password, setPassword] = useState(\"\");\n  const [typed, setTyped] = useState(\"\");\n  const [acknowledged, setAcknowledged] = useState(false);\n  const { pending, run } = usePromisePending();\n  const busy = Boolean(busyProp) || pending;\n  // `readOnly` rather than `disabled` on the fields while busy: disabling the field\n  // that has focus (Enter was pressed in it) drops focus to <body>.\n  const promptId = useId();\n  const consequencesId = useId();\n  const reasonId = useId();\n\n  // The buttons focus is moved to are found by id.\n  const armId = useId();\n  const cancelId = useId();\n  const confirmId = useId();\n  const firstFieldRef = useRef<HTMLInputElement>(null);\n  // The caller's fields (`children`), searched for their first form field on arm.\n  const slotRef = useRef<HTMLDivElement>(null);\n  // Focus moves only after a transition — never on mount, so a tile that renders armed\n  // (controlled) does not take the page's focus merely by existing.\n  const moveFocus = useRef(false);\n  // A confirm from this tile is under way — see the focus return after a failure below.\n  const confirmed = useRef(false);\n\n  // A disarm from anywhere (cancel, a resolved confirm, the parent) wipes the fields.\n  // During render, like NumberField's draft, so no frame shows a collapsed tile that\n  // still holds a password.\n  const [wasArmed, setWasArmed] = useState(armed);\n  if (wasArmed !== armed) {\n    setWasArmed(armed);\n    if (!armed) {\n      setPassword(\"\");\n      setTyped(\"\");\n      setAcknowledged(false);\n    }\n  }\n\n  const prevArmed = useRef(armed);\n  useEffect(() => {\n    const changed = prevArmed.current !== armed;\n    prevArmed.current = armed;\n    const byUser = moveFocus.current;\n    moveFocus.current = false;\n    if (!changed) return;\n    if (armed) {\n      if (byUser) {\n        // The caller's fields come first on the page, so first in focus too.\n        (firstSlotField(slotRef.current) ?? firstFieldRef.current ?? document.getElementById(cancelId))?.focus();\n      }\n      return;\n    }\n    confirmed.current = false;\n    // A controlled parent collapsing the tile from its own `onSuccess` did not go\n    // through `setArmed`; if focus went down with the form, bring it back too.\n    const lost = document.activeElement === null || document.activeElement === document.body;\n    if (byUser || lost) document.getElementById(armId)?.focus();\n  }, [armed, armId, cancelId]);\n\n  // The action settled and the tile is still armed — it failed, and the user retries.\n  // The confirm was natively disabled while it ran, and a focused button that turns\n  // disabled drops the focus to <body>: bring it back to the button that was pressed.\n  // Only after a confirm from THIS tile (`confirmed`), so a `busy` that comes and goes\n  // on its own never pulls the page's focus in. (A resolve disarms, and the effect\n  // above takes the focus to the arm button.)\n  const wasBusy = useRef(busy);\n  useEffect(() => {\n    const settled = wasBusy.current && !busy;\n    wasBusy.current = busy;\n    if (!settled) return;\n    const ours = confirmed.current;\n    confirmed.current = false;\n    if (!ours || !armed) return;\n    if (document.activeElement === null || document.activeElement === document.body) {\n      document.getElementById(confirmId)?.focus();\n    }\n  }, [busy, armed, confirmId]);\n\n  const setArmed = (next: boolean) => {\n    moveFocus.current = true;\n    if (armedProp === undefined) setArmedState(next);\n    onArmedChange?.(next);\n  };\n\n  const locked = hasContent(lockedReason);\n  // `true` words the tick with the namespace; any other node is its label; `false`,\n  // `null` and `\"\"` are no tick at all.\n  const acknowledgeLabel: ReactNode =\n    requireAcknowledge === true ? labels.acknowledge : hasContent(requireAcknowledge) ? requireAcknowledge : null;\n  const asksAcknowledge = acknowledgeLabel !== null;\n  const passwordOk = !requirePassword || password !== \"\";\n  const phraseOk = phrase === undefined || typedMatches(typed, phrase, phraseMatch);\n  const acknowledgeOk = !asksAcknowledge || acknowledged;\n  const callerHeld = hasContent(confirmDisabledReason);\n  // `{cond && <Select />}` and `[null, false]` are no fields: no wrapper, no gap.\n  const hasFields = Children.toArray(children).some(hasContent);\n  const canConfirm = passwordOk && phraseOk && acknowledgeOk && !callerHeld && !busy;\n  // The first guard still open, in the order the fields are drawn — the one the user\n  // meets next, so the sentence points at it.\n  const guardReason: string | undefined = !acknowledgeOk\n    ? labels.needsAcknowledge\n    : !phraseOk\n      ? typeof labels.needsPhrase === \"function\"\n        ? labels.needsPhrase(phrase ?? \"\")\n        : labels.needsPhrase\n      : !passwordOk\n        ? labels.needsPassword\n        : undefined;\n  // The lock first (no guard can lift it); none while busy, when the guards were met and\n  // the spinner is the state; then the caller's guard — about the fields drawn above the\n  // built-in ones, and about WHAT is confirmed — then the first built-in guard still open.\n  const confirmReason: ReactNode = locked\n    ? lockedReason\n    : busy\n      ? undefined\n      : callerHeld\n        ? confirmDisabledReason\n        : guardReason;\n\n  const submit = (e: FormEvent) => {\n    e.preventDefault();\n    // `locked` too: Enter in a field submits the form without the button's say (and\n    // `canConfirm` holds the caller's guard the same way).\n    if (!canConfirm || locked) return;\n    const values: DangerConfirmValues = {\n      ...(phrase !== undefined && { typed: phraseMatch === \"exact\" ? typed : typed.trim() }),\n      ...(requirePassword && { password }),\n      ...(asksAcknowledge && { acknowledged: true as const }),\n    };\n    confirmed.current = true;\n    // Disarms when it resolves; a rejection leaves it armed, fields kept: the caller\n    // shows why, the user retries.\n    run(onConfirm(values.password, values), () => setArmed(false));\n  };\n\n  // The first field takes focus on arm: the tick, then the phrase, then the password —\n  // the order they are drawn in.\n  const firstField = asksAcknowledge ? \"acknowledge\" : phrase !== undefined ? \"phrase\" : \"password\";\n  const lines = (consequences ?? []).map((item, index) =>\n    typeof item === \"string\"\n      ? { key: item, text: item as ReactNode, severe: false }\n      : { key: item.key ?? String(index), text: item.text, severe: Boolean(item.severe) },\n  );\n\n  const toneText = tone === \"warning\" ? \"text-warning\" : \"text-danger\";\n\n  if (!armed) {\n    const arm = (\n      <Button\n        id={armId}\n        type=\"button\"\n        variant={tone === \"warning\" ? \"secondary\" : \"danger\"}\n        disabled={disabled}\n        aria-disabled={locked || undefined}\n        aria-describedby={locked ? reasonId : undefined}\n        onClick={() => {\n          if (!locked) setArmed(true);\n        }}\n        className=\"aria-disabled:cursor-not-allowed aria-disabled:opacity-50\"\n      >\n        {armLabel ?? labels.arm}\n      </Button>\n    );\n    return (\n      <div {...rest} className={cn(\"space-y-1\", className)}>\n        {locked ? (\n          // The reason on the button itself too, where the pointer that tried it is —\n          // the line below can sit out of view in a long settings card. Portalled, so\n          // a card that scrolls neither clips it nor grows by it.\n          //\n          // The button in a FRAGMENT on purpose: Tooltip clones an element child to\n          // add the bubble to its `aria-describedby`, and the button is already\n          // described by the visible line below — the same sentence twice, read out\n          // on every focus. A fragment is left as it is, so the bubble stays visual.\n          <Tooltip label={lockedReason} portal>\n            <>{arm}</>\n          </Tooltip>\n        ) : (\n          arm\n        )}\n        {locked && (\n          <p id={reasonId} className=\"text-xs text-muted\">\n            {lockedReason}\n          </p>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div {...rest} className={cn(\"space-y-2\", className)}>\n      <form\n        className=\"space-y-2\"\n        aria-describedby={lines.length > 0 ? `${promptId} ${consequencesId}` : promptId}\n        aria-busy={busy || undefined}\n        onSubmit={submit}\n        noValidate\n      >\n        <p id={promptId} className={cn(\"text-xs font-medium\", toneText)}>\n          {prompt ?? labels.prompt}\n        </p>\n        {lines.length > 0 && (\n          <ul id={consequencesId} className=\"list-disc space-y-1 ps-5 text-xs text-secondary\">\n            {lines.map((line) => (\n              <li key={line.key} className={line.severe ? \"text-danger\" : undefined}>\n                {line.text}\n              </li>\n            ))}\n          </ul>\n        )}\n        {/* The caller's fields: after what the action does, before the proof that it is\n            meant. No wrapper without them — a 0.23 tile's markup is unchanged. */}\n        {hasFields && (\n          <div ref={slotRef} className=\"space-y-2\">\n            {children}\n          </div>\n        )}\n        {asksAcknowledge && (\n          <Checkbox\n            ref={firstField === \"acknowledge\" ? firstFieldRef : undefined}\n            label={acknowledgeLabel}\n            checked={acknowledged}\n            // Not `disabled` while busy, for the same reason the fields are readOnly:\n            // the box may hold the focus. A change while busy is simply not taken.\n            onCheckedChange={(next) => {\n              if (!busy) setAcknowledged(next);\n            }}\n          />\n        )}\n        {phrase !== undefined && (\n          <TypedConfirmField\n            ref={firstField === \"phrase\" ? firstFieldRef : undefined}\n            target={phrase}\n            match={phraseMatch}\n            value={typed}\n            onValueChange={setTyped}\n            busy={busy}\n            // Already resolved through this tile's own `labels` prop; handed on so a\n            // per-instance phrase wording reaches the field.\n            labels={{ phrase: labels.phrase, phrasePlaceholder: labels.phrasePlaceholder }}\n          />\n        )}\n        {requirePassword && (\n          <CurrentPasswordInput\n            ref={firstField === \"password\" ? firstFieldRef : undefined}\n            label={labels.password}\n            value={password}\n            busy={busy}\n            onValueChange={setPassword}\n          />\n        )}\n        <div className=\"flex flex-wrap gap-2\">\n          <Button id={cancelId} type=\"button\" variant=\"ghost\" disabled={busy} onClick={() => setArmed(false)}>\n            {labels.cancel}\n          </Button>\n          <Button\n            id={confirmId}\n            type=\"submit\"\n            variant={confirmVariant ?? (tone === \"warning\" ? \"primary\" : \"danger\")}\n            disabled={!canConfirm}\n            // Held by a guard (the caller's or a built-in one), or armed and then locked\n            // (or rendered armed under a lock): the confirm says why the way Button\n            // does — focusable, `aria-disabled`, the reason in its tooltip and\n            // description, a press swallowed (the submit with it) — and the fields stay\n            // as typed. Only busy is the native `disabled`.\n            disabledReason={confirmReason}\n            aria-busy={busy || undefined}\n          >\n            {busy && <Spinner label={null} className=\"h-4 w-4\" />}\n            {confirmLabel ?? labels.confirm}\n          </Button>\n        </div>\n        {locked && <p className=\"text-xs text-muted\">{lockedReason}</p>}\n      </form>\n    </div>\n  );\n}\n"],"mappings":";AAmJI,SA8qBQ,UA9qBR,KA+IE,YA/IF;AAnJJ,SAAS,UAAU,aAAa,WAAW,OAAO,QAAQ,gBAAgB;AAE1E,SAAS,UAAU;AACnB,SAAS,kBAAkB;AAC3B,SAAS,oBAAwC;AACjD,SAAS,cAAc;AACvB,SAAS,aAAa;AACtB,SAAS,aAAa;AACtB,SAAS,eAAe;AAGxB,SAAS,gBAAgB;AACzB,SAAS,eAAe;AACxB,SAAS,uBAAyC;AAClD,SAAS,qCAAqC;AAoBvC,SAAS,aAAa,OAAe,QAAgB,OAAmB,QAAiB;AAC9F,MAAI,SAAS,QAAS,QAAO,UAAU;AACvC,MAAI,SAAS,OAAQ,QAAO,MAAM,KAAK,MAAM;AAG7C,SAAO,MAAM,KAAK,EAAE,YAAY,MAAM,OAAO,KAAK,EAAE,YAAY;AAClE;AAWO,SAAS,oBAAoB;AAClC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,UAAU,OAAO,IAAI;AAC3B,YAAU,MAAM;AACd,YAAQ,UAAU;AAClB,WAAO,MAAM;AACX,cAAQ,UAAU;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC;AACL,QAAM,MAAM,YAAY,CAAC,QAAiB,eAAoC;AAC5E,QAAI,CAAC,UAAU,OAAQ,OAA4B,SAAS,WAAY,QAAO;AAC/E,eAAW,IAAI;AACf,IAAC,OAA4B;AAAA,MAC3B,MAAM;AACJ,YAAI,CAAC,QAAQ,QAAS;AACtB,mBAAW,KAAK;AAChB,mBAAW;AAAA,MACb;AAAA,MACA,MAAM;AACJ,YAAI,QAAQ,QAAS,YAAW,KAAK;AAAA,MACvC;AAAA,IACF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,CAAC;AACL,SAAO,EAAE,SAAS,IAAI;AACxB;AA2DO,SAAS,qBAAqB;AAAA,EACnC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,GAAG;AACL,GAA8B;AAC5B,QAAM,SAAS,aAAa,iBAAiB,+BAA+B,UAAU;AACtF,QAAM,iBAAiB,KAAK,YAAY,MAAM,UAAa,KAAK,iBAAiB,MAAM;AACvF,SACE;AAAA,IAAC;AAAA;AAAA,MAGE,GAAG;AAAA,MAGJ,MAAK;AAAA,MACL,cAAa;AAAA,MACb,OAAO,UAAU,SAAa,iBAAiB,SAAY,OAAO,WAAY,WAAW,KAAK,IAAI,QAAQ;AAAA,MAC1G,UAAU,QAAQ,IAAI,KAAK;AAAA,MAC3B,UAAU,CAAC,MAAM;AACf,mBAAW,CAAC;AACZ,wBAAgB,EAAE,OAAO,KAAK;AAAA,MAChC;AAAA;AAAA,EACF;AAEJ;AAiEO,SAAS,kBAAkB;AAAA,EAChC;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAA2B;AACzB,QAAM,SAAS,aAAa,iBAAiB,+BAA+B,UAAU;AACtF,QAAM,CAAC,KAAK,MAAM,IAAI,SAAS,YAAY;AAC3C,QAAM,QAAQ,aAAa;AAC3B,QAAM,UAAU,aAAa,OAAO,QAAQ,KAAK;AACjD,QAAM,YAAY,MAAM;AACxB,QAAM,UAAU,MAAM;AACtB,QAAM,QACJ,cAAc,SACV,YACA,OAAO,OAAO,WAAW,aACvB,OAAO,OAAO,MAAM,IACpB,OAAO;AACf,QAAM,aACJ,OAAO,sBAAsB,SACzB,SACA,OAAO,OAAO,sBAAsB,aAClC,OAAO,kBAAkB,MAAM,IAC/B,OAAO;AACf,QAAM,cAAc,mBAAmB;AAEvC,QAAM,aAAa;AAAA,IACjB,GAAG;AAAA,IACH;AAAA,IACA,IAAI;AAAA,IACJ;AAAA,IACA,cAAc;AAAA,IACd,gBAAgB;AAAA,IAChB,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,UAAU,QAAQ,IAAI,KAAK;AAAA,IAC3B,gBAAgB,WAAW;AAAA,IAC3B,UAAU,CAAC,MAAqC;AAC9C,iBAAW,CAAC;AACZ,YAAM,OAAO,EAAE,OAAO;AACtB,UAAI,cAAc,OAAW,QAAO,IAAI;AACxC,sBAAgB,IAAI;AACpB,YAAM,cAAc,aAAa,MAAM,QAAQ,KAAK;AACpD,UAAI,gBAAgB,QAAS,mBAAkB,WAAW;AAAA,IAC5D;AAAA,EACF;AAEA,MAAI,aAAa;AACf;AAAA;AAAA,MAEE,qBAAC,SAAI,WAAW,GAAG,eAAe,SAAS,GACzC;AAAA,4BAAC,SAAM,SAAS,SAAU,iBAAM;AAAA,QAChC,oBAAC,SAAO,GAAG,YAAY,aAA0B;AAAA,SACnD;AAAA;AAAA,EAEJ;AACA,SAAO,oBAAC,SAAO,GAAG,YAAY,OAAc,WAAsB;AACpE;AAsRA,MAAM,aAAa;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG,CAAC,YAAY,WAAW,SAAS,YAAY,UAAU,UAAU,cAAc,SAAS,EAAE;AAAA,IAC3F,CAAC,SAAS,UAAU,IAAI;AAAA,EAC1B;AACF,EACG,IAAI,CAAC,aAAa,GAAG,QAAQ,gEAAgE,EAC7F,KAAK,IAAI;AAIZ,SAAS,eAAe,MAA8C;AACpE,MAAI,CAAC,KAAM,QAAO;AAClB,aAAW,MAAM,KAAK,iBAA8B,UAAU,GAAG;AAC/D,QAAI,GAAG,QAAQ,mBAAmB,EAAG;AACrC,QAAI,cAAc,oBAAoB,GAAG,SAAS,WAAW,CAAC,GAAG,WAAW,GAAG,MAAM;AACnF,YAAM,QAAQ,GAAG,MAAM,SAAS,UAAU,GAAG,IAAI;AACjD,YAAM,UACJ,iBAAiB,iBAAiB,MAAM,KAAK,KAAK,EAAE,KAAK,CAAC,MAAM,aAAa,oBAAoB,EAAE,OAAO;AAC5G,UAAI,QAAS;AAAA,IACf;AACA,WAAO;AAAA,EACT;AACA,SAAO;AACT;AA8BO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,MAAM;AAAA,EACN;AAAA,EACA,cAAc;AAAA,EACd;AAAA,EACA,OAAO;AAAA,EACP;AAAA,EACA,QAAQ;AAAA,EACR;AAAA,EACA,GAAG;AACL,GAAuB;AACrB,QAAM,SAAS,aAAa,iBAAiB,+BAA+B,UAAU;AACtF,QAAM,eAAe,gBAAgB,QAAQ,eAAe;AAC5D,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAClD,QAAM,QAAQ,aAAa;AAC3B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,EAAE;AAC3C,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAS,EAAE;AACrC,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AACtD,QAAM,EAAE,SAAS,IAAI,IAAI,kBAAkB;AAC3C,QAAM,OAAO,QAAQ,QAAQ,KAAK;AAGlC,QAAM,WAAW,MAAM;AACvB,QAAM,iBAAiB,MAAM;AAC7B,QAAM,WAAW,MAAM;AAGvB,QAAM,QAAQ,MAAM;AACpB,QAAM,WAAW,MAAM;AACvB,QAAM,YAAY,MAAM;AACxB,QAAM,gBAAgB,OAAyB,IAAI;AAEnD,QAAM,UAAU,OAAuB,IAAI;AAG3C,QAAM,YAAY,OAAO,KAAK;AAE9B,QAAM,YAAY,OAAO,KAAK;AAK9B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAC9C,MAAI,aAAa,OAAO;AACtB,gBAAY,KAAK;AACjB,QAAI,CAAC,OAAO;AACV,kBAAY,EAAE;AACd,eAAS,EAAE;AACX,sBAAgB,KAAK;AAAA,IACvB;AAAA,EACF;AAEA,QAAM,YAAY,OAAO,KAAK;AAC9B,YAAU,MAAM;AACd,UAAM,UAAU,UAAU,YAAY;AACtC,cAAU,UAAU;AACpB,UAAM,SAAS,UAAU;AACzB,cAAU,UAAU;AACpB,QAAI,CAAC,QAAS;AACd,QAAI,OAAO;AACT,UAAI,QAAQ;AAEV,SAAC,eAAe,QAAQ,OAAO,KAAK,cAAc,WAAW,SAAS,eAAe,QAAQ,IAAI,MAAM;AAAA,MACzG;AACA;AAAA,IACF;AACA,cAAU,UAAU;AAGpB,UAAM,OAAO,SAAS,kBAAkB,QAAQ,SAAS,kBAAkB,SAAS;AACpF,QAAI,UAAU,KAAM,UAAS,eAAe,KAAK,GAAG,MAAM;AAAA,EAC5D,GAAG,CAAC,OAAO,OAAO,QAAQ,CAAC;AAQ3B,QAAM,UAAU,OAAO,IAAI;AAC3B,YAAU,MAAM;AACd,UAAM,UAAU,QAAQ,WAAW,CAAC;AACpC,YAAQ,UAAU;AAClB,QAAI,CAAC,QAAS;AACd,UAAM,OAAO,UAAU;AACvB,cAAU,UAAU;AACpB,QAAI,CAAC,QAAQ,CAAC,MAAO;AACrB,QAAI,SAAS,kBAAkB,QAAQ,SAAS,kBAAkB,SAAS,MAAM;AAC/E,eAAS,eAAe,SAAS,GAAG,MAAM;AAAA,IAC5C;AAAA,EACF,GAAG,CAAC,MAAM,OAAO,SAAS,CAAC;AAE3B,QAAM,WAAW,CAAC,SAAkB;AAClC,cAAU,UAAU;AACpB,QAAI,cAAc,OAAW,eAAc,IAAI;AAC/C,oBAAgB,IAAI;AAAA,EACtB;AAEA,QAAM,SAAS,WAAW,YAAY;AAGtC,QAAM,mBACJ,uBAAuB,OAAO,OAAO,cAAc,WAAW,kBAAkB,IAAI,qBAAqB;AAC3G,QAAM,kBAAkB,qBAAqB;AAC7C,QAAM,aAAa,CAAC,mBAAmB,aAAa;AACpD,QAAM,WAAW,WAAW,UAAa,aAAa,OAAO,QAAQ,WAAW;AAChF,QAAM,gBAAgB,CAAC,mBAAmB;AAC1C,QAAM,aAAa,WAAW,qBAAqB;AAEnD,QAAM,YAAY,SAAS,QAAQ,QAAQ,EAAE,KAAK,UAAU;AAC5D,QAAM,aAAa,cAAc,YAAY,iBAAiB,CAAC,cAAc,CAAC;AAG9E,QAAM,cAAkC,CAAC,gBACrC,OAAO,mBACP,CAAC,WACC,OAAO,OAAO,gBAAgB,aAC5B,OAAO,YAAY,UAAU,EAAE,IAC/B,OAAO,cACT,CAAC,aACC,OAAO,gBACP;AAIR,QAAM,gBAA2B,SAC7B,eACA,OACE,SACA,aACE,wBACA;AAER,QAAM,SAAS,CAAC,MAAiB;AAC/B,MAAE,eAAe;AAGjB,QAAI,CAAC,cAAc,OAAQ;AAC3B,UAAM,SAA8B;AAAA,MAClC,GAAI,WAAW,UAAa,EAAE,OAAO,gBAAgB,UAAU,QAAQ,MAAM,KAAK,EAAE;AAAA,MACpF,GAAI,mBAAmB,EAAE,SAAS;AAAA,MAClC,GAAI,mBAAmB,EAAE,cAAc,KAAc;AAAA,IACvD;AACA,cAAU,UAAU;AAGpB,QAAI,UAAU,OAAO,UAAU,MAAM,GAAG,MAAM,SAAS,KAAK,CAAC;AAAA,EAC/D;AAIA,QAAM,aAAa,kBAAkB,gBAAgB,WAAW,SAAY,WAAW;AACvF,QAAM,SAAS,gBAAgB,CAAC,GAAG;AAAA,IAAI,CAAC,MAAM,UAC5C,OAAO,SAAS,WACZ,EAAE,KAAK,MAAM,MAAM,MAAmB,QAAQ,MAAM,IACpD,EAAE,KAAK,KAAK,OAAO,OAAO,KAAK,GAAG,MAAM,KAAK,MAAM,QAAQ,QAAQ,KAAK,MAAM,EAAE;AAAA,EACtF;AAEA,QAAM,WAAW,SAAS,YAAY,iBAAiB;AAEvD,MAAI,CAAC,OAAO;AACV,UAAM,MACJ;AAAA,MAAC;AAAA;AAAA,QACC,IAAI;AAAA,QACJ,MAAK;AAAA,QACL,SAAS,SAAS,YAAY,cAAc;AAAA,QAC5C;AAAA,QACA,iBAAe,UAAU;AAAA,QACzB,oBAAkB,SAAS,WAAW;AAAA,QACtC,SAAS,MAAM;AACb,cAAI,CAAC,OAAQ,UAAS,IAAI;AAAA,QAC5B;AAAA,QACA,WAAU;AAAA,QAET,sBAAY,OAAO;AAAA;AAAA,IACtB;AAEF,WACE,qBAAC,SAAK,GAAG,MAAM,WAAW,GAAG,aAAa,SAAS,GAChD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QASC,oBAAC,WAAQ,OAAO,cAAc,QAAM,MAClC,0CAAG,eAAI,GACT;AAAA,UAEA;AAAA,MAED,UACC,oBAAC,OAAE,IAAI,UAAU,WAAU,sBACxB,wBACH;AAAA,OAEJ;AAAA,EAEJ;AAEA,SACE,oBAAC,SAAK,GAAG,MAAM,WAAW,GAAG,aAAa,SAAS,GACjD;AAAA,IAAC;AAAA;AAAA,MACC,WAAU;AAAA,MACV,oBAAkB,MAAM,SAAS,IAAI,GAAG,QAAQ,IAAI,cAAc,KAAK;AAAA,MACvE,aAAW,QAAQ;AAAA,MACnB,UAAU;AAAA,MACV,YAAU;AAAA,MAEV;AAAA,4BAAC,OAAE,IAAI,UAAU,WAAW,GAAG,uBAAuB,QAAQ,GAC3D,oBAAU,OAAO,QACpB;AAAA,QACC,MAAM,SAAS,KACd,oBAAC,QAAG,IAAI,gBAAgB,WAAU,mDAC/B,gBAAM,IAAI,CAAC,SACV,oBAAC,QAAkB,WAAW,KAAK,SAAS,gBAAgB,QACzD,eAAK,QADC,KAAK,GAEd,CACD,GACH;AAAA,QAID,aACC,oBAAC,SAAI,KAAK,SAAS,WAAU,aAC1B,UACH;AAAA,QAED,mBACC;AAAA,UAAC;AAAA;AAAA,YACC,KAAK,eAAe,gBAAgB,gBAAgB;AAAA,YACpD,OAAO;AAAA,YACP,SAAS;AAAA,YAGT,iBAAiB,CAAC,SAAS;AACzB,kBAAI,CAAC,KAAM,iBAAgB,IAAI;AAAA,YACjC;AAAA;AAAA,QACF;AAAA,QAED,WAAW,UACV;AAAA,UAAC;AAAA;AAAA,YACC,KAAK,eAAe,WAAW,gBAAgB;AAAA,YAC/C,QAAQ;AAAA,YACR,OAAO;AAAA,YACP,OAAO;AAAA,YACP,eAAe;AAAA,YACf;AAAA,YAGA,QAAQ,EAAE,QAAQ,OAAO,QAAQ,mBAAmB,OAAO,kBAAkB;AAAA;AAAA,QAC/E;AAAA,QAED,mBACC;AAAA,UAAC;AAAA;AAAA,YACC,KAAK,eAAe,aAAa,gBAAgB;AAAA,YACjD,OAAO,OAAO;AAAA,YACd,OAAO;AAAA,YACP;AAAA,YACA,eAAe;AAAA;AAAA,QACjB;AAAA,QAEF,qBAAC,SAAI,WAAU,wBACb;AAAA,8BAAC,UAAO,IAAI,UAAU,MAAK,UAAS,SAAQ,SAAQ,UAAU,MAAM,SAAS,MAAM,SAAS,KAAK,GAC9F,iBAAO,QACV;AAAA,UACA;AAAA,YAAC;AAAA;AAAA,cACC,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,SAAS,mBAAmB,SAAS,YAAY,YAAY;AAAA,cAC7D,UAAU,CAAC;AAAA,cAMX,gBAAgB;AAAA,cAChB,aAAW,QAAQ;AAAA,cAElB;AAAA,wBAAQ,oBAAC,WAAQ,OAAO,MAAM,WAAU,WAAU;AAAA,gBAClD,gBAAgB,OAAO;AAAA;AAAA;AAAA,UAC1B;AAAA,WACF;AAAA,QACC,UAAU,oBAAC,OAAE,WAAU,sBAAsB,wBAAa;AAAA;AAAA;AAAA,EAC7D,GACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/components/danger-confirm.tsx"],"sourcesContent":["import { Children, useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { ChangeEvent, ComponentPropsWithRef, FormEvent, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { hasContent } from \"../lib/presence\";\nimport { useKitLabels, type LabelOverride } from \"../i18n/kit-labels\";\nimport { Button } from \"./button\";\nimport { Input } from \"./input\";\nimport { Label } from \"./field-base\";\nimport { Spinner } from \"./spinner\";\nimport type { ButtonVariant } from \"./button-look\";\nimport type { InputProps } from \"./input\";\nimport { Checkbox } from \"./checkbox\";\nimport { Tooltip } from \"./tooltip\";\nimport { useCommitReason, type CommitScope } from \"./write-lock\";\nimport { DEFAULT_DANGER_CONFIRM_LABELS } from \"./danger-confirm-labels\";\n\n/**\n * How typed text is compared with the text it has to repeat — shared by\n * `DangerConfirm`'s `phraseMatch` and `useConfirm`'s `typedMatch`.\n *\n * - `\"trim\"` ignores spaces around the typed text — a phone keyboard's autocomplete\n *   likes to add one. Case counts: \"delete\" is not \"DELETE\".\n * - `\"exact\"` compares character for character, spaces included.\n * - `\"caseless\"` trims AND ignores case: for an e-mail address, whose domain is\n *   case-insensitive and whose local part every real mail server treats so. Both apps'\n *   \"type the account's address\" rules (keksdose's `TYPE_EMAIL`, Kurvenschmiede's\n *   `TypedConfirm`) compared `trim().toLowerCase()`, and a capital the user's keyboard\n *   put at the start must not make the right row look like the wrong one.\n */\nexport type TypedMatch = \"trim\" | \"exact\" | \"caseless\";\n\n/** Whether `typed` repeats `target` under `mode` — see {@link TypedMatch}. Exported for\n *  a caller that draws its own field (a dialog that also picks a recipient) and wants\n *  the same rule as the kit's. */\nexport function typedMatches(typed: string, target: string, mode: TypedMatch = \"trim\"): boolean {\n  if (mode === \"exact\") return typed === target;\n  if (mode === \"trim\") return typed.trim() === target;\n  // `toLowerCase`, not `toLocaleLowerCase`: the comparison must not change with the\n  // reader's locale (a Turkish dotless i would otherwise fail an ASCII address).\n  return typed.trim().toLowerCase() === target.trim().toLowerCase();\n}\n\n/**\n * Busy-while-a-promise-runs, for an action that MAY return one: `run(result, onResolved)`\n * marks the caller pending until `result` settles, calls `onResolved` if it fulfilled,\n * and only clears the flag if it rejected — the caller shows why and the user retries.\n * Nothing runs after unmount. Shared by `DangerConfirm` and `ReauthDialog`, whose\n * contract is the same: resolve = done, reject = stay put.\n *\n * @internal\n */\nexport function usePromisePending() {\n  const [pending, setPending] = useState(false);\n  const mounted = useRef(true);\n  useEffect(() => {\n    mounted.current = true;\n    return () => {\n      mounted.current = false;\n    };\n  }, []);\n  const run = useCallback((result: unknown, onResolved: () => void): boolean => {\n    if (!result || typeof (result as Promise<unknown>).then !== \"function\") return false;\n    setPending(true);\n    (result as Promise<unknown>).then(\n      () => {\n        if (!mounted.current) return;\n        setPending(false);\n        onResolved();\n      },\n      () => {\n        if (mounted.current) setPending(false);\n      },\n    );\n    return true;\n  }, []);\n  return { pending, run };\n}\n\n\n/** The one word {@link CurrentPasswordInput} says on its own behalf — the\n *  `dangerConfirm.password` label, shared with DangerConfirm's password field, so an\n *  app translates \"Password\" once. */\nexport type CurrentPasswordInputLabels = Pick<DangerConfirmLabels, \"password\">;\n\n/**\n * Everything {@link Input} takes except what makes this field what it is: `type` is\n * always `\"password\"` and `autoComplete` always `\"current-password\"`.\n */\nexport interface CurrentPasswordInputProps extends Omit<InputProps, \"type\" | \"autoComplete\" | \"label\"> {\n  /**\n   * The visible label. Default `dangerConfirm.password` (\"Password\") — unless the field\n   * is named another way (`aria-label` / `aria-labelledby`), which then stays the only\n   * name. Pass the app's own word on a sign-in form (\"Password\", \"Your password\"), or\n   * `null` for a field whose `<label htmlFor>` is drawn elsewhere (a form library's\n   * label), which would otherwise be labelled twice.\n   */\n  label?: ReactNode;\n  /** The value as a string — the `(next) => …` shape, so a caller holding it in\n   *  `useState` need not unwrap `event.target.value`. Fires alongside `onChange`,\n   *  never instead of it, so a form library's `onChange` keeps working. */\n  onValueChange?: (value: string) => void;\n  /**\n   * A check is running (the sign-in request, the re-auth). The field turns `readOnly`,\n   * NOT `disabled`: the field being submitted is usually the focused one (Enter was\n   * pressed in it), and disabling a focused field drops focus to `<body>` — the user\n   * lands nowhere when the \"wrong password\" answer comes back.\n   */\n  busy?: boolean;\n  /** Per-instance override of `dangerConfirm.password`. */\n  labels?: LabelOverride<CurrentPasswordInputLabels>;\n}\n\n/**\n * The \"prove it is you\" field: a password input that a password manager fills with\n * the CURRENT password and never offers to generate a new one for.\n *\n * It is the field of a sign-in form, a re-auth step ({@link ReauthDialog} draws the same\n * field), and {@link DangerConfirm}'s `requirePassword`. Public since 0.22 for kastlan's\n * sign-in and re-auth (kastlan 1), which wrote `type=\"password\"` +\n * `autoComplete=\"current-password\"` by hand — and a sign-in field that forgets the\n * second half gets the browser's \"suggest a strong password\" offer on the one form where\n * a NEW password is never what is wanted. The reverse matters as much: a field that sets\n * a NEW password (a passphrase, a sign-up) must NOT be this one — keksdose #170 keeps\n * its passphrase doors on `new-password` / `off` for that reason.\n *\n * Everything else is {@link Input}: the reveal toggle, `error` (under the field,\n * `aria-describedby`, `aria-invalid`), `invalid`, `name`, `id`, `autoFocus`, `required`.\n * The ref is the `<input>`, so it works with `@eifi1/ui-kit/rhf`'s `RhfField` / a\n * `register()` spread, and controlled or uncontrolled.\n *\n * ```tsx\n * <CurrentPasswordInput name=\"password\" label={t(\"password\")} error={errors.password?.message}\n *   busy={isSubmitting} {...register(\"password\")} />\n * ```\n */\nexport function CurrentPasswordInput({\n  label,\n  onValueChange,\n  onChange,\n  busy,\n  readOnly,\n  labels: labelsProp,\n  ...rest\n}: CurrentPasswordInputProps) {\n  const labels = useKitLabels(\"dangerConfirm\", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);\n  const namedOtherwise = rest[\"aria-label\"] !== undefined || rest[\"aria-labelledby\"] !== undefined;\n  return (\n    <Input\n      // `ref` (the `<input>`) rides along: a React 19 ref prop since 0.34 (MOD-4, refactor\n      // audit 2026-10), where this was `forwardRef`.\n      {...rest}\n      // After the spread: a props object spread at the field must not turn it into a\n      // text field, or into one the password manager offers a new password for.\n      type=\"password\"\n      autoComplete=\"current-password\"\n      label={label === undefined ? (namedOtherwise ? undefined : labels.password) : hasContent(label) ? label : undefined}\n      readOnly={Boolean(busy) || readOnly}\n      onChange={(e) => {\n        onChange?.(e);\n        onValueChange?.(e.target.value);\n      }}\n    />\n  );\n}\n\n/** The words {@link TypedConfirmField} says on its own behalf — the `dangerConfirm`\n *  namespace's `phrase` and `phrasePlaceholder`, shared with DangerConfirm's own field,\n *  so the sentence \"Type “X” to confirm\" is translated once. */\nexport type TypedConfirmFieldLabels = Pick<DangerConfirmLabels, \"phrase\" | \"phrasePlaceholder\">;\n\nexport interface TypedConfirmFieldProps\n  extends Omit<InputProps, \"type\" | \"value\" | \"defaultValue\" | \"label\" | \"placeholder\"> {\n  /** The text to repeat — a word (\"DELETE\"), a name, an e-mail address. */\n  target: string;\n  /** How the typed text is compared with `target` — {@link TypedMatch}. Default\n   *  `\"trim\"`, as {@link typedMatches}; `\"caseless\"` for an address or an\n   *  acknowledgement word a user may type in any case. */\n  match?: TypedMatch;\n  /** Controlled value. Left out, the field keeps its own (start: `defaultValue`). */\n  value?: string;\n  defaultValue?: string;\n  /** The typed text as a string, on every keystroke. Fires alongside `onChange`. */\n  onValueChange?: (value: string) => void;\n  /**\n   * The typed text started or stopped matching `target` — fired from the keystroke\n   * that flipped it, so an uncontrolled field can still drive the button it guards. A\n   * controlled caller that resets the value itself (on a close) knows the answer\n   * already, and gets no call for that; it can also compute it with {@link typedMatches}.\n   */\n  onMatchedChange?: (matched: boolean) => void;\n  /** The label. Default `dangerConfirm.phrase(target)` — \"Type “DELETE” to confirm\". */\n  label?: ReactNode;\n  /** Text inside the empty field. Default `dangerConfirm.phrasePlaceholder` (unset).\n   *  Given, the label moves ABOVE the field: a floating label occupies the empty\n   *  field, which is exactly where a placeholder shows. `\"\"` means none. */\n  placeholder?: string;\n  /** The guarded action is running: the field turns `readOnly` (not `disabled`, which\n   *  would drop the focus Enter left in it). */\n  busy?: boolean;\n  labels?: LabelOverride<TypedConfirmFieldLabels>;\n}\n\n/**\n * The \"type this to confirm\" field — {@link DangerConfirm}'s `phrase` field and\n * `useConfirm({ requireTyped })`'s, on its own (keksdose K7).\n *\n * keksdose writes it by hand four times: the privacy enrol, upgrade and sweep dialogs\n * (type the acknowledgement word, then the key doors appear) and the admin's \"type the\n * user's address\" (`UserActionConfirm`), each an `Input` plus its own\n * `trim().toUpperCase()` / `toLowerCase()` comparison. None of those places is an\n * arm → confirm tile or a modal confirm — what is guarded is a whole form, or the\n * next step of a dialog — so the field had to stand alone. What it brings over a plain\n * `Input`: one match rule ({@link typedMatches}, which lower-cases locale-independently\n * on purpose), the label worded from the target in the app's language, and the\n * attributes a phone keyboard needs to leave the text alone (no autocomplete, no\n * auto-capital, no autocorrect, no spellcheck — a keyboard that \"corrects\" an e-mail\n * address makes the guard unpassable).\n *\n * The field reports whether it matches (`onMatchedChange`, and `data-matched` on the\n * `<input>` for styling); what the match unlocks is the caller's. The ref is the\n * `<input>`.\n *\n * ```tsx\n * const [ok, setOk] = useState(false);\n * <TypedConfirmField target={t(\"privacy.enroll_ack_word\")} match=\"caseless\" onMatchedChange={setOk} />\n * {ok && <KeyDoorsForm … />}\n * ```\n */\nexport function TypedConfirmField({\n  ref,\n  target,\n  match = \"trim\",\n  value: valueProp,\n  defaultValue = \"\",\n  onValueChange,\n  onMatchedChange,\n  onChange,\n  label: labelProp,\n  placeholder: placeholderProp,\n  busy,\n  readOnly,\n  labels: labelsProp,\n  id,\n  className,\n  ...rest\n}: TypedConfirmFieldProps) {\n  const labels = useKitLabels(\"dangerConfirm\", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);\n  const [own, setOwn] = useState(defaultValue);\n  const value = valueProp ?? own;\n  const matched = typedMatches(value, target, match);\n  const generated = useId();\n  const fieldId = id ?? generated;\n  const label =\n    labelProp !== undefined\n      ? labelProp\n      : typeof labels.phrase === \"function\"\n        ? labels.phrase(target)\n        : labels.phrase;\n  const fromLabels =\n    labels.phrasePlaceholder === undefined\n      ? undefined\n      : typeof labels.phrasePlaceholder === \"function\"\n        ? labels.phrasePlaceholder(target)\n        : labels.phrasePlaceholder;\n  const placeholder = placeholderProp ?? fromLabels;\n\n  const fieldProps = {\n    ...rest,\n    ref,\n    id: fieldId,\n    value,\n    autoComplete: \"off\",\n    autoCapitalize: \"off\",\n    autoCorrect: \"off\",\n    spellCheck: false,\n    readOnly: Boolean(busy) || readOnly,\n    \"data-matched\": matched || undefined,\n    onChange: (e: ChangeEvent<HTMLInputElement>) => {\n      onChange?.(e);\n      const next = e.target.value;\n      if (valueProp === undefined) setOwn(next);\n      onValueChange?.(next);\n      const nextMatched = typedMatches(next, target, match);\n      if (nextMatched !== matched) onMatchedChange?.(nextMatched);\n    },\n  };\n\n  if (placeholder) {\n    return (\n      // A static label above, so the placeholder has the empty field to itself.\n      <div className={cn(\"space-y-1.5\", className)}>\n        <Label htmlFor={fieldId}>{label}</Label>\n        <Input {...fieldProps} placeholder={placeholder} />\n      </div>\n    );\n  }\n  return <Input {...fieldProps} label={label} className={className} />;\n}\n\n/**\n * Every string the tile renders — the `dangerConfirm` namespace of\n * `<UiKitProvider labels>`, overridable per instance through `labels`. The arm and\n * confirm buttons are usually worded per action (\"Delete budget\"), which is what the\n * `armLabel` / `confirmLabel` props are for; these are the fallbacks.\n */\nexport interface DangerConfirmLabels {\n  /** The button that arms the tile. */\n  arm: string;\n  /** The button that runs the action once the guards are satisfied. */\n  confirm: string;\n  cancel: string;\n  /** The warning above the fields, when no `prompt` is given. */\n  prompt: string;\n  /** Label of the password field (`requirePassword`). */\n  password: string;\n  /** Label of the type-to-confirm field. A FUNCTION of the phrase by default, like\n   *  every message that carries a value: where the phrase sits in the sentence moves\n   *  with the language. A plain STRING is taken as the finished label — for an app\n   *  whose catalogue already words it (\"Type DELETE to confirm\") and would otherwise\n   *  wrap it as `() => label`. */\n  phrase: string | ((phrase: string) => string);\n  /** Placeholder of the type-to-confirm field — a string, or a function of the\n   *  phrase (`(p) => p` echoes it). Optional and unset by default: the field keeps its\n   *  floating label, as before. Given, the label moves ABOVE the field (a floating\n   *  label occupies the empty field, which is exactly where a placeholder shows) and\n   *  the placeholder fills the field. An empty string means none. */\n  phrasePlaceholder?: string | ((phrase: string) => string);\n  /** 0.22: the checkbox `requireAcknowledge={true}` shows — \"I have read what this does\n   *  and want to continue\" (keksdose's `admin.users.confirm_ack`). */\n  acknowledge: string;\n  /**\n   * 0.23: why the armed confirm is held while the typed phrase does not match yet — in\n   * the confirm's tooltip and its description (keksdose G4a). A FUNCTION of the phrase\n   * by default (\"Type “DELETE” to confirm\"), or a finished STRING, as `phrase`.\n   */\n  needsPhrase: string | ((phrase: string) => string);\n  /** 0.23: why the armed confirm is held while the `requireAcknowledge` box is unticked\n   *  — \"Tick the box to confirm\". */\n  needsAcknowledge: string;\n  /** 0.23: why the armed confirm is held while the `requirePassword` field is empty —\n   *  \"Enter your password to confirm\". */\n  needsPassword: string;\n}\n\n// Defined in ./danger-confirm-labels, which holds no component code (0.34, KS U8).\nexport { DEFAULT_DANGER_CONFIRM_LABELS };\n\n/**\n * What the guards were answered with — the second argument of\n * {@link DangerConfirmProps.onConfirm} (0.23, keksdose G4b). A key is there only when its\n * guard was asked for, so the object can go into a request body as it is.\n */\nexport interface DangerConfirmValues {\n  /**\n   * The text typed into the `phrase` field — as the match rule compared it: trimmed\n   * under `phraseMatch` `\"trim\"` and `\"caseless\"` (the spaces a phone keyboard adds are\n   * not part of it), exactly as typed under `\"exact\"`. The case is the user's, even\n   * under `\"caseless\"`: a server that re-checks applies its own rule to it. Absent\n   * without a `phrase`.\n   */\n  typed?: string;\n  /** The entered password — the same value as the first argument. Absent without\n   *  `requirePassword`. */\n  password?: string;\n  /** `true` when the `requireAcknowledge` box was shown — it was ticked, since the\n   *  confirm is held until it is. Absent without one. */\n  acknowledged?: true;\n}\n\n/**\n * One line of {@link DangerConfirmProps.consequences}: what the action will do. A plain\n * string, or this, for a key of its own and the `severe` mark.\n */\nexport interface DangerConsequence {\n  /** React key — keksdose keys its lines by what they say (\"api_tokens\", \"only_door\").\n   *  Default: the text when it is a string, else the position. */\n  key?: string;\n  text: ReactNode;\n  /** \"There is no way back\" — painted in the danger colour rather than the list's\n   *  muted one. keksdose reserves it for the one line that loses something for good. */\n  severe?: boolean;\n}\n\nexport interface DangerConfirmProps extends Omit<ComponentPropsWithRef<\"div\">, \"onChange\"> {\n  /**\n   * Runs the action, with the entered password when `requirePassword` is on.\n   *\n   * Return a promise and the tile manages itself: busy until it settles, disarmed\n   * (fields wiped) when it resolves, still armed when it rejects — so the user can\n   * correct a wrong password and retry. The rejection is not swallowed for you to\n   * miss: handle it (and show why) in the caller, as with any mutation.\n   *\n   * 0.23: the second argument is what every guard was answered with — the typed phrase,\n   * the password, the tick ({@link DangerConfirmValues}). keksdose G4b: its admin\n   * actions send the address the admin TYPED, and the server re-checks it against the\n   * account (`assert_confirmed`), so a client that put the wrong row's id in the request\n   * is refused rather than obeyed; the tile kept the text to itself.\n   *\n   *     onConfirm={(_password, { typed }) =>\n   *       reset.mutateAsync({ id, confirm: { acknowledged: true, confirm_email: typed ?? null } })}\n   *\n   * A second argument rather than one object in place of the password: every\n   * `(password) => …` and `() => …` handler, and a `mutation.mutate` passed as it is,\n   * keeps working unchanged, and a handler that needs one guard's answer names it.\n   */\n  onConfirm: (password: string | undefined, values: DangerConfirmValues) => void | Promise<unknown>;\n  /** Show a password field; confirm is held until it is filled. */\n  requirePassword?: boolean;\n  /**\n   * Show an \"I understand\" checkbox; confirm is held until it is ticked\n   * (keksdose K7). `true` words it with `labels.acknowledge`; any other node IS the\n   * checkbox's label (\"I understand Anna will be signed out everywhere\").\n   *\n   * The guard for an action whose risk is MIS-TARGETING less than carelessness:\n   * keksdose's admin password reset asks for a typed address when the account has an\n   * encrypted door to lose, and a tick otherwise (`UserActionConfirm`), and its plan\n   * editor asks for the tick alone (`UserPlanEditor`). Both were hand-built beside this\n   * tile because it had no tick. It combines with `phrase` and `requirePassword`: every\n   * guard given must be satisfied.\n   */\n  requireAcknowledge?: ReactNode;\n  /**\n   * What the action will do, said before it happens — a list under the prompt, shown\n   * once armed (keksdose K7, `UserActionConfirm`'s consequences). Strings, or\n   * {@link DangerConsequence}s for a `severe` line in the danger colour.\n   *\n   * Derive them from the row's own facts rather than reciting the worst case: an admin\n   * who reads the same paragraph on every row stops reading it (keksdose dev#488).\n   */\n  consequences?: readonly (string | DangerConsequence)[];\n  /** Show a \"type <phrase> to confirm\" field; confirm is held until the field matches\n   *  (case-sensitive; surrounding spaces ignored unless `phraseMatch=\"exact\"`). */\n  phrase?: string;\n  /**\n   * How the typed text is compared with `phrase`. `\"trim\"` (default) ignores spaces\n   * around it — a phone keyboard's autocomplete likes to add one. `\"exact\"` compares\n   * character for character, spaces included, for an app whose contract is \"type\n   * exactly this\". `\"caseless\"` (0.18) also ignores case — for a phrase that is an\n   * e-mail address (keksdose's \"type the user's address\" admin rule). See\n   * {@link TypedMatch}.\n   */\n  phraseMatch?: TypedMatch;\n  /** The warning above the fields. Defaults to `labels.prompt`. */\n  prompt?: ReactNode;\n  /** `\"danger\"` (default) for what cannot be undone; `\"warning\"` for what can, at a\n   *  cost (loading demo data over your own). Colours the prompt, and picks the arm\n   *  button's variant and — unless {@link DangerConfirmProps.confirmVariant} is\n   *  given — the confirm's. */\n  tone?: \"danger\" | \"warning\";\n  /**\n   * The confirm button's variant, apart from `tone` (0.24, keksdose). Default: what\n   * `tone` picks, as before — `\"danger\"` for `\"danger\"`, `\"primary\"` for `\"warning\"`.\n   *\n   * `tone` says how bad the outcome is; this says how loud the last press is, and the two\n   * need not agree. keksdose's `UserActionConfirm` (an admin resets somebody else's\n   * password) asks an AMBER question — what it guards against is mis-targeting, not data\n   * loss, so the danger colour stays its one `severe` consequence's — and ends in a RED\n   * Go, as its hand-built panel did before it moved onto this tile in 0.23; with only\n   * `tone`, the amber question made Go the neutral primary fill. `tone=\"warning\"\n   * confirmVariant=\"danger\"` is that panel again.\n   */\n  confirmVariant?: ButtonVariant;\n  /**\n   * Hold the armed confirm for a reason of the CALLER's own (0.24, keksdose) — the\n   * tile's counterpart of FormActions' `submitDisabledReason`. While it has content the\n   * confirm is held exactly as by the built-in guards: `aria-disabled` but focusable,\n   * the reason in the kit {@link Tooltip} and its description, a press — or Enter in a\n   * field — does nothing. Nothing else changes: the arm button stays usable, and no\n   * line is printed under the buttons.\n   *\n   * keksdose's `UserPlanEditor` (\"move this account onto another plan\") must not confirm\n   * the plan the account already holds — the request would only write FREE → FREE into\n   * the audit trail. With no guard of its own to give, it passed \"Pick a different plan\"\n   * as `lockedReason`, which is a LOCK: documented as \"the action is not available\",\n   * spelled out under the buttons as well as in the tooltip, and meant for a write the\n   * user cannot make land. A guard the user lifts by changing a field is this prop.\n   *\n   * Which reason the held confirm names: a write lock's first (`lockedReason`, `commit`\n   * — nothing in the tile lifts it), then this one, then the built-in guards in the\n   * order they are drawn (the tick, the phrase, the password). This one before the\n   * built-ins because it is usually about a field in\n   * {@link DangerConfirmProps.children}, which is drawn ABOVE them — the rule since 0.23\n   * is \"the first open guard in the order the user meets it\" — and because it is about\n   * WHAT is being confirmed (which plan), which has to be settled before acknowledging\n   * it means anything. It is also the order keksdose's plan editor had, its\n   * `lockedReason` winning over the tick.\n   */\n  confirmDisabledReason?: ReactNode;\n  /**\n   * Fields of the caller's own, drawn INSIDE the armed tile (0.24, keksdose): after the\n   * prompt and the consequences, before the tick, the typed phrase and the password —\n   * the order is \"what this does, what to do it with, then prove you mean it\". Nothing\n   * is drawn for them while the tile is disarmed, and nothing at all without them, so a\n   * tile without children is laid out exactly as before.\n   *\n   * keksdose's `UserPlanEditor` asks WHICH plan before it asks for the tick; with no\n   * place inside the tile for the picker, the `Select` sat above it, and the tile's\n   * prompt — the panel's title by rights — became the \"FREE → PRO\" line under the\n   * picker. With the picker here, the prompt is the title again.\n   *\n   * The fields are the caller's: their values are not wiped on disarm (an uncontrolled\n   * field starts over anyway — the slot unmounts), not passed to `onConfirm`, and a\n   * guard on them is {@link DangerConfirmProps.confirmDisabledReason}. Arming moves\n   * focus to their first form field (an input, a select, a combobox, a radio…), else to\n   * the tile's own first field as before; Tab then goes on through the tick, the phrase\n   * and the password to Cancel and the confirm. They sit inside the tile's `<form>`:\n   * Enter in a text field confirms once every guard allows, and a {@link Button} among\n   * them needs `type=\"button\"` — without one it SUBMITS the form, as a native button\n   * does.\n   */\n  children?: ReactNode;\n  /** Visible text of the arm button; defaults to `labels.arm`. */\n  armLabel?: ReactNode;\n  /** Visible text of the confirm button; defaults to `labels.confirm`. */\n  confirmLabel?: ReactNode;\n  /**\n   * The action is running: confirm shows a spinner and nothing can be pressed — Cancel\n   * included. For a caller that tracks the mutation itself (a `useMutation`'s\n   * `isPending`); a promise returned from `onConfirm` does the same on its own.\n   *\n   * Cancel stays disabled ON PURPOSE, unlike FormActions' (keksdose asked in 0.24 why the\n   * two differ). Once the request has left, nothing on the client can call it back —\n   * not even an `AbortSignal`, which only stops the waiting, not the server — so a usable\n   * Cancel could only collapse the tile while the action went on: \"Cancel\" pressed, and\n   * the account reset anyway. Every way of settling what comes back is wrong somewhere: a\n   * resolve after the Cancel did what the user called off; a reject finds the fields\n   * wiped (a collapsed tile holds no password), so the 0.23 \"stay armed and retry\" is\n   * gone; and re-arming while the first request runs is either a busy tile with empty\n   * fields or — if the busy state went with the Cancel — a second destructive request\n   * beside the first. FormActions' Cancel leaves an editor whose save is the user's own\n   * edit landing, and a form can be edited again; the tile's action is the one that\n   * cannot be undone, so it says nothing it cannot keep and waits — the wait is one\n   * request long.\n   *\n   * When the action settles still armed (it failed) and the press on the confirm had\n   * dropped the focus — a natively disabled button loses it — focus comes back to the\n   * confirm, so a keyboard user can retry or Shift+Tab to the field to correct (0.24).\n   */\n  busy?: boolean;\n  /** The arm button is disabled. */\n  disabled?: boolean;\n  /**\n   * Why the action is not available — a read-only demo, a write lock, a missing\n   * permission. Disables the arm button like `disabled`, and SAYS so: the sentence is\n   * shown under the button and attached to it with `aria-describedby`, and the button\n   * stays focusable (`aria-disabled`) so a keyboard user can land on it and hear why.\n   *\n   * On the ARM button rather than the confirm: arming asks for a password, and asking\n   * for a password for a write that can never land is the worse of the two. A tile that\n   * is ALREADY armed when the reason arrives (controlled `armed`, or a lock that landed\n   * while it was open) keeps its fields but its confirm takes the reason the same way\n   * — focusable, `aria-disabled`, the reason in its tooltip — and Enter does nothing.\n   */\n  lockedReason?: ReactNode;\n  /**\n   * This tile COMMITS — the 0.18 write-lock opt-in that {@link Button} has (keksdose\n   * K3). Under a locked {@link WriteLockProvider} the lock's reason becomes\n   * `lockedReason` (and wins over one of the tile's own), so a page that mounts the\n   * provider no longer threads `lockedReason={lock.locked ? lock.reason : undefined}`\n   * into every tile. No provider, or an unlocked one: no effect.\n   */\n  commit?: CommitScope;\n  /** Controlled armed state. The parent can then collapse the tile from a mutation's\n   *  own `onSuccess` without returning a promise. */\n  armed?: boolean;\n  /** Called with the next armed state — on arm, cancel, and a resolved `onConfirm`. */\n  onArmedChange?: (armed: boolean) => void;\n  /** User-facing strings; see {@link DangerConfirmLabels}. */\n  labels?: LabelOverride<DangerConfirmLabels>;\n}\n\n/** What counts as a FIELD among the caller's `children` — what arming focuses. Not\n *  any tabbable element: a \"see the plans\" link or a disclosure button before the\n *  picker is not where the user starts. `[tabindex=\"-1\"]` is a roving radio group's\n *  unselected option; the selected one (`0`) is the group's stop. */\nconst SLOT_FIELD = [\n  'input:not([type=\"hidden\"])',\n  \"select\",\n  \"textarea\",\n  ...[\"combobox\", \"listbox\", \"radio\", \"checkbox\", \"switch\", \"slider\", \"spinbutton\", \"textbox\"].map(\n    (role) => `[role=\"${role}\"]`,\n  ),\n]\n  .map((selector) => `${selector}:not(:disabled):not([tabindex=\"-1\"]):not([aria-hidden=\"true\"])`)\n  .join(\", \");\n\n/** The first field among the caller's `children`, skipping a native radio that is not\n *  the checked one of its group (Tab lands on the checked one). */\nfunction firstSlotField(slot: HTMLElement | null): HTMLElement | null {\n  if (!slot) return null;\n  for (const el of slot.querySelectorAll<HTMLElement>(SLOT_FIELD)) {\n    if (el.closest(\"[hidden], [inert]\")) continue;\n    if (el instanceof HTMLInputElement && el.type === \"radio\" && !el.checked && el.name) {\n      const group = el.form?.elements.namedItem(el.name);\n      const checked =\n        group instanceof RadioNodeList && Array.from(group).some((r) => r instanceof HTMLInputElement && r.checked);\n      if (checked) continue;\n    }\n    return el;\n  }\n  return null;\n}\n\n/**\n * An \"arm → confirm\" tile for destructive actions: one button, which expands into a\n * warning, an optional list of consequences, optional fields of the caller's own\n * (`children`, 0.24), an optional \"I understand\" tick, an optional type-to-confirm\n * field, an optional password field and a confirm that is held until every guard is\n * satisfied — the built-in ones, and the caller's `confirmDisabledReason` (0.24).\n *\n * A held confirm SAYS which guard is still open (0.23, keksdose G4a): it is\n * `aria-disabled` rather than `disabled` — still focusable, so a keyboard user can land\n * on it — with the reason in the kit {@link Tooltip} and its description (\"Type\n * “DELETE” to confirm\", \"Tick the box to confirm\", \"Enter your password to confirm\";\n * `labels.needs*`), the first open guard in the order they are drawn. FormActions'\n * `submitDisabledReason` does the same for a form's Save. Pressing it, or Enter in a\n * field, does nothing. A lock's reason wins over a guard's, the caller's guard over the\n * built-in ones; while the action runs the confirm is plainly disabled, its spinner\n * saying why — and so is Cancel, which cannot call back a request that has left (see\n * `busy`).\n *\n * Keksdose hand-rolled it three times (load demo data, wipe everything, reset a\n * budget) and then as `shared/components/danger-confirm.tsx`; the only app-specific\n * part was its write-lock hook, which is `lockedReason` here.\n *\n * The fields are a `<form>`, so Enter confirms once the guards allow it. They are\n * wiped every time the tile disarms — a password must not sit in a collapsed tile.\n * Arming moves focus to the first field (or Cancel, when there is none — never to the\n * destructive button itself), and disarming moves it back to the arm button, so the\n * keyboard user is never left on an element that just vanished.\n */\nexport function DangerConfirm({\n  onConfirm,\n  requirePassword,\n  requireAcknowledge,\n  consequences,\n  phrase,\n  phraseMatch = \"trim\",\n  prompt,\n  tone = \"danger\",\n  confirmVariant,\n  confirmDisabledReason,\n  children,\n  armLabel,\n  confirmLabel,\n  busy: busyProp,\n  disabled,\n  lockedReason: ownLockedReason,\n  commit,\n  armed: armedProp,\n  onArmedChange,\n  labels: labelsProp,\n  className,\n  ...rest\n}: DangerConfirmProps) {\n  const labels = useKitLabels(\"dangerConfirm\", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);\n  const lockedReason = useCommitReason(commit, ownLockedReason);\n  const [armedState, setArmedState] = useState(false);\n  const armed = armedProp ?? armedState;\n  const [password, setPassword] = useState(\"\");\n  const [typed, setTyped] = useState(\"\");\n  const [acknowledged, setAcknowledged] = useState(false);\n  const { pending, run } = usePromisePending();\n  const busy = Boolean(busyProp) || pending;\n  // `readOnly` rather than `disabled` on the fields while busy: disabling the field\n  // that has focus (Enter was pressed in it) drops focus to <body>.\n  const promptId = useId();\n  const consequencesId = useId();\n  const reasonId = useId();\n\n  // The buttons focus is moved to are found by id.\n  const armId = useId();\n  const cancelId = useId();\n  const confirmId = useId();\n  const firstFieldRef = useRef<HTMLInputElement>(null);\n  // The caller's fields (`children`), searched for their first form field on arm.\n  const slotRef = useRef<HTMLDivElement>(null);\n  // Focus moves only after a transition — never on mount, so a tile that renders armed\n  // (controlled) does not take the page's focus merely by existing.\n  const moveFocus = useRef(false);\n  // A confirm from this tile is under way — see the focus return after a failure below.\n  const confirmed = useRef(false);\n\n  // A disarm from anywhere (cancel, a resolved confirm, the parent) wipes the fields.\n  // During render, like NumberField's draft, so no frame shows a collapsed tile that\n  // still holds a password.\n  const [wasArmed, setWasArmed] = useState(armed);\n  if (wasArmed !== armed) {\n    setWasArmed(armed);\n    if (!armed) {\n      setPassword(\"\");\n      setTyped(\"\");\n      setAcknowledged(false);\n    }\n  }\n\n  const prevArmed = useRef(armed);\n  useEffect(() => {\n    const changed = prevArmed.current !== armed;\n    prevArmed.current = armed;\n    const byUser = moveFocus.current;\n    moveFocus.current = false;\n    if (!changed) return;\n    if (armed) {\n      if (byUser) {\n        // The caller's fields come first on the page, so first in focus too.\n        (firstSlotField(slotRef.current) ?? firstFieldRef.current ?? document.getElementById(cancelId))?.focus();\n      }\n      return;\n    }\n    confirmed.current = false;\n    // A controlled parent collapsing the tile from its own `onSuccess` did not go\n    // through `setArmed`; if focus went down with the form, bring it back too.\n    const lost = document.activeElement === null || document.activeElement === document.body;\n    if (byUser || lost) document.getElementById(armId)?.focus();\n  }, [armed, armId, cancelId]);\n\n  // The action settled and the tile is still armed — it failed, and the user retries.\n  // The confirm was natively disabled while it ran, and a focused button that turns\n  // disabled drops the focus to <body>: bring it back to the button that was pressed.\n  // Only after a confirm from THIS tile (`confirmed`), so a `busy` that comes and goes\n  // on its own never pulls the page's focus in. (A resolve disarms, and the effect\n  // above takes the focus to the arm button.)\n  const wasBusy = useRef(busy);\n  useEffect(() => {\n    const settled = wasBusy.current && !busy;\n    wasBusy.current = busy;\n    if (!settled) return;\n    const ours = confirmed.current;\n    confirmed.current = false;\n    if (!ours || !armed) return;\n    if (document.activeElement === null || document.activeElement === document.body) {\n      document.getElementById(confirmId)?.focus();\n    }\n  }, [busy, armed, confirmId]);\n\n  const setArmed = (next: boolean) => {\n    moveFocus.current = true;\n    if (armedProp === undefined) setArmedState(next);\n    onArmedChange?.(next);\n  };\n\n  const locked = hasContent(lockedReason);\n  // `true` words the tick with the namespace; any other node is its label; `false`,\n  // `null` and `\"\"` are no tick at all.\n  const acknowledgeLabel: ReactNode =\n    requireAcknowledge === true ? labels.acknowledge : hasContent(requireAcknowledge) ? requireAcknowledge : null;\n  const asksAcknowledge = acknowledgeLabel !== null;\n  const passwordOk = !requirePassword || password !== \"\";\n  const phraseOk = phrase === undefined || typedMatches(typed, phrase, phraseMatch);\n  const acknowledgeOk = !asksAcknowledge || acknowledged;\n  const callerHeld = hasContent(confirmDisabledReason);\n  // `{cond && <Select />}` and `[null, false]` are no fields: no wrapper, no gap.\n  const hasFields = Children.toArray(children).some(hasContent);\n  const canConfirm = passwordOk && phraseOk && acknowledgeOk && !callerHeld && !busy;\n  // The first guard still open, in the order the fields are drawn — the one the user\n  // meets next, so the sentence points at it.\n  const guardReason: string | undefined = !acknowledgeOk\n    ? labels.needsAcknowledge\n    : !phraseOk\n      ? typeof labels.needsPhrase === \"function\"\n        ? labels.needsPhrase(phrase ?? \"\")\n        : labels.needsPhrase\n      : !passwordOk\n        ? labels.needsPassword\n        : undefined;\n  // The lock first (no guard can lift it); none while busy, when the guards were met and\n  // the spinner is the state; then the caller's guard — about the fields drawn above the\n  // built-in ones, and about WHAT is confirmed — then the first built-in guard still open.\n  const confirmReason: ReactNode = locked\n    ? lockedReason\n    : busy\n      ? undefined\n      : callerHeld\n        ? confirmDisabledReason\n        : guardReason;\n\n  const submit = (e: FormEvent) => {\n    e.preventDefault();\n    // `locked` too: Enter in a field submits the form without the button's say (and\n    // `canConfirm` holds the caller's guard the same way).\n    if (!canConfirm || locked) return;\n    const values: DangerConfirmValues = {\n      ...(phrase !== undefined && { typed: phraseMatch === \"exact\" ? typed : typed.trim() }),\n      ...(requirePassword && { password }),\n      ...(asksAcknowledge && { acknowledged: true as const }),\n    };\n    confirmed.current = true;\n    // Disarms when it resolves; a rejection leaves it armed, fields kept: the caller\n    // shows why, the user retries.\n    run(onConfirm(values.password, values), () => setArmed(false));\n  };\n\n  // The first field takes focus on arm: the tick, then the phrase, then the password —\n  // the order they are drawn in.\n  const firstField = asksAcknowledge ? \"acknowledge\" : phrase !== undefined ? \"phrase\" : \"password\";\n  const lines = (consequences ?? []).map((item, index) =>\n    typeof item === \"string\"\n      ? { key: item, text: item as ReactNode, severe: false }\n      : { key: item.key ?? String(index), text: item.text, severe: Boolean(item.severe) },\n  );\n\n  const toneText = tone === \"warning\" ? \"text-warning\" : \"text-danger\";\n\n  if (!armed) {\n    const arm = (\n      <Button\n        id={armId}\n        type=\"button\"\n        variant={tone === \"warning\" ? \"secondary\" : \"danger\"}\n        disabled={disabled}\n        aria-disabled={locked || undefined}\n        aria-describedby={locked ? reasonId : undefined}\n        onClick={() => {\n          if (!locked) setArmed(true);\n        }}\n        className=\"aria-disabled:cursor-not-allowed aria-disabled:opacity-50\"\n      >\n        {armLabel ?? labels.arm}\n      </Button>\n    );\n    return (\n      <div {...rest} className={cn(\"space-y-1\", className)}>\n        {locked ? (\n          // The reason on the button itself too, where the pointer that tried it is —\n          // the line below can sit out of view in a long settings card. Portalled, so\n          // a card that scrolls neither clips it nor grows by it.\n          //\n          // The button in a FRAGMENT on purpose: Tooltip clones an element child to\n          // add the bubble to its `aria-describedby`, and the button is already\n          // described by the visible line below — the same sentence twice, read out\n          // on every focus. A fragment is left as it is, so the bubble stays visual.\n          <Tooltip label={lockedReason} portal>\n            <>{arm}</>\n          </Tooltip>\n        ) : (\n          arm\n        )}\n        {locked && (\n          <p id={reasonId} className=\"text-xs text-muted\">\n            {lockedReason}\n          </p>\n        )}\n      </div>\n    );\n  }\n\n  return (\n    <div {...rest} className={cn(\"space-y-2\", className)}>\n      <form\n        className=\"space-y-2\"\n        aria-describedby={lines.length > 0 ? `${promptId} ${consequencesId}` : promptId}\n        aria-busy={busy || undefined}\n        onSubmit={submit}\n        noValidate\n      >\n        <p id={promptId} className={cn(\"text-xs font-medium\", toneText)}>\n          {prompt ?? labels.prompt}\n        </p>\n        {lines.length > 0 && (\n          <ul id={consequencesId} className=\"list-disc space-y-1 ps-5 text-xs text-secondary\">\n            {lines.map((line) => (\n              <li key={line.key} className={line.severe ? \"text-danger\" : undefined}>\n                {line.text}\n              </li>\n            ))}\n          </ul>\n        )}\n        {/* The caller's fields: after what the action does, before the proof that it is\n            meant. No wrapper without them — a 0.23 tile's markup is unchanged. */}\n        {hasFields && (\n          <div ref={slotRef} className=\"space-y-2\">\n            {children}\n          </div>\n        )}\n        {asksAcknowledge && (\n          <Checkbox\n            ref={firstField === \"acknowledge\" ? firstFieldRef : undefined}\n            label={acknowledgeLabel}\n            checked={acknowledged}\n            // Not `disabled` while busy, for the same reason the fields are readOnly:\n            // the box may hold the focus. A change while busy is simply not taken.\n            onCheckedChange={(next) => {\n              if (!busy) setAcknowledged(next);\n            }}\n          />\n        )}\n        {phrase !== undefined && (\n          <TypedConfirmField\n            ref={firstField === \"phrase\" ? firstFieldRef : undefined}\n            target={phrase}\n            match={phraseMatch}\n            value={typed}\n            onValueChange={setTyped}\n            busy={busy}\n            // Already resolved through this tile's own `labels` prop; handed on so a\n            // per-instance phrase wording reaches the field.\n            labels={{ phrase: labels.phrase, phrasePlaceholder: labels.phrasePlaceholder }}\n          />\n        )}\n        {requirePassword && (\n          <CurrentPasswordInput\n            ref={firstField === \"password\" ? firstFieldRef : undefined}\n            label={labels.password}\n            value={password}\n            busy={busy}\n            onValueChange={setPassword}\n          />\n        )}\n        <div className=\"flex flex-wrap gap-2\">\n          <Button id={cancelId} type=\"button\" variant=\"ghost\" disabled={busy} onClick={() => setArmed(false)}>\n            {labels.cancel}\n          </Button>\n          <Button\n            id={confirmId}\n            type=\"submit\"\n            variant={confirmVariant ?? (tone === \"warning\" ? \"primary\" : \"danger\")}\n            disabled={!canConfirm}\n            // Held by a guard (the caller's or a built-in one), or armed and then locked\n            // (or rendered armed under a lock): the confirm says why the way Button\n            // does — focusable, `aria-disabled`, the reason in its tooltip and\n            // description, a press swallowed (the submit with it) — and the fields stay\n            // as typed. Only busy is the native `disabled`.\n            disabledReason={confirmReason}\n            aria-busy={busy || undefined}\n          >\n            {busy && <Spinner label={null} className=\"h-4 w-4\" />}\n            {confirmLabel ?? labels.confirm}\n          </Button>\n        </div>\n        {locked && <p className=\"text-xs text-muted\">{lockedReason}</p>}\n      </form>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/components/data-table-filter-popover.d.ts

@@ -1,6 +1,6 @@
 import type { FilterValue } from "./data-table-filters.js";
 import type { DataTableColumn } from "./data-table.js";
-import { type DataTableLabels } from "./data-table-labels.js";
+import type { DataTableLabels } from "./data-table-labels.js";
 interface FilterPopoverProps<T> {
     column: DataTableColumn<T>;
     state: FilterValue;

package/dist/components/data-table-filter-popover.js

@@ -9,7 +9,7 @@ import { FOCUS_RING } from "./focus-ring.js";
 import { MiniCalendar } from "./mini-calendar.js";
 import { dateRangePresets } from "../lib/dates.js";
 import { resolveFilter } from "./data-table-filters.js";
-import { resolveDataTableLabels } from "./data-table-labels.js";
+import { resolveDataTableLabels } from "./data-table-shared.js";
 import { useKitLabelOverrides, useKitLocale } from "../i18n/kit-labels.js";
 function FilterPopover({
   column,

package/dist/components/data-table-filter-popover.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-filter-popover.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { decimalMark, localizeMark, readTyped, showsTyped } from \"../lib/decimal-marks\";\nimport { FIELD_TOUCH_TEXT } from \"./field-base\";\nimport { FOCUS_RING } from \"./focus-ring\";\nimport { MiniCalendar } from \"./mini-calendar\";\nimport { dateRangePresets } from \"../lib/dates\";\nimport { resolveFilter } from \"./data-table-filters\";\nimport type { FilterValue } from \"./data-table-filters\";\nimport type { DataTableColumn } from \"./data-table\";\nimport { resolveDataTableLabels, type DataTableLabels } from \"./data-table-labels\";\nimport { useKitLabelOverrides, useKitLocale } from \"../i18n/kit-labels\";\n\ninterface FilterPopoverProps<T> {\n  column: DataTableColumn<T>;\n  state: FilterValue;\n  onChange: (next: FilterValue) => void;\n  onClear: () => void;\n  selectOptions: { value: string; label: string }[];\n  /** BCP-47 locale for the date picker / labels. Falls back to the provider's. */\n  locale?: string;\n  /** Already resolved by {@link DataTable}. Standalone (it is exported), omit it and\n   *  the `dataTable` namespace of `<UiKitProvider labels>` is used. */\n  labels?: DataTableLabels;\n  /**\n   * Focus the text filter's input on mount. True, because that is right for the one\n   * place this component normally lives: a Popover opened by an explicit press on\n   * \"Filter\", which exists in order to be typed into and which the user has just asked\n   * for. It was hard-coded, which made it right there and wrong everywhere else — a\n   * browser scrolls whatever takes focus into view, so embedding this control in an\n   * ordinary page (the showcase documents it on one) landed the reader 25,000px down a\n   * page they had not scrolled. An embedder that is not a popover passes `false`.\n   */\n  autoFocus?: boolean;\n}\n\n/**\n * The contents of a column's filter Popover. Renders the right control set for\n * the column's filter type — text search, select checklist, date range (presets\n * + {@link MiniCalendar} + from/to inputs), or numeric min/max with an abs\n * toggle — driving the shared {@link FilterValue} state.\n */\nexport function FilterPopover<T>({\n  column,\n  state,\n  onChange,\n  onClear,\n  selectOptions,\n  locale: localeProp,\n  labels: labelsProp,\n  autoFocus = true,\n}: FilterPopoverProps<T>) {\n  // Both hooks run before the early return below, unconditionally.\n  const overrides = useKitLabelOverrides(\"dataTable\");\n  const labels = labelsProp ?? resolveDataTableLabels(overrides);\n  // No `\"en\"` fallback any more: that pinned the calendar to English in a table that\n  // was never handed a locale, under a provider that had one.\n  const locale = useKitLocale(localeProp);\n  // What `autoFocus` did, done by hand: a callback ref runs in the same commit phase\n  // React's own autofocus does, once when the input mounts (it is stable across\n  // renders, so a re-render does not re-take focus).\n  const focusOnMount = useCallback(\n    (el: HTMLInputElement | null) => {\n      if (el && autoFocus) el.focus();\n    },\n    [autoFocus],\n  );\n  // The number bounds' marks, and what the typist wrote in each box — see the number\n  // section below (BUG-10).\n  const mark = decimalMark(locale);\n  const [typed, setTyped] = useState<{ min: string | null; max: string | null }>({ min: null, max: null });\n  const filter = resolveFilter(column);\n  if (!filter) return null;\n\n  // `focus:outline-none` with only a 1px border tint to replace it is the same finding\n  // the audit records against the numpad's keys: on a panel of four identical fields a\n  // border going from --border to --border-strong is not a location. The ring is, and it\n  // is the package's brand focus colour, as on every field (field-base.tsx).\n  const inputBase =\n    \"block w-full rounded border border-subtle bg-surface px-2 py-1.5 text-sm text-secondary placeholder:text-placeholder focus:border-strong focus:outline-none \" +\n    FOCUS_RING +\n    \" \" +\n    // §10.1: a filter field is a field — 16 px on touch, or iOS zooms on focus.\n    FIELD_TOUCH_TEXT;\n  const buttonBase =\n    \"rounded border border-subtle bg-surface px-2 py-1 text-xs text-secondary hover:bg-hover\";\n\n  const clearRow = (\n    <div className=\"flex justify-end pt-1\">\n      <button type=\"button\" onClick={onClear} className={cn(buttonBase, \"flex items-center gap-1\")}>\n        <X className=\"size-3\" /> {labels.clearFilter}\n      </button>\n    </div>\n  );\n\n  if (filter.type === \"text\") {\n    const v = state.type === \"text\" ? state : { type: \"text\" as const, q: \"\" };\n    return (\n      <div className=\"space-y-2\">\n        <input\n          type=\"text\"\n          // A prop now, defaulting to what the popover needs; see `autoFocus` on the\n          // props above. Focused by `focusOnMount` rather than the `autoFocus`\n          // attribute, because here taking focus is the default, not an opt-in.\n          ref={focusOnMount}\n          value={v.q}\n          onChange={(e) => onChange({ type: \"text\", q: e.target.value })}\n          placeholder={labels.filterPlaceholder}\n          className={inputBase}\n        />\n        {clearRow}\n      </div>\n    );\n  }\n\n  if (filter.type === \"select\") {\n    const v = state.type === \"select\" ? state : { type: \"select\" as const, values: [] };\n    const toggle = (val: string) => {\n      const set = new Set(v.values);\n      if (set.has(val)) set.delete(val);\n      else set.add(val);\n      onChange({ type: \"select\", values: Array.from(set) });\n    };\n    return (\n      <div className=\"space-y-2\">\n        <div className=\"flex items-center justify-between text-xs text-muted\">\n          <span>{labels.selectFilter}</span>\n          <div className=\"flex gap-1\">\n            <button\n              type=\"button\"\n              onClick={() => onChange({ type: \"select\", values: selectOptions.map((o) => o.value) })}\n              className={buttonBase}\n            >\n              {labels.selectAll}\n            </button>\n            <button\n              type=\"button\"\n              onClick={() => onChange({ type: \"select\", values: [] })}\n              className={buttonBase}\n            >\n              {labels.selectNone}\n            </button>\n          </div>\n        </div>\n        <ul className=\"max-h-56 overflow-y-auto rounded border border-subtle\">\n          {selectOptions.map((o) => {\n            const checked = v.values.includes(o.value);\n            return (\n              <li key={o.value}>\n                <label className=\"flex cursor-pointer items-center gap-2 px-2 py-1.5 text-sm hover:bg-hover\">\n                  <input\n                    type=\"checkbox\"\n                    checked={checked}\n                    onChange={() => toggle(o.value)}\n                    className=\"size-3.5\"\n                  />\n                  <span className=\"truncate\">{o.label}</span>\n                </label>\n              </li>\n            );\n          })}\n          {selectOptions.length === 0 && (\n            <li className=\"px-2 py-2 text-sm text-muted\">—</li>\n          )}\n        </ul>\n        {clearRow}\n      </div>\n    );\n  }\n\n  if (filter.type === \"date\") {\n    const v = state.type === \"date\" ? state : { type: \"date\" as const, from: \"\", to: \"\" };\n    const set = (from: string, to: string) => onChange({ type: \"date\", from, to });\n    const presets = dateRangePresets();\n    const isActivePreset = (p: { from: string; to: string }) => v.from === p.from && v.to === p.to;\n    // Side by side, the 7rem preset column leaves a phone's calendar and its two\n    // native date inputs ~180px, which clips \"mm/dd/yyyy\" mid-placeholder. Below `sm`\n    // the presets wrap as a row above the calendar, which then gets the panel's width.\n    return (\n      <div className=\"flex flex-col gap-3 sm:flex-row\">\n        <ul className=\"flex flex-wrap gap-0.5 text-xs sm:w-28 sm:shrink-0 sm:flex-col sm:flex-nowrap\">\n          {presets.map((p) => {\n            const active = isActivePreset(p);\n            return (\n              <li key={p.key}>\n                <button\n                  type=\"button\"\n                  onClick={() => set(p.from, p.to)}\n                  className={cn(\n                    \"block rounded px-2 py-1 text-start transition-colors sm:w-full\",\n                    active\n                      ? \"bg-brand-soft text-brand-muted\"\n                      : \"text-secondary hover:bg-hover\",\n                  )}\n                >\n                  {labels.presets[p.key] ?? p.key}\n                </button>\n              </li>\n            );\n          })}\n        </ul>\n        <div className=\"min-w-0 flex-1 space-y-2\">\n          {/* No `labels` here: the calendar reads `miniCalendar` from the provider\n              itself, which is the only way a calendar nested this deep was ever going\n              to be translated — the table has no prop to forward them through. */}\n          <MiniCalendar from={v.from} to={v.to} locale={locale} onSelect={set} />\n          <div className=\"grid grid-cols-2 gap-2\">\n            <label className=\"text-xs text-muted\">\n              {labels.dateFrom}\n              <input\n                type=\"date\"\n                value={v.from}\n                onChange={(e) => set(e.target.value, v.to)}\n                className={cn(\"mt-0.5\", inputBase)}\n              />\n            </label>\n            <label className=\"text-xs text-muted\">\n              {labels.dateTo}\n              <input\n                type=\"date\"\n                value={v.to}\n                onChange={(e) => set(v.from, e.target.value)}\n                className={cn(\"mt-0.5\", inputBase)}\n              />\n            </label>\n          </div>\n          {clearRow}\n        </div>\n      </div>\n    );\n  }\n\n  // number\n  const v = state.type === \"number\" ? state : { type: \"number\" as const, min: \"\", max: \"\", abs: false };\n  // The bounds were native `type=\"number\"` inputs, the one numeric entry in the kit that\n  // bypassed decimal-marks (BUG-10, refactor audit 2026-10): where the browser refuses a\n  // comma, a German \"12,50\" read as empty and the filter silently stayed off while the box\n  // showed the text. A text box with the decimal keyboard now, read as NumberInput reads\n  // (`readTyped`): the state holds the dot-decimal figure, and the box keeps the typist's\n  // own text while it says the same (`showsTyped`), else the bound in the locale's mark.\n  const shown = (bound: \"min\" | \"max\") => {\n    const own = typed[bound];\n    return own !== null && showsTyped(own, mark, v[bound]) ? own : localizeMark(v[bound], mark);\n  };\n  const setBound = (bound: \"min\" | \"max\", raw: string) => {\n    setTyped((t) => ({ ...t, [bound]: raw }));\n    const read = readTyped(raw, mark);\n    onChange({\n      type: \"number\",\n      min: bound === \"min\" ? read : v.min,\n      max: bound === \"max\" ? read : v.max,\n      abs: v.abs,\n    });\n  };\n  return (\n    <div className=\"space-y-2\">\n      <div className=\"grid grid-cols-2 gap-2\">\n        <label className=\"text-xs text-muted\">\n          {labels.numberMin} (≥)\n          <input\n            type=\"text\"\n            inputMode=\"decimal\"\n            autoComplete=\"off\"\n            value={shown(\"min\")}\n            onChange={(e) => setBound(\"min\", e.target.value)}\n            className={cn(\"mt-0.5\", inputBase)}\n          />\n        </label>\n        <label className=\"text-xs text-muted\">\n          {labels.numberMax} (≤)\n          <input\n            type=\"text\"\n            inputMode=\"decimal\"\n            autoComplete=\"off\"\n            value={shown(\"max\")}\n            onChange={(e) => setBound(\"max\", e.target.value)}\n            className={cn(\"mt-0.5\", inputBase)}\n          />\n        </label>\n      </div>\n      <label className=\"flex items-center gap-2 text-sm text-secondary\">\n        <input\n          type=\"checkbox\"\n          checked={v.abs}\n          onChange={(e) => onChange({ type: \"number\", min: v.min, max: v.max, abs: e.target.checked })}\n          className=\"size-3.5\"\n        />\n        {labels.numberAbs}\n      </label>\n      {clearRow}\n    </div>\n  );\n}\n"],"mappings":"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","names":["v"]}
+{"version":3,"sources":["../../src/components/data-table-filter-popover.tsx"],"sourcesContent":["import { useCallback, useState } from \"react\";\nimport { X } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { decimalMark, localizeMark, readTyped, showsTyped } from \"../lib/decimal-marks\";\nimport { FIELD_TOUCH_TEXT } from \"./field-base\";\nimport { FOCUS_RING } from \"./focus-ring\";\nimport { MiniCalendar } from \"./mini-calendar\";\nimport { dateRangePresets } from \"../lib/dates\";\nimport { resolveFilter } from \"./data-table-filters\";\nimport type { FilterValue } from \"./data-table-filters\";\nimport type { DataTableColumn } from \"./data-table\";\nimport type { DataTableLabels } from \"./data-table-labels\";\nimport { resolveDataTableLabels } from \"./data-table-shared\";\nimport { useKitLabelOverrides, useKitLocale } from \"../i18n/kit-labels\";\n\ninterface FilterPopoverProps<T> {\n  column: DataTableColumn<T>;\n  state: FilterValue;\n  onChange: (next: FilterValue) => void;\n  onClear: () => void;\n  selectOptions: { value: string; label: string }[];\n  /** BCP-47 locale for the date picker / labels. Falls back to the provider's. */\n  locale?: string;\n  /** Already resolved by {@link DataTable}. Standalone (it is exported), omit it and\n   *  the `dataTable` namespace of `<UiKitProvider labels>` is used. */\n  labels?: DataTableLabels;\n  /**\n   * Focus the text filter's input on mount. True, because that is right for the one\n   * place this component normally lives: a Popover opened by an explicit press on\n   * \"Filter\", which exists in order to be typed into and which the user has just asked\n   * for. It was hard-coded, which made it right there and wrong everywhere else — a\n   * browser scrolls whatever takes focus into view, so embedding this control in an\n   * ordinary page (the showcase documents it on one) landed the reader 25,000px down a\n   * page they had not scrolled. An embedder that is not a popover passes `false`.\n   */\n  autoFocus?: boolean;\n}\n\n/**\n * The contents of a column's filter Popover. Renders the right control set for\n * the column's filter type — text search, select checklist, date range (presets\n * + {@link MiniCalendar} + from/to inputs), or numeric min/max with an abs\n * toggle — driving the shared {@link FilterValue} state.\n */\nexport function FilterPopover<T>({\n  column,\n  state,\n  onChange,\n  onClear,\n  selectOptions,\n  locale: localeProp,\n  labels: labelsProp,\n  autoFocus = true,\n}: FilterPopoverProps<T>) {\n  // Both hooks run before the early return below, unconditionally.\n  const overrides = useKitLabelOverrides(\"dataTable\");\n  const labels = labelsProp ?? resolveDataTableLabels(overrides);\n  // No `\"en\"` fallback any more: that pinned the calendar to English in a table that\n  // was never handed a locale, under a provider that had one.\n  const locale = useKitLocale(localeProp);\n  // What `autoFocus` did, done by hand: a callback ref runs in the same commit phase\n  // React's own autofocus does, once when the input mounts (it is stable across\n  // renders, so a re-render does not re-take focus).\n  const focusOnMount = useCallback(\n    (el: HTMLInputElement | null) => {\n      if (el && autoFocus) el.focus();\n    },\n    [autoFocus],\n  );\n  // The number bounds' marks, and what the typist wrote in each box — see the number\n  // section below (BUG-10).\n  const mark = decimalMark(locale);\n  const [typed, setTyped] = useState<{ min: string | null; max: string | null }>({ min: null, max: null });\n  const filter = resolveFilter(column);\n  if (!filter) return null;\n\n  // `focus:outline-none` with only a 1px border tint to replace it is the same finding\n  // the audit records against the numpad's keys: on a panel of four identical fields a\n  // border going from --border to --border-strong is not a location. The ring is, and it\n  // is the package's brand focus colour, as on every field (field-base.tsx).\n  const inputBase =\n    \"block w-full rounded border border-subtle bg-surface px-2 py-1.5 text-sm text-secondary placeholder:text-placeholder focus:border-strong focus:outline-none \" +\n    FOCUS_RING +\n    \" \" +\n    // §10.1: a filter field is a field — 16 px on touch, or iOS zooms on focus.\n    FIELD_TOUCH_TEXT;\n  const buttonBase =\n    \"rounded border border-subtle bg-surface px-2 py-1 text-xs text-secondary hover:bg-hover\";\n\n  const clearRow = (\n    <div className=\"flex justify-end pt-1\">\n      <button type=\"button\" onClick={onClear} className={cn(buttonBase, \"flex items-center gap-1\")}>\n        <X className=\"size-3\" /> {labels.clearFilter}\n      </button>\n    </div>\n  );\n\n  if (filter.type === \"text\") {\n    const v = state.type === \"text\" ? state : { type: \"text\" as const, q: \"\" };\n    return (\n      <div className=\"space-y-2\">\n        <input\n          type=\"text\"\n          // A prop now, defaulting to what the popover needs; see `autoFocus` on the\n          // props above. Focused by `focusOnMount` rather than the `autoFocus`\n          // attribute, because here taking focus is the default, not an opt-in.\n          ref={focusOnMount}\n          value={v.q}\n          onChange={(e) => onChange({ type: \"text\", q: e.target.value })}\n          placeholder={labels.filterPlaceholder}\n          className={inputBase}\n        />\n        {clearRow}\n      </div>\n    );\n  }\n\n  if (filter.type === \"select\") {\n    const v = state.type === \"select\" ? state : { type: \"select\" as const, values: [] };\n    const toggle = (val: string) => {\n      const set = new Set(v.values);\n      if (set.has(val)) set.delete(val);\n      else set.add(val);\n      onChange({ type: \"select\", values: Array.from(set) });\n    };\n    return (\n      <div className=\"space-y-2\">\n        <div className=\"flex items-center justify-between text-xs text-muted\">\n          <span>{labels.selectFilter}</span>\n          <div className=\"flex gap-1\">\n            <button\n              type=\"button\"\n              onClick={() => onChange({ type: \"select\", values: selectOptions.map((o) => o.value) })}\n              className={buttonBase}\n            >\n              {labels.selectAll}\n            </button>\n            <button\n              type=\"button\"\n              onClick={() => onChange({ type: \"select\", values: [] })}\n              className={buttonBase}\n            >\n              {labels.selectNone}\n            </button>\n          </div>\n        </div>\n        <ul className=\"max-h-56 overflow-y-auto rounded border border-subtle\">\n          {selectOptions.map((o) => {\n            const checked = v.values.includes(o.value);\n            return (\n              <li key={o.value}>\n                <label className=\"flex cursor-pointer items-center gap-2 px-2 py-1.5 text-sm hover:bg-hover\">\n                  <input\n                    type=\"checkbox\"\n                    checked={checked}\n                    onChange={() => toggle(o.value)}\n                    className=\"size-3.5\"\n                  />\n                  <span className=\"truncate\">{o.label}</span>\n                </label>\n              </li>\n            );\n          })}\n          {selectOptions.length === 0 && (\n            <li className=\"px-2 py-2 text-sm text-muted\">—</li>\n          )}\n        </ul>\n        {clearRow}\n      </div>\n    );\n  }\n\n  if (filter.type === \"date\") {\n    const v = state.type === \"date\" ? state : { type: \"date\" as const, from: \"\", to: \"\" };\n    const set = (from: string, to: string) => onChange({ type: \"date\", from, to });\n    const presets = dateRangePresets();\n    const isActivePreset = (p: { from: string; to: string }) => v.from === p.from && v.to === p.to;\n    // Side by side, the 7rem preset column leaves a phone's calendar and its two\n    // native date inputs ~180px, which clips \"mm/dd/yyyy\" mid-placeholder. Below `sm`\n    // the presets wrap as a row above the calendar, which then gets the panel's width.\n    return (\n      <div className=\"flex flex-col gap-3 sm:flex-row\">\n        <ul className=\"flex flex-wrap gap-0.5 text-xs sm:w-28 sm:shrink-0 sm:flex-col sm:flex-nowrap\">\n          {presets.map((p) => {\n            const active = isActivePreset(p);\n            return (\n              <li key={p.key}>\n                <button\n                  type=\"button\"\n                  onClick={() => set(p.from, p.to)}\n                  className={cn(\n                    \"block rounded px-2 py-1 text-start transition-colors sm:w-full\",\n                    active\n                      ? \"bg-brand-soft text-brand-muted\"\n                      : \"text-secondary hover:bg-hover\",\n                  )}\n                >\n                  {labels.presets[p.key] ?? p.key}\n                </button>\n              </li>\n            );\n          })}\n        </ul>\n        <div className=\"min-w-0 flex-1 space-y-2\">\n          {/* No `labels` here: the calendar reads `miniCalendar` from the provider\n              itself, which is the only way a calendar nested this deep was ever going\n              to be translated — the table has no prop to forward them through. */}\n          <MiniCalendar from={v.from} to={v.to} locale={locale} onSelect={set} />\n          <div className=\"grid grid-cols-2 gap-2\">\n            <label className=\"text-xs text-muted\">\n              {labels.dateFrom}\n              <input\n                type=\"date\"\n                value={v.from}\n                onChange={(e) => set(e.target.value, v.to)}\n                className={cn(\"mt-0.5\", inputBase)}\n              />\n            </label>\n            <label className=\"text-xs text-muted\">\n              {labels.dateTo}\n              <input\n                type=\"date\"\n                value={v.to}\n                onChange={(e) => set(v.from, e.target.value)}\n                className={cn(\"mt-0.5\", inputBase)}\n              />\n            </label>\n          </div>\n          {clearRow}\n        </div>\n      </div>\n    );\n  }\n\n  // number\n  const v = state.type === \"number\" ? state : { type: \"number\" as const, min: \"\", max: \"\", abs: false };\n  // The bounds were native `type=\"number\"` inputs, the one numeric entry in the kit that\n  // bypassed decimal-marks (BUG-10, refactor audit 2026-10): where the browser refuses a\n  // comma, a German \"12,50\" read as empty and the filter silently stayed off while the box\n  // showed the text. A text box with the decimal keyboard now, read as NumberInput reads\n  // (`readTyped`): the state holds the dot-decimal figure, and the box keeps the typist's\n  // own text while it says the same (`showsTyped`), else the bound in the locale's mark.\n  const shown = (bound: \"min\" | \"max\") => {\n    const own = typed[bound];\n    return own !== null && showsTyped(own, mark, v[bound]) ? own : localizeMark(v[bound], mark);\n  };\n  const setBound = (bound: \"min\" | \"max\", raw: string) => {\n    setTyped((t) => ({ ...t, [bound]: raw }));\n    const read = readTyped(raw, mark);\n    onChange({\n      type: \"number\",\n      min: bound === \"min\" ? read : v.min,\n      max: bound === \"max\" ? read : v.max,\n      abs: v.abs,\n    });\n  };\n  return (\n    <div className=\"space-y-2\">\n      <div className=\"grid grid-cols-2 gap-2\">\n        <label className=\"text-xs text-muted\">\n          {labels.numberMin} (≥)\n          <input\n            type=\"text\"\n            inputMode=\"decimal\"\n            autoComplete=\"off\"\n            value={shown(\"min\")}\n            onChange={(e) => setBound(\"min\", e.target.value)}\n            className={cn(\"mt-0.5\", inputBase)}\n          />\n        </label>\n        <label className=\"text-xs text-muted\">\n          {labels.numberMax} (≤)\n          <input\n            type=\"text\"\n            inputMode=\"decimal\"\n            autoComplete=\"off\"\n            value={shown(\"max\")}\n            onChange={(e) => setBound(\"max\", e.target.value)}\n            className={cn(\"mt-0.5\", inputBase)}\n          />\n        </label>\n      </div>\n      <label className=\"flex items-center gap-2 text-sm text-secondary\">\n        <input\n          type=\"checkbox\"\n          checked={v.abs}\n          onChange={(e) => onChange({ type: \"number\", min: v.min, max: v.max, abs: e.target.checked })}\n          className=\"size-3.5\"\n        />\n        {labels.numberAbs}\n      </label>\n      {clearRow}\n    </div>\n  );\n}\n"],"mappings":"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","names":["v"]}

package/dist/components/data-table-labels.d.ts

@@ -1,5 +1,4 @@
 import type { DataTableSortLabels } from "./data-table.js";
-import type { LabelOverride } from "../i18n/kit-labels.js";
 /** The phone sort control's four keys (`sortBy`, `sortDefault`, `sortAscending`,
  *  `sortDescending`, 0.22.0) are {@link DataTableSortLabels}', declared beside the
  *  control and part of this namespace like every other key. */
@@ -64,7 +63,7 @@ export interface DataTableLabels extends DataTableSortLabels {
      * A column's filter button and panel: "Filter Amount", and "Filter Amount (active)"
      * while the column is filtered (round 0.34 Wave 2, BUG-7c). Every column's used to be
      * "Filter" alike, and "filtered" was a colour. An app that translated only `filter`
-     * gets `"<filter>: <column>"` from it — see {@link resolveDataTableLabels}.
+     * gets `"<filter>: <column>"` from it: DataTable derives the one from the other.
      */
     filterColumn: (column: string, active: boolean) => string;
     /** The body of a table with no rows and no `empty` prop of its own. A sentence, not
@@ -82,43 +81,3 @@ export interface DataTableLabels extends DataTableSortLabels {
     booleanUnset: string;
 }
 export declare const DEFAULT_DATA_TABLE_LABELS: DataTableLabels;
-/**
- * Merge caller overrides onto the English defaults (presets merged too, key by key, as
- * the provider merges them — so the parameter is a {@link LabelOverride}).
- *
- * The parameter is lenient on purpose — a table with no labels at all still
- * renders — but that is also how a translated app ends up half English and never
- * hears about it: lenkbank ships nineteen of these keys in English in a German UI
- * today, because every one of them is backfilled silently. The kit will not start
- * throwing over it (three apps depend on the lenient merge), so
- * {@link missingDataTableLabels} is the other half: it answers which keys fell back,
- * and an app asserts on that in its OWN test, where the answer is actionable.
- *
- * @deprecated 0.34 — pass `labels` to DataTable, or the provider's `dataTable`, which this
- * merge serves; removed in 0.35 from the public surface, where DataTable keeps it as its
- * own (refactor audit 2026-10, API-6a). One app test calls it.
- */
-export declare function resolveDataTableLabels(partial?: LabelOverride<DataTableLabels>): DataTableLabels;
-/**
- * The label keys `labels` does not supply, and which therefore come back English
- * from {@link resolveDataTableLabels}.
- *
- * For a consumer's own test:
- *
- * ```ts
- * expect(missingDataTableLabels(de.dataTable)).toEqual([]);
- * ```
- *
- * which fails the day the kit adds a key — which is the point. Adding a label is
- * additive here and a silent regression in a translated app, and nothing else in
- * either repository can tell the two apart.
- *
- * Preset labels are reported one at a time (`presets.yesterday`), because `presets`
- * is a `Record` merged key by key: answering `"presets"` would say nothing about
- * which of the eleven are still English.
- *
- * @deprecated 0.34 — `missingKitLabels(labels, DEFAULT_UI_KIT_LABELS)`, which checks every
- * namespace, the table's among them, and which all three apps' tests already call;
- * removed in 0.35 (refactor audit 2026-10, API-6a).
- */
-export declare function missingDataTableLabels(labels?: Partial<DataTableLabels>): string[];

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

@@ -60,42 +60,13 @@ const DEFAULT_DATA_TABLE_LABELS = {
   // The phone sort control (0.22.0). The same words as `DEFAULT_DATA_TABLE_SORT_LABELS`
   // in data-table.tsx, written out rather than spread in: importing that VALUE here
   // would make data-table.tsx and this module import each other (data-table.tsx reads
-  // its resolver from here), and would pull the whole table into `i18n/defaults`.
+  // these defaults from here), and would pull the whole table into `i18n/defaults`.
   sortBy: "Sort by",
   sortDefault: "Default order",
   sortAscending: "Ascending",
   sortDescending: "Descending"
 };
-function resolveDataTableLabels(partial) {
-  if (!partial) return DEFAULT_DATA_TABLE_LABELS;
-  const presets = { ...DEFAULT_DATA_TABLE_LABELS.presets };
-  for (const [key, text] of Object.entries(partial.presets ?? {})) if (text !== void 0) presets[key] = text;
-  const merged = { ...DEFAULT_DATA_TABLE_LABELS, ...partial, presets };
-  if (partial.columns !== void 0 && partial.columnsCount === void 0) {
-    merged.columnsCount = (visible, total) => `${merged.columns} (${visible}/${total})`;
-  }
-  if (partial.filter !== void 0 && partial.filterColumn === void 0) {
-    merged.filterColumn = (column) => `${merged.filter}: ${column}`;
-  }
-  return merged;
-}
-function missingDataTableLabels(labels) {
-  const missing = [];
-  for (const key of Object.keys(DEFAULT_DATA_TABLE_LABELS)) {
-    if (key === "presets") continue;
-    if (labels?.[key] !== void 0) continue;
-    if (key === "columnsCount" && labels?.columns !== void 0) continue;
-    if (key === "filterColumn" && labels?.filter !== void 0) continue;
-    missing.push(key);
-  }
-  for (const preset of Object.keys(DEFAULT_DATA_TABLE_LABELS.presets)) {
-    if (labels?.presets?.[preset] === void 0) missing.push(`presets.${preset}`);
-  }
-  return missing;
-}
 export {
-  DEFAULT_DATA_TABLE_LABELS,
-  missingDataTableLabels,
-  resolveDataTableLabels
+  DEFAULT_DATA_TABLE_LABELS
 };
 //# sourceMappingURL=data-table-labels.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-labels.ts"],"sourcesContent":["// All user-facing strings for the DataTable system — the `dataTable` namespace of\n// `<UiKitProvider labels>`, and per table the `labels` prop over that. The kit's seven\n// catalogues carry the translations; the English defaults below make the table usable\n// with no wiring.\n\n// A type-only import: erased at build time, so this module stays free of the table\n// itself (and of react-router), which `i18n/defaults` relies on.\nimport type { DataTableSortLabels } from \"./data-table\";\nimport type { LabelOverride } from \"../i18n/kit-labels\";\n\n/** The phone sort control's four keys (`sortBy`, `sortDefault`, `sortAscending`,\n *  `sortDescending`, 0.22.0) are {@link DataTableSortLabels}', declared beside the\n *  control and part of this namespace like every other key. */\nexport interface DataTableLabels extends DataTableSortLabels {\n  // Table chrome\n  columns: string;\n  selectAllRows: string;\n  sortHint: string;\n  filter: string;\n  close: string;\n  selectRow: string;\n  /**\n   * The name of an opening row's disclosure button on desktop — visually hidden, in the\n   * row's first cell, carrying `aria-expanded` and `aria-controls` (round 0.34, the\n   * showcase's axe check: ARIA allows `aria-expanded` on a row only in a treegrid, and\n   * the `<tr>` wore it). The same words whether the row is open or shut: the state is\n   * the button's to say.\n   */\n  rowDetails: string;\n  autoSize: string;\n  loading: string;\n  filters: string;\n  clearAll: string;\n  done: string;\n  // Pagination\n  pageSize: string;\n  pageSizeAll: string;\n  prevPage: string;\n  nextPage: string;\n  // Filter popover\n  clearFilter: string;\n  filterPlaceholder: string;\n  selectFilter: string;\n  selectAll: string;\n  selectNone: string;\n  dateFrom: string;\n  dateTo: string;\n  numberMin: string;\n  numberMax: string;\n  numberAbs: string;\n  // Date-range preset labels, keyed by preset key (see dateRangePresets()).\n  presets: Record<string, string>;\n\n  /**\n   * The table's own accessible name. Deliberately a label rather than a second,\n   * parallel `tableLabel` prop: the audit already records \"three different prop\n   * names for the accessible name\" as a finding, and a table that is not \"Data\n   * table\" says so with `labels={{ table: \"Transactions\" }}` at the call site.\n   */\n  table: string;\n\n  // ---- Announcements ----\n  // Spoken through the live region, never rendered. Each takes its numbers as\n  // ARGUMENTS: a count glued into an English template literal is untranslatable,\n  // and the grammar around it moves with the number in most languages.\n\n  /** After a filter changes: \"12 of 137 rows\". */\n  filterResults: (shown: number, total: number) => string;\n  /** After a header is activated: \"Sorted by Name, ascending\". */\n  sortedAscending: (column: string) => string;\n  sortedDescending: (column: string) => string;\n  /** The third click, which removes the column from the sort entirely. */\n  sortCleared: (column: string) => string;\n  /** After paging: \"Page 3 of 14\". `page` is 1-BASED, as spoken. */\n  pageChanged: (page: number, totalPages: number) => string;\n\n  // ---- Counted chrome ----\n  // Visible text that interpolates numbers. These were template literals until the\n  // audit flagged them: a consumer could translate every key in this file and still\n  // be left with English (and with ASCII digit grouping) in the footer.\n\n  /** The pagination range summary: \"1–25 / 137\". */\n  pageRange: (from: number, to: number, total: number) => string;\n  /** The same summary when the page size is \"all\" — just the row count. */\n  rowCount: (total: number) => string;\n  /** The column-settings rail and its heading: \"Columns (4/9)\". */\n  columnsCount: (visible: number, total: number) => string;\n  /**\n   * A column's filter button and panel: \"Filter Amount\", and \"Filter Amount (active)\"\n   * while the column is filtered (round 0.34 Wave 2, BUG-7c). Every column's used to be\n   * \"Filter\" alike, and \"filtered\" was a colour. An app that translated only `filter`\n   * gets `\"<filter>: <column>\"` from it — see {@link resolveDataTableLabels}.\n   */\n  filterColumn: (column: string, active: boolean) => string;\n\n  // ---- Empty state, row actions, boolean cells (0.12.0) ----\n\n  /** The body of a table with no rows and no `empty` prop of its own. A sentence, not\n   *  \"—\": a dash in the only row of a table reads as one row with a missing value. */\n  empty: string;\n  /** The accessible name of the `rowActions` column (its header is visually empty). */\n  actions: string;\n  /** The `kind: \"edit\"` row action's name — its tooltip and its swipe label. */\n  edit: string;\n  /** The `kind: \"delete\"` row action's name. */\n  delete: string;\n  /** What {@link BooleanMark} says to a screen reader for `true` / `false` / nothing. */\n  booleanTrue: string;\n  booleanFalse: string;\n  booleanUnset: string;\n}\n\nexport const DEFAULT_DATA_TABLE_LABELS: DataTableLabels = {\n  columns: \"Columns\",\n  selectAllRows: \"Select all rows\",\n  sortHint: \"Click to sort · Shift-click to add a sort\",\n  filter: \"Filter\",\n  close: \"Close\",\n  selectRow: \"Select row\",\n  rowDetails: \"Details\",\n  autoSize: \"Auto-size columns\",\n  loading: \"Loading…\",\n  filters: \"Filters\",\n  clearAll: \"Clear all\",\n  done: \"Done\",\n  pageSize: \"Rows per page\",\n  pageSizeAll: \"All\",\n  prevPage: \"Previous page\",\n  nextPage: \"Next page\",\n  clearFilter: \"Clear filter\",\n  filterPlaceholder: \"Filter…\",\n  selectFilter: \"Select\",\n  selectAll: \"All\",\n  selectNone: \"None\",\n  dateFrom: \"From\",\n  dateTo: \"To\",\n  numberMin: \"Min\",\n  numberMax: \"Max\",\n  numberAbs: \"Absolute value\",\n  presets: {\n    today: \"Today\",\n    yesterday: \"Yesterday\",\n    this_week: \"This week\",\n    last_week: \"Last week\",\n    last_7_days: \"Last 7 days\",\n    last_30_days: \"Last 30 days\",\n    this_month: \"This month\",\n    last_month: \"Last month\",\n    last_3_months: \"Last 3 months\",\n    ytd: \"Year to date\",\n    last_year: \"Last year\",\n  },\n  table: \"Data table\",\n  filterResults: (shown, total) => `${shown} of ${total} rows`,\n  sortedAscending: (column) => `Sorted by ${column}, ascending`,\n  sortedDescending: (column) => `Sorted by ${column}, descending`,\n  sortCleared: (column) => `Sort cleared on ${column}`,\n  pageChanged: (page, totalPages) => `Page ${page} of ${totalPages}`,\n  // The separators are the ones that shipped, so adding the seam changes no screen.\n  pageRange: (from, to, total) => `${from}–${to} / ${total}`,\n  rowCount: (total) => `${total}`,\n  columnsCount: (visible, total) => `Columns (${visible}/${total})`,\n  filterColumn: (column, active) => (active ? `Filter ${column} (active)` : `Filter ${column}`),\n  empty: \"No entries\",\n  actions: \"Actions\",\n  edit: \"Edit\",\n  delete: \"Delete\",\n  booleanTrue: \"Yes\",\n  booleanFalse: \"No\",\n  booleanUnset: \"Not set\",\n  // The phone sort control (0.22.0). The same words as `DEFAULT_DATA_TABLE_SORT_LABELS`\n  // in data-table.tsx, written out rather than spread in: importing that VALUE here\n  // would make data-table.tsx and this module import each other (data-table.tsx reads\n  // its resolver from here), and would pull the whole table into `i18n/defaults`.\n  sortBy: \"Sort by\",\n  sortDefault: \"Default order\",\n  sortAscending: \"Ascending\",\n  sortDescending: \"Descending\",\n};\n\n/**\n * Merge caller overrides onto the English defaults (presets merged too, key by key, as\n * the provider merges them — so the parameter is a {@link LabelOverride}).\n *\n * The parameter is lenient on purpose — a table with no labels at all still\n * renders — but that is also how a translated app ends up half English and never\n * hears about it: lenkbank ships nineteen of these keys in English in a German UI\n * today, because every one of them is backfilled silently. The kit will not start\n * throwing over it (three apps depend on the lenient merge), so\n * {@link missingDataTableLabels} is the other half: it answers which keys fell back,\n * and an app asserts on that in its OWN test, where the answer is actionable.\n *\n * @deprecated 0.34 — pass `labels` to DataTable, or the provider's `dataTable`, which this\n * merge serves; removed in 0.35 from the public surface, where DataTable keeps it as its\n * own (refactor audit 2026-10, API-6a). One app test calls it.\n */\nexport function resolveDataTableLabels(partial?: LabelOverride<DataTableLabels>): DataTableLabels {\n  if (!partial) return DEFAULT_DATA_TABLE_LABELS;\n  // An `undefined` preset is skipped, as the provider skips it, rather than blanking one.\n  const presets = { ...DEFAULT_DATA_TABLE_LABELS.presets };\n  for (const [key, text] of Object.entries(partial.presets ?? {})) if (text !== undefined) presets[key] = text;\n  const merged: DataTableLabels = { ...DEFAULT_DATA_TABLE_LABELS, ...partial, presets };\n  // `columnsCount` was split out of `columns` + a template literal. Consumers have\n  // been translating `columns` since 0.1, and backfilling the English default over\n  // that would hand them \"Columns (4/9)\" back for having translated the key that\n  // existed at the time — the same silent-English failure the audit records against\n  // this file. So the count is derived from the RESOLVED `columns` unless the caller\n  // states the whole sentence, which is the escape hatch for a language where the\n  // parenthetical does not fit.\n  if (partial.columns !== undefined && partial.columnsCount === undefined) {\n    merged.columnsCount = (visible, total) => `${merged.columns} (${visible}/${total})`;\n  }\n  // The same for `filterColumn` (0.34), from a translated `filter`: the app's own word\n  // with the column, rather than English for having translated the key that existed.\n  if (partial.filter !== undefined && partial.filterColumn === undefined) {\n    merged.filterColumn = (column) => `${merged.filter}: ${column}`;\n  }\n  return merged;\n}\n\n/**\n * The label keys `labels` does not supply, and which therefore come back English\n * from {@link resolveDataTableLabels}.\n *\n * For a consumer's own test:\n *\n * ```ts\n * expect(missingDataTableLabels(de.dataTable)).toEqual([]);\n * ```\n *\n * which fails the day the kit adds a key — which is the point. Adding a label is\n * additive here and a silent regression in a translated app, and nothing else in\n * either repository can tell the two apart.\n *\n * Preset labels are reported one at a time (`presets.yesterday`), because `presets`\n * is a `Record` merged key by key: answering `\"presets\"` would say nothing about\n * which of the eleven are still English.\n *\n * @deprecated 0.34 — `missingKitLabels(labels, DEFAULT_UI_KIT_LABELS)`, which checks every\n * namespace, the table's among them, and which all three apps' tests already call;\n * removed in 0.35 (refactor audit 2026-10, API-6a).\n */\nexport function missingDataTableLabels(labels?: Partial<DataTableLabels>): string[] {\n  const missing: string[] = [];\n  for (const key of Object.keys(DEFAULT_DATA_TABLE_LABELS) as Array<keyof DataTableLabels>) {\n    if (key === \"presets\") continue;\n    if (labels?.[key] !== undefined) continue;\n    // `columnsCount` is DERIVED from a translated `columns` by the resolver above,\n    // so a caller who set that one is not leaking English here. Reporting it would\n    // send them to translate a key they have already covered, and an `toEqual([])`\n    // assertion built on this would never go green.\n    if (key === \"columnsCount\" && labels?.columns !== undefined) continue;\n    if (key === \"filterColumn\" && labels?.filter !== undefined) continue;\n    missing.push(key);\n  }\n  for (const preset of Object.keys(DEFAULT_DATA_TABLE_LABELS.presets)) {\n    if (labels?.presets?.[preset] === undefined) missing.push(`presets.${preset}`);\n  }\n  return missing;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../src/components/data-table-labels.ts"],"sourcesContent":["// All user-facing strings for the DataTable system — the `dataTable` namespace of\n// `<UiKitProvider labels>`, and per table the `labels` prop over that. The kit's seven\n// catalogues carry the translations; the English defaults below make the table usable\n// with no wiring.\n\n// A type-only import: erased at build time, so this module stays free of the table\n// itself (and of react-router), which `i18n/defaults` relies on.\nimport type { DataTableSortLabels } from \"./data-table\";\n\n/** The phone sort control's four keys (`sortBy`, `sortDefault`, `sortAscending`,\n *  `sortDescending`, 0.22.0) are {@link DataTableSortLabels}', declared beside the\n *  control and part of this namespace like every other key. */\nexport interface DataTableLabels extends DataTableSortLabels {\n  // Table chrome\n  columns: string;\n  selectAllRows: string;\n  sortHint: string;\n  filter: string;\n  close: string;\n  selectRow: string;\n  /**\n   * The name of an opening row's disclosure button on desktop — visually hidden, in the\n   * row's first cell, carrying `aria-expanded` and `aria-controls` (round 0.34, the\n   * showcase's axe check: ARIA allows `aria-expanded` on a row only in a treegrid, and\n   * the `<tr>` wore it). The same words whether the row is open or shut: the state is\n   * the button's to say.\n   */\n  rowDetails: string;\n  autoSize: string;\n  loading: string;\n  filters: string;\n  clearAll: string;\n  done: string;\n  // Pagination\n  pageSize: string;\n  pageSizeAll: string;\n  prevPage: string;\n  nextPage: string;\n  // Filter popover\n  clearFilter: string;\n  filterPlaceholder: string;\n  selectFilter: string;\n  selectAll: string;\n  selectNone: string;\n  dateFrom: string;\n  dateTo: string;\n  numberMin: string;\n  numberMax: string;\n  numberAbs: string;\n  // Date-range preset labels, keyed by preset key (see dateRangePresets()).\n  presets: Record<string, string>;\n\n  /**\n   * The table's own accessible name. Deliberately a label rather than a second,\n   * parallel `tableLabel` prop: the audit already records \"three different prop\n   * names for the accessible name\" as a finding, and a table that is not \"Data\n   * table\" says so with `labels={{ table: \"Transactions\" }}` at the call site.\n   */\n  table: string;\n\n  // ---- Announcements ----\n  // Spoken through the live region, never rendered. Each takes its numbers as\n  // ARGUMENTS: a count glued into an English template literal is untranslatable,\n  // and the grammar around it moves with the number in most languages.\n\n  /** After a filter changes: \"12 of 137 rows\". */\n  filterResults: (shown: number, total: number) => string;\n  /** After a header is activated: \"Sorted by Name, ascending\". */\n  sortedAscending: (column: string) => string;\n  sortedDescending: (column: string) => string;\n  /** The third click, which removes the column from the sort entirely. */\n  sortCleared: (column: string) => string;\n  /** After paging: \"Page 3 of 14\". `page` is 1-BASED, as spoken. */\n  pageChanged: (page: number, totalPages: number) => string;\n\n  // ---- Counted chrome ----\n  // Visible text that interpolates numbers. These were template literals until the\n  // audit flagged them: a consumer could translate every key in this file and still\n  // be left with English (and with ASCII digit grouping) in the footer.\n\n  /** The pagination range summary: \"1–25 / 137\". */\n  pageRange: (from: number, to: number, total: number) => string;\n  /** The same summary when the page size is \"all\" — just the row count. */\n  rowCount: (total: number) => string;\n  /** The column-settings rail and its heading: \"Columns (4/9)\". */\n  columnsCount: (visible: number, total: number) => string;\n  /**\n   * A column's filter button and panel: \"Filter Amount\", and \"Filter Amount (active)\"\n   * while the column is filtered (round 0.34 Wave 2, BUG-7c). Every column's used to be\n   * \"Filter\" alike, and \"filtered\" was a colour. An app that translated only `filter`\n   * gets `\"<filter>: <column>\"` from it: DataTable derives the one from the other.\n   */\n  filterColumn: (column: string, active: boolean) => string;\n\n  // ---- Empty state, row actions, boolean cells (0.12.0) ----\n\n  /** The body of a table with no rows and no `empty` prop of its own. A sentence, not\n   *  \"—\": a dash in the only row of a table reads as one row with a missing value. */\n  empty: string;\n  /** The accessible name of the `rowActions` column (its header is visually empty). */\n  actions: string;\n  /** The `kind: \"edit\"` row action's name — its tooltip and its swipe label. */\n  edit: string;\n  /** The `kind: \"delete\"` row action's name. */\n  delete: string;\n  /** What {@link BooleanMark} says to a screen reader for `true` / `false` / nothing. */\n  booleanTrue: string;\n  booleanFalse: string;\n  booleanUnset: string;\n}\n\nexport const DEFAULT_DATA_TABLE_LABELS: DataTableLabels = {\n  columns: \"Columns\",\n  selectAllRows: \"Select all rows\",\n  sortHint: \"Click to sort · Shift-click to add a sort\",\n  filter: \"Filter\",\n  close: \"Close\",\n  selectRow: \"Select row\",\n  rowDetails: \"Details\",\n  autoSize: \"Auto-size columns\",\n  loading: \"Loading…\",\n  filters: \"Filters\",\n  clearAll: \"Clear all\",\n  done: \"Done\",\n  pageSize: \"Rows per page\",\n  pageSizeAll: \"All\",\n  prevPage: \"Previous page\",\n  nextPage: \"Next page\",\n  clearFilter: \"Clear filter\",\n  filterPlaceholder: \"Filter…\",\n  selectFilter: \"Select\",\n  selectAll: \"All\",\n  selectNone: \"None\",\n  dateFrom: \"From\",\n  dateTo: \"To\",\n  numberMin: \"Min\",\n  numberMax: \"Max\",\n  numberAbs: \"Absolute value\",\n  presets: {\n    today: \"Today\",\n    yesterday: \"Yesterday\",\n    this_week: \"This week\",\n    last_week: \"Last week\",\n    last_7_days: \"Last 7 days\",\n    last_30_days: \"Last 30 days\",\n    this_month: \"This month\",\n    last_month: \"Last month\",\n    last_3_months: \"Last 3 months\",\n    ytd: \"Year to date\",\n    last_year: \"Last year\",\n  },\n  table: \"Data table\",\n  filterResults: (shown, total) => `${shown} of ${total} rows`,\n  sortedAscending: (column) => `Sorted by ${column}, ascending`,\n  sortedDescending: (column) => `Sorted by ${column}, descending`,\n  sortCleared: (column) => `Sort cleared on ${column}`,\n  pageChanged: (page, totalPages) => `Page ${page} of ${totalPages}`,\n  // The separators are the ones that shipped, so adding the seam changes no screen.\n  pageRange: (from, to, total) => `${from}–${to} / ${total}`,\n  rowCount: (total) => `${total}`,\n  columnsCount: (visible, total) => `Columns (${visible}/${total})`,\n  filterColumn: (column, active) => (active ? `Filter ${column} (active)` : `Filter ${column}`),\n  empty: \"No entries\",\n  actions: \"Actions\",\n  edit: \"Edit\",\n  delete: \"Delete\",\n  booleanTrue: \"Yes\",\n  booleanFalse: \"No\",\n  booleanUnset: \"Not set\",\n  // The phone sort control (0.22.0). The same words as `DEFAULT_DATA_TABLE_SORT_LABELS`\n  // in data-table.tsx, written out rather than spread in: importing that VALUE here\n  // would make data-table.tsx and this module import each other (data-table.tsx reads\n  // these defaults from here), and would pull the whole table into `i18n/defaults`.\n  sortBy: \"Sort by\",\n  sortDefault: \"Default order\",\n  sortAscending: \"Ascending\",\n  sortDescending: \"Descending\",\n};\n"],"mappings":";AA+GO,MAAM,4BAA6C;AAAA,EACxD,SAAS;AAAA,EACT,eAAe;AAAA,EACf,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,SAAS;AAAA,EACT,SAAS;AAAA,EACT,UAAU;AAAA,EACV,MAAM;AAAA,EACN,UAAU;AAAA,EACV,aAAa;AAAA,EACb,UAAU;AAAA,EACV,UAAU;AAAA,EACV,aAAa;AAAA,EACb,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,SAAS;AAAA,IACP,OAAO;AAAA,IACP,WAAW;AAAA,IACX,WAAW;AAAA,IACX,WAAW;AAAA,IACX,aAAa;AAAA,IACb,cAAc;AAAA,IACd,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,eAAe;AAAA,IACf,KAAK;AAAA,IACL,WAAW;AAAA,EACb;AAAA,EACA,OAAO;AAAA,EACP,eAAe,CAAC,OAAO,UAAU,GAAG,KAAK,OAAO,KAAK;AAAA,EACrD,iBAAiB,CAAC,WAAW,aAAa,MAAM;AAAA,EAChD,kBAAkB,CAAC,WAAW,aAAa,MAAM;AAAA,EACjD,aAAa,CAAC,WAAW,mBAAmB,MAAM;AAAA,EAClD,aAAa,CAAC,MAAM,eAAe,QAAQ,IAAI,OAAO,UAAU;AAAA;AAAA,EAEhE,WAAW,CAAC,MAAM,IAAI,UAAU,GAAG,IAAI,SAAI,EAAE,MAAM,KAAK;AAAA,EACxD,UAAU,CAAC,UAAU,GAAG,KAAK;AAAA,EAC7B,cAAc,CAAC,SAAS,UAAU,YAAY,OAAO,IAAI,KAAK;AAAA,EAC9D,cAAc,CAAC,QAAQ,WAAY,SAAS,UAAU,MAAM,cAAc,UAAU,MAAM;AAAA,EAC1F,OAAO;AAAA,EACP,SAAS;AAAA,EACT,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA;AAAA;AAAA;AAAA;AAAA,EAKd,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,eAAe;AAAA,EACf,gBAAgB;AAClB;","names":[]}

package/dist/components/data-table-shared.d.ts

@@ -1,6 +1,7 @@
 import type { CSSProperties, ReactNode } from "react";
-import type { DataTableLabels } from "./data-table-labels.js";
+import { type DataTableLabels } from "./data-table-labels.js";
 import type { DataTableCellProps, DataTableColumn, DataTableHeadProps } from "./data-table.js";
+import type { LabelOverride } from "../i18n/kit-labels.js";
 /**
  * Split a caller's cell attributes into what may reach the element and what the kit
  * owns. `role` and `data-col` are dropped outright (see `cellProps`); `className` and
@@ -37,6 +38,21 @@ export declare function cleanAttrs(attrs: Record<string, string | undefined> | u
  * should pass a string header, and that is visible in what gets announced.
  */
 export declare function columnLabel<T>(col: DataTableColumn<T>, labels?: DataTableLabels): string;
+/**
+ * The table's labels: caller overrides merged onto the English defaults (presets merged
+ * too, key by key, as the provider merges them — so the parameter is a
+ * {@link LabelOverride}).
+ *
+ * DataTable's own, and FilterPopover's: public until 0.35, when it left the barrel for
+ * DataTable's `labels` and the provider's `dataTable`, which it serves (round 0.35 R1,
+ * refactor audit 2026-10 API-6a). It stays a resolver rather than `useKitLabels` for the
+ * two keys it derives (`columnsCount`, `filterColumn`), which a plain merge would not.
+ *
+ * Lenient on purpose — a table with no labels at all still renders — so a translated app
+ * finds out what fell back to English from `missingKitLabels(labels,
+ * DEFAULT_UI_KIT_LABELS)` in its own test, where the answer is actionable.
+ */
+export declare function resolveDataTableLabels(...layers: (LabelOverride<DataTableLabels> | undefined)[]): DataTableLabels;
 /**
  * Whether a click that reached `row`'s handler did not start in the row's own DOM.
  *