@webiny/app-headless-cms 0.0.0-unstable.eb196ccd2f → 0.0.0-unstable.eb81deee7e

package/features/contentEntry/valueTransformers/feature.d.ts

@@ -0,0 +1 @@
+export declare const ValueTransformersFeature: import("@webiny/feature/admin").FeatureDefinition<any, []>;

package/features/contentEntry/valueTransformers/feature.js

@@ -0,0 +1,16 @@
+import { createFeature } from "@webiny/feature/admin";
+import { EntryDataPreparer, EntryDataPreparerImpl } from "./EntryDataPreparer.js";
+import { CmsEntryValueTransformer } from "./abstractions.js";
+import { DynamicZoneValueTransformer } from "./DynamicZoneValueTransformer.js";
+import { ObjectValueTransformer } from "./ObjectValueTransformer.js";
+const ValueTransformersFeature = createFeature({
+    name: "CmsEntryValueTransformers",
+    register (container) {
+        container.register(DynamicZoneValueTransformer);
+        container.register(ObjectValueTransformer);
+        container.registerInstance(EntryDataPreparer, new EntryDataPreparerImpl(()=>container.resolveAll(CmsEntryValueTransformer)));
+    }
+});
+export { ValueTransformersFeature };
+
+//# sourceMappingURL=feature.js.map

package/features/contentEntry/valueTransformers/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/contentEntry/valueTransformers/feature.js","sources":["../../../../src/features/contentEntry/valueTransformers/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { EntryDataPreparer, EntryDataPreparerImpl } from \"./EntryDataPreparer.js\";\nimport { CmsEntryValueTransformer } from \"./abstractions.js\";\nimport { DynamicZoneValueTransformer } from \"./DynamicZoneValueTransformer.js\";\nimport { ObjectValueTransformer } from \"./ObjectValueTransformer.js\";\n\nexport const ValueTransformersFeature = createFeature({\n    name: \"CmsEntryValueTransformers\",\n    register(container) {\n        container.register(DynamicZoneValueTransformer);\n        container.register(ObjectValueTransformer);\n        container.registerInstance(\n            EntryDataPreparer,\n            new EntryDataPreparerImpl(() => container.resolveAll(CmsEntryValueTransformer))\n        );\n    }\n});\n"],"names":["ValueTransformersFeature","createFeature","container","DynamicZoneValueTransformer","ObjectValueTransformer","EntryDataPreparer","EntryDataPreparerImpl","CmsEntryValueTransformer"],"mappings":";;;;;AAMO,MAAMA,2BAA2BC,cAAc;IAClD,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC;QACnBD,UAAU,QAAQ,CAACE;QACnBF,UAAU,gBAAgB,CACtBG,mBACA,IAAIC,sBAAsB,IAAMJ,UAAU,UAAU,CAACK;IAE7D;AACJ"}

package/features/formModel/CmsFormModelBuilder.d.ts

@@ -0,0 +1,23 @@
+import type { IFormModelConfig } from "@webiny/app-admin/features/formModel/abstractions.js";
+import type { CmsModel } from "../../types.js";
+import type { ICmsFieldTypeMapper, ICmsFormModelBuilder } from "./abstractions.js";
+import type { ICmsFieldRenderer } from "../../presentation/fieldRenderers/abstractions.js";
+declare class CmsFormModelBuilderImpl implements ICmsFormModelBuilder {
+    private mappers;
+    private rendererMap;
+    private renderers;
+    constructor(customMappers: ICmsFieldTypeMapper[] | undefined, fieldRenderers: ICmsFieldRenderer[] | undefined);
+    build(model: CmsModel): IFormModelConfig;
+    private mapField;
+    /**
+     * A list renderer can't render a single value: `dateTimeInputs` calls `.map()` on a
+     * stored date string and crashes the form. When a single-value field is configured with
+     * a renderer that only accepts list fields, drop it so the field type's default
+     * single-value renderer is used instead.
+     */
+    private withCompatibleRenderer;
+}
+export declare const CmsFormModelBuilder: typeof CmsFormModelBuilderImpl & {
+    __abstraction: import("@webiny/di").Abstraction<ICmsFormModelBuilder>;
+};
+export {};

package/features/formModel/CmsFormModelBuilder.js

@@ -0,0 +1,86 @@
+import { CmsFieldTypeMapper, CmsFormModelBuilder } from "./abstractions.js";
+import { CmsFieldRenderer } from "../../presentation/fieldRenderers/abstractions.js";
+import { collectFieldIds, mapCmsLayout } from "./CmsLayoutMapper.js";
+import { createBuiltInMappers } from "./mappers/index.js";
+import { applyFieldProps } from "./mappers/applyFieldProps.js";
+class CmsFormModelBuilderImpl {
+    constructor(customMappers, fieldRenderers){
+        this.mappers = new Map();
+        for (const mapper of createBuiltInMappers())this.mappers.set(mapper.type, mapper);
+        for (const mapper of customMappers || [])this.mappers.set(mapper.type, mapper);
+        this.rendererMap = new Map();
+        this.renderers = new Map();
+        for (const renderer of fieldRenderers || []){
+            this.rendererMap.set(renderer.rendererName, renderer.formRenderer);
+            this.renderers.set(renderer.rendererName, renderer);
+        }
+    }
+    build(model) {
+        const context = {
+            model,
+            rendererMap: this.rendererMap,
+            mapField: (field, registry)=>this.mapField(field, registry, context)
+        };
+        const idToFieldId = new Map();
+        for (const field of model.fields)idToFieldId.set(field.id, field.fieldId);
+        const fieldIdsInLayout = model.layout ? collectFieldIds(model.layout, idToFieldId) : null;
+        return {
+            fields: (registry)=>{
+                const result = {};
+                for (const field of model.fields){
+                    const builder = this.mapField(field, registry, context);
+                    if (fieldIdsInLayout && !fieldIdsInLayout.has(field.fieldId)) builder.hidden();
+                    result[field.fieldId] = builder;
+                }
+                return result;
+            },
+            layout: model.layout ? (layout)=>mapCmsLayout(model.layout, layout, idToFieldId) : void 0
+        };
+    }
+    mapField(modelField, registry, context) {
+        const field = this.withCompatibleRenderer(modelField, context.model);
+        const mapper = this.mappers.get(field.type);
+        if (mapper) return mapper.map(field, registry, context);
+        return applyFieldProps(registry.text(), field, context.rendererMap);
+    }
+    withCompatibleRenderer(field, model) {
+        if (field.list || !field.renderer || "object" != typeof field.renderer) return field;
+        const renderer = this.renderers.get(field.renderer.name);
+        if (!renderer || renderer.canUse({
+            field,
+            model
+        })) return field;
+        if (!renderer.canUse({
+            field: {
+                ...field,
+                list: true
+            },
+            model
+        })) return field;
+        if ("development" === process.env.NODE_ENV) console.warn(`[CmsFormModelBuilder] Renderer "${field.renderer.name}" is for list fields; field "${field.fieldId}" is not a list and uses its default renderer instead.`);
+        const { renderer: _renderer, ...rest } = field;
+        return rest;
+    }
+}
+const CmsFormModelBuilder_CmsFormModelBuilder = CmsFormModelBuilder.createImplementation({
+    implementation: CmsFormModelBuilderImpl,
+    dependencies: [
+        [
+            CmsFieldTypeMapper,
+            {
+                multiple: true,
+                optional: true
+            }
+        ],
+        [
+            CmsFieldRenderer,
+            {
+                multiple: true,
+                optional: true
+            }
+        ]
+    ]
+});
+export { CmsFormModelBuilder_CmsFormModelBuilder as CmsFormModelBuilder };
+
+//# sourceMappingURL=CmsFormModelBuilder.js.map

package/features/formModel/CmsFormModelBuilder.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/CmsFormModelBuilder.js","sources":["../../../src/features/formModel/CmsFormModelBuilder.ts"],"sourcesContent":["import type {\n    IFieldBuilder,\n    IFieldBuilderRegistry,\n    IFormModelConfig\n} from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport type { CmsModel, CmsModelField } from \"~/types.js\";\nimport type {\n    ICmsFieldTypeMapper,\n    ICmsFieldMapperContext,\n    ICmsFormModelBuilder\n} from \"./abstractions.js\";\nimport { CmsFormModelBuilder as BuilderAbstraction } from \"./abstractions.js\";\nimport { CmsFieldTypeMapper } from \"./abstractions.js\";\nimport { CmsFieldRenderer } from \"~/presentation/fieldRenderers/abstractions.js\";\nimport type { ICmsFieldRenderer } from \"~/presentation/fieldRenderers/abstractions.js\";\nimport { collectFieldIds, mapCmsLayout } from \"./CmsLayoutMapper.js\";\nimport { createBuiltInMappers } from \"./mappers/index.js\";\nimport { applyFieldProps } from \"./mappers/applyFieldProps.js\";\n\nclass CmsFormModelBuilderImpl implements ICmsFormModelBuilder {\n    private mappers: Map<string, ICmsFieldTypeMapper>;\n    private rendererMap: Map<string, string>;\n    private renderers: Map<string, ICmsFieldRenderer>;\n\n    constructor(\n        customMappers: ICmsFieldTypeMapper[] | undefined,\n        fieldRenderers: ICmsFieldRenderer[] | undefined\n    ) {\n        this.mappers = new Map();\n        for (const mapper of createBuiltInMappers()) {\n            this.mappers.set(mapper.type, mapper);\n        }\n        for (const mapper of customMappers || []) {\n            this.mappers.set(mapper.type, mapper);\n        }\n\n        this.rendererMap = new Map();\n        this.renderers = new Map();\n        for (const renderer of fieldRenderers || []) {\n            this.rendererMap.set(renderer.rendererName, renderer.formRenderer);\n            this.renderers.set(renderer.rendererName, renderer);\n        }\n    }\n\n    build(model: CmsModel): IFormModelConfig {\n        const context: ICmsFieldMapperContext = {\n            model,\n            rendererMap: this.rendererMap,\n            mapField: (field, registry) => this.mapField(field, registry, context)\n        };\n\n        const idToFieldId = new Map<string, string>();\n        for (const field of model.fields) {\n            idToFieldId.set(field.id, field.fieldId);\n        }\n\n        const fieldIdsInLayout = model.layout ? collectFieldIds(model.layout, idToFieldId) : null;\n\n        return {\n            fields: registry => {\n                const result: Record<string, IFieldBuilder> = {};\n                for (const field of model.fields) {\n                    const builder = this.mapField(field, registry, context);\n                    if (fieldIdsInLayout && !fieldIdsInLayout.has(field.fieldId)) {\n                        builder.hidden();\n                    }\n                    result[field.fieldId] = builder;\n                }\n                return result;\n            },\n            layout: model.layout\n                ? layout => mapCmsLayout(model.layout!, layout, idToFieldId)\n                : undefined\n        };\n    }\n\n    private mapField(\n        modelField: CmsModelField,\n        registry: IFieldBuilderRegistry,\n        context: ICmsFieldMapperContext\n    ): IFieldBuilder {\n        const field = this.withCompatibleRenderer(modelField, context.model);\n        const mapper = this.mappers.get(field.type);\n        if (mapper) {\n            return mapper.map(field, registry, context);\n        }\n\n        return applyFieldProps(registry.text(), field, context.rendererMap);\n    }\n\n    /**\n     * A list renderer can't render a single value: `dateTimeInputs` calls `.map()` on a\n     * stored date string and crashes the form. When a single-value field is configured with\n     * a renderer that only accepts list fields, drop it so the field type's default\n     * single-value renderer is used instead.\n     */\n    private withCompatibleRenderer(field: CmsModelField, model: CmsModel): CmsModelField {\n        if (field.list || !field.renderer || typeof field.renderer !== \"object\") {\n            return field;\n        }\n        const renderer = this.renderers.get(field.renderer.name);\n        if (!renderer || renderer.canUse({ field, model })) {\n            return field;\n        }\n        if (!renderer.canUse({ field: { ...field, list: true }, model })) {\n            return field;\n        }\n        if (process.env.NODE_ENV === \"development\") {\n            console.warn(\n                `[CmsFormModelBuilder] Renderer \"${field.renderer.name}\" is for list fields; ` +\n                    `field \"${field.fieldId}\" is not a list and uses its default renderer instead.`\n            );\n        }\n        // Mappers treat a missing renderer as \"use the field type's default\".\n        const { renderer: _renderer, ...rest } = field;\n        return rest as CmsModelField;\n    }\n}\n\nexport const CmsFormModelBuilder = BuilderAbstraction.createImplementation({\n    implementation: CmsFormModelBuilderImpl,\n    dependencies: [\n        [CmsFieldTypeMapper, { multiple: true, optional: true }],\n        [CmsFieldRenderer, { multiple: true, optional: true }]\n    ]\n});\n"],"names":["CmsFormModelBuilderImpl","customMappers","fieldRenderers","Map","mapper","createBuiltInMappers","renderer","model","context","field","registry","idToFieldId","fieldIdsInLayout","collectFieldIds","result","builder","layout","mapCmsLayout","undefined","modelField","applyFieldProps","process","console","_renderer","rest","CmsFormModelBuilder","BuilderAbstraction","CmsFieldTypeMapper","CmsFieldRenderer"],"mappings":"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"}

package/features/formModel/CmsFormModelBuilder.test.d.ts

@@ -0,0 +1 @@
+export {};

package/features/formModel/CmsFormModelBuilder.test.js

@@ -0,0 +1,252 @@
+import { describe, expect, it } from "vitest";
+import { Container } from "@webiny/di";
+import { FormModelFeature } from "@webiny/app-admin/features/formModel/feature.js";
+import { IdentityContextFeature } from "@webiny/app-admin/features/security/IdentityContext/feature.js";
+import { FormModelFactory } from "@webiny/app-admin/features/formModel/abstractions.js";
+import { CmsFormModelBuilder } from "./abstractions.js";
+import { CmsFormModelFeature } from "./feature.js";
+import { DateTimeInputRenderer } from "../../presentation/fieldTypes/renderers/dateTime/DateTimeInputRenderer.js";
+import { DateTimeInputsRenderer } from "../../presentation/fieldTypes/renderers/dateTime/DateTimeInputsRenderer.js";
+import { TextInputRenderer } from "../../presentation/fieldTypes/renderers/text/TextInputRenderer.js";
+import { TextInputsRenderer } from "../../presentation/fieldTypes/renderers/text/TextInputsRenderer.js";
+const field = (fieldId, type, list, renderer, extra = {})=>({
+        id: fieldId,
+        fieldId,
+        type,
+        label: fieldId,
+        tags: [],
+        list,
+        renderer: {
+            name: renderer,
+            settings: {}
+        },
+        validation: [],
+        listValidation: [],
+        settings: {},
+        predefinedValues: {
+            enabled: false,
+            values: []
+        },
+        ...extra
+    });
+function createCmsForm(fields) {
+    const container = new Container();
+    IdentityContextFeature.register(container);
+    FormModelFeature.register(container);
+    CmsFormModelFeature.register(container);
+    container.register(DateTimeInputRenderer);
+    container.register(DateTimeInputsRenderer);
+    container.register(TextInputRenderer);
+    container.register(TextInputsRenderer);
+    const model = {
+        modelId: "test",
+        fields,
+        layout: fields.map((f)=>[
+                f.fieldId
+            ])
+    };
+    const config = container.resolve(CmsFormModelBuilder).build(model);
+    return container.resolve(FormModelFactory).create(config);
+}
+describe("CmsFormModelBuilder renderer cardinality", ()=>{
+    it("keeps renderers that match the field's cardinality", ()=>{
+        const form = createCmsForm([
+            field("single", "datetime", false, "date-time-input"),
+            field("many", "datetime", true, "date-time-inputs")
+        ]);
+        expect(form.field("single").vm.renderer).toBe("dateTimeInput");
+        expect(form.field("many").vm.renderer).toBe("dateTimeInputs");
+    });
+    it("falls back to the single-value renderer when a list renderer is set on a non-list field", ()=>{
+        const form = createCmsForm([
+            field("openTime", "datetime", false, "date-time-inputs"),
+            field("name", "text", false, "text-inputs")
+        ]);
+        expect(form.field("openTime").vm.renderer).toBe("dateTimeInput");
+        expect(form.field("name").vm.renderer).toBe("textInput");
+    });
+    it("keeps the list renderer for list datetime fields with a subtype", ()=>{
+        const form = createCmsForm([
+            "date",
+            "time",
+            "dateTimeWithTimezone",
+            "dateTimeWithoutTimezone"
+        ].map((type)=>field(type, "datetime", true, "date-time-inputs", {
+                settings: {
+                    type
+                }
+            })));
+        expect(form.field("date").vm.renderer).toBe("dateTimeInputs");
+        expect(form.field("time").vm.renderer).toBe("dateTimeInputs");
+        expect(form.field("dateTimeWithTimezone").vm.renderer).toBe("dateTimeInputs");
+        expect(form.field("dateTimeWithoutTimezone").vm.renderer).toBe("dateTimeInputs");
+    });
+    it("applies the fallback to fields nested in object lists", ()=>{
+        const form = createCmsForm([
+            field("holidayHours", "object", true, "objects-accordion", {
+                settings: {
+                    fields: [
+                        field("openTime", "datetime", false, "date-time-inputs")
+                    ],
+                    layout: [
+                        [
+                            "openTime"
+                        ]
+                    ]
+                }
+            })
+        ]);
+        form.setData({
+            holidayHours: [
+                {
+                    openTime: "2026-12-24T09:00:00.000Z"
+                }
+            ]
+        });
+        const item = form.field("holidayHours").items[0];
+        expect(item.children.get("openTime").vm.renderer).toBe("dateTimeInput");
+    });
+});
+const rowNames = (layout)=>layout.map((row)=>row.fields.map((f)=>f.name));
+describe("CmsFormModelBuilder nested layouts", ()=>{
+    it("lays out a single object with the layout stored on the field", ()=>{
+        const form = createCmsForm([
+            field("address", "object", false, "object-accordion", {
+                settings: {
+                    fields: [
+                        field("street", "text", false, "text-input"),
+                        field("city", "text", false, "text-input", {
+                            id: "c1ty"
+                        }),
+                        field("zipCode", "text", false, "text-input")
+                    ],
+                    layout: [
+                        [
+                            "street"
+                        ],
+                        [
+                            "c1ty",
+                            "zipCode"
+                        ]
+                    ]
+                }
+            })
+        ]);
+        expect(rowNames(form.field("address").vm.layout)).toEqual([
+            [
+                "street"
+            ],
+            [
+                "city",
+                "zipCode"
+            ]
+        ]);
+    });
+    it("lays out every item of an object list", ()=>{
+        const form = createCmsForm([
+            field("facilityStats", "object", true, "objects-accordion", {
+                settings: {
+                    fields: [
+                        field("statValue", "text", false, "text-input"),
+                        field("statLabel", "text", false, "text-input")
+                    ],
+                    layout: [
+                        [
+                            "statValue",
+                            "statLabel"
+                        ]
+                    ]
+                }
+            })
+        ]);
+        form.setData({
+            facilityStats: [
+                {
+                    statValue: "1",
+                    statLabel: "a"
+                }
+            ]
+        });
+        const vm = form.field("facilityStats").vm;
+        expect(rowNames(vm.items[0].layout)).toEqual([
+            [
+                "statValue",
+                "statLabel"
+            ]
+        ]);
+    });
+    it("gives children missing from the stored layout a row of their own", ()=>{
+        const form = createCmsForm([
+            field("address", "object", false, "object-accordion", {
+                settings: {
+                    fields: [
+                        field("street", "text", false, "text-input"),
+                        field("city", "text", false, "text-input"),
+                        field("state", "text", false, "text-input")
+                    ],
+                    layout: [
+                        [
+                            "street",
+                            "city"
+                        ]
+                    ]
+                }
+            })
+        ]);
+        expect(rowNames(form.field("address").vm.layout)).toEqual([
+            [
+                "street",
+                "city"
+            ],
+            [
+                "state"
+            ]
+        ]);
+    });
+    it("lays out a dynamic zone template with the template's layout", ()=>{
+        const form = createCmsForm([
+            field("blocks", "dynamicZone", true, "dynamicZone", {
+                settings: {
+                    templates: [
+                        {
+                            id: "hero",
+                            name: "Hero",
+                            gqlTypeName: "Hero",
+                            description: "",
+                            icon: null,
+                            fields: [
+                                field("title", "text", false, "text-input"),
+                                field("subtitle", "text", false, "text-input")
+                            ],
+                            layout: [
+                                [
+                                    "title",
+                                    "subtitle"
+                                ]
+                            ],
+                            validation: []
+                        }
+                    ]
+                }
+            })
+        ]);
+        form.setData({
+            blocks: [
+                {
+                    _templateId: "hero",
+                    title: "T",
+                    subtitle: "S"
+                }
+            ]
+        });
+        const vm = form.field("blocks").vm;
+        expect(rowNames(vm.items[0].layout)).toEqual([
+            [
+                "title",
+                "subtitle"
+            ]
+        ]);
+    });
+});
+
+//# sourceMappingURL=CmsFormModelBuilder.test.js.map

package/features/formModel/CmsFormModelBuilder.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/CmsFormModelBuilder.test.js","sources":["../../../src/features/formModel/CmsFormModelBuilder.test.ts"],"sourcesContent":["import { describe, it, expect } from \"vitest\";\nimport { Container } from \"@webiny/di\";\nimport { FormModelFeature } from \"@webiny/app-admin/features/formModel/feature.js\";\nimport { IdentityContextFeature } from \"@webiny/app-admin/features/security/IdentityContext/feature.js\";\nimport { FormModelFactory } from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport { CmsFormModelBuilder } from \"~/features/formModel/abstractions.js\";\nimport { CmsFormModelFeature } from \"~/features/formModel/feature.js\";\nimport { DateTimeInputRenderer } from \"~/presentation/fieldTypes/renderers/dateTime/DateTimeInputRenderer.js\";\nimport { DateTimeInputsRenderer } from \"~/presentation/fieldTypes/renderers/dateTime/DateTimeInputsRenderer.js\";\nimport { TextInputRenderer } from \"~/presentation/fieldTypes/renderers/text/TextInputRenderer.js\";\nimport { TextInputsRenderer } from \"~/presentation/fieldTypes/renderers/text/TextInputsRenderer.js\";\n\nconst field = (fieldId: string, type: string, list: boolean, renderer: string, extra = {}) => ({\n    id: fieldId,\n    fieldId,\n    type,\n    label: fieldId,\n    tags: [],\n    list,\n    renderer: { name: renderer, settings: {} },\n    validation: [],\n    listValidation: [],\n    settings: {},\n    predefinedValues: { enabled: false, values: [] },\n    ...extra\n});\n\nfunction createCmsForm(fields: any[]) {\n    const container = new Container();\n    IdentityContextFeature.register(container);\n    FormModelFeature.register(container);\n    CmsFormModelFeature.register(container);\n    container.register(DateTimeInputRenderer);\n    container.register(DateTimeInputsRenderer);\n    container.register(TextInputRenderer);\n    container.register(TextInputsRenderer);\n\n    const model = {\n        modelId: \"test\",\n        fields,\n        layout: fields.map(f => [f.fieldId])\n    } as any;\n    const config = container.resolve(CmsFormModelBuilder).build(model);\n    return container.resolve(FormModelFactory).create(config);\n}\n\ndescribe(\"CmsFormModelBuilder renderer cardinality\", () => {\n    it(\"keeps renderers that match the field's cardinality\", () => {\n        const form = createCmsForm([\n            field(\"single\", \"datetime\", false, \"date-time-input\"),\n            field(\"many\", \"datetime\", true, \"date-time-inputs\")\n        ]);\n\n        expect(form.field(\"single\").vm.renderer).toBe(\"dateTimeInput\");\n        expect(form.field(\"many\").vm.renderer).toBe(\"dateTimeInputs\");\n    });\n\n    it(\"falls back to the single-value renderer when a list renderer is set on a non-list field\", () => {\n        const form = createCmsForm([\n            field(\"openTime\", \"datetime\", false, \"date-time-inputs\"),\n            field(\"name\", \"text\", false, \"text-inputs\")\n        ]);\n\n        expect(form.field(\"openTime\").vm.renderer).toBe(\"dateTimeInput\");\n        expect(form.field(\"name\").vm.renderer).toBe(\"textInput\");\n    });\n\n    it(\"keeps the list renderer for list datetime fields with a subtype\", () => {\n        const form = createCmsForm(\n            [\"date\", \"time\", \"dateTimeWithTimezone\", \"dateTimeWithoutTimezone\"].map(type =>\n                field(type, \"datetime\", true, \"date-time-inputs\", { settings: { type } })\n            )\n        );\n\n        expect(form.field(\"date\").vm.renderer).toBe(\"dateTimeInputs\");\n        expect(form.field(\"time\").vm.renderer).toBe(\"dateTimeInputs\");\n        expect(form.field(\"dateTimeWithTimezone\").vm.renderer).toBe(\"dateTimeInputs\");\n        expect(form.field(\"dateTimeWithoutTimezone\").vm.renderer).toBe(\"dateTimeInputs\");\n    });\n\n    it(\"applies the fallback to fields nested in object lists\", () => {\n        const form = createCmsForm([\n            field(\"holidayHours\", \"object\", true, \"objects-accordion\", {\n                settings: {\n                    fields: [field(\"openTime\", \"datetime\", false, \"date-time-inputs\")],\n                    layout: [[\"openTime\"]]\n                }\n            })\n        ]);\n\n        form.setData({ holidayHours: [{ openTime: \"2026-12-24T09:00:00.000Z\" }] });\n        const item = (form.field(\"holidayHours\") as any).items[0];\n\n        expect(item.children.get(\"openTime\").vm.renderer).toBe(\"dateTimeInput\");\n    });\n});\n\nconst rowNames = (layout: any[]) => layout.map(row => row.fields.map((f: any) => f.name));\n\ndescribe(\"CmsFormModelBuilder nested layouts\", () => {\n    it(\"lays out a single object with the layout stored on the field\", () => {\n        const form = createCmsForm([\n            field(\"address\", \"object\", false, \"object-accordion\", {\n                settings: {\n                    fields: [\n                        field(\"street\", \"text\", false, \"text-input\"),\n                        // Fields created in the model editor have an `id` that differs from `fieldId`.\n                        field(\"city\", \"text\", false, \"text-input\", { id: \"c1ty\" }),\n                        field(\"zipCode\", \"text\", false, \"text-input\")\n                    ],\n                    layout: [[\"street\"], [\"c1ty\", \"zipCode\"]]\n                }\n            })\n        ]);\n\n        expect(rowNames((form.field(\"address\").vm as any).layout)).toEqual([\n            [\"street\"],\n            [\"city\", \"zipCode\"]\n        ]);\n    });\n\n    it(\"lays out every item of an object list\", () => {\n        const form = createCmsForm([\n            field(\"facilityStats\", \"object\", true, \"objects-accordion\", {\n                settings: {\n                    fields: [\n                        field(\"statValue\", \"text\", false, \"text-input\"),\n                        field(\"statLabel\", \"text\", false, \"text-input\")\n                    ],\n                    layout: [[\"statValue\", \"statLabel\"]]\n                }\n            })\n        ]);\n\n        form.setData({ facilityStats: [{ statValue: \"1\", statLabel: \"a\" }] });\n        const vm = form.field(\"facilityStats\").vm as any;\n\n        expect(rowNames(vm.items[0].layout)).toEqual([[\"statValue\", \"statLabel\"]]);\n    });\n\n    it(\"gives children missing from the stored layout a row of their own\", () => {\n        const form = createCmsForm([\n            field(\"address\", \"object\", false, \"object-accordion\", {\n                settings: {\n                    fields: [\n                        field(\"street\", \"text\", false, \"text-input\"),\n                        field(\"city\", \"text\", false, \"text-input\"),\n                        field(\"state\", \"text\", false, \"text-input\")\n                    ],\n                    layout: [[\"street\", \"city\"]]\n                }\n            })\n        ]);\n\n        expect(rowNames((form.field(\"address\").vm as any).layout)).toEqual([\n            [\"street\", \"city\"],\n            [\"state\"]\n        ]);\n    });\n\n    it(\"lays out a dynamic zone template with the template's layout\", () => {\n        const form = createCmsForm([\n            field(\"blocks\", \"dynamicZone\", true, \"dynamicZone\", {\n                settings: {\n                    templates: [\n                        {\n                            id: \"hero\",\n                            name: \"Hero\",\n                            gqlTypeName: \"Hero\",\n                            description: \"\",\n                            icon: null,\n                            fields: [\n                                field(\"title\", \"text\", false, \"text-input\"),\n                                field(\"subtitle\", \"text\", false, \"text-input\")\n                            ],\n                            layout: [[\"title\", \"subtitle\"]],\n                            validation: []\n                        }\n                    ]\n                }\n            })\n        ]);\n\n        form.setData({ blocks: [{ _templateId: \"hero\", title: \"T\", subtitle: \"S\" }] });\n        const vm = form.field(\"blocks\").vm as any;\n\n        expect(rowNames(vm.items[0].layout)).toEqual([[\"title\", \"subtitle\"]]);\n    });\n});\n"],"names":["field","fieldId","type","list","renderer","extra","createCmsForm","fields","container","Container","IdentityContextFeature","FormModelFeature","CmsFormModelFeature","DateTimeInputRenderer","DateTimeInputsRenderer","TextInputRenderer","TextInputsRenderer","model","f","config","CmsFormModelBuilder","FormModelFactory","describe","it","form","expect","item","rowNames","layout","row","vm"],"mappings":"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"}

package/features/formModel/CmsLayoutMapper.d.ts

@@ -0,0 +1,10 @@
+import { type CmsEditorFieldsLayout, type CmsModelField } from "../../types.js";
+import type { ILayoutBuilder, ILayoutNodeBuilder } from "@webiny/app-admin/features/formModel/abstractions.js";
+export declare function mapCmsLayout(cmsLayout: CmsEditorFieldsLayout, layoutBuilder: ILayoutBuilder, idToFieldId: Map<string, string>): ILayoutNodeBuilder[];
+export declare function collectFieldIds(layout: CmsEditorFieldsLayout, idToFieldId: Map<string, string>): Set<string>;
+/**
+ * Maps the layout stored on an object field or a dynamic zone template. Returns `undefined`
+ * when there is no layout, so the form falls back to one row per child. Children missing
+ * from the layout get a row of their own at the end, so a stale layout can't hide them.
+ */
+export declare function mapCmsNestedLayout(cmsLayout: CmsEditorFieldsLayout | undefined, fields: CmsModelField[]): ((layoutBuilder: ILayoutBuilder) => ILayoutNodeBuilder[]) | undefined;

package/features/formModel/CmsLayoutMapper.js

@@ -0,0 +1,110 @@
+import { isLayoutField } from "../../types.js";
+function mapCmsLayout(cmsLayout, layoutBuilder, idToFieldId) {
+    const nodes = [];
+    for (const row of cmsLayout){
+        if (0 === row.length) continue;
+        const firstCell = row[0];
+        if (1 === row.length && isLayoutField(firstCell)) {
+            const layoutField = firstCell;
+            const node = mapLayoutField(layoutField, layoutBuilder, idToFieldId);
+            if (node) nodes.push(node);
+            continue;
+        }
+        const fieldIds = [];
+        for (const cell of row)if ("string" == typeof cell) {
+            const fieldId = idToFieldId.get(cell);
+            if (fieldId) fieldIds.push(fieldId);
+        }
+        if (fieldIds.length > 0) nodes.push(layoutBuilder.row(...fieldIds));
+    }
+    return nodes;
+}
+function collectFieldIds(layout, idToFieldId) {
+    const fieldIds = new Set();
+    for (const row of layout)for (const cell of row)if ("string" == typeof cell) {
+        const fieldId = idToFieldId.get(cell);
+        if (fieldId) fieldIds.add(fieldId);
+    } else if (isLayoutField(cell) && "tabs" === cell.type) {
+        const tabsField = cell;
+        for (const tab of tabsField.tabs)for (const id of collectFieldIds(tab.layout, idToFieldId))fieldIds.add(id);
+    }
+    return fieldIds;
+}
+function mapCmsNestedLayout(cmsLayout, fields) {
+    if (!cmsLayout || 0 === cmsLayout.length) return;
+    const idToFieldId = new Map();
+    for (const field of fields)idToFieldId.set(field.id, field.fieldId);
+    const fieldIdsInLayout = collectFieldIds(cmsLayout, idToFieldId);
+    return (layoutBuilder)=>{
+        const nodes = mapCmsLayout(cmsLayout, layoutBuilder, idToFieldId);
+        for (const field of fields)if (!fieldIdsInLayout.has(field.fieldId)) nodes.push(layoutBuilder.row(field.fieldId));
+        return nodes;
+    };
+}
+function mapLayoutField(field, layoutBuilder, idToFieldId) {
+    switch(field.type){
+        case "separator":
+            return mapSeparator(field, layoutBuilder);
+        case "tabs":
+            return mapTabs(field, layoutBuilder, idToFieldId);
+        case "alert":
+            return mapAlert(field, layoutBuilder);
+        default:
+            return null;
+    }
+}
+function mapSeparator(field, layoutBuilder) {
+    const builder = layoutBuilder.separator();
+    if (field.label) builder.title(field.label);
+    if (field.description) builder.description(field.description);
+    if (field.rules) builder.rules(field.rules.map((r)=>({
+            type: r.type,
+            target: r.target,
+            operator: r.operator,
+            value: r.value ?? null,
+            action: r.action
+        })));
+    return builder;
+}
+function mapTabs(field, layoutBuilder, idToFieldId) {
+    const tabsBuilder = layoutBuilder.tabs(field.id);
+    for (const tab of field.tabs)tabsBuilder.tab(tab.id, (t)=>{
+        t.label(tab.label);
+        if (tab.icon) t.icon({
+            type: "icon",
+            name: tab.icon
+        });
+        t.layout((l)=>mapCmsLayout(tab.layout, l, idToFieldId));
+        if (tab.rules) t.rules(tab.rules.map((r)=>({
+                type: r.type,
+                target: r.target,
+                operator: r.operator,
+                value: r.value ?? null,
+                action: r.action
+            })));
+    });
+    if (field.rules) tabsBuilder.rules(field.rules.map((r)=>({
+            type: r.type,
+            target: r.target,
+            operator: r.operator,
+            value: r.value ?? null,
+            action: r.action
+        })));
+    return tabsBuilder;
+}
+function mapAlert(field, layoutBuilder) {
+    const builder = layoutBuilder.alert();
+    if (field.label) builder.message(field.label);
+    if (field.alertType) builder.alertType(field.alertType);
+    if (field.rules) builder.rules(field.rules.map((r)=>({
+            type: r.type,
+            target: r.target,
+            operator: r.operator,
+            value: r.value ?? null,
+            action: r.action
+        })));
+    return builder;
+}
+export { collectFieldIds, mapCmsLayout, mapCmsNestedLayout };
+
+//# sourceMappingURL=CmsLayoutMapper.js.map

package/features/formModel/CmsLayoutMapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/CmsLayoutMapper.js","sources":["../../../src/features/formModel/CmsLayoutMapper.ts"],"sourcesContent":["import {\n    isLayoutField,\n    type CmsEditorFieldsLayout,\n    type CmsLayoutField,\n    type CmsModelField,\n    type CmsSeparatorLayoutField,\n    type CmsTabLayoutField,\n    type CmsAlertLayoutField\n} from \"~/types.js\";\nimport type {\n    ILayoutBuilder,\n    ILayoutNodeBuilder\n} from \"@webiny/app-admin/features/formModel/abstractions.js\";\n\nexport function mapCmsLayout(\n    cmsLayout: CmsEditorFieldsLayout,\n    layoutBuilder: ILayoutBuilder,\n    idToFieldId: Map<string, string>\n): ILayoutNodeBuilder[] {\n    const nodes: ILayoutNodeBuilder[] = [];\n\n    for (const row of cmsLayout) {\n        if (row.length === 0) {\n            continue;\n        }\n\n        const firstCell = row[0];\n\n        if (row.length === 1 && isLayoutField(firstCell)) {\n            const layoutField = firstCell as CmsLayoutField;\n            const node = mapLayoutField(layoutField, layoutBuilder, idToFieldId);\n            if (node) {\n                nodes.push(node);\n            }\n            continue;\n        }\n\n        const fieldIds: string[] = [];\n        for (const cell of row) {\n            if (typeof cell === \"string\") {\n                const fieldId = idToFieldId.get(cell);\n                if (fieldId) {\n                    fieldIds.push(fieldId);\n                }\n            }\n        }\n\n        if (fieldIds.length > 0) {\n            nodes.push(layoutBuilder.row(...fieldIds));\n        }\n    }\n\n    return nodes;\n}\n\nexport function collectFieldIds(\n    layout: CmsEditorFieldsLayout,\n    idToFieldId: Map<string, string>\n): Set<string> {\n    const fieldIds = new Set<string>();\n\n    for (const row of layout) {\n        for (const cell of row) {\n            if (typeof cell === \"string\") {\n                const fieldId = idToFieldId.get(cell);\n                if (fieldId) {\n                    fieldIds.add(fieldId);\n                }\n            } else if (isLayoutField(cell) && cell.type === \"tabs\") {\n                const tabsField = cell as { tabs: Array<{ layout: CmsEditorFieldsLayout }> };\n                for (const tab of tabsField.tabs) {\n                    for (const id of collectFieldIds(tab.layout, idToFieldId)) {\n                        fieldIds.add(id);\n                    }\n                }\n            }\n        }\n    }\n\n    return fieldIds;\n}\n\n/**\n * Maps the layout stored on an object field or a dynamic zone template. Returns `undefined`\n * when there is no layout, so the form falls back to one row per child. Children missing\n * from the layout get a row of their own at the end, so a stale layout can't hide them.\n */\nexport function mapCmsNestedLayout(\n    cmsLayout: CmsEditorFieldsLayout | undefined,\n    fields: CmsModelField[]\n): ((layoutBuilder: ILayoutBuilder) => ILayoutNodeBuilder[]) | undefined {\n    if (!cmsLayout || cmsLayout.length === 0) {\n        return undefined;\n    }\n\n    const idToFieldId = new Map<string, string>();\n    for (const field of fields) {\n        idToFieldId.set(field.id, field.fieldId);\n    }\n\n    const fieldIdsInLayout = collectFieldIds(cmsLayout, idToFieldId);\n\n    return layoutBuilder => {\n        const nodes = mapCmsLayout(cmsLayout, layoutBuilder, idToFieldId);\n        for (const field of fields) {\n            if (!fieldIdsInLayout.has(field.fieldId)) {\n                nodes.push(layoutBuilder.row(field.fieldId));\n            }\n        }\n        return nodes;\n    };\n}\n\nfunction mapLayoutField(\n    field: CmsLayoutField,\n    layoutBuilder: ILayoutBuilder,\n    idToFieldId: Map<string, string>\n): ILayoutNodeBuilder | null {\n    switch (field.type) {\n        case \"separator\":\n            return mapSeparator(field as CmsSeparatorLayoutField, layoutBuilder);\n\n        case \"tabs\":\n            return mapTabs(field as CmsTabLayoutField, layoutBuilder, idToFieldId);\n\n        case \"alert\":\n            return mapAlert(field as CmsAlertLayoutField, layoutBuilder);\n\n        default:\n            return null;\n    }\n}\n\nfunction mapSeparator(\n    field: CmsSeparatorLayoutField,\n    layoutBuilder: ILayoutBuilder\n): ILayoutNodeBuilder {\n    const builder = layoutBuilder.separator();\n    if (field.label) {\n        builder.title(field.label);\n    }\n    if (field.description) {\n        builder.description(field.description);\n    }\n    if (field.rules) {\n        builder.rules(\n            field.rules.map(r => ({\n                type: r.type,\n                target: r.target,\n                operator: r.operator,\n                value: r.value ?? null,\n                action: r.action as \"hide\" | \"disable\"\n            }))\n        );\n    }\n    return builder;\n}\n\nfunction mapTabs(\n    field: CmsTabLayoutField,\n    layoutBuilder: ILayoutBuilder,\n    idToFieldId: Map<string, string>\n): ILayoutNodeBuilder {\n    const tabsBuilder = layoutBuilder.tabs(field.id);\n\n    for (const tab of field.tabs) {\n        tabsBuilder.tab(tab.id, t => {\n            t.label(tab.label);\n            if (tab.icon) {\n                t.icon({ type: \"icon\", name: tab.icon });\n            }\n            t.layout(l => mapCmsLayout(tab.layout, l, idToFieldId));\n            if (tab.rules) {\n                t.rules(\n                    tab.rules.map(r => ({\n                        type: r.type,\n                        target: r.target,\n                        operator: r.operator,\n                        value: r.value ?? null,\n                        action: r.action as \"hide\" | \"disable\"\n                    }))\n                );\n            }\n        });\n    }\n\n    if (field.rules) {\n        tabsBuilder.rules(\n            field.rules.map(r => ({\n                type: r.type,\n                target: r.target,\n                operator: r.operator,\n                value: r.value ?? null,\n                action: r.action as \"hide\" | \"disable\"\n            }))\n        );\n    }\n\n    return tabsBuilder;\n}\n\nfunction mapAlert(field: CmsAlertLayoutField, layoutBuilder: ILayoutBuilder): ILayoutNodeBuilder {\n    const builder = layoutBuilder.alert();\n    if (field.label) {\n        builder.message(field.label);\n    }\n    if (field.alertType) {\n        builder.alertType(field.alertType);\n    }\n    if (field.rules) {\n        builder.rules(\n            field.rules.map(r => ({\n                type: r.type,\n                target: r.target,\n                operator: r.operator,\n                value: r.value ?? null,\n                action: r.action as \"hide\" | \"disable\"\n            }))\n        );\n    }\n    return builder;\n}\n"],"names":["mapCmsLayout","cmsLayout","layoutBuilder","idToFieldId","nodes","row","firstCell","isLayoutField","layoutField","node","mapLayoutField","fieldIds","cell","fieldId","collectFieldIds","layout","Set","tabsField","tab","id","mapCmsNestedLayout","fields","Map","field","fieldIdsInLayout","mapSeparator","mapTabs","mapAlert","builder","r","tabsBuilder","t","l"],"mappings":"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"}

package/features/formModel/CmsRefFieldType.d.ts

@@ -0,0 +1,18 @@
+import { type IFieldTypeFactory } from "@webiny/app-admin/features/formModel/abstractions.js";
+import { FieldBuilder } from "@webiny/app-admin/features/formModel/FieldBuilder.js";
+declare class RefFieldBuilder extends FieldBuilder<"ref"> {
+    constructor();
+}
+declare class RefFieldTypeFactory implements IFieldTypeFactory {
+    readonly type = "ref";
+    create(): RefFieldBuilder;
+}
+export declare const CmsRefFieldType: typeof RefFieldTypeFactory & {
+    __abstraction: import("@webiny/di").Abstraction<IFieldTypeFactory>;
+};
+declare module "@webiny/app-admin/features/formModel/abstractions.js" {
+    interface IFieldBuilderRegistry {
+        ref(): IFieldBuilder<"ref", false, Record<string, unknown> | null>;
+    }
+}
+export {};

package/features/formModel/CmsRefFieldType.js

@@ -0,0 +1,23 @@
+import { FieldType } from "@webiny/app-admin/features/formModel/abstractions.js";
+import { FieldBuilder } from "@webiny/app-admin/features/formModel/FieldBuilder.js";
+class RefFieldBuilder extends FieldBuilder {
+    constructor(){
+        super("ref");
+        this._config.renderer = "refInput";
+    }
+}
+class RefFieldTypeFactory {
+    create() {
+        return new RefFieldBuilder();
+    }
+    constructor(){
+        this.type = "ref";
+    }
+}
+const CmsRefFieldType = FieldType.createImplementation({
+    implementation: RefFieldTypeFactory,
+    dependencies: []
+});
+export { CmsRefFieldType };
+
+//# sourceMappingURL=CmsRefFieldType.js.map

package/features/formModel/CmsRefFieldType.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/CmsRefFieldType.js","sources":["../../../src/features/formModel/CmsRefFieldType.ts"],"sourcesContent":["import {\n    FieldType,\n    type IFieldTypeFactory\n} from \"@webiny/app-admin/features/formModel/abstractions.js\";\nimport { FieldBuilder } from \"@webiny/app-admin/features/formModel/FieldBuilder.js\";\n\nclass RefFieldBuilder extends FieldBuilder<\"ref\"> {\n    constructor() {\n        super(\"ref\");\n        this._config.renderer = \"refInput\";\n    }\n}\n\nclass RefFieldTypeFactory implements IFieldTypeFactory {\n    readonly type = \"ref\";\n    create() {\n        return new RefFieldBuilder();\n    }\n}\n\nexport const CmsRefFieldType = FieldType.createImplementation({\n    implementation: RefFieldTypeFactory,\n    dependencies: []\n});\n\ndeclare module \"@webiny/app-admin/features/formModel/abstractions.js\" {\n    interface IFieldBuilderRegistry {\n        ref(): IFieldBuilder<\"ref\", false, Record<string, unknown> | null>;\n    }\n}\n"],"names":["RefFieldBuilder","FieldBuilder","RefFieldTypeFactory","CmsRefFieldType","FieldType"],"mappings":";;AAMA,MAAMA,wBAAwBC;IAC1B,aAAc;QACV,KAAK,CAAC;QACN,IAAI,CAAC,OAAO,CAAC,QAAQ,GAAG;IAC5B;AACJ;AAEA,MAAMC;IAEF,SAAS;QACL,OAAO,IAAIF;IACf;;aAHS,IAAI,GAAG;;AAIpB;AAEO,MAAMG,kBAAkBC,UAAU,oBAAoB,CAAC;IAC1D,gBAAgBF;IAChB,cAAc,EAAE;AACpB"}