@cosmicdrift/kumiko-renderer-web 0.192.0 → 0.193.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-renderer-web",
-  "version": "0.192.0",
+  "version": "0.193.0",
   "description": "Web-platform bindings for @cosmicdrift/kumiko-renderer. HTML default-primitives, browser history-based navigation, EventSource-backed live events, and a one-call createKumikoApp that mounts the whole stack via react-dom.",
   "license": "BUSL-1.1",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
@@ -16,9 +16,9 @@
     "./styles.css": "./src/styles.css"
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-dispatcher-live": "0.192.0",
-    "@cosmicdrift/kumiko-headless": "0.192.0",
-    "@cosmicdrift/kumiko-renderer": "0.192.0",
+    "@cosmicdrift/kumiko-dispatcher-live": "0.193.0",
+    "@cosmicdrift/kumiko-headless": "0.193.0",
+    "@cosmicdrift/kumiko-renderer": "0.193.0",
     "@radix-ui/react-dialog": "^1.1.15",
     "@radix-ui/react-dropdown-menu": "^2.1.16",
     "@radix-ui/react-label": "^2.1.8",

package/src/__tests__/render-edit.test.tsx

@@ -3,7 +3,7 @@ import type {
   EntityDefinition,
   EntityEditScreenDefinition,
 } from "@cosmicdrift/kumiko-framework/ui-types";
-import type { Dispatcher, SubmitResult } from "@cosmicdrift/kumiko-headless";
+import type { Dispatcher, FormSnapshot, SubmitResult } from "@cosmicdrift/kumiko-headless";
 import {
   DispatcherProvider,
   DraftStorageProvider,
@@ -815,6 +815,44 @@ describe("RenderEdit — controlled mode (#1887)", () => {
     expect(titleInput.value).toBe("Acme");
     expect(screen.queryByTestId("render-edit-form-error")).toBeNull();
   });
+
+  // A caller like `schema={z.object({...})}` builds a fresh schema object on
+  // every render — unstable identity. If the effect depended on `schema`
+  // directly (not a ref), a parent that re-renders on every onChange call
+  // would refire the effect every time even though nothing in the form
+  // actually changed, risking an infinite update loop.
+  test("a parent re-rendering with a fresh schema object on every onChange does not loop", () => {
+    let calls = 0;
+    function Wrapper() {
+      const [, setTick] = useState(0);
+      const schema = z.object({ title: z.string().min(1) });
+      return (
+        <RenderEdit<TestValues>
+          screen={makeScreen()}
+          entity={orderEntity}
+          featureName="orders"
+          initial={{ title: "", count: 0, isUrgent: false }}
+          writeCommand="order:create"
+          schema={schema}
+          onChange={() => {
+            calls += 1;
+            // Cap so a still-broken implementation fails fast on a bounded
+            // count instead of hanging the test runner in an update loop.
+            if (calls < 15) setTick((t) => t + 1);
+          }}
+        />
+      );
+    }
+
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher()}>
+        <Wrapper />
+      </DispatcherProvider>,
+    );
+
+    expect(calls).toBeGreaterThanOrEqual(1);
+    expect(calls).toBeLessThan(5);
+  });
 });
 
 // Issue #1916: proves FieldConditions (visible/readOnly/required) react to
@@ -1015,7 +1053,7 @@ describe("RenderEdit wizard mode", () => {
     );
 
     expect(screen.getByTestId("field-title")).toBeTruthy();
-    expect(screen.queryByTestId("field-count")).toBeNull();
+    expect(screen.getByTestId("field-count").closest("[hidden]")).not.toBeNull();
     expect(screen.getByTestId("render-edit-wizard-step-label").textContent).toContain("1");
   });
 
@@ -1045,7 +1083,7 @@ describe("RenderEdit wizard mode", () => {
 
     expect(screen.getByTestId("field-title-errors")).toBeTruthy();
     expect(screen.getByTestId("field-title")).toBeTruthy();
-    expect(screen.queryByTestId("field-count")).toBeNull();
+    expect(screen.getByTestId("field-count").closest("[hidden]")).not.toBeNull();
   });
 
   test("Weiter advances to the next step once the current step is valid; last step shows the submit button", async () => {
@@ -1077,7 +1115,7 @@ describe("RenderEdit wizard mode", () => {
       await Promise.resolve();
     });
 
-    expect(screen.queryByTestId("field-title")).toBeNull();
+    expect(screen.getByTestId("field-title").closest("[hidden]")).not.toBeNull();
     expect(screen.getByTestId("field-count")).toBeTruthy();
     expect(screen.getByTestId("render-edit-submit")).toBeTruthy();
     expect(screen.queryByTestId("render-edit-wizard-next")).toBeNull();
@@ -1121,6 +1159,170 @@ describe("RenderEdit wizard mode", () => {
     expect(titleInputAgain.value).toBe("Acme");
     expect(screen.queryByTestId("field-title-errors")).toBeNull();
   });
+
+  // A server-side field error can land on a field belonging to a step the
+  // user isn't currently viewing — the old `setFormError(fieldIssues.length
+  // === 0 ? result.error : null)` rule suppressed the banner in that case
+  // (field issues exist) while the field itself was invisible on the
+  // current step, silently hiding the error entirely.
+  test("a server field error for a step that's not currently shown jumps the wizard there and shows the field error", async () => {
+    const write = mock(
+      async () =>
+        ({
+          isSuccess: false,
+          error: {
+            code: "validation_failed",
+            httpStatus: 422,
+            i18nKey: "kumiko.errors.validation",
+            message: "Validation failed",
+            details: {
+              fields: [{ path: "title", code: "too_small", i18nKey: "kumiko.errors.required" }],
+            },
+          },
+        }) as never,
+    );
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher(write)}>
+        <RenderEdit<TestValues>
+          screen={makeWizardScreen()}
+          entity={orderEntity}
+          featureName="orders"
+          initial={{ title: "Acme", count: 0 }}
+          writeCommand="order:create"
+        />
+      </DispatcherProvider>,
+    );
+
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-wizard-next"));
+      await Promise.resolve();
+    });
+    const countInput = screen.getByTestId("field-count").querySelector("input") as HTMLInputElement;
+    fireEvent.change(countInput, { target: { value: "5" } });
+
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-submit"));
+      await Promise.resolve();
+    });
+
+    // Jumped back to the step that owns `title`, where the server error lives.
+    expect(screen.getByTestId("field-title")).toBeTruthy();
+    expect(screen.getByTestId("field-title-errors")).toBeTruthy();
+    expect(screen.getByTestId("field-count").closest("[hidden]")).not.toBeNull();
+    // The field itself shows the error — no redundant top-level banner.
+    expect(screen.queryByTestId("render-edit-form-error")).toBeNull();
+  });
+
+  // A root-level issue (e.g. a cross-field `.refine()`) has no field to jump
+  // to — it must NOT be silently suppressed just because `details.fields`
+  // is non-empty.
+  test("a root-level server error with no matching field is not suppressed — the banner shows", async () => {
+    const write = mock(
+      async () =>
+        ({
+          isSuccess: false,
+          error: {
+            code: "validation_failed",
+            httpStatus: 422,
+            i18nKey: "kumiko.errors.validation",
+            message: "Validation failed",
+            details: {
+              fields: [{ path: "(root)", code: "custom", i18nKey: "kumiko.errors.cross-field" }],
+            },
+          },
+        }) as never,
+    );
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher(write)}>
+        <RenderEdit<TestValues>
+          screen={makeWizardScreen()}
+          entity={orderEntity}
+          featureName="orders"
+          initial={{ title: "Acme", count: 0 }}
+          writeCommand="order:create"
+        />
+      </DispatcherProvider>,
+    );
+
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-wizard-next"));
+      await Promise.resolve();
+    });
+    const countInput = screen.getByTestId("field-count").querySelector("input") as HTMLInputElement;
+    fireEvent.change(countInput, { target: { value: "5" } });
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-submit"));
+      await Promise.resolve();
+    });
+
+    expect(screen.getByTestId("render-edit-form-error")).toBeTruthy();
+  });
+
+  // An extension section on an earlier wizard step used to unmount when the
+  // wizard advanced (only the current step's section was rendered), which
+  // tore down its useExtensionFormSubmit registration (registry.remove on
+  // unmount). Finish then only ran the last-mounted step's handler and
+  // silently dropped the earlier step's write. Steps must stay mounted
+  // (hidden, not unmounted) so every step's handler survives to Finish.
+  test("an extension section on an earlier wizard step still submits on Finish after navigating past it", async () => {
+    const submitSpy = mock();
+    const ComposedCF = (_: { entityName: string; entityId: string | null }) => {
+      useExtensionFormSubmit({
+        dirty: true,
+        onSubmit: async (ctx) => {
+          submitSpy(ctx);
+          return { isSuccess: true as const };
+        },
+      });
+      return <div data-testid="composed-cf" />;
+    };
+
+    const screenDef: EntityEditScreenDefinition = {
+      id: "orders:screen:order-wizard-extension",
+      type: "entityEdit",
+      entity: "order",
+      layout: {
+        mode: "wizard",
+        sections: [
+          {
+            kind: "extension",
+            title: "Custom Fields",
+            component: { react: { __component: "ComposedCF" } },
+          },
+          { title: "Basics", columns: 1, fields: [{ field: "title" }] },
+        ],
+      },
+    };
+
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher()}>
+        <ExtensionSectionsProvider value={{ ComposedCF }}>
+          <RenderEdit<TestValues>
+            screen={screenDef}
+            entity={orderEntity}
+            featureName="orders"
+            initial={{ title: "Acme", count: 0 } as TestValues}
+            entityId="order-1"
+            writeCommand="order:update"
+          />
+        </ExtensionSectionsProvider>
+      </DispatcherProvider>,
+    );
+
+    expect(screen.getByTestId("composed-cf")).toBeTruthy();
+
+    fireEvent.click(screen.getByTestId("render-edit-wizard-next"));
+    expect(screen.getByTestId("field-title")).toBeTruthy();
+    // Step 1's extension section stayed mounted (hidden), not unmounted.
+    expect(screen.getByTestId("composed-cf").closest("[hidden]")).not.toBeNull();
+
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-submit"));
+      await Promise.resolve();
+    });
+
+    expect(submitSpy).toHaveBeenCalledWith({ entityId: "order-1" });
+  });
 });
 
 describe("RenderEdit wizard draft", () => {
@@ -1231,7 +1433,7 @@ describe("RenderEdit wizard draft", () => {
     );
 
     await waitFor(() => expect(screen.getByTestId("field-count")).toBeTruthy());
-    expect(screen.queryByTestId("field-title")).toBeNull();
+    expect(screen.getByTestId("field-title").closest("[hidden]")).not.toBeNull();
     expect(screen.getByTestId("render-edit-wizard-step-label").textContent).toContain("2");
 
     fireEvent.click(screen.getByTestId("render-edit-wizard-back"));
@@ -1440,6 +1642,94 @@ describe("RenderEdit wizard draft", () => {
     await waitFor(() => expect(savesSoFar()).toBe(before + 1), { timeout: 3000 });
     expect(savesSoFar()).toBe(before + 1);
   });
+
+  // A rejected discard write (network error) must be best-effort: the entity
+  // write already succeeded by the time discardDraft() runs, so a failure
+  // here must not propagate out of handleSubmit and break onSubmit/
+  // navigation — that would risk a duplicate submit on retry. Orphaned draft
+  // rows are swept later by cleanup.job.ts.
+  test("a rejected discard write does not break an otherwise successful submit", async () => {
+    const seenResults: SubmitResult<unknown>[] = [];
+    const write = mock(async (type: string) => {
+      if (type === "form-draft:write:discard") throw new Error("network error");
+      return { isSuccess: true, data: { id: "1" } };
+    });
+    const dispatcher = makeDispatcher(write as unknown as Dispatcher["write"]);
+
+    render(
+      <DispatcherProvider dispatcher={dispatcher}>
+        <DraftStorageProvider value={createFakeDraftStorage()}>
+          <RenderEdit<TestValues>
+            screen={makeDraftWizardScreen(true)}
+            entity={orderEntity}
+            featureName="orders"
+            initial={{ title: "", count: 0 }}
+            writeCommand="order:create"
+            onSubmit={(r) => seenResults.push(r)}
+          />
+        </DraftStorageProvider>
+      </DispatcherProvider>,
+    );
+
+    const titleInput = screen.getByTestId("field-title").querySelector("input") as HTMLInputElement;
+    fireEvent.change(titleInput, { target: { value: "Acme" } });
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-wizard-next"));
+      await Promise.resolve();
+    });
+
+    const countInput = screen.getByTestId("field-count").querySelector("input") as HTMLInputElement;
+    fireEvent.change(countInput, { target: { value: "5" } });
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-submit"));
+      await Promise.resolve();
+      await Promise.resolve();
+    });
+
+    // handleSubmit completed despite the rejected discard: onSubmit still
+    // fired with the successful entity-write result, not an unhandled
+    // rejection or an aborted handler.
+    expect(seenResults).toHaveLength(1);
+    expect(seenResults[0]?.isSuccess).toBe(true);
+  });
+
+  // `disabled` means "no input/no write", not "no navigation" (#1896). The
+  // old `if (disabled) return` guard sat BEFORE the wizard-next branch, and
+  // Next itself carried `disabled={disabled}` — together they made a
+  // disabled wizard unnavigable past step 0. Next must still step forward,
+  // but without running validate() (would block on an empty required field
+  // nobody can fill in) or saveDraft() (would mint a draftId / dispatch a
+  // write — exactly what `disabled` forbids).
+  test("disabled: clicking Next on step 0 navigates without validating or writing a draft", async () => {
+    const schema = z.object({ title: z.string().min(1), count: z.number().optional() });
+    const write = mock(async () => ({ isSuccess: true, data: { id: "1" } }) as never);
+
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher(write)}>
+        <DraftStorageProvider value={createFakeDraftStorage()}>
+          <RenderEdit<TestValues>
+            screen={makeDraftWizardScreen(true)}
+            entity={orderEntity}
+            featureName="orders"
+            initial={{ title: "", count: 0 }}
+            writeCommand="order:create"
+            schema={schema}
+            disabled
+          />
+        </DraftStorageProvider>
+      </DispatcherProvider>,
+    );
+
+    expect(screen.getByTestId("field-title")).toBeTruthy();
+    fireEvent.click(screen.getByTestId("render-edit-wizard-next"));
+
+    // Navigated despite the empty required `title` field.
+    expect(screen.getByTestId("field-count")).toBeTruthy();
+    expect(screen.getByTestId("field-title").closest("[hidden]")).not.toBeNull();
+    // No validate() ran (no field error painted) and no write fired
+    // (neither a form-draft:write:save nor an order:create).
+    expect(write).not.toHaveBeenCalled();
+  });
 });
 
 describe("RenderEdit create-mode draftId (issue #1913)", () => {
@@ -1574,11 +1864,13 @@ describe("RenderEdit create-mode draftId (issue #1913)", () => {
     expect(titles).toEqual(["Session A", "Session B"]);
   });
 
-  test("cleared storage with exactly one open draft resumes it automatically via list", async () => {
+  test("cleared storage with exactly one open draft still shows the picker — no silent cross-tab adopt", async () => {
     const { dispatcher, drafts } = makeMultiDraftDispatcher();
     const screenDef = makeDraftWizardScreen();
     // Pre-seed one existing create-mode draft, as if minted by an earlier,
-    // now-storage-less session (new tab / cleared sessionStorage).
+    // now-storage-less session (new tab / cleared sessionStorage) — or a
+    // genuinely different parallel session on the same screen. Auto-adopting
+    // it would silently hand this tab someone else's in-progress draft.
     drafts.set(`${screenDef.id}:new:existing-id`, {
       values: { title: "Resumed", count: 0 },
       stepIndex: 0,
@@ -1599,13 +1891,54 @@ describe("RenderEdit create-mode draftId (issue #1913)", () => {
       </DispatcherProvider>,
     );
 
-    await waitFor(() => {
-      const titleInput = screen
-        .getByTestId("field-title")
-        .querySelector("input") as HTMLInputElement;
-      expect(titleInput.value).toBe("Resumed");
+    await waitFor(() => expect(screen.getByTestId("render-edit-draft-picker")).toBeTruthy());
+    // No silent adopt: the form stays pristine until the user picks.
+    const titleInput = screen.getByTestId("field-title").querySelector("input") as HTMLInputElement;
+    expect(titleInput.value).toBe("");
+  });
+
+  test("start-new on a one-candidate picker clears it without adopting, leaving the candidate untouched", async () => {
+    const { dispatcher, drafts } = makeMultiDraftDispatcher();
+    const screenDef = makeDraftWizardScreen();
+    drafts.set(`${screenDef.id}:new:existing-id`, {
+      values: { title: "Resumed", count: 0 },
+      stepIndex: 0,
+      savedAt: "2026-01-01T00:00:00Z",
     });
+
+    render(
+      <DispatcherProvider dispatcher={dispatcher}>
+        <DraftStorageProvider value={createFakeDraftStorage()}>
+          <RenderEdit<TestValues>
+            screen={screenDef}
+            entity={orderEntity}
+            featureName="orders"
+            initial={{ title: "", count: 0 }}
+            writeCommand="order:create"
+          />
+        </DraftStorageProvider>
+      </DispatcherProvider>,
+    );
+
+    await waitFor(() => expect(screen.getByTestId("render-edit-draft-picker")).toBeTruthy());
+    fireEvent.click(screen.getByTestId("render-edit-draft-start-new"));
     expect(screen.queryByTestId("render-edit-draft-picker")).toBeNull();
+
+    const titleInput = screen.getByTestId("field-title").querySelector("input") as HTMLInputElement;
+    fireEvent.change(titleInput, { target: { value: "Brand new" } });
+    await act(async () => {
+      fireEvent.click(screen.getByTestId("render-edit-wizard-next"));
+      await Promise.resolve();
+    });
+
+    // Minted a genuinely different draftId — the ignored candidate is untouched.
+    expect(drafts.get(`${screenDef.id}:new:existing-id`)?.values["title"]).toBe("Resumed");
+    const prefix = `${screenDef.id}:new:`;
+    const mintedKeys = [...drafts.keys()].filter(
+      (k) => k.startsWith(prefix) && k !== `${prefix}existing-id`,
+    );
+    expect(mintedKeys).toHaveLength(1);
+    expect(drafts.get(mintedKeys[0] as string)?.values["title"]).toBe("Brand new");
   });
 
   test("cleared storage with multiple open drafts shows a picker; picking one resumes it", async () => {
@@ -1739,8 +2072,10 @@ describe("RenderEdit create-mode draftId (issue #1913)", () => {
       </DispatcherProvider>,
     );
 
-    // The lone open draft (`other-session`) auto-adopts on mount — the same
-    // path a cleared-storage tab takes. Wait for that to settle first.
+    // The lone open draft (`other-session`) shows in the picker on mount —
+    // the user explicitly picks it (no silent cross-tab auto-adopt).
+    await waitFor(() => expect(screen.getByTestId("render-edit-draft-picker")).toBeTruthy());
+    fireEvent.click(screen.getByTestId(`render-edit-draft-pick-${screenDef.id}:new:other-session`));
     await waitFor(() => {
       const titleInput = screen
         .getByTestId("field-title")
@@ -1788,7 +2123,7 @@ describe("RenderEdit create-mode draftId (issue #1913)", () => {
     });
 
     expect(listCallCount).toBe(1);
-    expect(screen.queryByTestId("field-title")).toBeNull();
+    expect(screen.getByTestId("field-title").closest("[hidden]")).not.toBeNull();
     expect(screen.queryByTestId("render-edit-draft-picker")).toBeNull();
     const countAfterSubmit = screen
       .getByTestId("field-count")
@@ -1892,6 +2227,91 @@ describe("RenderEdit locked state (#1896)", () => {
   });
 });
 
+describe("RenderEdit hideActions (host-driven action bar)", () => {
+  test("hideActions renders the fields but drops RenderEdit's own action bar", () => {
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher()}>
+        <RenderEdit<TestValues>
+          screen={makeScreen()}
+          entity={orderEntity}
+          featureName="orders"
+          initial={{ title: "Acme", count: 1, isUrgent: false }}
+          writeCommand="order:create"
+          hideActions
+        />
+      </DispatcherProvider>,
+    );
+
+    expect(screen.getByTestId("field-title").querySelector("input")).toBeTruthy();
+    expect(screen.queryByTestId("render-edit-submit")).toBeNull();
+  });
+
+  test("without hideActions, the submit button stays (existing behaviour unchanged)", () => {
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher()}>
+        <RenderEdit<TestValues>
+          screen={makeScreen()}
+          entity={orderEntity}
+          featureName="orders"
+          initial={{ title: "Acme", count: 1, isUrgent: false }}
+          writeCommand="order:create"
+        />
+      </DispatcherProvider>,
+    );
+
+    expect(screen.getByTestId("render-edit-submit")).toBeTruthy();
+  });
+
+  test("controls.submit() writes an unchanged, pre-filled form through customSubmit — the built-in button (disabled while unchanged) cannot do this", async () => {
+    const customSubmit = mock(
+      async (_snapshot: FormSnapshot<TestValues>): Promise<SubmitResult<unknown>> => ({
+        validationBlocked: false,
+        isSuccess: true,
+        data: { id: "42" },
+      }),
+    );
+    const onSubmit = mock((_result: SubmitResult<unknown>) => {});
+    let controls: RenderEditControls<TestValues> | undefined;
+    render(
+      <DispatcherProvider dispatcher={makeDispatcher()}>
+        <RenderEdit<TestValues>
+          screen={makeScreen()}
+          entity={orderEntity}
+          featureName="orders"
+          initial={{ title: "Acme", count: 1, isUrgent: false }}
+          customSubmit={customSubmit}
+          onSubmit={onSubmit}
+          onControlsReady={(c) => {
+            controls = c;
+          }}
+        />
+      </DispatcherProvider>,
+    );
+
+    // Nothing was ever edited — the built-in save button proves it by
+    // staying disabled. controls.submit() has no such guard and must
+    // still write, which is exactly the point of this test.
+    expect((screen.getByTestId("render-edit-submit") as HTMLButtonElement).disabled).toBe(true);
+
+    await act(async () => {
+      await controls?.submit();
+    });
+
+    expect(customSubmit).toHaveBeenCalledTimes(1);
+    expect(customSubmit.mock.calls[0]?.[0]?.values).toEqual({
+      title: "Acme",
+      count: 1,
+      isUrgent: false,
+    });
+    expect(onSubmit).toHaveBeenCalledTimes(1);
+    expect(onSubmit.mock.calls[0]?.[0]).toEqual({
+      validationBlocked: false,
+      isSuccess: true,
+      data: { id: "42" },
+    });
+  });
+});
+
 describe("RenderEdit fields filter", () => {
   const filterEntity = {
     fields: {

package/src/__tests__/wizard-form-validation.test.tsx

@@ -55,8 +55,8 @@ describe("entityEdit wizard — presence validation on Next (fw#1910)", () => {
 
     expect(screen.getByTestId("render-edit-wizard-step-label").textContent).toContain("1");
     expect(screen.getByTestId("field-fullName-errors")).toBeTruthy();
-    // Step 2's field never mounts — the transition was blocked.
-    expect(document.querySelector("#kumiko-edit-email")).toBeNull();
+    // Step 2's field stays mounted but hidden — the transition was blocked.
+    expect(screen.getByTestId("field-email").closest("[hidden]")).not.toBeNull();
   });
 
   test("filling the required field allows Next to advance to step 2", async () => {

package/src/primitives/__tests__/data-table-logic.test.ts

@@ -166,7 +166,7 @@ describe("defaultCellRender", () => {
   });
 
   test("money → { amount, currency } formatiert, kein [object Object]", () => {
-    const result = defaultCellRender({ amount: 45000, currency: "EUR" }, "money");
+    const result = defaultCellRender({ amount: 450, currency: "EUR" }, "money");
     expect(result).not.toBe("[object Object]");
     expect(result.replace(/[^0-9]/g, "")).toBe("45000");
   });

package/src/primitives/__tests__/embedded-list-input.test.tsx

@@ -326,14 +326,17 @@ describe("EmbeddedListInput — totals", () => {
 });
 
 describe("EmbeddedListInput — tab-to-add-row", () => {
-  test("Tab on the last cell of the last row (no maxItems limit) fires onAddRow and prevents default", () => {
+  // COLUMNS' last column ("amount") is derived, so its control is rendered
+  // disabled and never focusable/keydown-reachable in a real browser — the
+  // append-row handler must live on "quantity", the last EDITABLE column.
+  test("Tab on the last editable cell of the last row (no maxItems limit) fires onAddRow and prevents default", () => {
     const rows = [{ description: "A", quantity: 1, amount: 100 }];
     const onAddRow = mock(() => {});
     renderWithLocale(<EmbeddedListInput {...baseProps({ rows, onAddRow })} />);
     const desktop = within(screen.getByTestId("lines-desktop"));
-    const lastCell = desktop.getByTestId("lines-cell-0-amount");
-    const input = lastCell.querySelector("input");
-    if (input === null) throw new Error("expected an <input> inside the last cell");
+    const lastEditableCell = desktop.getByTestId("lines-cell-0-quantity");
+    const input = lastEditableCell.querySelector("input");
+    if (input === null) throw new Error("expected an <input> inside the last editable cell");
 
     // fireEvent returns false when the event's default was prevented —
     // same return-value convention as native dispatchEvent.
@@ -347,9 +350,26 @@ describe("EmbeddedListInput — tab-to-add-row", () => {
     const onAddRow = mock(() => {});
     renderWithLocale(<EmbeddedListInput {...baseProps({ rows, onAddRow, maxItems: 1 })} />);
     const desktop = within(screen.getByTestId("lines-desktop"));
-    const lastCell = desktop.getByTestId("lines-cell-0-amount");
-    const input = lastCell.querySelector("input");
-    if (input === null) throw new Error("expected an <input> inside the last cell");
+    const lastEditableCell = desktop.getByTestId("lines-cell-0-quantity");
+    const input = lastEditableCell.querySelector("input");
+    if (input === null) throw new Error("expected an <input> inside the last editable cell");
+
+    fireEvent.keyDown(input, { key: "Tab", code: "Tab" });
+    expect(onAddRow).not.toHaveBeenCalled();
+  });
+
+  // Regression: a derived trailing column (e.g. "amount") used to be treated
+  // as the last cell (columns.length - 1), but its control is disabled and
+  // unreachable via Tab/Enter in a real browser — the handler must attach
+  // to "quantity" (last editable), not "amount" (last, but derived).
+  test("Tab on the derived trailing cell ('amount') does not fire onAddRow — it isn't the last editable column", () => {
+    const rows = [{ description: "A", quantity: 1, amount: 100 }];
+    const onAddRow = mock(() => {});
+    renderWithLocale(<EmbeddedListInput {...baseProps({ rows, onAddRow })} />);
+    const desktop = within(screen.getByTestId("lines-desktop"));
+    const derivedCell = desktop.getByTestId("lines-cell-0-amount");
+    const input = derivedCell.querySelector("input");
+    if (input === null) throw new Error("expected an <input> inside the derived cell");
 
     fireEvent.keyDown(input, { key: "Tab", code: "Tab" });
     expect(onAddRow).not.toHaveBeenCalled();
@@ -405,14 +425,14 @@ describe("EmbeddedListInput — paste", () => {
 });
 
 describe("EmbeddedListInput — Enter-to-add-row (#1839)", () => {
-  test("Enter on the last cell of the last row fires onAddRow and prevents default, same as Tab", () => {
+  test("Enter on the last editable cell of the last row fires onAddRow and prevents default, same as Tab", () => {
     const rows = [{ description: "A", quantity: 1, amount: 100 }];
     const onAddRow = mock(() => {});
     renderWithLocale(<EmbeddedListInput {...baseProps({ rows, onAddRow })} />);
     const desktop = within(screen.getByTestId("lines-desktop"));
-    const lastCell = desktop.getByTestId("lines-cell-0-amount");
-    const input = lastCell.querySelector("input");
-    if (input === null) throw new Error("expected an <input> inside the last cell");
+    const lastEditableCell = desktop.getByTestId("lines-cell-0-quantity");
+    const input = lastEditableCell.querySelector("input");
+    if (input === null) throw new Error("expected an <input> inside the last editable cell");
 
     const notPrevented = fireEvent.keyDown(input, { key: "Enter", code: "Enter" });
     expect(onAddRow).toHaveBeenCalledTimes(1);
@@ -427,9 +447,9 @@ describe("EmbeddedListInput — Enter-to-add-row (#1839)", () => {
     const onAddRow = mock(() => {});
     renderWithLocale(<EmbeddedListInput {...baseProps({ rows, onAddRow, maxItems: 1 })} />);
     const desktop = within(screen.getByTestId("lines-desktop"));
-    const lastCell = desktop.getByTestId("lines-cell-0-amount");
-    const input = lastCell.querySelector("input");
-    if (input === null) throw new Error("expected an <input> inside the last cell");
+    const lastEditableCell = desktop.getByTestId("lines-cell-0-quantity");
+    const input = lastEditableCell.querySelector("input");
+    if (input === null) throw new Error("expected an <input> inside the last editable cell");
 
     fireEvent.keyDown(input, { key: "Enter", code: "Enter" });
     expect(onAddRow).not.toHaveBeenCalled();

package/src/primitives/embedded-list-input.tsx

@@ -406,6 +406,13 @@ export function EmbeddedListInput({
 
   const cellId = (rowIndex: number, field: string): string => `${id}-${rowIndex}-${field}`;
 
+  // handleLastCellKeyDown must attach to the last EDITABLE column, not
+  // columns.length - 1 — a derived column there is rendered disabled
+  // (renderCellControl) and never receives focus/keydown, which would
+  // silently kill Tab/Enter-appends-a-row whenever the table ends in a
+  // derived column (e.g. a trailing "amount" total).
+  const lastEditableIndex = columns.findLastIndex((column) => !column.derived);
+
   const showControls = disabled !== true;
   const addDisabled = maxItems !== undefined && rows.length >= maxItems;
 
@@ -500,7 +507,7 @@ export function EmbeddedListInput({
                     >
                       <TableRow data-testid={testIdFor(`row-${rowIndex}`)}>
                         {columns.map((column, columnIndex) => {
-                          const isLastCell = isLastRow && columnIndex === columns.length - 1;
+                          const isLastCell = isLastRow && columnIndex === lastEditableIndex;
                           const issues = cellIssues?.[`${rowIndex}.${column.field}`];
                           return (
                             <TableCell
@@ -614,7 +621,7 @@ export function EmbeddedListInput({
                 className="flex flex-col gap-3 rounded-lg border bg-card p-4"
               >
                 {columns.map((column, columnIndex) => {
-                  const isLastCell = isLastRow && columnIndex === columns.length - 1;
+                  const isLastCell = isLastRow && columnIndex === lastEditableIndex;
                   const issues = cellIssues?.[`${rowIndex}.${column.field}`];
                   return (
                     // biome-ignore lint/a11y/noStaticElementInteractions: paste/keydown are delegated from the focusable cell control rendered inside, not direct interaction on this wrapper div.

package/src/primitives/index.tsx

@@ -99,7 +99,7 @@ import { FileUploadInput } from "./file-upload";
 import { DefaultLightbox } from "./lightbox";
 import { LocatedTimestampInput } from "./located-timestamp-input";
 import { DefaultModal } from "./modal";
-import { formatMoney, MoneyInput } from "./money-input";
+import { currencyDecimals, formatMoney, MoneyInput } from "./money-input";
 import { TimestampInput } from "./timestamp-input";
 import { useToast } from "./toast";
 import { TzInput } from "./tz-input";
@@ -386,6 +386,7 @@ function DefaultInput(props: InputProps): ReactNode {
           {...common}
           data-testid={props.testId}
           value={props.value}
+          step={props.step}
           onChange={(e: ChangeEvent<HTMLInputElement>) => {
             const v = e.target.value;
             props.onChange(v === "" ? undefined : Number(v));
@@ -1444,10 +1445,13 @@ export function defaultCellRender(
     // can render differently in a table vs. a form on the same screen.
     // Mid-term: pass the app locale down here too, analogous to render-field.
     //
-    // formatMoney expects minor units. rehydrateMoney returns amount in MAJOR
-    // units plus amountMinor (cents). Prefer amountMinor when present; legacy
-    // shapes without it still carry cents in `amount`.
-    const minor = typeof value.amountMinor === "number" ? value.amountMinor : value.amount;
+    // formatMoney expects minor units scaled by currencyDecimals(currency).
+    // rehydrateMoney's `amountMinor` is scaled by a flat MINOR_UNIT_SCALE=100
+    // instead, which disagrees with currencyDecimals for non-2-decimal
+    // currencies (JPY: 0 decimals → 100x too high; BHD: 3 decimals → 10x too
+    // low). Deriving minor units from `amount` keeps this consistent with
+    // render-field.tsx's moneyMinorValue.
+    const minor = Math.round(value.amount * 10 ** currencyDecimals(value.currency));
     return formatMoney(minor, value.currency);
   }
   if (type === "select") {
@@ -1718,6 +1722,7 @@ function DefaultSection({
   actions,
   variant = "default",
   testId,
+  hidden,
 }: SectionProps): ReactNode {
   const insideForm = useContext(InsideFormContext);
 
@@ -1753,9 +1758,11 @@ function DefaultSection({
     return (
       <section
         data-testid={testId}
+        hidden={hidden}
         className={cn(
           "flex flex-col gap-4 px-6 py-6",
           variant === "destructive" && "border-l-2 border-destructive/40",
+          hidden && "hidden",
         )}
       >
         {header}
@@ -1782,10 +1789,12 @@ function DefaultSection({
   return (
     <div
       data-testid={testId}
+      hidden={hidden}
       className={cn(
         cardSurface(),
         "overflow-hidden",
         variant === "destructive" && "border-destructive/40",
+        hidden && "hidden",
       )}
     >
       <div className="flex flex-col gap-4 px-6 py-6">

package/src/widgets/__tests__/infinity-list.test.tsx

@@ -295,6 +295,119 @@ describe("InfinityList", () => {
       expect(calls[2]).toEqual({ limit: 1 });
     });
 
+    // Regression for the "logic inversion" bug: staleRows used to keep
+    // exactly the rows MISSING from the fresh page-1 response, so a row
+    // deleted elsewhere never left the list.
+    test("Row aus Seite 1 gelöscht → verschwindet nach Refresh", async () => {
+      const calls: Array<Readonly<Record<string, unknown>>> = [];
+      const dispatcher = createMockDispatcher({
+        query: ((_type: string, payload: Readonly<Record<string, unknown>>) => {
+          calls.push(payload);
+          if (calls.length === 1) {
+            return Promise.resolve({
+              isSuccess: true,
+              data: {
+                rows: [
+                  { id: "m1", subject: "Erste" },
+                  { id: "m2", subject: "Zweite" },
+                ],
+                nextCursor: null,
+              },
+            });
+          }
+          // Live refresh: m1 was deleted elsewhere, only m2 remains on page 1.
+          return Promise.resolve({
+            isSuccess: true,
+            data: { rows: [{ id: "m2", subject: "Zweite" }], nextCursor: null },
+          });
+        }) as unknown as Dispatcher["query"],
+      });
+      const fake = makeFakeLiveEvents();
+
+      renderWithLive(list("inbox:query:message:list"), dispatcher, fake.subscriber);
+
+      await waitFor(() => expect(screen.getByText("Erste")).toBeTruthy());
+      expect(screen.getByText("Zweite")).toBeTruthy();
+
+      act(() => {
+        fake.inject("message.deleted", {
+          id: "m1",
+          aggregateType: "message",
+          version: 1,
+          payload: {},
+          createdAt: "",
+        });
+      });
+
+      await waitFor(() => expect(screen.queryByText("Erste")).toBeNull());
+      expect(screen.getByText("Zweite")).toBeTruthy();
+    });
+
+    // A row that was never part of page 1 (it lives on an already-loaded
+    // page 2) must survive a page-1-only live refresh even when it isn't in
+    // the fresh response — the fix must not treat "not in freshIds" alone
+    // as reason to drop a row.
+    test("Row aus Seite 2 bleibt nach Seite-1-Refresh erhalten", async () => {
+      const calls: Array<Readonly<Record<string, unknown>>> = [];
+      const dispatcher = createMockDispatcher({
+        query: ((_type: string, payload: Readonly<Record<string, unknown>>) => {
+          calls.push(payload);
+          if (calls.length === 1) {
+            return Promise.resolve({
+              isSuccess: true,
+              data: { rows: [{ id: "m1", subject: "Erste" }], nextCursor: "c1" },
+            });
+          }
+          if (calls.length === 2) {
+            return Promise.resolve({
+              isSuccess: true,
+              data: { rows: [{ id: "m2", subject: "Zweite" }], nextCursor: null },
+            });
+          }
+          // Live refresh of page 1: m1 was deleted elsewhere, m3 arrives new.
+          // m2 lives on page 2 and is outside this fetch's scope.
+          return Promise.resolve({
+            isSuccess: true,
+            data: { rows: [{ id: "m3", subject: "Neu" }], nextCursor: null },
+          });
+        }) as unknown as Dispatcher["query"],
+      });
+      const fake = makeFakeLiveEvents();
+
+      renderWithLive(
+        <InfinityList<Page, Row>
+          query="inbox:query:message:list"
+          pageSize={1}
+          rows={(data) => data.rows}
+          nextCursor={(data) => data.nextCursor}
+          rowId={(row) => row.id}
+          renderRow={(row) => <span>{row.subject}</span>}
+          testId="inbox"
+        />,
+        dispatcher,
+        fake.subscriber,
+      );
+
+      await waitFor(() => expect(screen.getByText("Erste")).toBeTruthy());
+      fireIntersect();
+      await waitFor(() => expect(screen.getByText("Zweite")).toBeTruthy());
+      expect(calls.length).toBe(2);
+
+      act(() => {
+        fake.inject("message.created", {
+          id: "m3",
+          aggregateType: "message",
+          version: 1,
+          payload: {},
+          createdAt: "",
+        });
+      });
+
+      await waitFor(() => expect(screen.getByText("Neu")).toBeTruthy());
+      expect(screen.queryByText("Erste")).toBeNull();
+      expect(screen.getByText("Zweite")).toBeTruthy();
+    });
+
     test("live=false: SSE-Event wird ignoriert, kein Refetch", async () => {
       let calls = 0;
       const dispatcher = createMockDispatcher({

package/src/widgets/infinity-list.tsx

@@ -80,6 +80,12 @@ export function InfinityList<TData = unknown, TRow = Readonly<Record<string, unk
   // overwrite it, leaving stale rows on screen (fw#1705).
   const requestSeq = useRef(0);
 
+  // IDs of the most recently loaded first page. refreshFirstPage() needs
+  // this to tell "row dropped from page 1 elsewhere" (must be pruned) apart
+  // from "row belongs to an already-accumulated later page" (must survive)
+  // — both are simply absent from the fresh page's id set.
+  const firstPageIdsRef = useRef<ReadonlySet<string>>(new Set());
+
   // biome-ignore lint/correctness/useExhaustiveDependencies: payload goes through payloadKey
   const load = useCallback(
     async (cursor: string | null): Promise<void> => {
@@ -95,6 +101,11 @@ export function InfinityList<TData = unknown, TRow = Readonly<Record<string, unk
         return;
       }
       const nextRows = rowsRef.current(res.data);
+      if (cursor === null) {
+        firstPageIdsRef.current = new Set(
+          nextRows.map((row, index) => rowIdRef.current(row, index)),
+        );
+      }
       setState((prev) => ({
         kind: "ready",
         rows: cursor === null || prev.kind !== "ready" ? nextRows : [...prev.rows, ...nextRows],
@@ -131,12 +142,20 @@ export function InfinityList<TData = unknown, TRow = Readonly<Record<string, unk
     if (!res.isSuccess) return;
     const freshRows = rowsRef.current(res.data);
     const freshIds = new Set(freshRows.map((row, index) => rowIdRef.current(row, index)));
+    // A row absent from freshIds is stale for one of two reasons: it was
+    // dropped from page 1 (deleted, or filtered out elsewhere) and must be
+    // pruned, or it belongs to an already-accumulated later page and must
+    // survive. previousFirstPageIds — captured before it's overwritten below
+    // — is what tells those two cases apart.
+    const previousFirstPageIds = firstPageIdsRef.current;
+    firstPageIdsRef.current = freshIds;
     setState((prev) => {
       // skip: not showing an accumulated list yet, nothing to merge into
       if (prev.kind !== "ready") return prev;
-      const staleRows = prev.rows.filter(
-        (row, index) => !freshIds.has(rowIdRef.current(row, index)),
-      );
+      const staleRows = prev.rows.filter((row, index) => {
+        const id = rowIdRef.current(row, index);
+        return !freshIds.has(id) && !previousFirstPageIds.has(id);
+      });
       return { kind: "ready", rows: [...freshRows, ...staleRows], cursor: prev.cursor };
     });
   }, [dispatcher, query, pageSize, payloadKey]);