@eifi1/ui-kit 0.33.1 → 0.34.0

package/dist/components/danger-confirm.js

@@ -1,12 +1,17 @@
 "use client";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Children, forwardRef, useCallback, useEffect, useId, useRef, useState } from "react";
+import { Children, useCallback, useEffect, useId, useRef, useState } from "react";
 import { cn } from "../lib/cn.js";
+import { hasContent } from "../lib/presence.js";
 import { useKitLabels } from "../i18n/kit-labels.js";
-import { Button, Input, Label, Spinner } from "./ui.js";
+import { Button } from "./button.js";
+import { Input } from "./input.js";
+import { Label } from "./field-base.js";
+import { Spinner } from "./spinner.js";
 import { Checkbox } from "./checkbox.js";
 import { Tooltip } from "./tooltip.js";
 import { useCommitReason } from "./write-lock.js";
+import { DEFAULT_DANGER_CONFIRM_LABELS } from "./danger-confirm-labels.js";
 function typedMatches(typed, target, mode = "trim") {
   if (mode === "exact") return typed === target;
   if (mode === "trim") return typed.trim() === target;
@@ -38,32 +43,34 @@ function usePromisePending() {
   }, []);
   return { pending, run };
 }
-function hasContent(node) {
-  return node !== void 0 && node !== null && node !== false && node !== "";
-}
-const CurrentPasswordInput = forwardRef(
-  function CurrentPasswordInput2({ label, onValueChange, onChange, busy, readOnly, labels: labelsProp, ...rest }, ref) {
-    const labels = useKitLabels("dangerConfirm", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);
-    const namedOtherwise = rest["aria-label"] !== void 0 || rest["aria-labelledby"] !== void 0;
-    return /* @__PURE__ */ jsx(
-      Input,
-      {
-        ...rest,
-        ref,
-        type: "password",
-        autoComplete: "current-password",
-        label: label === void 0 ? namedOtherwise ? void 0 : labels.password : hasContent(label) ? label : void 0,
-        readOnly: Boolean(busy) || readOnly,
-        onChange: (e) => {
-          onChange?.(e);
-          onValueChange?.(e.target.value);
-        }
+function CurrentPasswordInput({
+  label,
+  onValueChange,
+  onChange,
+  busy,
+  readOnly,
+  labels: labelsProp,
+  ...rest
+}) {
+  const labels = useKitLabels("dangerConfirm", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);
+  const namedOtherwise = rest["aria-label"] !== void 0 || rest["aria-labelledby"] !== void 0;
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      ...rest,
+      type: "password",
+      autoComplete: "current-password",
+      label: label === void 0 ? namedOtherwise ? void 0 : labels.password : hasContent(label) ? label : void 0,
+      readOnly: Boolean(busy) || readOnly,
+      onChange: (e) => {
+        onChange?.(e);
+        onValueChange?.(e.target.value);
       }
-    );
-  }
-);
-CurrentPasswordInput.displayName = "CurrentPasswordInput";
-const TypedConfirmField = forwardRef(function TypedConfirmField2({
+    }
+  );
+}
+function TypedConfirmField({
+  ref,
   target,
   match = "trim",
   value: valueProp,
@@ -79,7 +86,7 @@ const TypedConfirmField = forwardRef(function TypedConfirmField2({
   id,
   className,
   ...rest
-}, ref) {
+}) {
   const labels = useKitLabels("dangerConfirm", DEFAULT_DANGER_CONFIRM_LABELS, labelsProp);
   const [own, setOwn] = useState(defaultValue);
   const value = valueProp ?? own;
@@ -119,20 +126,7 @@ const TypedConfirmField = forwardRef(function TypedConfirmField2({
     );
   }
   return /* @__PURE__ */ jsx(Input, { ...fieldProps, label, className });
-});
-TypedConfirmField.displayName = "TypedConfirmField";
-const DEFAULT_DANGER_CONFIRM_LABELS = {
-  arm: "Delete\u2026",
-  confirm: "Delete",
-  cancel: "Cancel",
-  prompt: "This cannot be undone.",
-  password: "Password",
-  phrase: (phrase) => `Type \u201C${phrase}\u201D to confirm`,
-  acknowledge: "I have read what this does and want to continue.",
-  needsPhrase: (phrase) => `Type \u201C${phrase}\u201D to confirm`,
-  needsAcknowledge: "Tick the box to confirm",
-  needsPassword: "Enter your password to confirm"
-};
+}
 const SLOT_FIELD = [
   'input:not([type="hidden"])',
   "select",
@@ -266,7 +260,7 @@ function DangerConfirm({
   const lines = (consequences ?? []).map(
     (item, index) => typeof item === "string" ? { key: item, text: item, severe: false } : { key: item.key ?? String(index), text: item.text, severe: Boolean(item.severe) }
   );
-  const toneText = tone === "warning" ? "text-[var(--warning)]" : "text-[var(--danger)]";
+  const toneText = tone === "warning" ? "text-warning" : "text-danger";
   if (!armed) {
     const arm = /* @__PURE__ */ jsx(
       Button,
@@ -296,7 +290,7 @@ function DangerConfirm({
         // on every focus. A fragment is left as it is, so the bubble stays visual.
         /* @__PURE__ */ jsx(Tooltip, { label: lockedReason, portal: true, children: /* @__PURE__ */ jsx(Fragment, { children: arm }) })
       ) : arm,
-      locked && /* @__PURE__ */ jsx("p", { id: reasonId, className: "text-xs text-[var(--text-muted)]", children: lockedReason })
+      locked && /* @__PURE__ */ jsx("p", { id: reasonId, className: "text-xs text-muted", children: lockedReason })
     ] });
   }
   return /* @__PURE__ */ jsx("div", { ...rest, className: cn("space-y-2", className), children: /* @__PURE__ */ jsxs(
@@ -309,7 +303,7 @@ function DangerConfirm({
       noValidate: true,
       children: [
         /* @__PURE__ */ jsx("p", { id: promptId, className: cn("text-xs font-medium", toneText), children: prompt ?? labels.prompt }),
-        lines.length > 0 && /* @__PURE__ */ jsx("ul", { id: consequencesId, className: "list-disc space-y-1 ps-5 text-xs text-[var(--text-secondary)]", children: lines.map((line) => /* @__PURE__ */ jsx("li", { className: line.severe ? "text-[var(--danger)]" : void 0, children: line.text }, line.key)) }),
+        lines.length > 0 && /* @__PURE__ */ jsx("ul", { id: consequencesId, className: "list-disc space-y-1 ps-5 text-xs text-secondary", children: lines.map((line) => /* @__PURE__ */ jsx("li", { className: line.severe ? "text-danger" : void 0, children: line.text }, line.key)) }),
         hasFields && /* @__PURE__ */ jsx("div", { ref: slotRef, className: "space-y-2", children }),
         asksAcknowledge && /* @__PURE__ */ jsx(
           Checkbox,
@@ -362,7 +356,7 @@ function DangerConfirm({
             }
           )
         ] }),
-        locked && /* @__PURE__ */ jsx("p", { className: "text-xs text-[var(--text-muted)]", children: lockedReason })
+        locked && /* @__PURE__ */ jsx("p", { className: "text-xs text-muted", children: lockedReason })
       ]
     }
   ) });

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/danger-confirm.tsx"],"sourcesContent":["import { Children, forwardRef, useCallback, useEffect, useId, useRef, useState } from \"react\";\nimport type { ChangeEvent, ComponentPropsWithoutRef, FormEvent, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport { Button, Input, Label, Spinner } from \"./ui\";\nimport type { ButtonVariant, InputProps } from \"./ui\";\nimport { Checkbox } from \"./checkbox\";\nimport { Tooltip } from \"./tooltip\";\nimport { useCommitReason, type CommitScope } from \"./write-lock\";\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/** A label that is really there — `null`, `false` and `\"\"` are what a caller's\n *  `cond && reason` evaluates to on the path where there is none. */\nfunction hasContent(node: ReactNode): boolean {\n  return node !== undefined && node !== null && node !== false && node !== \"\";\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?: Partial<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 const CurrentPasswordInput = forwardRef<HTMLInputElement, CurrentPasswordInputProps>(\n  function CurrentPasswordInput({ label, onValueChange, onChange, busy, readOnly, labels: labelsProp, ...rest }, ref) {\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        {...rest}\n        ref={ref}\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);\nCurrentPasswordInput.displayName = \"CurrentPasswordInput\";\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?: Partial<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 const TypedConfirmField = forwardRef<HTMLInputElement, TypedConfirmFieldProps>(function TypedConfirmField(\n  {\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  },\n  ref,\n) {\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});\nTypedConfirmField.displayName = \"TypedConfirmField\";\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/** `satisfies` rather than a type annotation, so `DEFAULT_DANGER_CONFIRM_LABELS.phrase`\n *  stays callable for a caller that composes its own label from it. */\nexport const DEFAULT_DANGER_CONFIRM_LABELS = {\n  arm: \"Delete…\",\n  confirm: \"Delete\",\n  cancel: \"Cancel\",\n  prompt: \"This cannot be undone.\",\n  password: \"Password\",\n  phrase: (phrase: string) => `Type “${phrase}” to confirm`,\n  acknowledge: \"I have read what this does and want to continue.\",\n  needsPhrase: (phrase: string) => `Type “${phrase}” to confirm`,\n  needsAcknowledge: \"Tick the box to confirm\",\n  needsPassword: \"Enter your password to confirm\",\n} satisfies DangerConfirmLabels;\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<ComponentPropsWithoutRef<\"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?: Partial<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-[var(--warning)]\" : \"text-[var(--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-[var(--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-[var(--text-secondary)]\">\n            {lines.map((line) => (\n              <li key={line.key} className={line.severe ? \"text-[var(--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-[var(--text-muted)]\">{lockedReason}</p>}\n      </form>\n    </div>\n  );\n}\n"],"mappings":"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","names":["CurrentPasswordInput","TypedConfirmField"]}
+{"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":"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","names":[]}

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

@@ -1,21 +1,8 @@
-import * as react from 'react';
-import { ReactNode } from 'react';
-import { d as DataTableColumn, f as DataTableLabels } from '../data-table-labels-BJ5JE_X2.js';
-import './data-table-sort.js';
-import './swipeable-row.js';
-import './status-dot.js';
-import './progress-bar.js';
-import './signed-amount.js';
-import './stat-tile.js';
-import './chip.js';
-import 'lucide-react';
-import './field-parts.js';
-import './tooltip.js';
-import '../hooks/use-anchored-rect.js';
-import '../lib/clipping.js';
-import './write-lock.js';
-
-interface BooleanMarkProps {
+import type { ReactNode } from "react";
+import { type LabelOverride } from "../i18n/kit-labels.js";
+import { type DataTableLabels } from "./data-table-labels.js";
+import type { DataTableColumn } from "./data-table.js";
+export interface BooleanMarkProps {
     /** `true` → a check, `false` → a cross (or a dash, see `falseAs`), `null` /
      *  `undefined` → a dash. */
     value: boolean | null | undefined;
@@ -28,7 +15,7 @@ interface BooleanMarkProps {
     falseAs?: "cross" | "dash";
     /** The spoken words, over `dataTable.booleanTrue` / `booleanFalse` / `booleanUnset`
      *  from `<UiKitProvider labels>`. */
-    labels?: Partial<Pick<DataTableLabels, "booleanTrue" | "booleanFalse" | "booleanUnset">>;
+    labels?: LabelOverride<Pick<DataTableLabels, "booleanTrue" | "booleanFalse" | "booleanUnset">>;
     className?: string;
 }
 /**
@@ -40,8 +27,8 @@ interface BooleanMarkProps {
  * no text, so a reader walking the table heard an empty cell for every row; the apps'
  * Yes/No chips were the other answer, and too loud for a column of them.
  */
-declare function BooleanMark({ value, falseAs, labels: labelsProp, className }: BooleanMarkProps): react.JSX.Element;
-interface BooleanColumnOptions<T> {
+export declare function BooleanMark({ value, falseAs, labels: labelsProp, className }: BooleanMarkProps): import("react").JSX.Element;
+export interface BooleanColumnOptions<T> {
     key: string;
     header: ReactNode;
     /** The value of this row. */
@@ -68,6 +55,4 @@ interface BooleanColumnOptions<T> {
  * A {@link DataTableColumn} for a yes/no field: {@link BooleanMark} cells,
  * sortable with `true` first, and optionally a Yes/No select filter.
  */
-declare function booleanColumn<T>({ key, header, value, falseAs, sortable, filterOptions, column, }: BooleanColumnOptions<T>): DataTableColumn<T>;
-
-export { type BooleanColumnOptions, BooleanMark, type BooleanMarkProps, booleanColumn };
+export declare function booleanColumn<T>({ key, header, value, falseAs, sortable, filterOptions, column, }: BooleanColumnOptions<T>): DataTableColumn<T>;

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

@@ -16,7 +16,7 @@ function BooleanMark({ value, falseAs = "cross", labels: labelsProp, className }
         "aria-hidden": true,
         className: cn(
           "size-4",
-          state === "true" ? "text-[var(--success)]" : state === "false" && falseAs === "cross" ? "text-[var(--text-muted)]" : "text-[var(--text-placeholder)]"
+          state === "true" ? "text-success" : state === "false" && falseAs === "cross" ? "text-muted" : "text-placeholder"
         )
       }
     ),

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

@@ -1 +1 @@
-{"version":3,"sources":["../../src/components/data-table-cells.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Check, Minus, X } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { useKitLabels } from \"../i18n/kit-labels\";\nimport { DEFAULT_DATA_TABLE_LABELS, type DataTableLabels } from \"./data-table-labels\";\nimport type { DataTableColumn } from \"./data-table\";\n\nexport interface BooleanMarkProps {\n  /** `true` → a check, `false` → a cross (or a dash, see `falseAs`), `null` /\n   *  `undefined` → a dash. */\n  value: boolean | null | undefined;\n  /**\n   * How `false` is drawn. `\"cross\"` (default) when \"no\" is news worth seeing — a\n   * failed check, a missing document. `\"dash\"` for a column that is mostly `false` and\n   * reads as a list of the `true` ones (kastlan's BoolCell): a column of crosses is\n   * noise. The screen-reader text says \"No\" either way.\n   */\n  falseAs?: \"cross\" | \"dash\";\n  /** The spoken words, over `dataTable.booleanTrue` / `booleanFalse` / `booleanUnset`\n   *  from `<UiKitProvider labels>`. */\n  labels?: Partial<Pick<DataTableLabels, \"booleanTrue\" | \"booleanFalse\" | \"booleanUnset\">>;\n  className?: string;\n}\n\n/**\n * A yes/no value in a table cell: a green check, a muted cross, or a faint dash for\n * \"not set\" — with the word for a screen reader, since a glyph alone is announced as\n * nothing at all (or as \"image\").\n *\n * kastlan's `BoolCell` (shared/components/data-table/bool-cell.tsx) drew the icons with\n * no text, so a reader walking the table heard an empty cell for every row; the apps'\n * Yes/No chips were the other answer, and too loud for a column of them.\n */\nexport function BooleanMark({ value, falseAs = \"cross\", labels: labelsProp, className }: BooleanMarkProps) {\n  const labels = useKitLabels(\"dataTable\", DEFAULT_DATA_TABLE_LABELS, labelsProp);\n  const state = value === true ? \"true\" : value === false ? \"false\" : \"unset\";\n  const text =\n    state === \"true\" ? labels.booleanTrue : state === \"false\" ? labels.booleanFalse : labels.booleanUnset;\n  const Icon = state === \"true\" ? Check : state === \"false\" && falseAs === \"cross\" ? X : Minus;\n  return (\n    <span data-value={state} className={cn(\"inline-flex items-center align-middle\", className)}>\n      <Icon\n        aria-hidden\n        className={cn(\n          \"size-4\",\n          state === \"true\"\n            ? \"text-[var(--success)]\"\n            : state === \"false\" && falseAs === \"cross\"\n              ? \"text-[var(--text-muted)]\"\n              : \"text-[var(--text-placeholder)]\",\n        )}\n      />\n      <span className=\"sr-only\">{text}</span>\n    </span>\n  );\n}\n\nexport interface BooleanColumnOptions<T> {\n  key: string;\n  header: ReactNode;\n  /** The value of this row. */\n  value: (row: T) => boolean | null | undefined;\n  /** See {@link BooleanMarkProps.falseAs}. */\n  falseAs?: \"cross\" | \"dash\";\n  /** Sortable, `true` first on the first click (a column is sorted to find the yes\n   *  rows). Default true. */\n  sortable?: boolean;\n  /**\n   * A select filter over the column, with these option labels — pass them translated.\n   * Omitted: no filter. The option values are `\"true\"` / `\"false\"` (and `\"unset\"` when\n   * `unset` is given), which is also what `filterHref` takes for this column.\n   */\n  filterOptions?: { true: string; false: string; unset?: string };\n  /** Further column settings (`mobileHidden`, `headClassName`, …), merged over. */\n  column?: Partial<DataTableColumn<T>>;\n}\n\n/**\n * A {@link DataTableColumn} for a yes/no field: {@link BooleanMark} cells,\n * sortable with `true` first, and optionally a Yes/No select filter.\n */\nexport function booleanColumn<T>({\n  key,\n  header,\n  value,\n  falseAs,\n  sortable = true,\n  filterOptions,\n  column,\n}: BooleanColumnOptions<T>): DataTableColumn<T> {\n  const asKey = (row: T) => {\n    const v = value(row);\n    return v === true ? \"true\" : v === false ? \"false\" : \"unset\";\n  };\n  return {\n    key,\n    header,\n    cell: (row) => <BooleanMark value={value(row)} falseAs={falseAs} />,\n    // 0 for yes, 1 for no, null for unset (which the table sorts last either way).\n    sortBy: sortable\n      ? (row) => {\n          const v = value(row);\n          return v == null ? null : v ? 0 : 1;\n        }\n      : undefined,\n    filter: filterOptions\n      ? {\n          type: \"select\",\n          getValue: asKey,\n          options: [\n            { value: \"true\", label: filterOptions.true },\n            { value: \"false\", label: filterOptions.false },\n            ...(filterOptions.unset !== undefined ? [{ value: \"unset\", label: filterOptions.unset }] : []),\n          ],\n        }\n      : undefined,\n    ...column,\n  };\n}\n"],"mappings":";AAwCI,SACE,KADF;AAvCJ,SAAS,OAAO,OAAO,SAAS;AAChC,SAAS,UAAU;AACnB,SAAS,oBAAoB;AAC7B,SAAS,iCAAuD;AA6BzD,SAAS,YAAY,EAAE,OAAO,UAAU,SAAS,QAAQ,YAAY,UAAU,GAAqB;AACzG,QAAM,SAAS,aAAa,aAAa,2BAA2B,UAAU;AAC9E,QAAM,QAAQ,UAAU,OAAO,SAAS,UAAU,QAAQ,UAAU;AACpE,QAAM,OACJ,UAAU,SAAS,OAAO,cAAc,UAAU,UAAU,OAAO,eAAe,OAAO;AAC3F,QAAM,OAAO,UAAU,SAAS,QAAQ,UAAU,WAAW,YAAY,UAAU,IAAI;AACvF,SACE,qBAAC,UAAK,cAAY,OAAO,WAAW,GAAG,yCAAyC,SAAS,GACvF;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,eAAW;AAAA,QACX,WAAW;AAAA,UACT;AAAA,UACA,UAAU,SACN,0BACA,UAAU,WAAW,YAAY,UAC/B,6BACA;AAAA,QACR;AAAA;AAAA,IACF;AAAA,IACA,oBAAC,UAAK,WAAU,WAAW,gBAAK;AAAA,KAClC;AAEJ;AA0BO,SAAS,cAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAgD;AAC9C,QAAM,QAAQ,CAAC,QAAW;AACxB,UAAM,IAAI,MAAM,GAAG;AACnB,WAAO,MAAM,OAAO,SAAS,MAAM,QAAQ,UAAU;AAAA,EACvD;AACA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,MAAM,CAAC,QAAQ,oBAAC,eAAY,OAAO,MAAM,GAAG,GAAG,SAAkB;AAAA;AAAA,IAEjE,QAAQ,WACJ,CAAC,QAAQ;AACP,YAAM,IAAI,MAAM,GAAG;AACnB,aAAO,KAAK,OAAO,OAAO,IAAI,IAAI;AAAA,IACpC,IACA;AAAA,IACJ,QAAQ,gBACJ;AAAA,MACE,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,QACP,EAAE,OAAO,QAAQ,OAAO,cAAc,KAAK;AAAA,QAC3C,EAAE,OAAO,SAAS,OAAO,cAAc,MAAM;AAAA,QAC7C,GAAI,cAAc,UAAU,SAAY,CAAC,EAAE,OAAO,SAAS,OAAO,cAAc,MAAM,CAAC,IAAI,CAAC;AAAA,MAC9F;AAAA,IACF,IACA;AAAA,IACJ,GAAG;AAAA,EACL;AACF;","names":[]}
+{"version":3,"sources":["../../src/components/data-table-cells.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\nimport { Check, Minus, X } from \"lucide-react\";\nimport { cn } from \"../lib/cn\";\nimport { useKitLabels, type LabelOverride } from \"../i18n/kit-labels\";\nimport { DEFAULT_DATA_TABLE_LABELS, type DataTableLabels } from \"./data-table-labels\";\nimport type { DataTableColumn } from \"./data-table\";\n\nexport interface BooleanMarkProps {\n  /** `true` → a check, `false` → a cross (or a dash, see `falseAs`), `null` /\n   *  `undefined` → a dash. */\n  value: boolean | null | undefined;\n  /**\n   * How `false` is drawn. `\"cross\"` (default) when \"no\" is news worth seeing — a\n   * failed check, a missing document. `\"dash\"` for a column that is mostly `false` and\n   * reads as a list of the `true` ones (kastlan's BoolCell): a column of crosses is\n   * noise. The screen-reader text says \"No\" either way.\n   */\n  falseAs?: \"cross\" | \"dash\";\n  /** The spoken words, over `dataTable.booleanTrue` / `booleanFalse` / `booleanUnset`\n   *  from `<UiKitProvider labels>`. */\n  labels?: LabelOverride<Pick<DataTableLabels, \"booleanTrue\" | \"booleanFalse\" | \"booleanUnset\">>;\n  className?: string;\n}\n\n/**\n * A yes/no value in a table cell: a green check, a muted cross, or a faint dash for\n * \"not set\" — with the word for a screen reader, since a glyph alone is announced as\n * nothing at all (or as \"image\").\n *\n * kastlan's `BoolCell` (shared/components/data-table/bool-cell.tsx) drew the icons with\n * no text, so a reader walking the table heard an empty cell for every row; the apps'\n * Yes/No chips were the other answer, and too loud for a column of them.\n */\nexport function BooleanMark({ value, falseAs = \"cross\", labels: labelsProp, className }: BooleanMarkProps) {\n  const labels = useKitLabels(\"dataTable\", DEFAULT_DATA_TABLE_LABELS, labelsProp);\n  const state = value === true ? \"true\" : value === false ? \"false\" : \"unset\";\n  const text =\n    state === \"true\" ? labels.booleanTrue : state === \"false\" ? labels.booleanFalse : labels.booleanUnset;\n  const Icon = state === \"true\" ? Check : state === \"false\" && falseAs === \"cross\" ? X : Minus;\n  return (\n    <span data-value={state} className={cn(\"inline-flex items-center align-middle\", className)}>\n      <Icon\n        aria-hidden\n        className={cn(\n          \"size-4\",\n          state === \"true\"\n            ? \"text-success\"\n            : state === \"false\" && falseAs === \"cross\"\n              ? \"text-muted\"\n              : \"text-placeholder\",\n        )}\n      />\n      <span className=\"sr-only\">{text}</span>\n    </span>\n  );\n}\n\nexport interface BooleanColumnOptions<T> {\n  key: string;\n  header: ReactNode;\n  /** The value of this row. */\n  value: (row: T) => boolean | null | undefined;\n  /** See {@link BooleanMarkProps.falseAs}. */\n  falseAs?: \"cross\" | \"dash\";\n  /** Sortable, `true` first on the first click (a column is sorted to find the yes\n   *  rows). Default true. */\n  sortable?: boolean;\n  /**\n   * A select filter over the column, with these option labels — pass them translated.\n   * Omitted: no filter. The option values are `\"true\"` / `\"false\"` (and `\"unset\"` when\n   * `unset` is given), which is also what `filterHref` takes for this column.\n   */\n  filterOptions?: { true: string; false: string; unset?: string };\n  /** Further column settings (`mobileHidden`, `headClassName`, …), merged over. */\n  column?: Partial<DataTableColumn<T>>;\n}\n\n/**\n * A {@link DataTableColumn} for a yes/no field: {@link BooleanMark} cells,\n * sortable with `true` first, and optionally a Yes/No select filter.\n */\nexport function booleanColumn<T>({\n  key,\n  header,\n  value,\n  falseAs,\n  sortable = true,\n  filterOptions,\n  column,\n}: BooleanColumnOptions<T>): DataTableColumn<T> {\n  const asKey = (row: T) => {\n    const v = value(row);\n    return v === true ? \"true\" : v === false ? \"false\" : \"unset\";\n  };\n  return {\n    key,\n    header,\n    cell: (row) => <BooleanMark value={value(row)} falseAs={falseAs} />,\n    // 0 for yes, 1 for no, null for unset (which the table sorts last either way).\n    sortBy: sortable\n      ? (row) => {\n          const v = value(row);\n          return v == null ? null : v ? 0 : 1;\n        }\n      : undefined,\n    filter: filterOptions\n      ? {\n          type: \"select\",\n          getValue: asKey,\n          options: [\n            { value: \"true\", label: filterOptions.true },\n            { value: \"false\", label: filterOptions.false },\n            ...(filterOptions.unset !== undefined ? [{ value: \"unset\", label: filterOptions.unset }] : []),\n          ],\n        }\n      : undefined,\n    ...column,\n  };\n}\n"],"mappings":";AAwCI,SACE,KADF;AAvCJ,SAAS,OAAO,OAAO,SAAS;AAChC,SAAS,UAAU;AACnB,SAAS,oBAAwC;AACjD,SAAS,iCAAuD;AA6BzD,SAAS,YAAY,EAAE,OAAO,UAAU,SAAS,QAAQ,YAAY,UAAU,GAAqB;AACzG,QAAM,SAAS,aAAa,aAAa,2BAA2B,UAAU;AAC9E,QAAM,QAAQ,UAAU,OAAO,SAAS,UAAU,QAAQ,UAAU;AACpE,QAAM,OACJ,UAAU,SAAS,OAAO,cAAc,UAAU,UAAU,OAAO,eAAe,OAAO;AAC3F,QAAM,OAAO,UAAU,SAAS,QAAQ,UAAU,WAAW,YAAY,UAAU,IAAI;AACvF,SACE,qBAAC,UAAK,cAAY,OAAO,WAAW,GAAG,yCAAyC,SAAS,GACvF;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,eAAW;AAAA,QACX,WAAW;AAAA,UACT;AAAA,UACA,UAAU,SACN,iBACA,UAAU,WAAW,YAAY,UAC/B,eACA;AAAA,QACR;AAAA;AAAA,IACF;AAAA,IACA,oBAAC,UAAK,WAAU,WAAW,gBAAK;AAAA,KAClC;AAEJ;AA0BO,SAAS,cAAiB;AAAA,EAC/B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,WAAW;AAAA,EACX;AAAA,EACA;AACF,GAAgD;AAC9C,QAAM,QAAQ,CAAC,QAAW;AACxB,UAAM,IAAI,MAAM,GAAG;AACnB,WAAO,MAAM,OAAO,SAAS,MAAM,QAAQ,UAAU;AAAA,EACvD;AACA,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA,MAAM,CAAC,QAAQ,oBAAC,eAAY,OAAO,MAAM,GAAG,GAAG,SAAkB;AAAA;AAAA,IAEjE,QAAQ,WACJ,CAAC,QAAQ;AACP,YAAM,IAAI,MAAM,GAAG;AACnB,aAAO,KAAK,OAAO,OAAO,IAAI,IAAI;AAAA,IACpC,IACA;AAAA,IACJ,QAAQ,gBACJ;AAAA,MACE,MAAM;AAAA,MACN,UAAU;AAAA,MACV,SAAS;AAAA,QACP,EAAE,OAAO,QAAQ,OAAO,cAAc,KAAK;AAAA,QAC3C,EAAE,OAAO,SAAS,OAAO,cAAc,MAAM;AAAA,QAC7C,GAAI,cAAc,UAAU,SAAY,CAAC,EAAE,OAAO,SAAS,OAAO,cAAc,MAAM,CAAC,IAAI,CAAC;AAAA,MAC9F;AAAA,IACF,IACA;AAAA,IACJ,GAAG;AAAA,EACL;AACF;","names":[]}

package/dist/components/data-table-column-settings.d.ts

@@ -0,0 +1,16 @@
+import type { Dispatch, SetStateAction } from "react";
+import type { DataTableLabels } from "./data-table-labels.js";
+import type { DataTableColumn } from "./data-table.js";
+/** The "Columns" rail and its drawer (`columnSettings`). */
+export declare function ColumnSettingsPanel<T>({ columns, hiddenCols, setHiddenCols, showSettings, setShowSettings, columnsCountLabel, labels, autoSizeAll, }: {
+    /** Every column, hidden ones included; the actions column is left out here. */
+    columns: DataTableColumn<T>[];
+    hiddenCols: Set<string>;
+    setHiddenCols: Dispatch<SetStateAction<Set<string>>>;
+    showSettings: boolean;
+    setShowSettings: (open: boolean) => void;
+    /** "Columns (n/m)", the rail's text and name. */
+    columnsCountLabel: string;
+    labels: DataTableLabels;
+    autoSizeAll: () => void;
+}): import("react").JSX.Element;