@webiny/app-admin 0.0.0-unstable.496cf268ac → 0.0.0-unstable.5387e5f7c8

package/features/formModel/demo/FormModelPhase11Presenter.js

@@ -0,0 +1,107 @@
+import { makeAutoObservable, toJS } from "mobx";
+import { z } from "zod";
+class FormModelPhase11Presenter {
+    constructor(formFactory){
+        this.lastSubmitted = null;
+        this.isSubmitting = false;
+        this.form = formFactory.create({
+            fields: (fields)=>({
+                    first: fields.text().label("First name").defaultValue("Ada"),
+                    last: fields.text().label("Last name").defaultValue("Lovelace"),
+                    fullName: fields.text().label("Full name (computed)").computed(({ form })=>`${form.field("first").getValue()} ${form.field("last").getValue()}`),
+                    slug: fields.text().label("Slug (computed until you edit it)").computedUntilDirty(({ form })=>{
+                        const full = `${form.field("first").getValue()} ${form.field("last").getValue()}`;
+                        return full.trim().toLowerCase().replace(/\s+/g, "-");
+                    }),
+                    plan: fields.text().label("Plan").defaultValue("free").options([
+                        {
+                            label: "Free",
+                            value: "free"
+                        },
+                        {
+                            label: "Pro",
+                            value: "pro"
+                        },
+                        {
+                            label: "Enterprise",
+                            value: "enterprise"
+                        }
+                    ]),
+                    seats: fields.text().label("Number of seats").help("Required when plan is pro or enterprise").requiredWhen(({ form })=>"pro" === form.field("plan").getValue(), "Pro plan needs a seat count"),
+                    profile: fields.object().label("Profile").fields((f)=>({
+                            title: f.text().label("Title")
+                        })),
+                    password: fields.text().label("Password"),
+                    confirm: fields.text().label("Confirm password")
+                })
+        });
+        this.form.field("profile").as("object").fields((f)=>({
+                company: f.text().label("Company"),
+                bio: f.text().label("Short bio")
+            }));
+        this.form.field("seats").addRequiredWhen(({ form })=>"enterprise" === form.field("plan").getValue(), "Enterprise plan needs a seat count too");
+        this.form.addRule(z.object({
+            password: z.string().nullable(),
+            confirm: z.string().nullable()
+        }).refine((d)=>d.password === d.confirm || !d.password && !d.confirm, {
+            message: "Passwords must match",
+            path: [
+                "confirm"
+            ]
+        }));
+        this.form.addRule((f)=>{
+            const slug = String(f.field("slug").getValue() ?? "");
+            if (slug.length > 0 && slug.length < 3) return [
+                {
+                    path: "slug",
+                    message: "Slug must be at least 3 characters"
+                }
+            ];
+            return [];
+        });
+        this.form.setLayout((layout)=>[
+                layout.row("first", "last"),
+                layout.row("fullName"),
+                layout.row("slug"),
+                layout.separator(),
+                layout.row("plan", "seats"),
+                layout.separator(),
+                layout.object("profile", (l)=>[
+                        l.row("title"),
+                        l.row("company"),
+                        l.row("bio")
+                    ]),
+                layout.separator(),
+                layout.row("password", "confirm")
+            ]);
+        makeAutoObservable(this);
+    }
+    get vm() {
+        return {
+            form: this.form.vm,
+            data: toJS(this.form.getData()),
+            lastSubmitted: this.lastSubmitted,
+            isSubmitting: this.isSubmitting,
+            formErrors: this.form.errors.map((e)=>({
+                    path: e.path,
+                    message: e.message
+                }))
+        };
+    }
+    async submit() {
+        this.isSubmitting = true;
+        try {
+            const result = await this.form.submit();
+            if (false !== result) this.lastSubmitted = toJS(result);
+        } finally{
+            this.isSubmitting = false;
+        }
+    }
+    reset() {
+        this.form.reset();
+        this.lastSubmitted = null;
+    }
+}
+export { FormModelPhase11Presenter };
+
+//# sourceMappingURL=FormModelPhase11Presenter.js.map

package/features/formModel/demo/FormModelPhase11Presenter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/demo/FormModelPhase11Presenter.js","sources":["../../../../src/features/formModel/demo/FormModelPhase11Presenter.ts"],"sourcesContent":["import { makeAutoObservable, toJS } from \"mobx\";\nimport { z } from \"zod\";\nimport type { IFormModel, IFormModelFactory, IFormVM } from \"../abstractions.js\";\n\nexport interface FormModelPhase11VM {\n    form: IFormVM;\n    data: Record<string, unknown>;\n    lastSubmitted: Record<string, unknown> | null;\n    isSubmitting: boolean;\n    formErrors: { path: string; message: string }[];\n}\n\n/**\n * Demo presenter exercising Phase 11 features: requiredWhen (builder + modifier\n * chaining), computed/computedUntilDirty, .extend() on object fields, form-level\n * addRule (Zod + imperative), and setLayout.\n */\nexport class FormModelPhase11Presenter {\n    private form: IFormModel;\n    private lastSubmitted: Record<string, unknown> | null = null;\n    private isSubmitting = false;\n\n    constructor(formFactory: IFormModelFactory) {\n        this.form = formFactory.create({\n            fields: fields => ({\n                first: fields.text().label(\"First name\").defaultValue(\"Ada\"),\n                last: fields.text().label(\"Last name\").defaultValue(\"Lovelace\"),\n                fullName: fields\n                    .text()\n                    .label(\"Full name (computed)\")\n                    .computed(\n                        ({ form }) =>\n                            `${form.field(\"first\").getValue()} ${form.field(\"last\").getValue()}`\n                    ),\n                slug: fields\n                    .text()\n                    .label(\"Slug (computed until you edit it)\")\n                    .computedUntilDirty(({ form }) => {\n                        const full = `${form.field(\"first\").getValue()} ${form.field(\"last\").getValue()}`;\n                        return full.trim().toLowerCase().replace(/\\s+/g, \"-\");\n                    }),\n                plan: fields\n                    .text()\n                    .label(\"Plan\")\n                    .defaultValue(\"free\")\n                    .options([\n                        { label: \"Free\", value: \"free\" },\n                        { label: \"Pro\", value: \"pro\" },\n                        { label: \"Enterprise\", value: \"enterprise\" }\n                    ]),\n                seats: fields\n                    .text()\n                    .label(\"Number of seats\")\n                    .help(\"Required when plan is pro or enterprise\")\n                    .requiredWhen(\n                        ({ form }) => form.field(\"plan\").getValue() === \"pro\",\n                        \"Pro plan needs a seat count\"\n                    ),\n                profile: fields\n                    .object()\n                    .label(\"Profile\")\n                    .fields(f => ({\n                        title: f.text().label(\"Title\")\n                    })),\n                password: fields.text().label(\"Password\"),\n                confirm: fields.text().label(\"Confirm password\")\n            })\n        });\n\n        // Modifier-style: add children to the existing \"profile\" object field.\n        this.form\n            .field(\"profile\")\n            .as(\"object\")\n            .fields(f => ({\n                company: f.text().label(\"Company\"),\n                bio: f.text().label(\"Short bio\")\n            }));\n\n        // Modifier-style requiredWhen: chains with the builder-defined one above.\n        // First truthy callback wins.\n        this.form\n            .field(\"seats\")\n            .addRequiredWhen(\n                ({ form }) => form.field(\"plan\").getValue() === \"enterprise\",\n                \"Enterprise plan needs a seat count too\"\n            );\n\n        // Form-level Zod rule: confirm must match password.\n        this.form.addRule(\n            z\n                .object({\n                    password: z.string().nullable(),\n                    confirm: z.string().nullable()\n                })\n                .refine(d => d.password === d.confirm || (!d.password && !d.confirm), {\n                    message: \"Passwords must match\",\n                    path: [\"confirm\"]\n                })\n        );\n\n        // Imperative form-level rule.\n        this.form.addRule(f => {\n            const slug = String(f.field(\"slug\").getValue() ?? \"\");\n            if (slug.length > 0 && slug.length < 3) {\n                return [{ path: \"slug\", message: \"Slug must be at least 3 characters\" }];\n            }\n            return [];\n        });\n\n        // setLayout — full replacement.\n        this.form.setLayout(layout => [\n            layout.row(\"first\", \"last\"),\n            layout.row(\"fullName\"),\n            layout.row(\"slug\"),\n            layout.separator(),\n            layout.row(\"plan\", \"seats\"),\n            layout.separator(),\n            layout.object(\"profile\", l => [l.row(\"title\"), l.row(\"company\"), l.row(\"bio\")]),\n            layout.separator(),\n            layout.row(\"password\", \"confirm\")\n        ]);\n\n        makeAutoObservable(this);\n    }\n\n    get vm(): FormModelPhase11VM {\n        return {\n            form: this.form.vm,\n            data: toJS(this.form.getData()),\n            lastSubmitted: this.lastSubmitted,\n            isSubmitting: this.isSubmitting,\n            formErrors: this.form.errors.map(e => ({\n                path: e.path,\n                message: e.message\n            }))\n        };\n    }\n\n    async submit(): Promise<void> {\n        this.isSubmitting = true;\n        try {\n            const result = await this.form.submit<Record<string, unknown>>();\n            if (result !== false) {\n                this.lastSubmitted = toJS(result);\n            }\n        } finally {\n            this.isSubmitting = false;\n        }\n    }\n\n    reset(): void {\n        this.form.reset();\n        this.lastSubmitted = null;\n    }\n}\n"],"names":["FormModelPhase11Presenter","formFactory","fields","form","full","f","z","d","slug","String","layout","l","makeAutoObservable","toJS","e","result"],"mappings":"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"}

package/features/formModel/demo/FormModelPhase8c1Presenter.d.ts

@@ -0,0 +1,23 @@
+import type { IFormModelFactory, IFormVM } from "../abstractions.js";
+export interface FormModelPhase8c1VM {
+    form: IFormVM;
+    data: Record<string, unknown>;
+    lastSubmitted: Record<string, unknown> | null;
+    isSubmitting: boolean;
+}
+/**
+ * Demo presenter exercising Phase 8c.1: nested object layouts. The form has a
+ * top-level `page` object whose inner layout contains tabs, and one of those
+ * tabs contains a nested `seo` object with its own row layout. The Phase 8c.1
+ * registrar walks the inner layout (including tabs) and forwards the nested
+ * `layout.object("seo", ...)` to the seo field at build time.
+ */
+export declare class FormModelPhase8c1Presenter {
+    private form;
+    private lastSubmitted;
+    private isSubmitting;
+    constructor(formFactory: IFormModelFactory);
+    get vm(): FormModelPhase8c1VM;
+    submit(): Promise<void>;
+    reset(): void;
+}

package/features/formModel/demo/FormModelPhase8c1Presenter.js

@@ -0,0 +1,69 @@
+import { makeAutoObservable, toJS } from "mobx";
+class FormModelPhase8c1Presenter {
+    constructor(formFactory){
+        this.lastSubmitted = null;
+        this.isSubmitting = false;
+        this.form = formFactory.create({
+            fields: (fields)=>({
+                    page: fields.object().label("Page").fields((f)=>({
+                            title: f.text().label("Title").defaultValue("Welcome"),
+                            slug: f.text().label("Slug").defaultValue("welcome"),
+                            seo: f.object().label("SEO").fields((g)=>({
+                                    metaTitle: g.text().label("Meta title"),
+                                    metaDescription: g.text().label("Meta description"),
+                                    og: g.object().label("Open Graph").fields((h)=>({
+                                            ogTitle: h.text().label("OG title"),
+                                            ogImage: h.text().label("OG image URL")
+                                        }))
+                                })),
+                            body: f.text().label("Body content")
+                        }))
+                }),
+            layout: (layout)=>[
+                    layout.object("page", (l)=>[
+                            l.tabs("pageTabs").tab("general", (tab)=>{
+                                tab.label("General").layout((l)=>[
+                                        l.row("title", "slug"),
+                                        l.row("body")
+                                    ]);
+                            }).tab("seo", (tab)=>{
+                                tab.label("SEO").layout((l)=>[
+                                        l.object("seo", (inner)=>[
+                                                inner.row("metaTitle"),
+                                                inner.row("metaDescription"),
+                                                inner.object("og", (og)=>[
+                                                        og.row("ogTitle", "ogImage")
+                                                    ])
+                                            ])
+                                    ]);
+                            })
+                        ])
+                ]
+        });
+        makeAutoObservable(this);
+    }
+    get vm() {
+        return {
+            form: this.form.vm,
+            data: toJS(this.form.getData()),
+            lastSubmitted: this.lastSubmitted,
+            isSubmitting: this.isSubmitting
+        };
+    }
+    async submit() {
+        this.isSubmitting = true;
+        try {
+            const result = await this.form.submit();
+            if (false !== result) this.lastSubmitted = toJS(result);
+        } finally{
+            this.isSubmitting = false;
+        }
+    }
+    reset() {
+        this.form.reset();
+        this.lastSubmitted = null;
+    }
+}
+export { FormModelPhase8c1Presenter };
+
+//# sourceMappingURL=FormModelPhase8c1Presenter.js.map

package/features/formModel/demo/FormModelPhase8c1Presenter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/demo/FormModelPhase8c1Presenter.js","sources":["../../../../src/features/formModel/demo/FormModelPhase8c1Presenter.ts"],"sourcesContent":["import { makeAutoObservable, toJS } from \"mobx\";\nimport type { IFormModel, IFormModelFactory, IFormVM } from \"../abstractions.js\";\n\nexport interface FormModelPhase8c1VM {\n    form: IFormVM;\n    data: Record<string, unknown>;\n    lastSubmitted: Record<string, unknown> | null;\n    isSubmitting: boolean;\n}\n\n/**\n * Demo presenter exercising Phase 8c.1: nested object layouts. The form has a\n * top-level `page` object whose inner layout contains tabs, and one of those\n * tabs contains a nested `seo` object with its own row layout. The Phase 8c.1\n * registrar walks the inner layout (including tabs) and forwards the nested\n * `layout.object(\"seo\", ...)` to the seo field at build time.\n */\nexport class FormModelPhase8c1Presenter {\n    private form: IFormModel;\n    private lastSubmitted: Record<string, unknown> | null = null;\n    private isSubmitting = false;\n\n    constructor(formFactory: IFormModelFactory) {\n        this.form = formFactory.create({\n            fields: fields => ({\n                page: fields\n                    .object()\n                    .label(\"Page\")\n                    .fields(f => ({\n                        title: f.text().label(\"Title\").defaultValue(\"Welcome\"),\n                        slug: f.text().label(\"Slug\").defaultValue(\"welcome\"),\n                        seo: f\n                            .object()\n                            .label(\"SEO\")\n                            .fields(g => ({\n                                metaTitle: g.text().label(\"Meta title\"),\n                                metaDescription: g.text().label(\"Meta description\"),\n                                og: g\n                                    .object()\n                                    .label(\"Open Graph\")\n                                    .fields(h => ({\n                                        ogTitle: h.text().label(\"OG title\"),\n                                        ogImage: h.text().label(\"OG image URL\")\n                                    }))\n                            })),\n                        body: f.text().label(\"Body content\")\n                    }))\n            }),\n            layout: layout => [\n                layout.object(\"page\", l => [\n                    l\n                        .tabs(\"pageTabs\")\n                        .tab(\"general\", tab => {\n                            tab.label(\"General\").layout(l => [\n                                l.row(\"title\", \"slug\"),\n                                l.row(\"body\")\n                            ]);\n                        })\n                        .tab(\"seo\", tab => {\n                            tab.label(\"SEO\").layout(l => [\n                                l.object(\"seo\", inner => [\n                                    inner.row(\"metaTitle\"),\n                                    inner.row(\"metaDescription\"),\n                                    inner.object(\"og\", og => [og.row(\"ogTitle\", \"ogImage\")])\n                                ])\n                            ]);\n                        })\n                ])\n            ]\n        });\n\n        makeAutoObservable(this);\n    }\n\n    get vm(): FormModelPhase8c1VM {\n        return {\n            form: this.form.vm,\n            data: toJS(this.form.getData()),\n            lastSubmitted: this.lastSubmitted,\n            isSubmitting: this.isSubmitting\n        };\n    }\n\n    async submit(): Promise<void> {\n        this.isSubmitting = true;\n        try {\n            const result = await this.form.submit<Record<string, unknown>>();\n            if (result !== false) {\n                this.lastSubmitted = toJS(result);\n            }\n        } finally {\n            this.isSubmitting = false;\n        }\n    }\n\n    reset(): void {\n        this.form.reset();\n        this.lastSubmitted = null;\n    }\n}\n"],"names":["FormModelPhase8c1Presenter","formFactory","fields","f","g","h","layout","l","tab","inner","og","makeAutoObservable","toJS","result"],"mappings":";AAiBO,MAAMA;IAKT,YAAYC,WAA8B,CAAE;aAHpC,aAAa,GAAmC;aAChD,YAAY,GAAG;QAGnB,IAAI,CAAC,IAAI,GAAGA,YAAY,MAAM,CAAC;YAC3B,QAAQC,CAAAA,SAAW;oBACf,MAAMA,OACD,MAAM,GACN,KAAK,CAAC,QACN,MAAM,CAACC,CAAAA,IAAM;4BACV,OAAOA,EAAE,IAAI,GAAG,KAAK,CAAC,SAAS,YAAY,CAAC;4BAC5C,MAAMA,EAAE,IAAI,GAAG,KAAK,CAAC,QAAQ,YAAY,CAAC;4BAC1C,KAAKA,EACA,MAAM,GACN,KAAK,CAAC,OACN,MAAM,CAACC,CAAAA,IAAM;oCACV,WAAWA,EAAE,IAAI,GAAG,KAAK,CAAC;oCAC1B,iBAAiBA,EAAE,IAAI,GAAG,KAAK,CAAC;oCAChC,IAAIA,EACC,MAAM,GACN,KAAK,CAAC,cACN,MAAM,CAACC,CAAAA,IAAM;4CACV,SAASA,EAAE,IAAI,GAAG,KAAK,CAAC;4CACxB,SAASA,EAAE,IAAI,GAAG,KAAK,CAAC;wCAC5B;gCACR;4BACJ,MAAMF,EAAE,IAAI,GAAG,KAAK,CAAC;wBACzB;gBACR;YACA,QAAQG,CAAAA,SAAU;oBACdA,OAAO,MAAM,CAAC,QAAQC,CAAAA,IAAK;4BACvBA,EACK,IAAI,CAAC,YACL,GAAG,CAAC,WAAWC,CAAAA;gCACZA,IAAI,KAAK,CAAC,WAAW,MAAM,CAACD,CAAAA,IAAK;wCAC7BA,EAAE,GAAG,CAAC,SAAS;wCACfA,EAAE,GAAG,CAAC;qCACT;4BACL,GACC,GAAG,CAAC,OAAOC,CAAAA;gCACRA,IAAI,KAAK,CAAC,OAAO,MAAM,CAACD,CAAAA,IAAK;wCACzBA,EAAE,MAAM,CAAC,OAAOE,CAAAA,QAAS;gDACrBA,MAAM,GAAG,CAAC;gDACVA,MAAM,GAAG,CAAC;gDACVA,MAAM,MAAM,CAAC,MAAMC,CAAAA,KAAM;wDAACA,GAAG,GAAG,CAAC,WAAW;qDAAW;6CAC1D;qCACJ;4BACL;yBACP;iBACJ;QACL;QAEAC,mBAAmB,IAAI;IAC3B;IAEA,IAAI,KAA0B;QAC1B,OAAO;YACH,MAAM,IAAI,CAAC,IAAI,CAAC,EAAE;YAClB,MAAMC,KAAK,IAAI,CAAC,IAAI,CAAC,OAAO;YAC5B,eAAe,IAAI,CAAC,aAAa;YACjC,cAAc,IAAI,CAAC,YAAY;QACnC;IACJ;IAEA,MAAM,SAAwB;QAC1B,IAAI,CAAC,YAAY,GAAG;QACpB,IAAI;YACA,MAAMC,SAAS,MAAM,IAAI,CAAC,IAAI,CAAC,MAAM;YACrC,IAAIA,AAAW,UAAXA,QACA,IAAI,CAAC,aAAa,GAAGD,KAAKC;QAElC,SAAU;YACN,IAAI,CAAC,YAAY,GAAG;QACxB;IACJ;IAEA,QAAc;QACV,IAAI,CAAC,IAAI,CAAC,KAAK;QACf,IAAI,CAAC,aAAa,GAAG;IACzB;AACJ"}

package/features/formModel/feature.d.ts

@@ -0,0 +1,3 @@
+export declare const FormModelFeature: import("@webiny/feature/admin").FeatureDefinition<{
+    formModelFactory: import("./abstractions.js").IFormModelFactory;
+}, []>;

package/features/formModel/feature.js

@@ -0,0 +1,35 @@
+import { createFeature } from "@webiny/feature/admin";
+import { FormModelFactory } from "./abstractions.js";
+import { FormModelFactory as external_FormModelFactory_js_FormModelFactory } from "./FormModelFactory.js";
+import { ConditionRuleEvaluator } from "./ConditionRuleEvaluator.js";
+import { AccessControlRuleEvaluator } from "./AccessControlRuleEvaluator.js";
+import { FieldBuilderRegistry } from "./FieldBuilderRegistry.js";
+import { BooleanFieldType, DateTimeFieldType, FileFieldType, FileUrlFieldType, LexicalFieldType, NumberFieldType, ObjectFieldType, PasswordFieldType, PermissionsFieldType, RolesMultiSelectFieldType, TextFieldType } from "./fieldTypes/index.js";
+const FormModelFeature = createFeature({
+    name: "FormModel",
+    register (container) {
+        container.register(TextFieldType);
+        container.register(NumberFieldType);
+        container.register(BooleanFieldType);
+        container.register(DateTimeFieldType);
+        container.register(FileFieldType);
+        container.register(FileUrlFieldType);
+        container.register(ObjectFieldType);
+        container.register(LexicalFieldType);
+        container.register(PasswordFieldType);
+        container.register(PermissionsFieldType);
+        container.register(RolesMultiSelectFieldType);
+        container.register(FieldBuilderRegistry).inSingletonScope();
+        container.register(ConditionRuleEvaluator).inSingletonScope();
+        container.register(AccessControlRuleEvaluator).inSingletonScope();
+        container.register(external_FormModelFactory_js_FormModelFactory).inSingletonScope();
+    },
+    resolve (container) {
+        return {
+            formModelFactory: container.resolve(FormModelFactory)
+        };
+    }
+});
+export { FormModelFeature };
+
+//# sourceMappingURL=feature.js.map

package/features/formModel/feature.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/feature.js","sources":["../../../src/features/formModel/feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { FormModelFactory as Abstraction } from \"./abstractions.js\";\nimport { FormModelFactory } from \"./FormModelFactory.js\";\nimport { ConditionRuleEvaluator } from \"./ConditionRuleEvaluator.js\";\nimport { AccessControlRuleEvaluator } from \"./AccessControlRuleEvaluator.js\";\nimport { FieldBuilderRegistry } from \"./FieldBuilderRegistry.js\";\nimport {\n    TextFieldType,\n    NumberFieldType,\n    BooleanFieldType,\n    DateTimeFieldType,\n    FileFieldType,\n    FileUrlFieldType,\n    ObjectFieldType,\n    LexicalFieldType,\n    PasswordFieldType,\n    PermissionsFieldType,\n    RolesMultiSelectFieldType\n} from \"./fieldTypes/index.js\";\n\nexport const FormModelFeature = createFeature({\n    name: \"FormModel\",\n    register(container) {\n        container.register(TextFieldType);\n        container.register(NumberFieldType);\n        container.register(BooleanFieldType);\n        container.register(DateTimeFieldType);\n        container.register(FileFieldType);\n        container.register(FileUrlFieldType);\n        container.register(ObjectFieldType);\n        container.register(LexicalFieldType);\n        container.register(PasswordFieldType);\n        container.register(PermissionsFieldType);\n        container.register(RolesMultiSelectFieldType);\n\n        container.register(FieldBuilderRegistry).inSingletonScope();\n        container.register(ConditionRuleEvaluator).inSingletonScope();\n        container.register(AccessControlRuleEvaluator).inSingletonScope();\n        container.register(FormModelFactory).inSingletonScope();\n    },\n    resolve(container) {\n        return {\n            formModelFactory: container.resolve(Abstraction)\n        };\n    }\n});\n"],"names":["FormModelFeature","createFeature","container","TextFieldType","NumberFieldType","BooleanFieldType","DateTimeFieldType","FileFieldType","FileUrlFieldType","ObjectFieldType","LexicalFieldType","PasswordFieldType","PermissionsFieldType","RolesMultiSelectFieldType","FieldBuilderRegistry","ConditionRuleEvaluator","AccessControlRuleEvaluator","FormModelFactory","Abstraction"],"mappings":";;;;;;;AAoBO,MAAMA,mBAAmBC,cAAc;IAC1C,MAAM;IACN,UAASC,SAAS;QACdA,UAAU,QAAQ,CAACC;QACnBD,UAAU,QAAQ,CAACE;QACnBF,UAAU,QAAQ,CAACG;QACnBH,UAAU,QAAQ,CAACI;QACnBJ,UAAU,QAAQ,CAACK;QACnBL,UAAU,QAAQ,CAACM;QACnBN,UAAU,QAAQ,CAACO;QACnBP,UAAU,QAAQ,CAACQ;QACnBR,UAAU,QAAQ,CAACS;QACnBT,UAAU,QAAQ,CAACU;QACnBV,UAAU,QAAQ,CAACW;QAEnBX,UAAU,QAAQ,CAACY,sBAAsB,gBAAgB;QACzDZ,UAAU,QAAQ,CAACa,wBAAwB,gBAAgB;QAC3Db,UAAU,QAAQ,CAACc,4BAA4B,gBAAgB;QAC/Dd,UAAU,QAAQ,CAACe,+CAAkB,gBAAgB;IACzD;IACA,SAAQf,SAAS;QACb,OAAO;YACH,kBAAkBA,UAAU,OAAO,CAACgB;QACxC;IACJ;AACJ"}

package/features/formModel/fieldTypes/BooleanFieldType.d.ts

@@ -0,0 +1,19 @@
+import { type IFieldTypeFactory } from "../abstractions.js";
+import { FieldBuilder } from "../FieldBuilder.js";
+export declare class BooleanFieldBuilder extends FieldBuilder<"boolean"> {
+    constructor();
+    normalizeValue(value: unknown): unknown;
+}
+declare class BooleanFieldTypeFactory implements IFieldTypeFactory {
+    readonly type = "boolean";
+    create(): BooleanFieldBuilder;
+}
+export declare const BooleanFieldType: typeof BooleanFieldTypeFactory & {
+    __abstraction: import("@webiny/di").Abstraction<IFieldTypeFactory>;
+};
+declare module "../abstractions.js" {
+    interface IFieldBuilderRegistry {
+        boolean(): IFieldBuilder<"boolean", false, boolean | null>;
+    }
+}
+export {};

package/features/formModel/fieldTypes/BooleanFieldType.js

@@ -0,0 +1,26 @@
+import { FieldType } from "../abstractions.js";
+import { FieldBuilder } from "../FieldBuilder.js";
+class BooleanFieldBuilder extends FieldBuilder {
+    constructor(){
+        super("boolean");
+        this._config.renderer = "switch";
+    }
+    normalizeValue(value) {
+        return Boolean(value);
+    }
+}
+class BooleanFieldTypeFactory {
+    create() {
+        return new BooleanFieldBuilder();
+    }
+    constructor(){
+        this.type = "boolean";
+    }
+}
+const BooleanFieldType = FieldType.createImplementation({
+    implementation: BooleanFieldTypeFactory,
+    dependencies: []
+});
+export { BooleanFieldBuilder, BooleanFieldType };
+
+//# sourceMappingURL=BooleanFieldType.js.map

package/features/formModel/fieldTypes/BooleanFieldType.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"features/formModel/fieldTypes/BooleanFieldType.js","sources":["../../../../src/features/formModel/fieldTypes/BooleanFieldType.ts"],"sourcesContent":["import { FieldType, type IFieldTypeFactory } from \"../abstractions.js\";\nimport { FieldBuilder } from \"../FieldBuilder.js\";\n\nexport class BooleanFieldBuilder extends FieldBuilder<\"boolean\"> {\n    constructor() {\n        super(\"boolean\");\n        this._config.renderer = \"switch\";\n    }\n\n    override normalizeValue(value: unknown): unknown {\n        return Boolean(value);\n    }\n}\n\nclass BooleanFieldTypeFactory implements IFieldTypeFactory {\n    readonly type = \"boolean\";\n    create() {\n        return new BooleanFieldBuilder();\n    }\n}\n\nexport const BooleanFieldType = FieldType.createImplementation({\n    implementation: BooleanFieldTypeFactory,\n    dependencies: []\n});\n\ndeclare module \"../abstractions.js\" {\n    interface IFieldBuilderRegistry {\n        boolean(): IFieldBuilder<\"boolean\", false, boolean | null>;\n    }\n}\n"],"names":["BooleanFieldBuilder","FieldBuilder","value","Boolean","BooleanFieldTypeFactory","BooleanFieldType","FieldType"],"mappings":";;AAGO,MAAMA,4BAA4BC;IACrC,aAAc;QACV,KAAK,CAAC;QACN,IAAI,CAAC,OAAO,CAAC,QAAQ,GAAG;IAC5B;IAES,eAAeC,KAAc,EAAW;QAC7C,OAAOC,QAAQD;IACnB;AACJ;AAEA,MAAME;IAEF,SAAS;QACL,OAAO,IAAIJ;IACf;;aAHS,IAAI,GAAG;;AAIpB;AAEO,MAAMK,mBAAmBC,UAAU,oBAAoB,CAAC;IAC3D,gBAAgBF;IAChB,cAAc,EAAE;AACpB"}

package/features/formModel/fieldTypes/DateTimeFieldType.d.ts

@@ -0,0 +1,175 @@
+import { type IFieldTypeFactory } from "../abstractions.js";
+import { FieldBuilder } from "../FieldBuilder.js";
+export declare class DateTimeFieldBuilder extends FieldBuilder<"datetime"> {
+    private _subtype;
+    constructor();
+    list(): this;
+    /** Subtype methods reset the renderer; a list field keeps the list renderer. */
+    private _defaultRenderer;
+    /**
+     * Calendar date only.
+     * @example datetime().dateOnly()
+     *
+     * Value format: `"2026-05-01"` (YYYY-MM-DD)
+     */
+    dateOnly(): this;
+    /**
+     * Time only, no date component.
+     * @example datetime().timeOnly()
+     *
+     * Value format: `"14:30:00"` (HH:mm:ss)
+     */
+    timeOnly(): this;
+    /**
+     * Date and time with explicit timezone offset.
+     * @example datetime().withTimezone()
+     *
+     * Value format: `"2026-05-01T14:30:00+02:00"` (ISO 8601 with offset)
+     */
+    withTimezone(): this;
+    /**
+     * Date and time in UTC, no timezone offset.
+     * @example datetime().withoutTimezone()
+     *
+     * Value format: `"2026-05-01T14:30:00.000Z"` (ISO 8601 UTC)
+     */
+    withoutTimezone(): this;
+    /**
+     * Month and year picker.
+     * @example datetime().monthOnly()
+     *
+     * Value format: `"2026-05"` (YYYY-MM)
+     */
+    monthOnly(): this;
+    /**
+     * ISO week picker. Selecting any day highlights and selects the full week.
+     * @example
+     * datetime().weekOnly()
+     * datetime().weekOnly({ startsOn: 1 })  // weeks start on Monday
+     *
+     * Value format: `"2026-W18"` (YYYY-Www)
+     */
+    weekOnly(options?: {
+        startsOn?: 0 | 1 | 2 | 3 | 4 | 5 | 6;
+    }): this;
+    /**
+     * Year picker with a scrollable grid.
+     * @example
+     * datetime().yearOnly()
+     * datetime().yearOnly({ range: [2010, 2030] })
+     *
+     * Value format: `2026` (number)
+     */
+    yearOnly(options?: {
+        range?: [number, number];
+    }): this;
+    /**
+     * Date range picker with a two-month calendar.
+     * @example datetime().dateRange()
+     *
+     * Value format: `{ from: "2026-05-01", to: "2026-05-15" }`
+     */
+    dateRange(): this;
+    /**
+     * Select multiple individual dates.
+     * @example datetime().multipleDates()
+     *
+     * Value format: `["2026-05-01", "2026-05-03"]`
+     */
+    multipleDates(): this;
+    /**
+     * Select multiple months.
+     * @example datetime().multipleMonths()
+     *
+     * Value format: `["2026-01", "2026-03"]`
+     */
+    multipleMonths(): this;
+    /**
+     * Select multiple years.
+     * @example
+     * datetime().multipleYears()
+     * datetime().multipleYears({ range: [2020, 2035] })
+     *
+     * Value format: `[2024, 2025, 2026]`
+     */
+    multipleYears(options?: {
+        range?: [number, number];
+    }): this;
+    /**
+     * Add quick-select preset buttons to the picker. Available on all variants.
+     * Each preset's `value` function is called at click time, and the variant
+     * handles formatting the Date into its value type.
+     * @example
+     * datetime().dateOnly().presets([
+     *     { label: "Today", value: () => new Date() },
+     *     { label: "In a week", value: () => addDays(new Date(), 7) }
+     * ])
+     */
+    presets(presets: Array<{
+        label: string;
+        value: () => Date;
+    }>): this;
+    /**
+     * Customize the display format shown in the picker trigger.
+     * Uses date-fns format tokens.
+     * @example
+     * datetime().dateOnly().displayFormat("MM/dd/yyyy")   // "05/01/2026"
+     * datetime().dateOnly().displayFormat("dd MMM yyyy")  // "01 May 2026"
+     * datetime().monthOnly().displayFormat("MMMM yyyy")   // "May 2026"
+     */
+    displayFormat(format: string): this;
+    normalizeValue(value: unknown): unknown;
+}
+declare class DateTimeFieldTypeFactory implements IFieldTypeFactory {
+    readonly type = "datetime";
+    create(_registry: any): DateTimeFieldBuilder;
+}
+export declare const DateTimeFieldType: typeof DateTimeFieldTypeFactory & {
+    __abstraction: import("@webiny/di").Abstraction<IFieldTypeFactory>;
+};
+declare module "../abstractions.js" {
+    interface IFieldBuilderRegistry {
+        /**
+         * Defines a field that stores date and/or time values.
+         *
+         * Variant methods (pick one):
+         * - `dateOnly()` — "2026-05-01"
+         * - `timeOnly()` — "14:30:00"
+         * - `withoutTimezone()` — "2026-05-01T14:30:00.000Z"
+         * - `withTimezone()` — "2026-05-01T14:30:00+02:00"
+         * - `monthOnly()` — "2026-05"
+         * - `weekOnly()` — "2026-W18"
+         * - `yearOnly()` — 2026
+         * - `dateRange()` — { from: "2026-05-01", to: "2026-05-15" }
+         * - `multipleDates()` — ["2026-05-01", "2026-05-03"]
+         * - `multipleMonths()` — ["2026-01", "2026-03"]
+         * - `multipleYears()` — [2024, 2025, 2026]
+         *
+         * Configuration methods (chain after variant):
+         * - `.presets([...])` — quick-select buttons (all variants)
+         * - `.displayFormat("MM/dd/yyyy")` — customize trigger display
+         *
+         * Variant-specific options (passed to variant method):
+         * - `yearOnly({ range: [2020, 2030] })` — year range
+         * - `multipleYears({ range: [2020, 2035] })` — year range
+         * - `weekOnly({ startsOn: 1 })` — first day of week (0=Sun, 1=Mon)
+         *
+         * @example
+         * datetime()                        // full UTC datetime (default)
+         * datetime().dateOnly()             // birthdays, due dates, holidays
+         * datetime().timeOnly()             // opening hours, daily reminders
+         * datetime().withTimezone()         // events tied to a specific locale
+         * datetime().withoutTimezone()      // timestamps, logs, sortable moments
+         * datetime().monthOnly()            // billing cycles, report periods
+         * datetime().weekOnly()             // sprint planning, weekly schedules
+         * datetime().yearOnly({ range: [2010, 2030] })  // fiscal years
+         * datetime().dateRange()            // vacation requests, booking windows
+         * datetime().multipleDates()        // blackout dates, recurring events
+         * datetime().multipleMonths()       // seasonal availability
+         * datetime().multipleYears({ range: [2020, 2035] })  // multi-year budgets
+         * datetime().dateOnly().presets([...]).displayFormat("dd/MM/yyyy")
+         */
+        datetime(): DateTimeFieldBuilder;
+    }
+}
+export {};