@eifi1/ui-kit 0.53.0 → 0.54.0

package/src/components/modal.tsx

@@ -257,8 +257,35 @@ export interface ModalProps extends Omit<ComponentPropsWithoutRef<"div">, "role"
    * the dialog asks for itself through `ModalCloseContext` while busy is refused too; one
    * made from an effect that depends on that close (ReauthDialog's on a resolved submit)
    * runs again once `busy` turns false, because the close changes with it.
+   *
+   * A dialog that must not be dismissed while NOTHING runs — a code shown once — wants
+   * {@link ModalProps.held} instead: the same hold without the request.
    */
   busy?: boolean;
+  /**
+   * Hold the dialog open: every dismissal `busy` refuses is refused — the backdrop,
+   * Escape, Back, the frame's X and an `actions(close)` button — but no request is
+   * claimed: the panel is not `aria-busy`. For a dialog the user must not lose by
+   * accident while nothing is in flight (keksdose audit follow-up, 2026-11-01): keksdose's
+   * one-time recovery code (auth/recovery-code-pane.tsx) refused in its own `onClose`,
+   * which comes after the exit has started and cannot hold Back — the first Back spent
+   * the dialog's history entry, and the second left the page, and the code with it.
+   * Held, a refused Back puts the entry back, so every Back is held, not only the first.
+   * The refusal is silent, as under `busy` — `onClose` is not called — so what the
+   * dialog is waiting for is said up front, not after a refused press.
+   *
+   * The way out is a close the CALLER decides on, which is never held: `open={false}`
+   * (the exit still plays) or unmounting, from the dialog's own "I have saved it" button.
+   * Not the `close` that `actions` and `headerActions` receive — that is the dialog's
+   * own dismissal, and held like the rest.
+   *
+   * `DialogFrame`'s X is DISABLED while held, where under `busy` it stays enabled and its
+   * press is dropped: a request is over in a moment, a hold lasts until the user acts,
+   * and an X that does nothing for that long reads as broken. Disabled rather than
+   * hidden, so the header does not reflow the moment the hold lifts; a caller that wants
+   * it gone passes `closeButton={!held}`. Independent of `busy`: either one holds.
+   */
+  held?: boolean;
   /**
    * The PANEL — the `role="dialog"` element the rest of the props go on, not the
    * backdrop around it (0.35, round 0.35 R4, the follow-up to API-2; as on
@@ -325,6 +352,7 @@ function ModalPanel({
   role = "dialog",
   urlParam: _urlParam,
   busy = false,
+  held = false,
   "aria-busy": ariaBusy,
   ownHistoryEntry = true,
   ref,
@@ -371,13 +399,14 @@ function ModalPanel({
     setDismissed(true);
     onClose();
   });
-  // `busy` (DUP-3) refuses HERE, before `lower` starts the exit: a refusal in the
-  // caller's `onClose` comes 220ms too late, after the panel has already gone down.
-  // A new function when `busy` flips, so a close asked for from an effect while busy
+  // `busy` (DUP-3) and `held` refuse HERE, before `lower` starts the exit: a refusal in
+  // the caller's `onClose` comes 220ms too late, after the panel has already gone down.
+  // A new function when the hold flips, so a close asked for from an effect while busy
   // (a resolved action whose caller's `isPending` trails its promise) runs again.
+  const holding = busy || held;
   const requestClose = useCallback(() => {
-    if (!busy) lower();
-  }, [busy, lower]);
+    if (!holding) lower();
+  }, [holding, lower]);
   // A panel on its way out after `open` turned false is already closed: a press on
   // its fading backdrop must not report a second close.
   const backdropClose = useBackdropClose(active ? requestClose : () => {});
@@ -385,8 +414,8 @@ function ModalPanel({
   // this the only way out of a dialog is finding its close button — and Back, the
   // gesture everyone reaches for, navigated the page underneath instead (#172).
   // Held only while open: a closed `open={false}` dialog must not own a history entry.
-  // `held`: a Back while busy is refused, and the entry it took is put back.
-  useOverlayHistory(active && ownHistoryEntry, requestClose, { held: busy });
+  // `held`: a Back while busy or held is refused, and the entry it took is put back.
+  useOverlayHistory(active && ownHistoryEntry, requestClose, { held: holding });
 
   // Through the shared hook and not by hand: this component's own save/restore copy
   // was one half of the pair that left the page permanently unscrollable when a dialog

package/src/components/number-input.tsx

@@ -222,9 +222,10 @@ const asTyped = (text: string) => text;
 
 // ── The money guard (kastlan 5, Kurvenschmiede) ─────────────────────────────────
 
-// The codes the kit's own currency pickers offer, as whole words: "Amount (CHF)",
-// "EUR", "Kosten CHF". Not every ISO 4217 code — "ALL", "TOP" and "PEN" are codes too,
-// and an upper-case label would trip on them.
+// The codes the kit's own currency pickers know, as whole words: "Amount (CHF)",
+// "EUR", "Kosten CHF". A `retired` one too (BGN): a label that names it is still money,
+// whatever the pickers offer. Not every ISO 4217 code — "ALL", "TOP" and "PEN" are codes
+// too, and an upper-case label would trip on them.
 const CURRENCY_CODE = new RegExp(`(?:^|[^A-Za-z])(?:${CURRENCIES.map((c) => c.code).join("|")})(?![A-Za-z])`);
 // Symbols no unit of measure is written with. Not "kr", "R" or "Fr": those are words
 // and units as often as they are money.

package/src/components/stat-tile.tsx

@@ -229,8 +229,27 @@ export interface StatTileProps extends Omit<ComponentPropsWithRef<"div">, "child
   /** Anything below the rest — a progress bar, a link row. */
   footer?: ReactNode;
   /** Tag every figure `data-private`, so the host's demo-mode rule blurs it — the
-   *  same attribute `Tooltip redact` and the chart tooltip's value cell carry. */
+   *  same attribute `Tooltip redact` and the chart tooltip's value cell carry.
+   *  The figures are the tile's own: value, delta, projection, sub-values and the
+   *  trend. The `description` and `footer` are the app's nodes and stay readable;
+   *  see {@link StatTileProps.descriptionSensitive} for the ones that carry an amount. */
   sensitive?: boolean;
+  /**
+   * Tag the `description` line `data-private` too, as `sensitive` tags the figures.
+   * For a description that names an amount: keksdose's tax reserve tile states its
+   * basis there ("…applied to €42,000"), and its report KpiCard puts a `hintSensitive`
+   * hint there — both tag their own `<span data-private>` today
+   * (reports/tabs/tax-tab.tsx, reports/charts/kpi-card.tsx). Separate from
+   * `sensitive`, so a description of words ("Last 12 months") on a money tile stays
+   * readable in demo mode. keksdose audit follow-up, 2026-11-01.
+   */
+  descriptionSensitive?: boolean;
+  /**
+   * Tag the `footer` `data-private`, as `sensitive` tags the figures — for a footer
+   * that carries an amount: keksdose's tax reserve tile's shortfall line ("Set aside
+   * €1,200 more…"), which it tags by hand. keksdose audit follow-up, 2026-11-01.
+   */
+  footerSensitive?: boolean;
   /** Skeleton in place of the value; delta, sub-values and trend are withheld. */
   loading?: boolean;
   /** `"sm"` for dense grids (a metrics wall); `"md"` the default KPI. */
@@ -317,6 +336,8 @@ export function StatTile({
   icon,
   footer,
   sensitive = false,
+  descriptionSensitive = false,
+  footerSensitive = false,
   loading = false,
   size = "md",
   variant = "card",
@@ -551,7 +572,11 @@ export function StatTile({
       )}
 
       {deltaNode}
-      {description != null && <div className="mt-1 text-xs text-muted">{description}</div>}
+      {description != null && (
+        <div data-private={descriptionSensitive ? "" : undefined} className="mt-1 text-xs text-muted">
+          {description}
+        </div>
+      )}
       {!large && graphic && <div className="mt-2">{graphic}</div>}
 
       {!loading && ((large && projections.length > 0) || (subValues && subValues.length > 0)) && (
@@ -572,7 +597,11 @@ export function StatTile({
         </div>
       )}
 
-      {footer != null && <div className="mt-2">{footer}</div>}
+      {footer != null && (
+        <div data-private={footerSensitive ? "" : undefined} className="mt-2">
+          {footer}
+        </div>
+      )}
     </Card>
   );
 }

package/src/currencies.ts

@@ -12,6 +12,11 @@
 // CurrencySelect, AmountInput's currency chip and NumberInput's code detection read this
 // same array (components/currency-option-list re-exports it, and currency-select as it
 // always has), so the list the pickers show and the flags an app ships cannot drift.
+//
+// A currency that was REPLACED stays in the array, marked `retired`: the pickers stop
+// offering it, and whatever reads a value an app already holds — the trigger's flag and
+// code, `getCurrency`, the flag subset, NumberInput's code detection — keeps knowing it
+// (keksdose audit follow-up, 2026-11-01: the lev, after Bulgaria's euro).
 
 export interface CurrencyOption {
   code: string;
@@ -19,6 +24,19 @@ export interface CurrencyOption {
   symbol: string;
   /** ISO 3166-1 alpha-2 country code (lowercase) used by flag-icons. */
   country: string;
+  /**
+   * The day ("YYYY-MM-DD") the currency was replaced as its country's money — set only on
+   * one that was. The pickers leave it out of their default list. A field that already
+   * holds it still shows it (the trigger's flag and code, and its row in the list,
+   * checked), and an explicit `options` list that names it still offers it: that list is
+   * the caller's.
+   *
+   * Marked rather than deleted, because an app may hold amounts in it from before. Gone
+   * from the array, `getCurrency` would answer `undefined` for a stored value, the field
+   * would show its placeholder over a real amount, and an app's flag subset
+   * (`CURRENCY_COUNTRIES`) would ship that value's flag as an empty box.
+   */
+  retired?: string;
 }
 
 export const CURRENCIES: CurrencyOption[] = [
@@ -37,7 +55,8 @@ export const CURRENCIES: CurrencyOption[] = [
   { code: "CZK", name: "Czech Koruna", symbol: "Kč", country: "cz" },
   { code: "HUF", name: "Hungarian Forint", symbol: "Ft", country: "hu" },
   { code: "RON", name: "Romanian Leu", symbol: "lei", country: "ro" },
-  { code: "BGN", name: "Bulgarian Lev", symbol: "лв", country: "bg" },
+  // Bulgaria adopted the euro on 2026-01-01 (keksdose audit follow-up, 2026-11-01).
+  { code: "BGN", name: "Bulgarian Lev", symbol: "лв", country: "bg", retired: "2026-01-01" },
   { code: "TRY", name: "Turkish Lira", symbol: "₺", country: "tr" },
   { code: "RUB", name: "Russian Ruble", symbol: "₽", country: "ru" },
   { code: "CNY", name: "Chinese Yuan", symbol: "¥", country: "cn" },
@@ -56,8 +75,9 @@ export const CURRENCIES: CurrencyOption[] = [
  * code flag-icons names it by (`fi-ch`, `flags/4x3/ch.svg`). `CHF` → `"ch"`, `EUR` →
  * `"eu"` (flag-icons has the EU's flag under that code).
  *
- * Derived from {@link CURRENCIES}, so a currency the pickers gain is a flag here too. An
- * app that ships only the flags it renders builds its subset from these values:
+ * Derived from {@link CURRENCIES}, so a currency the pickers gain is a flag here too — and
+ * a `retired` one keeps its flag, for the values an app still holds in it. An app that
+ * ships only the flags it renders builds its subset from these values:
  *
  * ```ts
  * // vite.config.ts — plain Node, no DOM

package/src/feedback/feedback-context-labels.ts

@@ -7,4 +7,5 @@ import type { FeedbackContextLabels } from "./feedback-context";
 export const DEFAULT_FEEDBACK_CONTEXT_LABELS: FeedbackContextLabels = {
   user: "User",
   attachUrl: "Attach current page URL",
+  diagnostics: "Diagnostics sent with the report",
 };

package/src/feedback/feedback-context.tsx

@@ -1,8 +1,10 @@
+import { useId } from "react";
 import { Checkbox } from "../components/checkbox";
 import { DEFAULT_COMMON_LABELS, useKitLabels, type LabelOverride } from "../i18n/kit-labels";
 import { cn } from "../lib/cn";
 import type { FeedbackContext, FeedbackEnvironment } from "./feedback-record";
 import { DEFAULT_FEEDBACK_CONTEXT_LABELS } from "./feedback-context-labels";
+import { diagnosticsEntries, FeedbackDiagnosticsList } from "./feedback-diagnostics";
 
 /**
  * The reporter context of a feedback report: the box the submit dialog shows, and the
@@ -70,6 +72,10 @@ export interface FeedbackContextInput {
   viewport?: string;
   /** Default `navigator.userAgent`. */
   ua?: string;
+  /** What the app attached about the thing reported — `useFeedbackSubmit().open(category,
+   *  { diagnostics })` (keksdose live #481). Sent whatever `attachUrl` says, as the box
+   *  shows it; left out of the object when it has no key to show. */
+  diagnostics?: Readonly<Record<string, unknown>> | null;
 }
 
 /** The pathname of a full or path-only URL; `""` for something that is neither. */
@@ -85,12 +91,13 @@ function pathOf(url: string, base: string | undefined): string {
 /**
  * The `context` object of `POST /feedback` (§3.2), keys in keksdose's order: `url`, `route`,
  * `origin`, `environment`, `user_id`, `user_email`, `user_display_name`, `viewport`, `ua`,
- * `version`.
+ * `version`, then the app's `diagnostics`.
  *
  * With `attachUrl: false`, `url` and `route` are `""` — present and empty, as keksdose
  * sends them, so a reader can tell "withheld" from "an old row without the key".
  * `environment` and `version` are omitted when the app passes none (kastlan had no
- * version), rather than sent as `undefined`.
+ * version), rather than sent as `undefined`; `diagnostics` when the box would show no
+ * line of it (none, `{}`, not a record).
  *
  * Reads `window` / `navigator` only for the defaults it was not given, so it is a pure
  * function in a test that passes everything.
@@ -111,6 +118,8 @@ export function feedbackContext(input: FeedbackContextInput): FeedbackContext {
   context.viewport = input.viewport ?? (win ? `${win.innerWidth}x${win.innerHeight}` : "");
   context.ua = input.ua ?? (typeof navigator === "undefined" ? "" : navigator.userAgent);
   if (input.version !== undefined) context.version = input.version;
+  // The box's own test: what it draws no line of is not sent either.
+  if (input.diagnostics && diagnosticsEntries(input.diagnostics).length) context.diagnostics = input.diagnostics;
   return context;
 }
 
@@ -127,6 +136,9 @@ export interface FeedbackContextLabels {
   user: string;
   /** The checkbox. The URL it is about is the line beneath it. */
   attachUrl: string;
+  /** The heading over what the app attached — `open(category, { diagnostics })`, shown
+   *  read-only under the URL (keksdose live #481). de-CH: "Mitgesendete Diagnose" */
+  diagnostics: string;
 }
 
 // Defined in ./feedback-context-labels, which holds no component code (0.34, KS U8).
@@ -140,6 +152,10 @@ export interface FeedbackContextBoxProps {
   /** The checkbox, on by default in the dialog (§4.2) — the same `attachUrl`. */
   attachUrl: boolean;
   onAttachUrlChange: (next: boolean) => void;
+  /** What the app attached — the same `diagnostics` handed to {@link feedbackContext}.
+   *  Shown read-only, each key and its value as the row detail draws them; no block when
+   *  there is no line to show. */
+  diagnostics?: Readonly<Record<string, unknown>> | null;
   /** Prop > `<UiKitProvider labels={{ feedbackContext }}>` > English. */
   labels?: LabelOverride<FeedbackContextLabels>;
   className?: string;
@@ -157,6 +173,10 @@ export interface FeedbackContextBoxProps {
  * against whatever screen happened to be open, the queue reads as if it were about that
  * screen.
  *
+ * Below the URL, what the app attached (`diagnostics`, keksdose live #481: a stuck receipt
+ * scan's bookkeeping), read-only and in the row detail's own lines: the reporter sees what
+ * goes with the report, and that the URL checkbox does not withhold it.
+ *
  * Nothing in here is the app's: hand it the values handed to {@link feedbackContext}, and
  * what the box shows is what is sent.
  */
@@ -165,11 +185,14 @@ export function FeedbackContextBox({
   url,
   attachUrl,
   onAttachUrlChange,
+  diagnostics,
   labels: labelsProp,
   className,
 }: FeedbackContextBoxProps) {
   const labels = useKitLabels("feedbackContext", DEFAULT_FEEDBACK_CONTEXT_LABELS, labelsProp);
   const common = useKitLabels("common", DEFAULT_COMMON_LABELS);
+  const diagnosticsId = useId();
+  const attached = diagnosticsEntries(diagnostics);
   const submitter = submitterLine(user);
   // "User: Ada …" through `common.fieldValue`, so French gets its space before the colon
   // and Chinese its full-width one; the label and its punctuation are drawn bold, as
@@ -208,6 +231,15 @@ export function FeedbackContextBox({
           ) : undefined
         }
       />
+      {attached.length > 0 && (
+        // A named group, so a screen reader hears what the pairs are before it reads them.
+        <div role="group" aria-labelledby={diagnosticsId} className="space-y-0.5 pt-1">
+          <div id={diagnosticsId} className="font-medium text-secondary">
+            {labels.diagnostics}
+          </div>
+          <FeedbackDiagnosticsList entries={attached} />
+        </div>
+      )}
     </div>
   );
 }

package/src/feedback/feedback-diagnostics.tsx

@@ -0,0 +1,41 @@
+/**
+ * `context.diagnostics` (§3.2), drawn one way wherever it shows: in the submit dialog's
+ * context box, to the reporter before it goes (§4.2), and in the row detail, to the admin
+ * and the author afterwards (§4.4.2). One module for both, so the reporter is shown the
+ * very lines the admin will read (keksdose live #481).
+ *
+ * Internal: neither `@eifi1/ui-kit/feedback` nor the barrel names it.
+ */
+
+/** `diagnostics` as [key, text] pairs, in the app's order: a string, number or boolean as
+ *  written, an object or a list as JSON, nothing as "—". Empty for no diagnostics, and for
+ *  a value that is not a plain object — the server stores whatever the client sent. */
+export function diagnosticsEntries(diagnostics: unknown): Array<[string, string]> {
+  if (!diagnostics || typeof diagnostics !== "object" || Array.isArray(diagnostics)) return [];
+  return Object.entries(diagnostics).map(([key, v]) => [
+    key,
+    v === null || v === undefined || v === ""
+      ? "—"
+      : typeof v === "object"
+        ? JSON.stringify(v)
+        : String(v as string | number | boolean | bigint),
+  ]);
+}
+
+/** The pairs as a definition list: each key beside its value, in monospace. Read-only in
+ *  both places; the heading over it is the caller's. */
+export function FeedbackDiagnosticsList({ entries }: { entries: ReadonlyArray<readonly [string, string]> }) {
+  return (
+    <dl
+      className="grid grid-cols-[auto_minmax(0,1fr)] gap-x-3 gap-y-0.5 font-mono text-xs"
+      data-feedback-diagnostics=""
+    >
+      {entries.map(([key, text]) => (
+        <div key={key} className="contents">
+          <dt className="text-muted">{key}</dt>
+          <dd className="min-w-0 break-words text-secondary">{text}</dd>
+        </div>
+      ))}
+    </dl>
+  );
+}

package/src/feedback/feedback-dialog.tsx

@@ -146,6 +146,16 @@ interface FeedbackDialogBaseProps<C extends string = string> {
    *  English. Optional since 0.12.0; a whole `FeedbackDialogLabels` still fits. */
   labels?: LabelOverride<FeedbackDialogLabels>;
   submitting?: boolean;
+  /**
+   * The subject and the body each opening starts with, in place of empty fields — the
+   * reporter edits them like anything typed. `useFeedbackSubmit().open(category, { title,
+   * body })` passes them (keksdose live #481: "Report this problem" opens on words the
+   * screen already knows). Read when the dialog opens; a change while it is open leaves
+   * the draft alone.
+   */
+  defaultTitle?: string;
+  /** The body's, as `defaultTitle` is the subject's. */
+  defaultBody?: string;
   contextSlot?: ReactNode;
   attachmentAccept?: string[];
   maxAttachmentBytes?: number;
@@ -245,6 +255,8 @@ export function FeedbackDialog<C extends string = string>(props: FeedbackDialogP
     onCategoryChange,
     labels: labelsProp,
     submitting = false,
+    defaultTitle = "",
+    defaultBody = "",
     contextSlot,
     attachmentAccept = DEFAULT_ATTACHMENT_ACCEPT,
     maxAttachmentBytes = DEFAULT_MAX_ATTACHMENT_BYTES,
@@ -254,8 +266,8 @@ export function FeedbackDialog<C extends string = string>(props: FeedbackDialogP
     attachmentButtonSize,
     publicNotice,
   } = props;
-  const [title, setTitle] = useState("");
-  const [body, setBody] = useState("");
+  const [title, setTitle] = useState(defaultTitle);
+  const [body, setBody] = useState(defaultBody);
   const [attachment, setAttachment] = useState<File | null>(null);
   // `attachments="multiple"` only: the capture, apart from the picked/pasted files.
   const [screenshot, setScreenshot] = useState<File | null>(null);
@@ -283,8 +295,8 @@ export function FeedbackDialog<C extends string = string>(props: FeedbackDialogP
   if (open !== wasOpen) {
     setWasOpen(open);
     if (open) {
-      setTitle("");
-      setBody("");
+      setTitle(defaultTitle);
+      setBody(defaultBody);
       setAttachment(null);
       setScreenshot(null);
       setFiles([]);

package/src/feedback/feedback-record.ts

@@ -59,6 +59,11 @@ export interface FeedbackContext {
   ua?: string;
   /** The app build (`__APP_VERSION__`). */
   version?: string;
+  /** What the app attached about the thing reported (keksdose's stuck receipt scan, live
+   *  #481): a flat record of short values, in the order the app wrote them. The row
+   *  detail shows it to the admin and the author, never to anyone else; erasure drops it
+   *  (it is not on server-kit's `FEEDBACK_CONTEXT_KEEP`). */
+  diagnostics?: Readonly<Record<string, unknown>>;
   // Crash rows (server-written, keksdose `feedback_service.py:346`).
   fingerprint?: string;
   /** Which error boundary caught it. */

package/src/feedback/feedback-row-detail-labels.ts

@@ -14,6 +14,7 @@ export const DEFAULT_FEEDBACK_DETAIL_LABELS: FeedbackDetailLabels = {
   cancel: "Cancel",
   url: "URL",
   copyUrl: "Copy URL",
+  diagnostics: "Diagnostics",
   attachment: "Attachment",
   download: (name) => `Download ${name}`,
   downloadFailed: "The attachment could not be downloaded.",

package/src/feedback/feedback-row-detail.tsx

@@ -35,6 +35,7 @@ import {
   splitDescription,
 } from "./feedback-record";
 import type { FeedbackContext, FeedbackRecord } from "./feedback-record";
+import { diagnosticsEntries, FeedbackDiagnosticsList } from "./feedback-diagnostics";
 import { runMutation } from "./feedback-mutation";
 import { feedbackPage, feedbackPageLinkTarget } from "./feedback-page-link";
 import { useFeedbackStatusUndo } from "./feedback-status-undo";
@@ -117,6 +118,9 @@ export interface FeedbackDetailLabels {
   /** The copy button beside the link — copies the FULL `context.url`.
    *  de-CH: "URL kopieren" */
   copyUrl: string;
+  /** The heading over `context.diagnostics`, between the URL and the attachment (keksdose
+   *  live #481). de-CH: "Diagnose" */
+  diagnostics: string;
   /** Section 3's heading, and each picture's alt text. de-CH: "Anhang" */
   attachment: string;
   /** A PDF's / text file's download button, given the file's name.
@@ -631,6 +635,9 @@ export function FeedbackRowDetail({
   const { description } = splitDescription(row.body);
   const page = feedbackPage(row.context);
   const pageLink = page && feedbackPageLinkTarget(page, pageLinkExclude);
+  // What the app attached is for whoever handles the report and whoever sent it, never
+  // for another viewer of a shared row (keksdose live #481).
+  const diagnostics = canEdit || access.isAuthor ? diagnosticsEntries(row.context?.diagnostics) : [];
   // 0.47 (§12): with the entries, each entry's file is drawn inline in the Replies
   // timeline, so the Attachment section holds the report's own files.
   const files = feedbackAttachmentUrls(row.replies ? { ...row, replies: undefined } : row);
@@ -733,6 +740,12 @@ export function FeedbackRowDetail({
         </FeedbackDetailSection>
       )}
 
+      {diagnostics.length > 0 && (
+        <FeedbackDetailSection title={labels.diagnostics}>
+          <FeedbackDiagnosticsList entries={diagnostics} />
+        </FeedbackDetailSection>
+      )}
+
       {files.length > 0 && (
         <FeedbackDetailSection title={labels.attachment}>
           <div className="flex min-w-0 flex-wrap items-start gap-2">

package/src/feedback/feedback-submit-dialog.tsx

@@ -12,6 +12,7 @@ import {
   type FeedbackContext,
   type FeedbackEnvironment,
 } from "./feedback-record";
+import type { FeedbackSubmitOpenOptions } from "./feedback-submit";
 import type { FeedbackCategory } from "./feedback-vocabulary";
 
 /**
@@ -49,6 +50,9 @@ export interface FeedbackSubmitDialogProps {
   capture?: false | (() => Promise<File | null>);
   /** `UseFeedbackSubmitOptions.publicNotice` (0.38): the line under the body. */
   publicNotice?: boolean;
+  /** `open(category, options)`'s, taken when it opened (keksdose live #481): the box
+   *  shows the diagnostics and the report carries them; the title and body prefill. */
+  opened?: FeedbackSubmitOpenOptions;
 }
 
 /** `FeedbackDialog` as `useFeedbackSubmit` settles it — see the hook for what it settles. */
@@ -66,6 +70,7 @@ export function FeedbackSubmitDialog({
   version,
   capture,
   publicNotice = false,
+  opened: { diagnostics, title, body } = {},
 }: FeedbackSubmitDialogProps) {
   const toastText = useFeedbackToastLabels();
   const dialogText = useKitLabels("feedbackDialog", DEFAULT_FEEDBACK_DIALOG_LABELS);
@@ -108,10 +113,18 @@ export function FeedbackSubmitDialog({
       }
       onCaptureScreenshot={onCaptureScreenshot}
       publicNotice={publicNotice ? (dialogText.publicNotice ?? DEFAULT_FEEDBACK_DIALOG_LABELS.publicNotice) : undefined}
+      defaultTitle={title}
+      defaultBody={body}
       // The context is read off the very values the box below shows (§3.2).
-      onSubmit={(data) => onSubmit(data, feedbackContext({ user, attachUrl, url, environment, version }))}
+      onSubmit={(data) => onSubmit(data, feedbackContext({ user, attachUrl, url, environment, version, diagnostics }))}
       contextSlot={
-        <FeedbackContextBox user={user} url={url} attachUrl={attachUrl} onAttachUrlChange={onAttachUrlChange} />
+        <FeedbackContextBox
+          user={user}
+          url={url}
+          attachUrl={attachUrl}
+          onAttachUrlChange={onAttachUrlChange}
+          diagnostics={diagnostics}
+        />
       }
     />
   );

package/src/feedback/feedback-submit.tsx

@@ -97,14 +97,42 @@ export interface UseFeedbackSubmitOptions<R = unknown> {
   publicNotice?: boolean;
 }
 
+/**
+ * `open`'s second argument (keksdose live #481: "Report this problem" on a receipt scan
+ * that never finished, filed with the scan's bookkeeping). All of it optional, and none of
+ * it outlives the opening it was handed to.
+ */
+export interface FeedbackSubmitOpenOptions {
+  /**
+   * What the app knows about the thing reported — keksdose's stuck scan: its id, status,
+   * attempts, last error. Taken when the dialog opens (a shallow copy, so what the box
+   * shows is what goes, even if the app's object changes while the reporter types), shown
+   * read-only in the context box, and sent as `context.diagnostics` whatever "Attach
+   * current page URL" says: that box withholds the page, not this. Flat, short values,
+   * never the reported content itself (§3.2); the row detail shows them to the admin and
+   * the author only.
+   */
+  diagnostics?: Readonly<Record<string, unknown>>;
+  /** The subject the form starts with; the reporter can change it. Where the app's reports
+   *  are public (`publicNotice`), other users read it: what only the admin should see goes
+   *  in `diagnostics`. */
+  title?: string;
+  /** The body the form starts with, as `title` is the subject's. */
+  body?: string;
+}
+
 export interface FeedbackSubmit {
   /**
    * Open the dialog on `category` — a `FeedbackMenu` row's (§4.2: "default category when
    * opened from a row: that row's"). Without one, or with `CRASH` (never pickable), it
    * opens on `OTHER`, the server's own default (§3.4). Each open starts a fresh form,
    * reads `location.href` for the context box and ticks "Attach current page URL" again.
+   *
+   * `options` (0.54, keksdose live #481) is a screen's own report — `open("BUG", {
+   * diagnostics })` from "Report this problem": the diagnostics shown in the box and sent,
+   * the subject and body prefilled. An open without them starts empty and sends none.
    */
-  open: (category?: FeedbackCategory) => void;
+  open: (category?: FeedbackCategory, options?: FeedbackSubmitOpenOptions) => void;
   /** Close it, as Cancel does. */
   close: () => void;
   /**
@@ -140,7 +168,8 @@ export interface FeedbackSubmit {
  * - The pickable categories — Bug, Idea, Question, Other, in the kit's words. `CRASH` is
  *   filed by the error boundary and is never offered (keksdose feedback #160).
  * - The context box, built from the same values as the `context` it sends
- *   ({@link FeedbackContextBox} / `feedbackContext`), the URL read when the dialog OPENS.
+ *   ({@link FeedbackContextBox} / `feedbackContext`), the URL read when the dialog OPENS,
+ *   and the diagnostics `open` was handed then (0.54, keksdose live #481).
  * - Upload every file, then create (keksdose `use-feedback-dialog.tsx:89`): the
  *   screenshot to `screenshot_url`, the rest to `attachment_urls`, all in parallel.
  * - The toasts, from `feedbackToast`: filed, failed (the server's `detail` through
@@ -161,18 +190,21 @@ export function useFeedbackSubmit<R = unknown>(options: UseFeedbackSubmitOptions
   const [category, setCategory] = useState<FeedbackCategory>("OTHER");
   const [url, setUrl] = useState("");
   const [attachUrl, setAttachUrl] = useState(true);
+  const [opened, setOpened] = useState<FeedbackSubmitOpenOptions>({});
   const [submitting, setSubmitting] = useState(false);
   // Which opening a send belongs to — see "closed and opened again" above.
   const opening = useRef(0);
   const inFlight = useRef(false);
 
-  const open = (next?: FeedbackCategory) => {
+  const open = (next?: FeedbackCategory, given?: FeedbackSubmitOpenOptions) => {
     opening.current += 1;
     setCategory(next && FEEDBACK_PICKABLE_CATEGORIES.includes(next) ? next : "OTHER");
     setUrl(typeof window === "undefined" ? "" : window.location.href);
     // Fresh every time (Kurvenschmiede use-feedback-dialog.tsx:80): a reporter who left the
     // page out of one idea is not saying the bug report after it is unrelated too.
     setAttachUrl(true);
+    // This opening's own, nothing of the last one's; the diagnostics copied now (#481).
+    setOpened({ ...given, diagnostics: given?.diagnostics && { ...given.diagnostics } });
     setIsOpen(true);
   };
   const close = () => setIsOpen(false);
@@ -229,6 +261,7 @@ export function useFeedbackSubmit<R = unknown>(options: UseFeedbackSubmitOptions
         version={version}
         capture={capture}
         publicNotice={publicNotice}
+        opened={opened}
       />
     </Suspense>
   ) : null;

package/src/hooks/use-hotkey.ts

@@ -119,10 +119,33 @@ export function matchesHotkey(e: KeyboardEvent, combo: ParsedHotkey): boolean {
   return symbol && !combo.shift ? true : e.shiftKey === combo.shift;
 }
 
+/**
+ * Whether `el` is editable content — `isContentEditable`, read from the attributes where
+ * the engine has no such property (keksdose audit follow-up, 2026-11-01). jsdom is one:
+ * there a hotkey fired while typing in a contenteditable, so a test could not show the
+ * editor keeping its letters, and an engine without the property would do the same.
+ *
+ * The nearest element with a `contenteditable` that names a state decides: `""`,
+ * `"true"` and `"plaintext-only"` edit, `"false"` does not — a `false` island inside an
+ * editor is not typed in. Any other value is the attribute's invalid-value default,
+ * which inherits, so the search goes on to the next one up. Keywords are
+ * case-insensitive. None at all: editable only in a `designMode` document.
+ */
+function isEditableContent(el: HTMLElement): boolean {
+  const native = (el as { isContentEditable?: boolean }).isContentEditable;
+  if (native !== undefined) return native;
+  for (let at = el.closest("[contenteditable]"); at; at = at.parentElement?.closest("[contenteditable]") ?? null) {
+    const state = (at.getAttribute("contenteditable") ?? "").toLowerCase();
+    if (state === "" || state === "true" || state === "plaintext-only") return true;
+    if (state === "false") return false;
+  }
+  return el.ownerDocument.designMode === "on";
+}
+
 /** Is the focus somewhere that takes typed characters? */
 function isTypingTarget(target: EventTarget | null): boolean {
   if (!(target instanceof HTMLElement)) return false;
-  if (target.isContentEditable) return true;
+  if (isEditableContent(target)) return true;
   if (target instanceof HTMLTextAreaElement || target instanceof HTMLSelectElement) return true;
   if (target instanceof HTMLInputElement) {
     return !["button", "checkbox", "radio", "submit", "reset", "range", "color", "file", "image"].includes(target.type);