@cosmicdrift/kumiko-renderer 0.386.0 → 0.388.0

package/dist/web/widgets/result-panel.d.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
-/** Ergebnis-Sektion eines Rechners: SectionCard mit Empty-Zustand (Banner)
- *  oder Kennzahl-Liste (DetailList) + optionalen Extras (Tabelle, Hinweise).
- *  Ersetzt die handgebauten `<dl>`/Banner-Blöcke in Custom-Screens. */
+/** Result section for a calculator: SectionCard with an empty state (Banner)
+ *  or a metric list (DetailList) plus optional extras (table, notes).
+ *  Replaces hand-built `<dl>`/banner blocks in custom screens. */
 export declare function ResultPanel({ title, subtitle, empty, emptyText, rows, footer, children, testId, }: {
     readonly title: string;
     readonly subtitle?: string;
@@ -12,7 +12,7 @@ export declare function ResultPanel({ title, subtitle, empty, emptyText, rows, f
         readonly value: ReactNode;
         readonly emphasize?: boolean;
     }[];
-    /** Action-Slot am Karten-Fuß (z.B. „In Finanzierung übernehmen"). */
+    /** Action slot at the bottom of the card (e.g. "Move to financing"). */
     readonly footer?: ReactNode;
     readonly children?: ReactNode;
     readonly testId?: string;
@@ -27,18 +27,18 @@ export interface ResultTableFooterRow {
     readonly value: ReactNode;
     readonly emphasize?: boolean;
 }
-/** Statische, prop-getriebene Ergebnistabelle für berechnete Zeilen (Tranchen,
- *  Szenarien). Nimmt dem Screen die `<table>`+tabular-nums-Ketten ab.
- *  ponytail: bewusst die minimale Read-only-Tabelle — für Sort/Pager/Facets
- *  stattdessen usePrimitives().DataTable bzw. QueryTable nutzen. */
+/** Static, prop-driven result table for calculated rows (tranches, scenarios).
+ *  Avoids repeating the `<table>`+tabular-nums pattern in each screen.
+ *  ponytail: intentionally minimal and read-only—for sorting, paging, or facets,
+ *  use usePrimitives().DataTable or QueryTable instead. */
 export declare function ResultTable<Row>({ columns, rows, rowKey, testId, className, card, footer, }: {
     readonly columns: readonly ResultColumn<Row>[];
     readonly rows: readonly Row[];
     readonly rowKey: (row: Row, index: number) => string;
     readonly testId?: string;
     readonly className?: string;
-    /** Rahmen-Look wie die CRUD-Liste (DataTable): gerundeter Border-Container +
-     *  bg-muted-Header-Band. Default = bare (nur die Tabelle, ohne Container). */
+    /** Framed appearance like the CRUD list (DataTable): rounded border container +
+     *  bg-muted header band. Default = bare (table only, without a container). */
     readonly card?: boolean;
     /** Summary rows (Subtotal/Tax/Total) rendered as real `<tr>`s in the same
      *  `<table>` instead of a separate flex-div next to it — guarantees
@@ -49,12 +49,12 @@ export declare function ResultTable<Row>({ columns, rows, rowKey, testId, classN
 export interface ComparisonMetric<Col> {
     readonly label: string;
     readonly value: (col: Col, index: number) => ReactNode;
-    /** Index der besten Spalte für diese Zeile (hervorgehoben); -1 = keine. */
+    /** Index of the best column for this row (highlighted); -1 = none. */
     readonly bestIndex?: (cols: readonly Col[]) => number;
 }
-/** Transponierte Vergleichstabelle: Zeile = Kennzahl, Spalte = Variante, je
- *  Kennzahl optional die beste Spalte hervorgehoben. Für Szenario-/Angebots-
- *  Vergleiche, wo ResultTable (Zeile=Datensatz) nicht passt. */
+/** Transposed comparison table: row = metric, column = variant, with the best
+ *  column optionally highlighted for each metric. For scenario/offer comparisons
+ *  where ResultTable (row = record) is not suitable. */
 export declare function ComparisonTable<Col>({ columns, columnHeader, columnKey, metrics, metricLabel, testId, className, card, }: {
     readonly columns: readonly Col[];
     readonly columnHeader: (col: Col, index: number) => string;
@@ -63,7 +63,7 @@ export declare function ComparisonTable<Col>({ columns, columnHeader, columnKey,
     readonly metricLabel: string;
     readonly testId?: string;
     readonly className?: string;
-    /** Rahmen-Look wie die CRUD-Liste (DataTable): gerundeter Border-Container +
-     *  bg-muted-Header-Band. Default = bare. */
+    /** Framed appearance like the CRUD list (DataTable): rounded border container +
+     *  bg-muted header band. Default = bare. */
     readonly card?: boolean;
 }): ReactNode;

package/dist/web/widgets/result-panel.js

@@ -3,24 +3,24 @@ import { usePrimitives } from "../../index.js";
 import { cn } from "../lib/cn.js";
 import { DetailList } from "./detail-list.js";
 import { SectionCard } from "./section-card.js";
-/** Ergebnis-Sektion eines Rechners: SectionCard mit Empty-Zustand (Banner)
- *  oder Kennzahl-Liste (DetailList) + optionalen Extras (Tabelle, Hinweise).
- *  Ersetzt die handgebauten `<dl>`/Banner-Blöcke in Custom-Screens. */
+/** Result section for a calculator: SectionCard with an empty state (Banner)
+ *  or a metric list (DetailList) plus optional extras (table, notes).
+ *  Replaces hand-built `<dl>`/banner blocks in custom screens. */
 export function ResultPanel({ title, subtitle, empty, emptyText, rows, footer, children, testId, }) {
     const { Banner } = usePrimitives();
     return (_jsx(SectionCard, { title: title, subtitle: subtitle, footer: footer, testId: testId, children: empty === true ? (_jsx(Banner, { variant: "info", padded: true, children: emptyText })) : (_jsxs("div", { className: "flex flex-col gap-4", children: [rows !== undefined && rows.length > 0 && _jsx(DetailList, { rows: rows }), children] })) }));
 }
-/** Statische, prop-getriebene Ergebnistabelle für berechnete Zeilen (Tranchen,
- *  Szenarien). Nimmt dem Screen die `<table>`+tabular-nums-Ketten ab.
- *  ponytail: bewusst die minimale Read-only-Tabelle — für Sort/Pager/Facets
- *  stattdessen usePrimitives().DataTable bzw. QueryTable nutzen. */
+/** Static, prop-driven result table for calculated rows (tranches, scenarios).
+ *  Avoids repeating the `<table>`+tabular-nums pattern in each screen.
+ *  ponytail: intentionally minimal and read-only—for sorting, paging, or facets,
+ *  use usePrimitives().DataTable or QueryTable instead. */
 export function ResultTable({ columns, rows, rowKey, testId, className, card, footer, }) {
     const table = (_jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { "data-testid": testId, className: cn("w-full text-sm", className), children: [_jsx("thead", { className: cn(card === true && "bg-muted"), children: _jsx("tr", { className: "border-b text-left text-muted-foreground", children: columns.map((col) => (_jsx("th", { className: cn("py-1.5 font-medium", card === true && "px-3", col.align === "right" && "text-right"), children: col.header }, col.header))) }) }), _jsxs("tbody", { children: [rows.map((row, i) => (_jsx("tr", { className: "border-b last:border-0", children: columns.map((col) => (_jsx("td", { className: cn("py-1.5", card === true && "px-3", col.align === "right" && "text-right tabular-nums"), children: col.cell(row) }, col.header))) }, rowKey(row, i)))), footer?.map((row, i) => (_jsxs("tr", { className: cn(i === 0 && "border-t", row.emphasize === true && "font-semibold"), children: [_jsxs("td", { colSpan: columns.length > 1 ? Math.max(columns.length - 1, 1) : undefined, className: cn("py-1.5 text-muted-foreground", card === true && "px-3", row.emphasize === true && "text-foreground", columns.length === 1 && "flex items-center justify-between gap-4"), children: [row.label, columns.length === 1 && (_jsx("span", { className: cn("text-right tabular-nums", row.emphasize === true && "text-foreground"), children: row.value }))] }), columns.length > 1 && (_jsx("td", { className: cn("py-1.5 text-right tabular-nums", card === true && "px-3"), children: row.value }))] }, row.label)))] })] }) }));
     return card === true ? (_jsx("div", { className: "overflow-hidden rounded-lg border bg-card", children: table })) : (table);
 }
-/** Transponierte Vergleichstabelle: Zeile = Kennzahl, Spalte = Variante, je
- *  Kennzahl optional die beste Spalte hervorgehoben. Für Szenario-/Angebots-
- *  Vergleiche, wo ResultTable (Zeile=Datensatz) nicht passt. */
+/** Transposed comparison table: row = metric, column = variant, with the best
+ *  column optionally highlighted for each metric. For scenario/offer comparisons
+ *  where ResultTable (row = record) is not suitable. */
 export function ComparisonTable({ columns, columnHeader, columnKey, metrics, metricLabel, testId, className, card, }) {
     const table = (_jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { "data-testid": testId, className: cn("w-full min-w-[24rem] text-sm", className), children: [_jsx("thead", { className: cn(card === true && "bg-muted"), children: _jsxs("tr", { className: "border-b text-left text-muted-foreground", children: [_jsx("th", { className: cn("py-1.5 font-medium", card === true && "px-3"), children: metricLabel }), columns.map((col, i) => (_jsx("th", { className: cn("py-1.5 text-right font-medium", card === true && "px-3"), children: columnHeader(col, i) }, columnKey(col, i))))] }) }), _jsx("tbody", { children: metrics.map((metric) => {
                         const best = metric.bestIndex !== undefined ? metric.bestIndex(columns) : -1;

package/dist/web/widgets/section-card.d.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
-/** Sektion mit Titel + optionalem Action-Slot (Range-Umschalter, Filter) —
- *  ersetzt die wiederholten `<section className={CARD}>…<h2>`-Blöcke in
- *  Custom-Screens. Dünner Wrapper über das Card-Primitive. */
+/** Section with a title and optional action slot (range switcher, filter) —
+ * replaces repeated `<section className={CARD}>…<h2>` blocks in
+ * custom screens. Thin wrapper around the Card primitive. */
 export declare function SectionCard({ title, subtitle, action, footer, children, testId, }: {
     readonly title: string;
     readonly subtitle?: string;

package/dist/web/widgets/section-card.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { usePrimitives } from "../../index.js";
-/** Sektion mit Titel + optionalem Action-Slot (Range-Umschalter, Filter) —
- *  ersetzt die wiederholten `<section className={CARD}>…<h2>`-Blöcke in
- *  Custom-Screens. Dünner Wrapper über das Card-Primitive. */
+/** Section with a title and optional action slot (range switcher, filter) —
+ * replaces repeated `<section className={CARD}>…<h2>` blocks in
+ * custom screens. Thin wrapper around the Card primitive. */
 export function SectionCard({ title, subtitle, action, footer, children, testId, }) {
     const { Card } = usePrimitives();
     return (_jsx(Card, { slots: { title, subtitle, headerActions: action, footer }, testId: testId, children: _jsx("div", { className: "flex h-full flex-col gap-4", children: children }) }));

package/dist/web/widgets/stat.d.ts

@@ -10,8 +10,8 @@ export declare function Sparkline({ points, className, }: {
     readonly points: readonly number[];
     readonly className?: string;
 }): ReactNode;
-/** Icon-tragende Kennzahl-Kachel mit optionalem Delta-Chip, Trend-Zeile
- *  und Sparkline. `icon` ist ein fertiger Knoten (App liefert ihr SVG). */
+/** Icon-bearing metric tile with an optional delta chip, trend line,
+ *  and sparkline. `icon` is a ready-made node (the app supplies its SVG). */
 export declare function StatCard({ icon, label, value, sub, tone, accentColor, delta, trend, spark, testId, children, }: {
     readonly icon?: ReactNode;
     readonly label: string;
@@ -41,8 +41,8 @@ export declare function StatStripCell({ icon, label, value, sub, tone, accentCol
     readonly spark?: readonly number[];
     readonly testId?: string;
 }): ReactNode;
-/** Kompakte Kennzahl-Kachel (ohne Icon) — für dichte KPI-Raster.
- *  StatCard ist die icon-tragende Variante. */
+/** Compact metric tile (without an icon) — for dense KPI grids.
+ *  StatCard is the icon-bearing variant. */
 export declare function MiniStat({ label, value, tone, emphasize, testId, labelTestId, valueTestId, }: {
     readonly label: string;
     readonly value: string;

package/dist/web/widgets/stat.js

@@ -15,8 +15,8 @@ const TONE_VALUE = {
     warn: "text-destructive",
     negative: "text-status-bad",
 };
-// Inline-SVG-Sparkline (kein Chart-Dep für eine 28px-Kurve): Linie +
-// schwacher Flächen-Verlauf, Farbe via currentColor (Caller setzt text-tone).
+// Inline SVG sparkline (no chart dependency for a 28px curve): line +
+// subtle area gradient, colored via currentColor (caller sets text-tone).
 export function Sparkline({ points, className, }) {
     if (points.length < 2)
         return null;
@@ -42,8 +42,8 @@ function StatIconChip({ icon, tone, accentColor, }) {
                 backgroundColor: `color-mix(in srgb, ${accentColor} 12%, transparent)`,
             }, children: icon }));
 }
-/** Icon-tragende Kennzahl-Kachel mit optionalem Delta-Chip, Trend-Zeile
- *  und Sparkline. `icon` ist ein fertiger Knoten (App liefert ihr SVG). */
+/** Icon-bearing metric tile with an optional delta chip, trend line,
+ *  and sparkline. `icon` is a ready-made node (the app supplies its SVG). */
 export function StatCard({ icon, label, value, sub, tone = "default", accentColor, delta, trend, spark, testId, children, }) {
     const { Card } = usePrimitives();
     // StatCard is a reusable small-tile widget (a metrics dashboard grid, not
@@ -57,8 +57,8 @@ export function StatCard({ icon, label, value, sub, tone = "default", accentColo
 export function StatStripCell({ icon, label, value, sub, tone = "default", accentColor, delta, spark, testId, }) {
     return (_jsxs("div", { "data-testid": testId, className: "flex min-w-0 flex-col gap-1 px-4 py-3", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-x-2 gap-y-1", children: [_jsxs("span", { className: "flex min-w-0 items-center gap-2 text-xs font-medium text-muted-foreground", children: [icon !== undefined && _jsx(StatIconChip, { icon: icon, tone: tone, accentColor: accentColor }), _jsx("span", { children: label })] }), delta !== undefined && (_jsxs("span", { className: cn("inline-flex shrink-0 items-center gap-0.5 whitespace-nowrap rounded-full px-1.5 py-0.5 text-xs font-medium tabular-nums", TONE_CHIP[delta.tone ?? tone]), children: [delta.direction === "up" ? "↑" : "↓", delta.value] }))] }), _jsxs("div", { className: "flex items-center gap-3", children: [_jsx("span", { className: cn("text-xl font-semibold tabular-nums", TONE_VALUE[tone]), children: value }), spark !== undefined && (_jsx(Sparkline, { points: spark, className: cn("h-7 w-20 shrink-0", TONE_VALUE[tone]) }))] }), sub !== undefined && _jsx("div", { className: "text-xs text-muted-foreground", children: sub })] }));
 }
-/** Kompakte Kennzahl-Kachel (ohne Icon) — für dichte KPI-Raster.
- *  StatCard ist die icon-tragende Variante. */
+/** Compact metric tile (without an icon) — for dense KPI grids.
+ *  StatCard is the icon-bearing variant. */
 export function MiniStat({ label, value, tone = "default", emphasize = false, testId, labelTestId, valueTestId, }) {
     const { Card } = usePrimitives();
     return (_jsxs(Card, { options: { padded: false }, className: cn("p-3", emphasize && "ring-1 ring-primary/30"), testId: testId, children: [_jsx("div", { className: "text-xs text-muted-foreground", "data-testid": labelTestId, children: label }), _jsx("div", { className: cn("mt-0.5 font-semibold tabular-nums", TONE_VALUE[tone], emphasize ? "text-lg" : "text-sm"), "data-testid": valueTestId, children: value })] }));

package/dist/web/widgets/states.d.ts

@@ -1,7 +1,7 @@
 import type { ReactNode } from "react";
 import type { DispatcherError } from "../../headless/index.ts";
-/** Leerer-Zustand mit optionalem Icon + CTA — die dashed-Box-Optik der
- *  entityList-Empty-States, als Standalone-Widget für Custom-Screens. */
+/** Empty state with an optional icon and CTA, using the dashed-box style of
+ *  entityList empty states as a standalone widget for custom screens. */
 export declare function EmptyState({ icon, title, description, action, testId, }: {
     readonly icon?: ReactNode;
     readonly title: string;
@@ -9,13 +9,13 @@ export declare function EmptyState({ icon, title, description, action, testId, }
     readonly action?: ReactNode;
     readonly testId?: string;
 }): ReactNode;
-/** Lade-Zustand: Skeleton-Zeilen in Card-Optik. `rows` steuert die Höhe. */
+/** Loading state with skeleton rows styled like cards; `rows` controls the height. */
 export declare function LoadingState({ rows, className, testId, }: {
     readonly rows?: number;
     readonly className?: string;
     readonly testId?: string;
 }): ReactNode;
-/** Fehler-Zustand auf Basis des Banner-Primitives, mit Retry-Button. */
+/** Error state based on the Banner primitive, with a retry button. */
 export declare function ErrorState({ error, onRetry, testId, }: {
     readonly error: DispatcherError;
     readonly onRetry?: () => void;

package/dist/web/widgets/states.js

@@ -2,17 +2,17 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { dispatcherErrorText, usePrimitives, useTranslation } from "../../index.js";
 import { cn } from "../lib/cn.js";
 import { Skeleton } from "../ui/skeleton.js";
-/** Leerer-Zustand mit optionalem Icon + CTA — die dashed-Box-Optik der
- *  entityList-Empty-States, als Standalone-Widget für Custom-Screens. */
+/** Empty state with an optional icon and CTA, using the dashed-box style of
+ *  entityList empty states as a standalone widget for custom screens. */
 export function EmptyState({ icon, title, description, action, testId, }) {
     return (_jsxs("div", { "data-testid": testId, className: "flex flex-col items-center justify-center gap-2 rounded-lg border border-dashed px-6 py-10 text-center", children: [icon !== undefined && _jsx("div", { className: "text-muted-foreground", children: icon }), _jsx("div", { className: "text-sm font-medium", children: title }), description !== undefined && (_jsx("div", { className: "text-sm text-muted-foreground", children: description })), action !== undefined && _jsx("div", { className: "mt-2", children: action })] }));
 }
-/** Lade-Zustand: Skeleton-Zeilen in Card-Optik. `rows` steuert die Höhe. */
+/** Loading state with skeleton rows styled like cards; `rows` controls the height. */
 export function LoadingState({ rows = 3, className, testId, }) {
     const t = useTranslation();
     return (_jsx("output", { "data-testid": testId, "aria-label": t("kumiko.widget.loading"), className: cn("flex w-full flex-col gap-2", className), children: Array.from({ length: rows }, (_, i) => (_jsx(Skeleton, { className: "h-9 w-full" }, i))) }));
 }
-/** Fehler-Zustand auf Basis des Banner-Primitives, mit Retry-Button. */
+/** Error state based on the Banner primitive, with a retry button. */
 export function ErrorState({ error, onRetry, testId, }) {
     const { Banner, Button } = usePrimitives();
     const t = useTranslation();

package/dist/web/widgets/upload-zone.js

@@ -114,6 +114,18 @@ export function UploadZone({ onUpload, title, hint, accept, multiple = true, cap
         if (row.value !== undefined)
             onRemove?.(row.value);
     }
+    // Values the owner already held before any upload of this zone (editing a record with files).
+    // Hidden while an upload runs: its value reaches `doneValues` one render before its row is done.
+    const uploading = rows.some((row) => row.status === "uploading");
+    const existingRows = doneValues === undefined || uploading
+        ? []
+        : doneValues
+            .filter((value) => !rows.some((row) => row.value === value))
+            .map((value) => ({ id: `existing:${value}`, fileName: value, status: "done", value }));
+    const visibleRows = [
+        ...existingRows,
+        ...rows.filter((row) => row.value === undefined || doneValues === undefined || doneValues.includes(row.value)),
+    ];
     const acceptAttr = toAcceptAttr(accept);
     return (_jsxs("div", { "data-testid": testId, className: "flex flex-col gap-4", children: [_jsxs("label", { htmlFor: inputId, onDragOver: (e) => {
                     e.preventDefault();
@@ -123,9 +135,5 @@ export function UploadZone({ onUpload, title, hint, accept, multiple = true, cap
                     if (!(e.relatedTarget instanceof Node) || !e.currentTarget.contains(e.relatedTarget)) {
                         setDragOver(false);
                     }
-                }, onDrop: handleDrop, "data-testid": testId !== undefined ? `${testId}-dropzone` : undefined, className: cn("flex w-full cursor-pointer flex-col items-center gap-3 rounded-lg border-2 border-dashed p-10 text-center transition-colors has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-ring has-[:focus-visible]:ring-offset-2", dragOver ? "border-primary bg-muted/40" : "border-border", disabled === true && "cursor-not-allowed opacity-50"), children: [_jsx(Upload, { className: "size-8 text-muted-foreground", "aria-hidden": "true" }), _jsx("span", { className: "text-sm", children: title }), hint !== undefined && _jsx("span", { className: "text-sm text-muted-foreground", children: hint }), _jsx("input", { ref: inputRef, id: inputId, type: "file", multiple: multiple, className: "sr-only", "data-testid": testId !== undefined ? `${testId}-input` : undefined, disabled: disabled, ...(acceptAttr !== undefined && { accept: acceptAttr }), ...(capture !== undefined && { capture }), onChange: (e) => void uploadFiles(e.target.files) })] }), rows.length > 0 && (_jsx("ul", { className: "flex flex-col gap-2", children: rows
-                    .filter((row) => row.value === undefined ||
-                    doneValues === undefined ||
-                    doneValues.includes(row.value))
-                    .map((row) => (_jsxs("li", { "data-testid": testId !== undefined ? `${testId}-row` : undefined, className: "flex items-center justify-between gap-3 rounded-md border border-border px-4 py-2", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx(FileUp, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" }), _jsx("span", { className: "truncate text-sm", children: row.fileName })] }), _jsxs("output", { className: "flex shrink-0 items-center gap-1.5 text-xs text-muted-foreground", children: [STATUS_ICON[row.status], _jsx("span", { className: "sr-only", children: t(STATUS_LABEL_KEY[row.status]) }), row.status === "error" && row.error !== undefined && _jsx("span", { children: row.error }), row.value !== undefined && onRemove !== undefined && disabled !== true && (_jsx("button", { type: "button", className: "rounded-sm p-0.5 text-muted-foreground hover:text-foreground", "aria-label": t("kumiko.widget.upload.remove"), "data-testid": testId !== undefined ? `${testId}-remove` : undefined, onClick: () => removeRow(row), children: _jsx(X, { className: "size-3.5", "aria-hidden": "true" }) }))] })] }, row.id))) }))] }));
+                }, onDrop: handleDrop, "data-testid": testId !== undefined ? `${testId}-dropzone` : undefined, className: cn("flex w-full cursor-pointer flex-col items-center gap-3 rounded-lg border-2 border-dashed p-10 text-center transition-colors has-[:focus-visible]:ring-2 has-[:focus-visible]:ring-ring has-[:focus-visible]:ring-offset-2", dragOver ? "border-primary bg-muted/40" : "border-border", disabled === true && "cursor-not-allowed opacity-50"), children: [_jsx(Upload, { className: "size-8 text-muted-foreground", "aria-hidden": "true" }), _jsx("span", { className: "text-sm", children: title }), hint !== undefined && _jsx("span", { className: "text-sm text-muted-foreground", children: hint }), _jsx("input", { ref: inputRef, id: inputId, type: "file", multiple: multiple, className: "sr-only", "data-testid": testId !== undefined ? `${testId}-input` : undefined, disabled: disabled, ...(acceptAttr !== undefined && { accept: acceptAttr }), ...(capture !== undefined && { capture }), onChange: (e) => void uploadFiles(e.target.files) })] }), visibleRows.length > 0 && (_jsx("ul", { className: "flex flex-col gap-2", children: visibleRows.map((row) => (_jsxs("li", { "data-testid": testId !== undefined ? `${testId}-row` : undefined, className: "flex items-center justify-between gap-3 rounded-md border border-border px-4 py-2", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx(FileUp, { className: "size-4 shrink-0 text-muted-foreground", "aria-hidden": "true" }), _jsx("span", { className: "truncate text-sm", children: row.fileName })] }), _jsxs("output", { className: "flex shrink-0 items-center gap-1.5 text-xs text-muted-foreground", children: [STATUS_ICON[row.status], _jsx("span", { className: "sr-only", children: t(STATUS_LABEL_KEY[row.status]) }), row.status === "error" && row.error !== undefined && _jsx("span", { children: row.error }), row.value !== undefined && onRemove !== undefined && disabled !== true && (_jsx("button", { type: "button", className: "rounded-sm p-0.5 text-muted-foreground hover:text-foreground", "aria-label": t("kumiko.widget.upload.remove"), "data-testid": testId !== undefined ? `${testId}-remove` : undefined, onClick: () => removeRow(row), children: _jsx(X, { className: "size-3.5", "aria-hidden": "true" }) }))] })] }, row.id))) }))] }));
 }

package/dist/web/widgets/use-draft.d.ts

@@ -1,10 +1,10 @@
-/** Formular-State für Rechner-Screens: ein Draft-Objekt + `patch` für
- *  Teil-Updates + `field(name)` das die `{ id, name, value, onChange }`-Props
- *  fertig für die Feld-Widgets (NumberField/MoneyField/PercentField) liefert.
- *  Ersetzt das pro Screen wiederholte Draft-Interface + patch-Helper.
- *  `idPrefix` verhindert doppelte DOM-`id`s, wenn mehrere `useDraft`-Formulare
- *  mit gleichnamigen Feldern auf derselben Seite gemountet werden — `name`
- *  bleibt der reine Key fürs Form-Payload. */
+/** Form state for calculator screens: a draft object plus `patch` for
+ *  partial updates, and `field(name)` that provides `{ id, name, value, onChange }`
+ *  props ready for field widgets (NumberField/MoneyField/PercentField).
+ *  Replaces the repeated draft interface and patch helper in each screen.
+ *  `idPrefix` prevents duplicate DOM `id`s when multiple `useDraft` forms with
+ *  same-named fields are mounted on the same page; `name` remains the plain key
+ *  for the form payload. */
 export declare function useDraft<T extends object>(defaults: T, options?: {
     readonly idPrefix?: string;
 }): {

package/dist/web/widgets/use-draft.js

@@ -1,11 +1,11 @@
 import { useCallback, useState } from "react";
-/** Formular-State für Rechner-Screens: ein Draft-Objekt + `patch` für
- *  Teil-Updates + `field(name)` das die `{ id, name, value, onChange }`-Props
- *  fertig für die Feld-Widgets (NumberField/MoneyField/PercentField) liefert.
- *  Ersetzt das pro Screen wiederholte Draft-Interface + patch-Helper.
- *  `idPrefix` verhindert doppelte DOM-`id`s, wenn mehrere `useDraft`-Formulare
- *  mit gleichnamigen Feldern auf derselben Seite gemountet werden — `name`
- *  bleibt der reine Key fürs Form-Payload. */
+/** Form state for calculator screens: a draft object plus `patch` for
+ *  partial updates, and `field(name)` that provides `{ id, name, value, onChange }`
+ *  props ready for field widgets (NumberField/MoneyField/PercentField).
+ *  Replaces the repeated draft interface and patch helper in each screen.
+ *  `idPrefix` prevents duplicate DOM `id`s when multiple `useDraft` forms with
+ *  same-named fields are mounted on the same page; `name` remains the plain key
+ *  for the form payload. */
 export function useDraft(defaults, options) {
     const idPrefix = options?.idPrefix;
     const [draft, setDraft] = useState(defaults);

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@cosmicdrift/kumiko-renderer",
-  "version": "0.386.0",
+  "version": "0.388.0",
   "description": "React renderer for Kumiko screens. The root export holds the platform-agnostic logic (primitives contract, hooks, KumikoScreen, navigation and SSE abstractions); ./headless the DOM-free UI logic, ./live the HTTP dispatcher, ./web the browser bindings (HTML primitives, history navigation, EventSource live events, createKumikoApp).",
-  "license": "BUSL-1.1",
+  "license": "MIT",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
   "type": "module",
   "kumiko": {
@@ -48,8 +48,8 @@
     }
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-framework": "0.386.0",
-    "@cosmicdrift/kumiko-types": "0.386.0",
+    "@cosmicdrift/kumiko-framework": "0.388.0",
+    "@cosmicdrift/kumiko-types": "0.388.0",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-label": "^2.1.8",
@@ -92,8 +92,8 @@
     }
   },
   "devDependencies": {
-    "@cosmicdrift/kumiko-locale-de": "0.386.0",
-    "@cosmicdrift/kumiko-testing": "0.386.0",
+    "@cosmicdrift/kumiko-locale-de": "0.388.0",
+    "@cosmicdrift/kumiko-testing": "0.388.0",
     "@tailwindcss/cli": "^4.3.0",
     "@testing-library/react": "^16.3.2",
     "@testing-library/user-event": "^14.6.1",

package/src/changes.json

@@ -1,4 +1,53 @@
 [
+  {
+    "version": "0.388.0",
+    "type": "improvement",
+    "title": "List view model and cell formats as tables",
+    "detail": "computeListViewModel resolves each column through an ordered list of resolvers and applyFormatSpec dispatches through a table of cell formatters. Output is unchanged; a format named like an Object.prototype member such as \"toString\" still takes the unknown-format path."
+  },
+  {
+    "version": "0.388.0",
+    "type": "fix",
+    "title": "Single-line row actions, stable form columns and select width, system-scope configEdit",
+    "detail": "Row actions never wrap onto a second line; the template overview lets long titles break and cuts the slug earlier so the table keeps room at 1280 px. In screen forms a section with explicitly declared columns (two or more) lays out as that many columns, and a select cell is as wide as a text cell instead of growing with its help text. A configEdit screen with scope system now reads the system level, so a SystemAdmin no longer sees the value of their own tenant row."
+  },
+  {
+    "version": "0.388.0",
+    "type": "fix",
+    "title": "Uniform control height in page headers and list toolbars, spacing for projectionList descriptions",
+    "detail": "Buttons in the page header (create, toolbarActions, detail actions, form actions and app-added buttons such as the AI button) and in list toolbars (search, filters, secondary actions) now share one height, independent of the size a screen or app requested. A toolbarAction promoted into the page header no longer renders smaller than the standard create button. A projectionList without a toolbar no longer glues its description to the page header. The header of a CollapsibleSection (\"Erweitert\") has the same height as the form controls next to it."
+  },
+  {
+    "version": "0.388.0",
+    "type": "breaking",
+    "title": "Input gets kind \"code\" and autoFocus on kind \"text\"",
+    "detail": "Input has a new kind \"code\" (length, onComplete, autoFocus, autoComplete defaulting to one-time-code), a single real input shown as separate cells; onComplete fires once when input, paste or autofill reaches full length and the value holds digits only. kind \"text\" gains autoFocus.",
+    "migration": "custom Input implementations (PrimitivesProvider override) with an exhaustive switch over props.kind need a case \"code\"; delegating to DefaultInput from @cosmicdrift/kumiko-renderer/web is enough"
+  },
+  {
+    "version": "0.388.0",
+    "type": "fix",
+    "title": "Renderer low-severity robustness fixes",
+    "detail": "The list search echo handling no longer mutates state during render and no longer re-sends an already sent value. A failing live refetch no longer drops a queued follow-up run. Downloaded blob URLs are revoked after a delay, failed PDF loads are retried on the next mount, the file meta cache is cleared when the app gate unmounts, and renderFlow rejects duplicate node ids and unknown icons. The es/fr/it titles of the reset-to-system action now say the tenant template is reset to the system template."
+  },
+  {
+    "version": "0.388.0",
+    "type": "fix",
+    "title": "Renderer review fixes for lookups, dropzone, markSaved, actionForm reset and dashboard gates",
+    "detail": "Reference labels show \"Unknown\" only when the lookup page was complete; a related-list column keeps sortable on fields without a sortable key; a files dropzone lists and can remove files already in the value; extension markSaved accepts the written field names, no longer clears other sections' dirty state; an actionForm with load and resetOnSuccess reloads the record before resetting; fallback panels no longer flash before the visibility gate answers; identical text blocks get unique keys; the missing-screen warning names the route id."
+  },
+  {
+    "version": "0.388.0",
+    "type": "improvement",
+    "title": "useTenantCurrency hook",
+    "detail": "The tenant currency resolution of the entity edit prefill is exported as a hook with an explicit fallback for errors and missing values and no query when no currency is needed; the mail preview uses it only for templates with a money variable."
+  },
+  {
+    "version": "0.388.0",
+    "type": "improvement",
+    "title": "ChoiceCards widget and PlanCard price prefix",
+    "detail": "ChoiceCards is a card-styled radio group (title, description, aside, native radios, keyboard operable) for exclusive choices that need more than a segment label. PlanCardPrice takes an optional prefix shown before the amount, for example \"from\"."
+  },
   {
     "version": "0.385.0",
     "type": "improvement",