@cosmicdrift/kumiko-headless 0.295.0 → 0.297.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cosmicdrift/kumiko-headless",
-  "version": "0.295.0",
+  "version": "0.297.0",
   "description": "Headless UI logic for Kumiko — Dispatcher contract, Form-Controller, View-Model, Nav-Resolver. Plattform- und React-frei; jeder Renderer (renderer, renderer-web, renderer-native, …) komponiert darauf.",
   "license": "BUSL-1.1",
   "author": "Marc Frost <marc@cosmicdriftgamestudio.com>",
@@ -36,7 +36,7 @@
     }
   },
   "dependencies": {
-    "@cosmicdrift/kumiko-framework": "0.295.0",
+    "@cosmicdrift/kumiko-framework": "0.297.0",
     "temporal-polyfill": "^0.3.2",
     "zod": "^4.4.3"
   },

package/src/view-model/__tests__/edit.test.ts

@@ -119,6 +119,47 @@ describe("computeEditViewModel", () => {
     expect(asFields(vm.sections[1]).columns).toBe(1);
   });
 
+  // The two-column default came in with projectionDetail tabs and now also
+  // covers entityEdit tabs (fw#3134) — a tab is its own panel, where a stacked
+  // form's single column wastes the width.
+  test("a tabs layout defaults sections to 2 columns, not 1", () => {
+    const vm = computeEditViewModel({
+      screen: editScreen({
+        mode: "tabs",
+        sections: [
+          { id: "main", title: "Main", fields: ["customerName"] },
+          { id: "notes", title: "Notes", columns: 1, fields: ["notes"] },
+        ],
+      }),
+      entity: orderEntity,
+      values: {},
+      translate,
+      featureName: "orders",
+    });
+
+    expect(asFields(vm.sections[0]).columns).toBe(2);
+    expect(asFields(vm.sections[1]).columns).toBe(1);
+  });
+
+  test("tabs sections carry their declared id into the view model", () => {
+    const vm = computeEditViewModel({
+      screen: editScreen({
+        mode: "tabs",
+        sections: [
+          { id: "main", title: "Main", fields: ["customerName"] },
+          { id: "notes", title: "Notes", fields: ["notes"] },
+        ],
+      }),
+      entity: orderEntity,
+      values: {},
+      translate,
+      featureName: "orders",
+    });
+
+    expect(asFields(vm.sections[0]).id).toBe("main");
+    expect(asFields(vm.sections[1]).id).toBe("notes");
+  });
+
   test("visible predicate evaluated against current values (live-reactive)", () => {
     const screen = editScreen({
       sections: [

package/src/view-model/edit.ts

@@ -149,6 +149,7 @@ export function computeEditViewModel<
     if (isExtensionEditSection(sectionSpec)) {
       return {
         kind: "extension" as const,
+        ...(sectionSpec.id !== undefined && { id: sectionSpec.id }),
         title: translate(sectionSpec.title),
         component: sectionSpec.component,
         contributesToFormSubmit: sectionSpec.contributesToFormSubmit === true,
@@ -441,8 +442,9 @@ export function computeEditViewModel<
     // Boot-validator rejects fields.length === 0 with no groups (screens.ts),
     // so an empty section never reaches this code.
     const visible = fields.some((field) => field.visible);
-    // Tabs mode renders this section as its own card, where two columns reads
-    // better than the single-column default a stacked form keeps.
+    // Tabs mode renders this section as its own panel, where two columns reads
+    // better than the single-column default a stacked form keeps. Applies to
+    // entityEdit tabs as well since fw#3134, not just projectionDetail.
     const defaultColumns = screen.layout.mode === "tabs" ? 2 : 1;
     const groups = sectionSpec.groups?.map((group) => ({
       title: translate(group.title),
@@ -461,6 +463,7 @@ export function computeEditViewModel<
     }));
     return {
       kind: "fields" as const,
+      ...(sectionSpec.id !== undefined && { id: sectionSpec.id }),
       visible,
       // Titellose Section (flache Form) → kein h3; nur übersetzen wenn gesetzt.
       ...(sectionSpec.title !== undefined && { title: translate(sectionSpec.title) }),

package/src/view-model/types.ts

@@ -266,6 +266,10 @@ export type EditSectionViewModel =
 
 export type EditFieldsSectionViewModel = {
   readonly kind: "fields";
+  /** From `EditFieldsSection.id`. The boot-validator makes it mandatory under
+   *  `layout.mode: "tabs"` so the tab strip has a stable key per tab; other
+   *  layouts leave it unset. */
+  readonly id?: string;
   /** False when the section has fields but none of them is visible.
    *  The renderer then draws nothing, but the section stays in the array
    *  (key stability). */
@@ -291,6 +295,9 @@ export type EditFieldsSectionViewModel = {
 
 export type EditExtensionSectionViewModel = {
   readonly kind: "extension";
+  /** From `EditExtensionSection.id` — same tab-strip role as on a "fields"
+   *  section, see EditFieldsSectionViewModel.id. */
+  readonly id?: string;
   readonly title: string;
   readonly component: PlatformComponent;
   readonly contributesToFormSubmit: boolean;