@webiny/app-admin 6.3.0-beta.1 → 6.3.0-beta.3

package/features/formModel/demo/FormModelPhase8c1Presenter.js

@@ -0,0 +1,62 @@
+import { makeAutoObservable, toJS } from "mobx";
+/**
+ * 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 class FormModelPhase8c1Presenter {
+  lastSubmitted = null;
+  isSubmitting = false;
+  constructor(formFactory) {
+    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 (result !== false) {
+        this.lastSubmitted = toJS(result);
+      }
+    } finally {
+      this.isSubmitting = false;
+    }
+  }
+  reset() {
+    this.form.reset();
+    this.lastSubmitted = null;
+  }
+}
+
+//# sourceMappingURL=FormModelPhase8c1Presenter.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["makeAutoObservable","toJS","FormModelPhase8c1Presenter","lastSubmitted","isSubmitting","constructor","formFactory","form","create","fields","page","object","label","f","title","text","defaultValue","slug","seo","g","metaTitle","metaDescription","og","h","ogTitle","ogImage","body","layout","l","tabs","tab","row","inner","vm","data","getData","submit","result","reset"],"sources":["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"],"mappings":"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","ignoreList":[]}

package/features/formModel/feature.js

@@ -1,9 +1,21 @@
 import { createFeature } from "@webiny/feature/admin";
 import { FormModelFactory as Abstraction } from "./abstractions.js";
 import { FormModelFactory } from "./FormModelFactory.js";
+import { ConditionRuleEvaluator } from "./ConditionRuleEvaluator.js";
+import { FieldBuilderRegistry } from "./FieldBuilderRegistry.js";
+import { TextFieldType, NumberFieldType, BooleanFieldType, DateTimeFieldType, FileFieldType, FileUrlFieldType, ObjectFieldType } from "./fieldTypes/index.js";
 export 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(FieldBuilderRegistry).inSingletonScope();
+    container.register(ConditionRuleEvaluator).inSingletonScope();
     container.register(FormModelFactory).inSingletonScope();
   },
   resolve(container) {

package/features/formModel/feature.js.map

@@ -1 +1 @@
-{"version":3,"names":["createFeature","FormModelFactory","Abstraction","FormModelFeature","name","register","container","inSingletonScope","resolve","formModelFactory"],"sources":["feature.ts"],"sourcesContent":["import { createFeature } from \"@webiny/feature/admin\";\nimport { FormModelFactory as Abstraction } from \"./abstractions.js\";\nimport { FormModelFactory } from \"./FormModelFactory.js\";\n\nexport const FormModelFeature = createFeature({\n    name: \"FormModel\",\n    register(container) {\n        container.register(FormModelFactory).inSingletonScope();\n    },\n    resolve(container) {\n        return {\n            formModelFactory: container.resolve(Abstraction)\n        };\n    }\n});\n"],"mappings":"AAAA,SAASA,aAAa,QAAQ,uBAAuB;AACrD,SAASC,gBAAgB,IAAIC,WAAW;AACxC,SAASD,gBAAgB;AAEzB,OAAO,MAAME,gBAAgB,GAAGH,aAAa,CAAC;EAC1CI,IAAI,EAAE,WAAW;EACjBC,QAAQA,CAACC,SAAS,EAAE;IAChBA,SAAS,CAACD,QAAQ,CAACJ,gBAAgB,CAAC,CAACM,gBAAgB,CAAC,CAAC;EAC3D,CAAC;EACDC,OAAOA,CAACF,SAAS,EAAE;IACf,OAAO;MACHG,gBAAgB,EAAEH,SAAS,CAACE,OAAO,CAACN,WAAW;IACnD,CAAC;EACL;AACJ,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["createFeature","FormModelFactory","Abstraction","ConditionRuleEvaluator","FieldBuilderRegistry","TextFieldType","NumberFieldType","BooleanFieldType","DateTimeFieldType","FileFieldType","FileUrlFieldType","ObjectFieldType","FormModelFeature","name","register","container","inSingletonScope","resolve","formModelFactory"],"sources":["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 { FieldBuilderRegistry } from \"./FieldBuilderRegistry.js\";\nimport {\n    TextFieldType,\n    NumberFieldType,\n    BooleanFieldType,\n    DateTimeFieldType,\n    FileFieldType,\n    FileUrlFieldType,\n    ObjectFieldType\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\n        container.register(FieldBuilderRegistry).inSingletonScope();\n        container.register(ConditionRuleEvaluator).inSingletonScope();\n        container.register(FormModelFactory).inSingletonScope();\n    },\n    resolve(container) {\n        return {\n            formModelFactory: container.resolve(Abstraction)\n        };\n    }\n});\n"],"mappings":"AAAA,SAASA,aAAa,QAAQ,uBAAuB;AACrD,SAASC,gBAAgB,IAAIC,WAAW;AACxC,SAASD,gBAAgB;AACzB,SAASE,sBAAsB;AAC/B,SAASC,oBAAoB;AAC7B,SACIC,aAAa,EACbC,eAAe,EACfC,gBAAgB,EAChBC,iBAAiB,EACjBC,aAAa,EACbC,gBAAgB,EAChBC,eAAe;AAGnB,OAAO,MAAMC,gBAAgB,GAAGZ,aAAa,CAAC;EAC1Ca,IAAI,EAAE,WAAW;EACjBC,QAAQA,CAACC,SAAS,EAAE;IAChBA,SAAS,CAACD,QAAQ,CAACT,aAAa,CAAC;IACjCU,SAAS,CAACD,QAAQ,CAACR,eAAe,CAAC;IACnCS,SAAS,CAACD,QAAQ,CAACP,gBAAgB,CAAC;IACpCQ,SAAS,CAACD,QAAQ,CAACN,iBAAiB,CAAC;IACrCO,SAAS,CAACD,QAAQ,CAACL,aAAa,CAAC;IACjCM,SAAS,CAACD,QAAQ,CAACJ,gBAAgB,CAAC;IACpCK,SAAS,CAACD,QAAQ,CAACH,eAAe,CAAC;IAEnCI,SAAS,CAACD,QAAQ,CAACV,oBAAoB,CAAC,CAACY,gBAAgB,CAAC,CAAC;IAC3DD,SAAS,CAACD,QAAQ,CAACX,sBAAsB,CAAC,CAACa,gBAAgB,CAAC,CAAC;IAC7DD,SAAS,CAACD,QAAQ,CAACb,gBAAgB,CAAC,CAACe,gBAAgB,CAAC,CAAC;EAC3D,CAAC;EACDC,OAAOA,CAACF,SAAS,EAAE;IACf,OAAO;MACHG,gBAAgB,EAAEH,SAAS,CAACE,OAAO,CAACf,WAAW;IACnD,CAAC;EACL;AACJ,CAAC,CAAC","ignoreList":[]}

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

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

@@ -0,0 +1 @@
+{"version":3,"names":["FieldType","FieldBuilder","BooleanFieldBuilder","constructor","_config","renderer","normalizeValue","value","Boolean","BooleanFieldTypeFactory","type","create","BooleanFieldType","createImplementation","implementation","dependencies"],"sources":["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"],"mappings":"AAAA,SAASA,SAAS;AAClB,SAASC,YAAY;AAErB,OAAO,MAAMC,mBAAmB,SAASD,YAAY,CAAY;EAC7DE,WAAWA,CAAA,EAAG;IACV,KAAK,CAAC,SAAS,CAAC;IAChB,IAAI,CAACC,OAAO,CAACC,QAAQ,GAAG,QAAQ;EACpC;EAESC,cAAcA,CAACC,KAAc,EAAW;IAC7C,OAAOC,OAAO,CAACD,KAAK,CAAC;EACzB;AACJ;AAEA,MAAME,uBAAuB,CAA8B;EAC9CC,IAAI,GAAG,SAAS;EACzBC,MAAMA,CAAA,EAAG;IACL,OAAO,IAAIT,mBAAmB,CAAC,CAAC;EACpC;AACJ;AAEA,OAAO,MAAMU,gBAAgB,GAAGZ,SAAS,CAACa,oBAAoB,CAAC;EAC3DC,cAAc,EAAEL,uBAAuB;EACvCM,YAAY,EAAE;AAClB,CAAC,CAAC","ignoreList":[]}

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

@@ -0,0 +1,173 @@
+import { type IFieldTypeFactory } from "../abstractions.js";
+import { FieldBuilder } from "../FieldBuilder.js";
+export declare class DateTimeFieldBuilder extends FieldBuilder<"datetime"> {
+    private _subtype;
+    constructor();
+    list(): this;
+    /**
+     * 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 {};