npm - @webiny/app-admin - Versions diffs - 0.0.0-unstable.e6f0dc8ca7 → 0.0.0-unstable.eb81deee7e - Mend

@webiny/app-admin 0.0.0-unstable.e6f0dc8ca7 → 0.0.0-unstable.eb81deee7e

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (2006) hide show

package/features/formModel/demo/FormModelDemo.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import React, { useMemo } from "react";
+import react, { useMemo } from "react";
 import { observer } from "mobx-react-lite";
 import { useFeature } from "@webiny/app";
 import { Button } from "@webiny/admin-ui";
@@ -8,227 +8,199 @@ import { FieldRenderersDemoPresenter } from "./FieldRenderersDemoPresenter.js";
 import { FormModelDemoPresenter } from "./FormModelDemoPresenter.js";
 import { FormModelPhase8c1Presenter } from "./FormModelPhase8c1Presenter.js";
 import { FormModelPhase11Presenter } from "./FormModelPhase11Presenter.js";
-export const FormModelDemo = observer(() => {
-  const {
-    formModelFactory
-  } = useFeature(FormModelFeature);
-  const presenter = useMemo(() => new FormModelDemoPresenter(formModelFactory), [formModelFactory]);
-  const {
-    form,
-    data,
-    lastSubmitted,
-    isSubmitting,
-    runtimeTemplateAdded,
-    textTemplateRemoved
-  } = presenter.vm;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "p-lg flex flex-col gap-2xl max-w-4xl mx-auto"
-  }, /*#__PURE__*/React.createElement(FieldRenderersSection, null), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-lg"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-sm"
-  }, /*#__PURE__*/React.createElement("h2", {
-    className: "text-xl font-semibold"
-  }, "FormModel Demo \u2014 Phase 8"), /*#__PURE__*/React.createElement("p", {
-    className: "text-sm text-neutral-strong"
-  }, "Exercises the full Phase 8 surface: single-object templates (\"Content Block\"), templated lists (\"Page Sections\"), per-template layouts (Hero spans two rows; Rich Text uses a single row; templates without a layout entry fall back to default), and runtime template management via", " ", /*#__PURE__*/React.createElement("code", null, "field.templates.add/remove"), ". Change Plan to", " ", /*#__PURE__*/React.createElement("code", null, "enterprise"), " to reveal the \"Premium Widget\" template in the Content Block picker.")), /*#__PURE__*/React.createElement(FormView, {
-    name: "Demo",
-    form: form
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-wrap gap-sm"
-  }, /*#__PURE__*/React.createElement(Button, {
-    text: isSubmitting ? "Submitting…" : "Submit",
-    variant: "primary",
-    onClick: () => presenter.submit(),
-    disabled: isSubmitting
-  }), /*#__PURE__*/React.createElement(Button, {
-    text: "Reset",
-    variant: "secondary",
-    onClick: () => presenter.reset(),
-    disabled: isSubmitting
-  }), /*#__PURE__*/React.createElement(Button, {
-    text: runtimeTemplateAdded ? 'Remove "Runtime Banner" from sections' : 'Add "Runtime Banner" to sections',
-    variant: "tertiary",
-    onClick: () => presenter.toggleRuntimeTemplate()
-  }), /*#__PURE__*/React.createElement(Button, {
-    text: textTemplateRemoved ? 'Restore "Rich Text" on content' : 'Remove "Rich Text" from content',
-    variant: "tertiary",
-    onClick: () => presenter.toggleTextTemplate()
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "grid grid-cols-2 gap-md"
-  }, /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Current getData()",
-    data: data
-  }), /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Last submitted",
-    data: lastSubmitted
-  }))), /*#__PURE__*/React.createElement(Phase8c1Section, null), /*#__PURE__*/React.createElement(Phase11Section, null));
+const FormModelDemo = observer(()=>{
+    const { formModelFactory } = useFeature(FormModelFeature);
+    const presenter = useMemo(()=>new FormModelDemoPresenter(formModelFactory), [
+        formModelFactory
+    ]);
+    const { form, data, lastSubmitted, isSubmitting, runtimeTemplateAdded, textTemplateRemoved } = presenter.vm;
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "p-lg flex flex-col gap-2xl max-w-4xl mx-auto"
+    }, /*#__PURE__*/ react.createElement(FieldRenderersSection, null), /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-lg"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-sm"
+    }, /*#__PURE__*/ react.createElement("h2", {
+        className: "text-xl font-semibold"
+    }, "FormModel Demo — Phase 8"), /*#__PURE__*/ react.createElement("p", {
+        className: "text-sm text-neutral-strong"
+    }, 'Exercises the full Phase 8 surface: single-object templates ("Content Block"), templated lists ("Page Sections"), per-template layouts (Hero spans two rows; Rich Text uses a single row; templates without a layout entry fall back to default), and runtime template management via', " ", /*#__PURE__*/ react.createElement("code", null, "field.templates.add/remove"), ". Change Plan to", " ", /*#__PURE__*/ react.createElement("code", null, "enterprise"), ' to reveal the "Premium Widget" template in the Content Block picker.')), /*#__PURE__*/ react.createElement(FormView, {
+        name: "Demo",
+        form: form
+    }), /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-sm"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        text: isSubmitting ? "Submitting…" : "Submit",
+        variant: "primary",
+        onClick: ()=>presenter.submit(),
+        disabled: isSubmitting
+    }), /*#__PURE__*/ react.createElement(Button, {
+        text: "Reset",
+        variant: "secondary",
+        onClick: ()=>presenter.reset(),
+        disabled: isSubmitting
+    }), /*#__PURE__*/ react.createElement(Button, {
+        text: runtimeTemplateAdded ? 'Remove "Runtime Banner" from sections' : 'Add "Runtime Banner" to sections',
+        variant: "tertiary",
+        onClick: ()=>presenter.toggleRuntimeTemplate()
+    }), /*#__PURE__*/ react.createElement(Button, {
+        text: textTemplateRemoved ? 'Restore "Rich Text" on content' : 'Remove "Rich Text" from content',
+        variant: "tertiary",
+        onClick: ()=>presenter.toggleTextTemplate()
+    })), /*#__PURE__*/ react.createElement("div", {
+        className: "grid grid-cols-2 gap-md"
+    }, /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Current getData()",
+        data: data
+    }), /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Last submitted",
+        data: lastSubmitted
+    }))), /*#__PURE__*/ react.createElement(Phase8c1Section, null), /*#__PURE__*/ react.createElement(Phase11Section, null));
 });
-const FieldRenderersSection = observer(() => {
-  const {
-    formModelFactory
-  } = useFeature(FormModelFeature);
-  const presenter = useMemo(() => new FieldRenderersDemoPresenter(formModelFactory), [formModelFactory]);
-  const {
-    form,
-    data,
-    lastSubmitted,
-    isSubmitting,
-    formErrors
-  } = presenter.vm;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-lg"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-sm"
-  }, /*#__PURE__*/React.createElement("h2", {
-    className: "text-xl font-semibold"
-  }, "Field Renderers Showcase"), /*#__PURE__*/React.createElement("p", {
-    className: "text-sm text-neutral-strong"
-  }, "All field renderer variants: text, number, boolean, select (dropdown/radio/checkboxes), date/time (4 variants), tags, textarea, multi-value lists, hidden, and dynamic zones. Renderers not yet implemented show nothing (console warning).")), /*#__PURE__*/React.createElement(FormView, {
-    name: "Demo",
-    form: form
-  }), formErrors.length > 0 && /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-xs"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "text-sm font-medium"
-  }, "Form errors"), /*#__PURE__*/React.createElement("ul", {
-    className: "text-xs text-error-strong list-disc pl-md"
-  }, formErrors.map((e, i) => /*#__PURE__*/React.createElement("li", {
-    key: i
-  }, e.path ? /*#__PURE__*/React.createElement("button", {
-    type: "button",
-    className: "underline cursor-pointer hover:text-error-default",
-    onClick: () => presenter.focusField(e.path)
-  }, /*#__PURE__*/React.createElement("code", null, e.path)) : null, " ", e.message)))), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-wrap gap-sm"
-  }, /*#__PURE__*/React.createElement(Button, {
-    text: isSubmitting ? "Submitting…" : "Submit",
-    variant: "primary",
-    onClick: () => presenter.submit(),
-    disabled: isSubmitting
-  }), /*#__PURE__*/React.createElement(Button, {
-    text: "Reset",
-    variant: "secondary",
-    onClick: () => presenter.reset(),
-    disabled: isSubmitting
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "grid grid-cols-2 gap-md"
-  }, /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Current getData()",
-    data: data
-  }), /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Last submitted",
-    data: lastSubmitted
-  })));
+const FieldRenderersSection = observer(()=>{
+    const { formModelFactory } = useFeature(FormModelFeature);
+    const presenter = useMemo(()=>new FieldRenderersDemoPresenter(formModelFactory), [
+        formModelFactory
+    ]);
+    const { form, data, lastSubmitted, isSubmitting, formErrors } = presenter.vm;
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-lg"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-sm"
+    }, /*#__PURE__*/ react.createElement("h2", {
+        className: "text-xl font-semibold"
+    }, "Field Renderers Showcase"), /*#__PURE__*/ react.createElement("p", {
+        className: "text-sm text-neutral-strong"
+    }, "All field renderer variants: text, number, boolean, select (dropdown/radio/checkboxes), date/time (4 variants), tags, textarea, multi-value lists, hidden, and dynamic zones. Renderers not yet implemented show nothing (console warning).")), /*#__PURE__*/ react.createElement(FormView, {
+        name: "Demo",
+        form: form
+    }), formErrors.length > 0 && /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-xs"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "text-sm font-medium"
+    }, "Form errors"), /*#__PURE__*/ react.createElement("ul", {
+        className: "text-xs text-error-strong list-disc pl-md"
+    }, formErrors.map((e, i)=>/*#__PURE__*/ react.createElement("li", {
+            key: i
+        }, e.path ? /*#__PURE__*/ react.createElement("button", {
+            type: "button",
+            className: "underline cursor-pointer hover:text-error-default",
+            onClick: ()=>presenter.focusField(e.path)
+        }, /*#__PURE__*/ react.createElement("code", null, e.path)) : null, " ", e.message)))), /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-sm"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        text: isSubmitting ? "Submitting…" : "Submit",
+        variant: "primary",
+        onClick: ()=>presenter.submit(),
+        disabled: isSubmitting
+    }), /*#__PURE__*/ react.createElement(Button, {
+        text: "Reset",
+        variant: "secondary",
+        onClick: ()=>presenter.reset(),
+        disabled: isSubmitting
+    })), /*#__PURE__*/ react.createElement("div", {
+        className: "grid grid-cols-2 gap-md"
+    }, /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Current getData()",
+        data: data
+    }), /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Last submitted",
+        data: lastSubmitted
+    })));
 });
-const Phase8c1Section = observer(() => {
-  const {
-    formModelFactory
-  } = useFeature(FormModelFeature);
-  const presenter = useMemo(() => new FormModelPhase8c1Presenter(formModelFactory), [formModelFactory]);
-  const {
-    form,
-    data,
-    lastSubmitted,
-    isSubmitting
-  } = presenter.vm;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-lg border-t border-neutral-dimmed pt-lg"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-sm"
-  }, /*#__PURE__*/React.createElement("h2", {
-    className: "text-xl font-semibold"
-  }, "FormModel Demo \u2014 Phase 8c.1"), /*#__PURE__*/React.createElement("p", {
-    className: "text-sm text-neutral-strong"
-  }, "Nested object layouts. A top-level ", /*#__PURE__*/React.createElement("code", null, "page"), " object whose inner layout is split across tabs (General / SEO). The SEO tab contains a nested", " ", /*#__PURE__*/React.createElement("code", null, "layout.object(\"seo\", ...)"), " with its own row layout, and the SEO object itself contains another nested", " ", /*#__PURE__*/React.createElement("code", null, "layout.object(\"og\", ...)"), " for the Open Graph fields. Phase 8c.1 walks the inner layout (including across tabs) and forwards each nested", " ", /*#__PURE__*/React.createElement("code", null, "layout.object()"), " to the matching child at build time.")), /*#__PURE__*/React.createElement(FormView, {
-    name: "Demo",
-    form: form
-  }), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-wrap gap-sm"
-  }, /*#__PURE__*/React.createElement(Button, {
-    text: isSubmitting ? "Submitting…" : "Submit",
-    variant: "primary",
-    onClick: () => presenter.submit(),
-    disabled: isSubmitting
-  }), /*#__PURE__*/React.createElement(Button, {
-    text: "Reset",
-    variant: "secondary",
-    onClick: () => presenter.reset(),
-    disabled: isSubmitting
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "grid grid-cols-2 gap-md"
-  }, /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Current getData()",
-    data: data
-  }), /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Last submitted",
-    data: lastSubmitted
-  })));
+const Phase8c1Section = observer(()=>{
+    const { formModelFactory } = useFeature(FormModelFeature);
+    const presenter = useMemo(()=>new FormModelPhase8c1Presenter(formModelFactory), [
+        formModelFactory
+    ]);
+    const { form, data, lastSubmitted, isSubmitting } = presenter.vm;
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-lg border-t border-neutral-dimmed pt-lg"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-sm"
+    }, /*#__PURE__*/ react.createElement("h2", {
+        className: "text-xl font-semibold"
+    }, "FormModel Demo — Phase 8c.1"), /*#__PURE__*/ react.createElement("p", {
+        className: "text-sm text-neutral-strong"
+    }, "Nested object layouts. A top-level ", /*#__PURE__*/ react.createElement("code", null, "page"), " object whose inner layout is split across tabs (General / SEO). The SEO tab contains a nested", " ", /*#__PURE__*/ react.createElement("code", null, 'layout.object("seo", ...)'), " with its own row layout, and the SEO object itself contains another nested", " ", /*#__PURE__*/ react.createElement("code", null, 'layout.object("og", ...)'), " for the Open Graph fields. Phase 8c.1 walks the inner layout (including across tabs) and forwards each nested", " ", /*#__PURE__*/ react.createElement("code", null, "layout.object()"), " to the matching child at build time.")), /*#__PURE__*/ react.createElement(FormView, {
+        name: "Demo",
+        form: form
+    }), /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-sm"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        text: isSubmitting ? "Submitting…" : "Submit",
+        variant: "primary",
+        onClick: ()=>presenter.submit(),
+        disabled: isSubmitting
+    }), /*#__PURE__*/ react.createElement(Button, {
+        text: "Reset",
+        variant: "secondary",
+        onClick: ()=>presenter.reset(),
+        disabled: isSubmitting
+    })), /*#__PURE__*/ react.createElement("div", {
+        className: "grid grid-cols-2 gap-md"
+    }, /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Current getData()",
+        data: data
+    }), /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Last submitted",
+        data: lastSubmitted
+    })));
 });
-const Phase11Section = observer(() => {
-  const {
-    formModelFactory
-  } = useFeature(FormModelFeature);
-  const presenter = useMemo(() => new FormModelPhase11Presenter(formModelFactory), [formModelFactory]);
-  const {
-    form,
-    data,
-    lastSubmitted,
-    isSubmitting,
-    formErrors
-  } = presenter.vm;
-  return /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-lg border-t border-neutral-dimmed pt-lg"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-sm"
-  }, /*#__PURE__*/React.createElement("h2", {
-    className: "text-xl font-semibold"
-  }, "FormModel Demo \u2014 Phase 11"), /*#__PURE__*/React.createElement("p", {
-    className: "text-sm text-neutral-strong"
-  }, "Conditional required (", /*#__PURE__*/React.createElement("code", null, "requiredWhen"), " on Seats \u2014 chained builder + modifier rules), derived fields (", /*#__PURE__*/React.createElement("code", null, "computed"), " Full Name and", " ", /*#__PURE__*/React.createElement("code", null, "computedUntilDirty"), " Slug), modifier-style child addition via", " ", /*#__PURE__*/React.createElement("code", null, "field.as(\"object\").fields()"), " adding Company/Bio to Profile, form-level rules (", /*#__PURE__*/React.createElement("code", null, "addRule"), " with a Zod refinement for password match plus an imperative slug-length rule), and a layout assembled via", " ", /*#__PURE__*/React.createElement("code", null, "setLayout"), ".")), /*#__PURE__*/React.createElement(FormView, {
-    name: "Demo",
-    form: form
-  }), formErrors.length > 0 && /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-xs"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "text-sm font-medium"
-  }, "Form errors"), /*#__PURE__*/React.createElement("ul", {
-    className: "text-xs text-error-strong list-disc pl-md"
-  }, formErrors.map((e, i) => /*#__PURE__*/React.createElement("li", {
-    key: i
-  }, e.path ? /*#__PURE__*/React.createElement("code", null, e.path) : null, " ", e.message)))), /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-wrap gap-sm"
-  }, /*#__PURE__*/React.createElement(Button, {
-    text: isSubmitting ? "Submitting…" : "Submit",
-    variant: "primary",
-    onClick: () => presenter.submit(),
-    disabled: isSubmitting
-  }), /*#__PURE__*/React.createElement(Button, {
-    text: "Reset",
-    variant: "secondary",
-    onClick: () => presenter.reset(),
-    disabled: isSubmitting
-  })), /*#__PURE__*/React.createElement("div", {
-    className: "grid grid-cols-2 gap-md"
-  }, /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Current getData()",
-    data: data
-  }), /*#__PURE__*/React.createElement(DataPanel, {
-    title: "Last submitted",
-    data: lastSubmitted
-  })));
+const Phase11Section = observer(()=>{
+    const { formModelFactory } = useFeature(FormModelFeature);
+    const presenter = useMemo(()=>new FormModelPhase11Presenter(formModelFactory), [
+        formModelFactory
+    ]);
+    const { form, data, lastSubmitted, isSubmitting, formErrors } = presenter.vm;
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-lg border-t border-neutral-dimmed pt-lg"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-sm"
+    }, /*#__PURE__*/ react.createElement("h2", {
+        className: "text-xl font-semibold"
+    }, "FormModel Demo — Phase 11"), /*#__PURE__*/ react.createElement("p", {
+        className: "text-sm text-neutral-strong"
+    }, "Conditional required (", /*#__PURE__*/ react.createElement("code", null, "requiredWhen"), " on Seats — chained builder + modifier rules), derived fields (", /*#__PURE__*/ react.createElement("code", null, "computed"), " Full Name and", " ", /*#__PURE__*/ react.createElement("code", null, "computedUntilDirty"), " Slug), modifier-style child addition via", " ", /*#__PURE__*/ react.createElement("code", null, 'field.as("object").fields()'), " adding Company/Bio to Profile, form-level rules (", /*#__PURE__*/ react.createElement("code", null, "addRule"), " with a Zod refinement for password match plus an imperative slug-length rule), and a layout assembled via", " ", /*#__PURE__*/ react.createElement("code", null, "setLayout"), ".")), /*#__PURE__*/ react.createElement(FormView, {
+        name: "Demo",
+        form: form
+    }), formErrors.length > 0 && /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-xs"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "text-sm font-medium"
+    }, "Form errors"), /*#__PURE__*/ react.createElement("ul", {
+        className: "text-xs text-error-strong list-disc pl-md"
+    }, formErrors.map((e, i)=>/*#__PURE__*/ react.createElement("li", {
+            key: i
+        }, e.path ? /*#__PURE__*/ react.createElement("code", null, e.path) : null, " ", e.message)))), /*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-wrap gap-sm"
+    }, /*#__PURE__*/ react.createElement(Button, {
+        text: isSubmitting ? "Submitting…" : "Submit",
+        variant: "primary",
+        onClick: ()=>presenter.submit(),
+        disabled: isSubmitting
+    }), /*#__PURE__*/ react.createElement(Button, {
+        text: "Reset",
+        variant: "secondary",
+        onClick: ()=>presenter.reset(),
+        disabled: isSubmitting
+    })), /*#__PURE__*/ react.createElement("div", {
+        className: "grid grid-cols-2 gap-md"
+    }, /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Current getData()",
+        data: data
+    }), /*#__PURE__*/ react.createElement(DataPanel, {
+        title: "Last submitted",
+        data: lastSubmitted
+    })));
 });
-const DataPanel = ({
-  title,
-  data
-}) => {
-  return /*#__PURE__*/React.createElement("div", {
-    className: "flex flex-col gap-xs"
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "text-sm font-medium"
-  }, title), /*#__PURE__*/React.createElement("pre", {
-    className: "text-xs bg-neutral-subtle p-sm rounded border border-neutral-dimmed overflow-auto"
-  }, data === null ? "null" : JSON.stringify(data, null, 2)));
-};
+const DataPanel = ({ title, data })=>/*#__PURE__*/ react.createElement("div", {
+        className: "flex flex-col gap-xs"
+    }, /*#__PURE__*/ react.createElement("div", {
+        className: "text-sm font-medium"
+    }, title), /*#__PURE__*/ react.createElement("pre", {
+        className: "text-xs bg-neutral-subtle p-sm rounded border border-neutral-dimmed overflow-auto"
+    }, null === data ? "null" : JSON.stringify(data, null, 2)));
+export { FormModelDemo };
 //# sourceMappingURL=FormModelDemo.js.map

package/features/formModel/demo/FormModelDemo.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["React","useMemo","observer","useFeature","Button","FormView","FormModelFeature","FieldRenderersDemoPresenter","FormModelDemoPresenter","FormModelPhase8c1Presenter","FormModelPhase11Presenter","FormModelDemo","formModelFactory","presenter","form","data","lastSubmitted","isSubmitting","runtimeTemplateAdded","textTemplateRemoved","vm","createElement","className","FieldRenderersSection","name","text","variant","onClick","submit","disabled","reset","toggleRuntimeTemplate","toggleTextTemplate","DataPanel","title","Phase8c1Section","Phase11Section","formErrors","length","map","e","i","key","path","type","focusField","message","JSON","stringify"],"sources":["FormModelDemo.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { useFeature } from \"@webiny/app\";\nimport { Button } from \"@webiny/admin-ui\";\nimport { FormView } from \"../FormView.js\";\nimport { FormModelFeature } from \"../feature.js\";\nimport { FieldRenderersDemoPresenter } from \"./FieldRenderersDemoPresenter.js\";\nimport { FormModelDemoPresenter } from \"./FormModelDemoPresenter.js\";\nimport { FormModelPhase8c1Presenter } from \"./FormModelPhase8c1Presenter.js\";\nimport { FormModelPhase11Presenter } from \"./FormModelPhase11Presenter.js\";\n\nexport const FormModelDemo = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FormModelDemoPresenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting, runtimeTemplateAdded, textTemplateRemoved } =\n presenter.vm;\n\n return (\n <div className={\"p-lg flex flex-col gap-2xl max-w-4xl mx-auto\"}>\n <FieldRenderersSection />\n\n <div className={\"flex flex-col gap-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>FormModel Demo — Phase 8</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n Exercises the full Phase 8 surface: single-object templates ("Content\n Block"), templated lists ("Page Sections"), per-template\n layouts (Hero spans two rows; Rich Text uses a single row; templates without\n a layout entry fall back to default), and runtime template management via{\" \"}\n <code>field.templates.add/remove</code>. Change Plan to{\" \"}\n <code>enterprise</code> to reveal the "Premium Widget" template in\n the Content Block picker.\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n <Button\n text={\n runtimeTemplateAdded\n ? 'Remove \"Runtime Banner\" from sections'\n : 'Add \"Runtime Banner\" to sections'\n }\n variant={\"tertiary\"}\n onClick={() => presenter.toggleRuntimeTemplate()}\n />\n <Button\n text={\n textTemplateRemoved\n ? 'Restore \"Rich Text\" on content'\n : 'Remove \"Rich Text\" from content'\n }\n variant={\"tertiary\"}\n onClick={() => presenter.toggleTextTemplate()}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n\n <Phase8c1Section />\n\n <Phase11Section />\n </div>\n );\n});\n\nconst FieldRenderersSection = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FieldRenderersDemoPresenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting, formErrors } = presenter.vm;\n\n return (\n <div className={\"flex flex-col gap-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>Field Renderers Showcase</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n All field renderer variants: text, number, boolean, select\n (dropdown/radio/checkboxes), date/time (4 variants), tags, textarea, multi-value\n lists, hidden, and dynamic zones. Renderers not yet implemented show nothing\n (console warning).\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n {formErrors.length > 0 && (\n <div className={\"flex flex-col gap-xs\"}>\n <div className={\"text-sm font-medium\"}>Form errors</div>\n <ul className={\"text-xs text-error-strong list-disc pl-md\"}>\n {formErrors.map((e, i) => (\n <li key={i}>\n {e.path ? (\n <button\n type={\"button\"}\n className={\n \"underline cursor-pointer hover:text-error-default\"\n }\n onClick={() => presenter.focusField(e.path)}\n >\n <code>{e.path}</code>\n </button>\n ) : null}{\" \"}\n {e.message}\n </li>\n ))}\n </ul>\n </div>\n )}\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n );\n});\n\nconst Phase8c1Section = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FormModelPhase8c1Presenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting } = presenter.vm;\n\n return (\n <div className={\"flex flex-col gap-lg border-t border-neutral-dimmed pt-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>FormModel Demo — Phase 8c.1</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n Nested object layouts. A top-level <code>page</code> object whose inner layout\n is split across tabs (General / SEO). The SEO tab contains a nested{\" \"}\n <code>layout.object("seo", ...)</code> with its own row layout, and\n the SEO object itself contains another nested{\" \"}\n <code>layout.object("og", ...)</code> for the Open Graph fields. Phase\n 8c.1 walks the inner layout (including across tabs) and forwards each nested{\" \"}\n <code>layout.object()</code> to the matching child at build time.\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n );\n});\n\nconst Phase11Section = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FormModelPhase11Presenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting, formErrors } = presenter.vm;\n\n return (\n <div className={\"flex flex-col gap-lg border-t border-neutral-dimmed pt-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>FormModel Demo — Phase 11</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n Conditional required (<code>requiredWhen</code> on Seats — chained builder +\n modifier rules), derived fields (<code>computed</code> Full Name and{\" \"}\n <code>computedUntilDirty</code> Slug), modifier-style child addition via{\" \"}\n <code>field.as("object").fields()</code> adding Company/Bio to\n Profile, form-level rules (<code>addRule</code> with a Zod refinement for\n password match plus an imperative slug-length rule), and a layout assembled via{\" \"}\n <code>setLayout</code>.\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n {formErrors.length > 0 && (\n <div className={\"flex flex-col gap-xs\"}>\n <div className={\"text-sm font-medium\"}>Form errors</div>\n <ul className={\"text-xs text-error-strong list-disc pl-md\"}>\n {formErrors.map((e, i) => (\n <li key={i}>\n {e.path ? <code>{e.path}</code> : null} {e.message}\n </li>\n ))}\n </ul>\n </div>\n )}\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n );\n});\n\nconst DataPanel = ({ title, data }: { title: string; data: unknown }) => {\n return (\n <div className={\"flex flex-col gap-xs\"}>\n <div className={\"text-sm font-medium\"}>{title}</div>\n <pre\n className={\n \"text-xs bg-neutral-subtle p-sm rounded border border-neutral-dimmed overflow-auto\"\n }\n >\n {data === null ? \"null\" : JSON.stringify(data, null, 2)}\n </pre>\n </div>\n );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,UAAU,QAAQ,aAAa;AACxC,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SAASC,QAAQ;AACjB,SAASC,gBAAgB;AACzB,SAASC,2BAA2B;AACpC,SAASC,sBAAsB;AAC/B,SAASC,0BAA0B;AACnC,SAASC,yBAAyB;AAElC,OAAO,MAAMC,aAAa,GAAGT,QAAQ,CAAC,MAAM;EACxC,MAAM;IAAEU;EAAiB,CAAC,GAAGT,UAAU,CAACG,gBAAgB,CAAC;EACzD,MAAMO,SAAS,GAAGZ,OAAO,CACrB,MAAM,IAAIO,sBAAsB,CAACI,gBAAgB,CAAC,EAClD,CAACA,gBAAgB,CACrB,CAAC;EAED,MAAM;IAAEE,IAAI;IAAEC,IAAI;IAAEC,aAAa;IAAEC,YAAY;IAAEC,oBAAoB;IAAEC;EAAoB,CAAC,GACxFN,SAAS,CAACO,EAAE;EAEhB,oBACIpB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAA+C,gBAC3DtB,KAAA,CAAAqB,aAAA,CAACE,qBAAqB,MAAE,CAAC,eAEzBvB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAIC,SAAS,EAAE;EAAwB,GAAC,+BAA4B,CAAC,eACrEtB,KAAA,CAAAqB,aAAA;IAAGC,SAAS,EAAE;EAA8B,GAAC,2RAIgC,EAAC,GAAG,eAC7EtB,KAAA,CAAAqB,aAAA,eAAM,4BAAgC,CAAC,oBAAgB,EAAC,GAAG,eAC3DrB,KAAA,CAAAqB,aAAA,eAAM,YAAgB,CAAC,2EAExB,CACF,CAAC,eAENrB,KAAA,CAAAqB,aAAA,CAAChB,QAAQ;IAACmB,IAAI,EAAC,MAAM;IAACV,IAAI,EAAEA;EAAK,CAAE,CAAC,eAEpCd,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAwB,gBACpCtB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAER,YAAY,GAAG,aAAa,GAAG,QAAS;IAC9CS,OAAO,EAAE,SAAU;IACnBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACe,MAAM,CAAC,CAAE;IAClCC,QAAQ,EAAEZ;EAAa,CAC1B,CAAC,eACFjB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAE,OAAQ;IACdC,OAAO,EAAE,WAAY;IACrBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACiB,KAAK,CAAC,CAAE;IACjCD,QAAQ,EAAEZ;EAAa,CAC1B,CAAC,eACFjB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EACAP,oBAAoB,GACd,uCAAuC,GACvC,kCACT;IACDQ,OAAO,EAAE,UAAW;IACpBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACkB,qBAAqB,CAAC;EAAE,CACpD,CAAC,eACF/B,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EACAN,mBAAmB,GACb,gCAAgC,GAChC,iCACT;IACDO,OAAO,EAAE,UAAW;IACpBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACmB,kBAAkB,CAAC;EAAE,CACjD,CACA,CAAC,eAENhC,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAA0B,gBACtCtB,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,mBAAoB;IAACnB,IAAI,EAAEA;EAAK,CAAE,CAAC,eACrDf,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,gBAAiB;IAACnB,IAAI,EAAEC;EAAc,CAAE,CACzD,CACJ,CAAC,eAENhB,KAAA,CAAAqB,aAAA,CAACc,eAAe,MAAE,CAAC,eAEnBnC,KAAA,CAAAqB,aAAA,CAACe,cAAc,MAAE,CAChB,CAAC;AAEd,CAAC,CAAC;AAEF,MAAMb,qBAAqB,GAAGrB,QAAQ,CAAC,MAAM;EACzC,MAAM;IAAEU;EAAiB,CAAC,GAAGT,UAAU,CAACG,gBAAgB,CAAC;EACzD,MAAMO,SAAS,GAAGZ,OAAO,CACrB,MAAM,IAAIM,2BAA2B,CAACK,gBAAgB,CAAC,EACvD,CAACA,gBAAgB,CACrB,CAAC;EAED,MAAM;IAAEE,IAAI;IAAEC,IAAI;IAAEC,aAAa;IAAEC,YAAY;IAAEoB;EAAW,CAAC,GAAGxB,SAAS,CAACO,EAAE;EAE5E,oBACIpB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAIC,SAAS,EAAE;EAAwB,GAAC,0BAA4B,CAAC,eACrEtB,KAAA,CAAAqB,aAAA;IAAGC,SAAS,EAAE;EAA8B,GAAC,6OAK1C,CACF,CAAC,eAENtB,KAAA,CAAAqB,aAAA,CAAChB,QAAQ;IAACmB,IAAI,EAAC,MAAM;IAACV,IAAI,EAAEA;EAAK,CAAE,CAAC,EAEnCuB,UAAU,CAACC,MAAM,GAAG,CAAC,iBAClBtC,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAsB,GAAC,aAAgB,CAAC,eACxDtB,KAAA,CAAAqB,aAAA;IAAIC,SAAS,EAAE;EAA4C,GACtDe,UAAU,CAACE,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,kBACjBzC,KAAA,CAAAqB,aAAA;IAAIqB,GAAG,EAAED;EAAE,GACND,CAAC,CAACG,IAAI,gBACH3C,KAAA,CAAAqB,aAAA;IACIuB,IAAI,EAAE,QAAS;IACftB,SAAS,EACL,mDACH;IACDK,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACgC,UAAU,CAACL,CAAC,CAACG,IAAI;EAAE,gBAE5C3C,KAAA,CAAAqB,aAAA,eAAOmB,CAAC,CAACG,IAAW,CAChB,CAAC,GACT,IAAI,EAAE,GAAG,EACZH,CAAC,CAACM,OACH,CACP,CACD,CACH,CACR,eAED9C,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAwB,gBACpCtB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAER,YAAY,GAAG,aAAa,GAAG,QAAS;IAC9CS,OAAO,EAAE,SAAU;IACnBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACe,MAAM,CAAC,CAAE;IAClCC,QAAQ,EAAEZ;EAAa,CAC1B,CAAC,eACFjB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAE,OAAQ;IACdC,OAAO,EAAE,WAAY;IACrBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACiB,KAAK,CAAC,CAAE;IACjCD,QAAQ,EAAEZ;EAAa,CAC1B,CACA,CAAC,eAENjB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAA0B,gBACtCtB,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,mBAAoB;IAACnB,IAAI,EAAEA;EAAK,CAAE,CAAC,eACrDf,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,gBAAiB;IAACnB,IAAI,EAAEC;EAAc,CAAE,CACzD,CACJ,CAAC;AAEd,CAAC,CAAC;AAEF,MAAMmB,eAAe,GAAGjC,QAAQ,CAAC,MAAM;EACnC,MAAM;IAAEU;EAAiB,CAAC,GAAGT,UAAU,CAACG,gBAAgB,CAAC;EACzD,MAAMO,SAAS,GAAGZ,OAAO,CACrB,MAAM,IAAIQ,0BAA0B,CAACG,gBAAgB,CAAC,EACtD,CAACA,gBAAgB,CACrB,CAAC;EAED,MAAM;IAAEE,IAAI;IAAEC,IAAI;IAAEC,aAAa;IAAEC;EAAa,CAAC,GAAGJ,SAAS,CAACO,EAAE;EAEhE,oBACIpB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAA4D,gBACxEtB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAIC,SAAS,EAAE;EAAwB,GAAC,kCAA+B,CAAC,eACxEtB,KAAA,CAAAqB,aAAA;IAAGC,SAAS,EAAE;EAA8B,GAAC,qCACN,eAAAtB,KAAA,CAAAqB,aAAA,eAAM,MAAU,CAAC,kGACe,EAAC,GAAG,eACvErB,KAAA,CAAAqB,aAAA,eAAM,6BAAyC,CAAC,+EACH,EAAC,GAAG,eACjDrB,KAAA,CAAAqB,aAAA,eAAM,4BAAwC,CAAC,kHAC6B,EAAC,GAAG,eAChFrB,KAAA,CAAAqB,aAAA,eAAM,iBAAqB,CAAC,yCAC7B,CACF,CAAC,eAENrB,KAAA,CAAAqB,aAAA,CAAChB,QAAQ;IAACmB,IAAI,EAAC,MAAM;IAACV,IAAI,EAAEA;EAAK,CAAE,CAAC,eAEpCd,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAwB,gBACpCtB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAER,YAAY,GAAG,aAAa,GAAG,QAAS;IAC9CS,OAAO,EAAE,SAAU;IACnBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACe,MAAM,CAAC,CAAE;IAClCC,QAAQ,EAAEZ;EAAa,CAC1B,CAAC,eACFjB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAE,OAAQ;IACdC,OAAO,EAAE,WAAY;IACrBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACiB,KAAK,CAAC,CAAE;IACjCD,QAAQ,EAAEZ;EAAa,CAC1B,CACA,CAAC,eAENjB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAA0B,gBACtCtB,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,mBAAoB;IAACnB,IAAI,EAAEA;EAAK,CAAE,CAAC,eACrDf,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,gBAAiB;IAACnB,IAAI,EAAEC;EAAc,CAAE,CACzD,CACJ,CAAC;AAEd,CAAC,CAAC;AAEF,MAAMoB,cAAc,GAAGlC,QAAQ,CAAC,MAAM;EAClC,MAAM;IAAEU;EAAiB,CAAC,GAAGT,UAAU,CAACG,gBAAgB,CAAC;EACzD,MAAMO,SAAS,GAAGZ,OAAO,CACrB,MAAM,IAAIS,yBAAyB,CAACE,gBAAgB,CAAC,EACrD,CAACA,gBAAgB,CACrB,CAAC;EAED,MAAM;IAAEE,IAAI;IAAEC,IAAI;IAAEC,aAAa;IAAEC,YAAY;IAAEoB;EAAW,CAAC,GAAGxB,SAAS,CAACO,EAAE;EAE5E,oBACIpB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAA4D,gBACxEtB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAIC,SAAS,EAAE;EAAwB,GAAC,gCAA6B,CAAC,eACtEtB,KAAA,CAAAqB,aAAA;IAAGC,SAAS,EAAE;EAA8B,GAAC,wBACnB,eAAAtB,KAAA,CAAAqB,aAAA,eAAM,cAAkB,CAAC,wEACd,eAAArB,KAAA,CAAAqB,aAAA,eAAM,UAAc,CAAC,kBAAc,EAAC,GAAG,eACxErB,KAAA,CAAAqB,aAAA,eAAM,oBAAwB,CAAC,6CAAyC,EAAC,GAAG,eAC5ErB,KAAA,CAAAqB,aAAA,eAAM,+BAA2C,CAAC,sDACvB,eAAArB,KAAA,CAAAqB,aAAA,eAAM,SAAa,CAAC,8GACgC,EAAC,GAAG,eACnFrB,KAAA,CAAAqB,aAAA,eAAM,WAAe,CAAC,KACvB,CACF,CAAC,eAENrB,KAAA,CAAAqB,aAAA,CAAChB,QAAQ;IAACmB,IAAI,EAAC,MAAM;IAACV,IAAI,EAAEA;EAAK,CAAE,CAAC,EAEnCuB,UAAU,CAACC,MAAM,GAAG,CAAC,iBAClBtC,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAsB,GAAC,aAAgB,CAAC,eACxDtB,KAAA,CAAAqB,aAAA;IAAIC,SAAS,EAAE;EAA4C,GACtDe,UAAU,CAACE,GAAG,CAAC,CAACC,CAAC,EAAEC,CAAC,kBACjBzC,KAAA,CAAAqB,aAAA;IAAIqB,GAAG,EAAED;EAAE,GACND,CAAC,CAACG,IAAI,gBAAG3C,KAAA,CAAAqB,aAAA,eAAOmB,CAAC,CAACG,IAAW,CAAC,GAAG,IAAI,EAAC,GAAC,EAACH,CAAC,CAACM,OAC3C,CACP,CACD,CACH,CACR,eAED9C,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAwB,gBACpCtB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAER,YAAY,GAAG,aAAa,GAAG,QAAS;IAC9CS,OAAO,EAAE,SAAU;IACnBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACe,MAAM,CAAC,CAAE;IAClCC,QAAQ,EAAEZ;EAAa,CAC1B,CAAC,eACFjB,KAAA,CAAAqB,aAAA,CAACjB,MAAM;IACHqB,IAAI,EAAE,OAAQ;IACdC,OAAO,EAAE,WAAY;IACrBC,OAAO,EAAEA,CAAA,KAAMd,SAAS,CAACiB,KAAK,CAAC,CAAE;IACjCD,QAAQ,EAAEZ;EAAa,CAC1B,CACA,CAAC,eAENjB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAA0B,gBACtCtB,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,mBAAoB;IAACnB,IAAI,EAAEA;EAAK,CAAE,CAAC,eACrDf,KAAA,CAAAqB,aAAA,CAACY,SAAS;IAACC,KAAK,EAAE,gBAAiB;IAACnB,IAAI,EAAEC;EAAc,CAAE,CACzD,CACJ,CAAC;AAEd,CAAC,CAAC;AAEF,MAAMiB,SAAS,GAAGA,CAAC;EAAEC,KAAK;EAAEnB;AAAuC,CAAC,KAAK;EACrE,oBACIf,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAuB,gBACnCtB,KAAA,CAAAqB,aAAA;IAAKC,SAAS,EAAE;EAAsB,GAAEY,KAAW,CAAC,eACpDlC,KAAA,CAAAqB,aAAA;IACIC,SAAS,EACL;EACH,GAEAP,IAAI,KAAK,IAAI,GAAG,MAAM,GAAGgC,IAAI,CAACC,SAAS,CAACjC,IAAI,EAAE,IAAI,EAAE,CAAC,CACrD,CACJ,CAAC;AAEd,CAAC","ignoreList":[]}
1	+ {"version":3,"file":"features/formModel/demo/FormModelDemo.js","sources":["../../../../src/features/formModel/demo/FormModelDemo.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { useFeature } from \"@webiny/app\";\nimport { Button } from \"@webiny/admin-ui\";\nimport { FormView } from \"../FormView.js\";\nimport { FormModelFeature } from \"../feature.js\";\nimport { FieldRenderersDemoPresenter } from \"./FieldRenderersDemoPresenter.js\";\nimport { FormModelDemoPresenter } from \"./FormModelDemoPresenter.js\";\nimport { FormModelPhase8c1Presenter } from \"./FormModelPhase8c1Presenter.js\";\nimport { FormModelPhase11Presenter } from \"./FormModelPhase11Presenter.js\";\n\nexport const FormModelDemo = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FormModelDemoPresenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting, runtimeTemplateAdded, textTemplateRemoved } =\n presenter.vm;\n\n return (\n <div className={\"p-lg flex flex-col gap-2xl max-w-4xl mx-auto\"}>\n <FieldRenderersSection />\n\n <div className={\"flex flex-col gap-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>FormModel Demo — Phase 8</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n Exercises the full Phase 8 surface: single-object templates ("Content\n Block"), templated lists ("Page Sections"), per-template\n layouts (Hero spans two rows; Rich Text uses a single row; templates without\n a layout entry fall back to default), and runtime template management via{\" \"}\n <code>field.templates.add/remove</code>. Change Plan to{\" \"}\n <code>enterprise</code> to reveal the "Premium Widget" template in\n the Content Block picker.\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n <Button\n text={\n runtimeTemplateAdded\n ? 'Remove \"Runtime Banner\" from sections'\n : 'Add \"Runtime Banner\" to sections'\n }\n variant={\"tertiary\"}\n onClick={() => presenter.toggleRuntimeTemplate()}\n />\n <Button\n text={\n textTemplateRemoved\n ? 'Restore \"Rich Text\" on content'\n : 'Remove \"Rich Text\" from content'\n }\n variant={\"tertiary\"}\n onClick={() => presenter.toggleTextTemplate()}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n\n <Phase8c1Section />\n\n <Phase11Section />\n </div>\n );\n});\n\nconst FieldRenderersSection = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FieldRenderersDemoPresenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting, formErrors } = presenter.vm;\n\n return (\n <div className={\"flex flex-col gap-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>Field Renderers Showcase</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n All field renderer variants: text, number, boolean, select\n (dropdown/radio/checkboxes), date/time (4 variants), tags, textarea, multi-value\n lists, hidden, and dynamic zones. Renderers not yet implemented show nothing\n (console warning).\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n {formErrors.length > 0 && (\n <div className={\"flex flex-col gap-xs\"}>\n <div className={\"text-sm font-medium\"}>Form errors</div>\n <ul className={\"text-xs text-error-strong list-disc pl-md\"}>\n {formErrors.map((e, i) => (\n <li key={i}>\n {e.path ? (\n <button\n type={\"button\"}\n className={\n \"underline cursor-pointer hover:text-error-default\"\n }\n onClick={() => presenter.focusField(e.path)}\n >\n <code>{e.path}</code>\n </button>\n ) : null}{\" \"}\n {e.message}\n </li>\n ))}\n </ul>\n </div>\n )}\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n );\n});\n\nconst Phase8c1Section = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FormModelPhase8c1Presenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting } = presenter.vm;\n\n return (\n <div className={\"flex flex-col gap-lg border-t border-neutral-dimmed pt-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>FormModel Demo — Phase 8c.1</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n Nested object layouts. A top-level <code>page</code> object whose inner layout\n is split across tabs (General / SEO). The SEO tab contains a nested{\" \"}\n <code>layout.object("seo", ...)</code> with its own row layout, and\n the SEO object itself contains another nested{\" \"}\n <code>layout.object("og", ...)</code> for the Open Graph fields. Phase\n 8c.1 walks the inner layout (including across tabs) and forwards each nested{\" \"}\n <code>layout.object()</code> to the matching child at build time.\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n );\n});\n\nconst Phase11Section = observer(() => {\n const { formModelFactory } = useFeature(FormModelFeature);\n const presenter = useMemo(\n () => new FormModelPhase11Presenter(formModelFactory),\n [formModelFactory]\n );\n\n const { form, data, lastSubmitted, isSubmitting, formErrors } = presenter.vm;\n\n return (\n <div className={\"flex flex-col gap-lg border-t border-neutral-dimmed pt-lg\"}>\n <div className={\"flex flex-col gap-sm\"}>\n <h2 className={\"text-xl font-semibold\"}>FormModel Demo — Phase 11</h2>\n <p className={\"text-sm text-neutral-strong\"}>\n Conditional required (<code>requiredWhen</code> on Seats — chained builder +\n modifier rules), derived fields (<code>computed</code> Full Name and{\" \"}\n <code>computedUntilDirty</code> Slug), modifier-style child addition via{\" \"}\n <code>field.as("object").fields()</code> adding Company/Bio to\n Profile, form-level rules (<code>addRule</code> with a Zod refinement for\n password match plus an imperative slug-length rule), and a layout assembled via{\" \"}\n <code>setLayout</code>.\n </p>\n </div>\n\n <FormView name=\"Demo\" form={form} />\n\n {formErrors.length > 0 && (\n <div className={\"flex flex-col gap-xs\"}>\n <div className={\"text-sm font-medium\"}>Form errors</div>\n <ul className={\"text-xs text-error-strong list-disc pl-md\"}>\n {formErrors.map((e, i) => (\n <li key={i}>\n {e.path ? <code>{e.path}</code> : null} {e.message}\n </li>\n ))}\n </ul>\n </div>\n )}\n\n <div className={\"flex flex-wrap gap-sm\"}>\n <Button\n text={isSubmitting ? \"Submitting…\" : \"Submit\"}\n variant={\"primary\"}\n onClick={() => presenter.submit()}\n disabled={isSubmitting}\n />\n <Button\n text={\"Reset\"}\n variant={\"secondary\"}\n onClick={() => presenter.reset()}\n disabled={isSubmitting}\n />\n </div>\n\n <div className={\"grid grid-cols-2 gap-md\"}>\n <DataPanel title={\"Current getData()\"} data={data} />\n <DataPanel title={\"Last submitted\"} data={lastSubmitted} />\n </div>\n </div>\n );\n});\n\nconst DataPanel = ({ title, data }: { title: string; data: unknown }) => {\n return (\n <div className={\"flex flex-col gap-xs\"}>\n <div className={\"text-sm font-medium\"}>{title}</div>\n <pre\n className={\n \"text-xs bg-neutral-subtle p-sm rounded border border-neutral-dimmed overflow-auto\"\n }\n >\n {data === null ? \"null\" : JSON.stringify(data, null, 2)}\n </pre>\n </div>\n );\n};\n"],"names":["FormModelDemo","observer","formModelFactory","useFeature","FormModelFeature","presenter","useMemo","FormModelDemoPresenter","form","data","lastSubmitted","isSubmitting","runtimeTemplateAdded","textTemplateRemoved","FieldRenderersSection","FormView","Button","DataPanel","Phase8c1Section","Phase11Section","FieldRenderersDemoPresenter","formErrors","e","i","FormModelPhase8c1Presenter","FormModelPhase11Presenter","title","JSON"],"mappings":"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"}