@webiny/app-website-builder 6.3.0-beta.2 → 6.3.0-beta.4

package/modules/pages/PageEditor/PageSettings/groups/SocialSettingsGroup.js

@@ -0,0 +1,44 @@
+import { PageSettingsGroup } from "../abstractions.js";
+class SocialSettingsGroupImpl {
+  name = "social";
+  label = "Social";
+  description = "Control how this page is previewed when shared on social media.";
+  icon = {
+    type: "icon",
+    name: "fas/thumbs-up"
+  };
+  buildForm(form) {
+    form.fields(fields => ({
+      title: fields.text().label("Title").description("Title for social platforms (og:title)"),
+      description: fields.text().label("Description").description("Description for social platforms (og:description)").renderer("textarea"),
+      image: fields.file().label("Image").description("Select an image for social platforms (og:image)"),
+      metaTags: fields.object().label("Meta Tags").description("Add more Open Graph tags").renderer("keyValueTags").fields(f => ({
+        property: f.text().placeholder("Property"),
+        content: f.text().placeholder("Content")
+      })).list()
+    }));
+    form.layout(layout => [layout.row("title"), layout.row("description"), layout.row("image"), layout.row("metaTags")]);
+  }
+  mapToForm(doc) {
+    const social = doc.properties?.social ?? {};
+    return {
+      title: social.title,
+      description: social.description,
+      image: social.image,
+      metaTags: social.metaTags
+    };
+  }
+  mapFromForm(formData, doc) {
+    doc.properties.social = doc.properties.social ?? {};
+    doc.properties.social.title = formData.title;
+    doc.properties.social.description = formData.description;
+    doc.properties.social.image = formData.image;
+    doc.properties.social.metaTags = formData.metaTags;
+  }
+}
+export const SocialSettingsGroup = PageSettingsGroup.createImplementation({
+  implementation: SocialSettingsGroupImpl,
+  dependencies: []
+});
+
+//# sourceMappingURL=SocialSettingsGroup.js.map

package/modules/pages/PageEditor/PageSettings/groups/SocialSettingsGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PageSettingsGroup","SocialSettingsGroupImpl","name","label","description","icon","type","buildForm","form","fields","title","text","renderer","image","file","metaTags","object","f","property","placeholder","content","list","layout","row","mapToForm","doc","social","properties","mapFromForm","formData","SocialSettingsGroup","createImplementation","implementation","dependencies"],"sources":["SocialSettingsGroup.ts"],"sourcesContent":["import { PageSettingsGroup } from \"../abstractions.js\";\n\nclass SocialSettingsGroupImpl implements PageSettingsGroup.Interface {\n    name = \"social\";\n    label = \"Social\";\n    description = \"Control how this page is previewed when shared on social media.\";\n    icon = { type: \"icon\", name: \"fas/thumbs-up\" };\n\n    buildForm(form: PageSettingsGroup.FormBuilder): void {\n        form.fields(fields => ({\n            title: fields\n                .text()\n                .label(\"Title\")\n                .description(\"Title for social platforms (og:title)\"),\n            description: fields\n                .text()\n                .label(\"Description\")\n                .description(\"Description for social platforms (og:description)\")\n                .renderer(\"textarea\"),\n            image: fields\n                .file()\n                .label(\"Image\")\n                .description(\"Select an image for social platforms (og:image)\"),\n            metaTags: fields\n                .object()\n                .label(\"Meta Tags\")\n                .description(\"Add more Open Graph tags\")\n                .renderer(\"keyValueTags\")\n                .fields(f => ({\n                    property: f.text().placeholder(\"Property\"),\n                    content: f.text().placeholder(\"Content\")\n                }))\n                .list()\n        }));\n\n        form.layout(layout => [\n            layout.row(\"title\"),\n            layout.row(\"description\"),\n            layout.row(\"image\"),\n            layout.row(\"metaTags\")\n        ]);\n    }\n\n    mapToForm(doc: PageSettingsGroup.PageDocument): Record<string, any> {\n        const social = doc.properties?.social ?? {};\n        return {\n            title: social.title,\n            description: social.description,\n            image: social.image,\n            metaTags: social.metaTags\n        };\n    }\n\n    mapFromForm(formData: Record<string, any>, doc: PageSettingsGroup.PageDocument): void {\n        doc.properties.social = doc.properties.social ?? {};\n        doc.properties.social.title = formData.title;\n        doc.properties.social.description = formData.description;\n        doc.properties.social.image = formData.image;\n        doc.properties.social.metaTags = formData.metaTags;\n    }\n}\n\nexport const SocialSettingsGroup = PageSettingsGroup.createImplementation({\n    implementation: SocialSettingsGroupImpl,\n    dependencies: []\n});\n"],"mappings":"AAAA,SAASA,iBAAiB;AAE1B,MAAMC,uBAAuB,CAAwC;EACjEC,IAAI,GAAG,QAAQ;EACfC,KAAK,GAAG,QAAQ;EAChBC,WAAW,GAAG,iEAAiE;EAC/EC,IAAI,GAAG;IAAEC,IAAI,EAAE,MAAM;IAAEJ,IAAI,EAAE;EAAgB,CAAC;EAE9CK,SAASA,CAACC,IAAmC,EAAQ;IACjDA,IAAI,CAACC,MAAM,CAACA,MAAM,KAAK;MACnBC,KAAK,EAAED,MAAM,CACRE,IAAI,CAAC,CAAC,CACNR,KAAK,CAAC,OAAO,CAAC,CACdC,WAAW,CAAC,uCAAuC,CAAC;MACzDA,WAAW,EAAEK,MAAM,CACdE,IAAI,CAAC,CAAC,CACNR,KAAK,CAAC,aAAa,CAAC,CACpBC,WAAW,CAAC,mDAAmD,CAAC,CAChEQ,QAAQ,CAAC,UAAU,CAAC;MACzBC,KAAK,EAAEJ,MAAM,CACRK,IAAI,CAAC,CAAC,CACNX,KAAK,CAAC,OAAO,CAAC,CACdC,WAAW,CAAC,iDAAiD,CAAC;MACnEW,QAAQ,EAAEN,MAAM,CACXO,MAAM,CAAC,CAAC,CACRb,KAAK,CAAC,WAAW,CAAC,CAClBC,WAAW,CAAC,0BAA0B,CAAC,CACvCQ,QAAQ,CAAC,cAAc,CAAC,CACxBH,MAAM,CAACQ,CAAC,KAAK;QACVC,QAAQ,EAAED,CAAC,CAACN,IAAI,CAAC,CAAC,CAACQ,WAAW,CAAC,UAAU,CAAC;QAC1CC,OAAO,EAAEH,CAAC,CAACN,IAAI,CAAC,CAAC,CAACQ,WAAW,CAAC,SAAS;MAC3C,CAAC,CAAC,CAAC,CACFE,IAAI,CAAC;IACd,CAAC,CAAC,CAAC;IAEHb,IAAI,CAACc,MAAM,CAACA,MAAM,IAAI,CAClBA,MAAM,CAACC,GAAG,CAAC,OAAO,CAAC,EACnBD,MAAM,CAACC,GAAG,CAAC,aAAa,CAAC,EACzBD,MAAM,CAACC,GAAG,CAAC,OAAO,CAAC,EACnBD,MAAM,CAACC,GAAG,CAAC,UAAU,CAAC,CACzB,CAAC;EACN;EAEAC,SAASA,CAACC,GAAmC,EAAuB;IAChE,MAAMC,MAAM,GAAGD,GAAG,CAACE,UAAU,EAAED,MAAM,IAAI,CAAC,CAAC;IAC3C,OAAO;MACHhB,KAAK,EAAEgB,MAAM,CAAChB,KAAK;MACnBN,WAAW,EAAEsB,MAAM,CAACtB,WAAW;MAC/BS,KAAK,EAAEa,MAAM,CAACb,KAAK;MACnBE,QAAQ,EAAEW,MAAM,CAACX;IACrB,CAAC;EACL;EAEAa,WAAWA,CAACC,QAA6B,EAAEJ,GAAmC,EAAQ;IAClFA,GAAG,CAACE,UAAU,CAACD,MAAM,GAAGD,GAAG,CAACE,UAAU,CAACD,MAAM,IAAI,CAAC,CAAC;IACnDD,GAAG,CAACE,UAAU,CAACD,MAAM,CAAChB,KAAK,GAAGmB,QAAQ,CAACnB,KAAK;IAC5Ce,GAAG,CAACE,UAAU,CAACD,MAAM,CAACtB,WAAW,GAAGyB,QAAQ,CAACzB,WAAW;IACxDqB,GAAG,CAACE,UAAU,CAACD,MAAM,CAACb,KAAK,GAAGgB,QAAQ,CAAChB,KAAK;IAC5CY,GAAG,CAACE,UAAU,CAACD,MAAM,CAACX,QAAQ,GAAGc,QAAQ,CAACd,QAAQ;EACtD;AACJ;AAEA,OAAO,MAAMe,mBAAmB,GAAG9B,iBAAiB,CAAC+B,oBAAoB,CAAC;EACtEC,cAAc,EAAE/B,uBAAuB;EACvCgC,YAAY,EAAE;AAClB,CAAC,CAAC","ignoreList":[]}

package/modules/pages/PageEditor/PageSettings/index.d.ts

@@ -0,0 +1,3 @@
+export { PageSettingsPresenter } from "./abstractions.js";
+export { PageSettingsGroup } from "./abstractions.js";
+export { PageSettingsGroupModifier } from "./abstractions.js";

package/modules/pages/PageEditor/PageSettings/index.js

@@ -0,0 +1,5 @@
+export { PageSettingsPresenter } from "./abstractions.js";
+export { PageSettingsGroup } from "./abstractions.js";
+export { PageSettingsGroupModifier } from "./abstractions.js";
+
+//# sourceMappingURL=index.js.map

package/modules/pages/PageEditor/PageSettings/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["PageSettingsPresenter","PageSettingsGroup","PageSettingsGroupModifier"],"sources":["index.ts"],"sourcesContent":["export { PageSettingsPresenter } from \"./abstractions.js\";\nexport { PageSettingsGroup } from \"./abstractions.js\";\nexport { PageSettingsGroupModifier } from \"./abstractions.js\";\n"],"mappings":"AAAA,SAASA,qBAAqB;AAC9B,SAASC,iBAAiB;AAC1B,SAASC,yBAAyB","ignoreList":[]}

package/modules/pages/PageEditor/TopBar/PageSettingsDrawer.d.ts

@@ -0,0 +1,11 @@
+import React from "react";
+import type { PageSettingsPresenter } from "../../../../modules/pages/PageEditor/PageSettings/index.js";
+export interface PageSettingsDrawerProps {
+    presenter: PageSettingsPresenter.Interface;
+    open: boolean;
+    onClose: () => void;
+    onSave: () => void;
+}
+export declare const PageSettingsDrawer: (({ presenter, open, onClose, onSave }: PageSettingsDrawerProps) => React.JSX.Element) & {
+    displayName: string;
+};

package/modules/pages/PageEditor/TopBar/PageSettingsDrawer.js

@@ -0,0 +1,35 @@
+import React from "react";
+import { observer } from "mobx-react-lite";
+import { FormView } from "@webiny/app-admin";
+import { Drawer } from "@webiny/admin-ui";
+export const PageSettingsDrawer = observer(({
+  presenter,
+  open,
+  onClose,
+  onSave
+}) => {
+  const vm = presenter.vm;
+  return /*#__PURE__*/React.createElement(Drawer, {
+    open: open,
+    onClose: onClose,
+    modal: true,
+    width: 900,
+    bodyPadding: false,
+    title: "Page Settings",
+    actions: /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Drawer.CancelButton, {
+      text: "Cancel"
+    }), /*#__PURE__*/React.createElement(Drawer.ConfirmButton, {
+      onClick: onSave,
+      text: "Save Settings"
+    })),
+    headerSeparator: true,
+    footerSeparator: true,
+    className: "flex flex-col"
+  }, vm.error ? /*#__PURE__*/React.createElement("div", {
+    className: "text-destructive-default text-sm p-md"
+  }, vm.error) : null, vm.form ? /*#__PURE__*/React.createElement(FormView, {
+    form: vm.form
+  }) : null);
+});
+
+//# sourceMappingURL=PageSettingsDrawer.js.map

package/modules/pages/PageEditor/TopBar/PageSettingsDrawer.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","observer","FormView","Drawer","PageSettingsDrawer","presenter","open","onClose","onSave","vm","createElement","modal","width","bodyPadding","title","actions","Fragment","CancelButton","text","ConfirmButton","onClick","headerSeparator","footerSeparator","className","error","form"],"sources":["PageSettingsDrawer.tsx"],"sourcesContent":["import React from \"react\";\nimport { observer } from \"mobx-react-lite\";\nimport { FormView } from \"@webiny/app-admin\";\nimport { Drawer } from \"@webiny/admin-ui\";\nimport type { PageSettingsPresenter } from \"~/modules/pages/PageEditor/PageSettings/index.js\";\n\nexport interface PageSettingsDrawerProps {\n    presenter: PageSettingsPresenter.Interface;\n    open: boolean;\n    onClose: () => void;\n    onSave: () => void;\n}\n\nexport const PageSettingsDrawer = observer(\n    ({ presenter, open, onClose, onSave }: PageSettingsDrawerProps) => {\n        const vm = presenter.vm;\n\n        return (\n            <Drawer\n                open={open}\n                onClose={onClose}\n                modal={true}\n                width={900}\n                bodyPadding={false}\n                title={\"Page Settings\"}\n                actions={\n                    <>\n                        <Drawer.CancelButton text={\"Cancel\"} />\n                        <Drawer.ConfirmButton onClick={onSave} text={\"Save Settings\"} />\n                    </>\n                }\n                headerSeparator={true}\n                footerSeparator={true}\n                className={\"flex flex-col\"}\n            >\n                {vm.error ? (\n                    <div className=\"text-destructive-default text-sm p-md\">{vm.error}</div>\n                ) : null}\n                {vm.form ? <FormView form={vm.form} /> : null}\n            </Drawer>\n        );\n    }\n);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,QAAQ,QAAQ,mBAAmB;AAC5C,SAASC,MAAM,QAAQ,kBAAkB;AAUzC,OAAO,MAAMC,kBAAkB,GAAGH,QAAQ,CACtC,CAAC;EAAEI,SAAS;EAAEC,IAAI;EAAEC,OAAO;EAAEC;AAAgC,CAAC,KAAK;EAC/D,MAAMC,EAAE,GAAGJ,SAAS,CAACI,EAAE;EAEvB,oBACIT,KAAA,CAAAU,aAAA,CAACP,MAAM;IACHG,IAAI,EAAEA,IAAK;IACXC,OAAO,EAAEA,OAAQ;IACjBI,KAAK,EAAE,IAAK;IACZC,KAAK,EAAE,GAAI;IACXC,WAAW,EAAE,KAAM;IACnBC,KAAK,EAAE,eAAgB;IACvBC,OAAO,eACHf,KAAA,CAAAU,aAAA,CAAAV,KAAA,CAAAgB,QAAA,qBACIhB,KAAA,CAAAU,aAAA,CAACP,MAAM,CAACc,YAAY;MAACC,IAAI,EAAE;IAAS,CAAE,CAAC,eACvClB,KAAA,CAAAU,aAAA,CAACP,MAAM,CAACgB,aAAa;MAACC,OAAO,EAAEZ,MAAO;MAACU,IAAI,EAAE;IAAgB,CAAE,CACjE,CACL;IACDG,eAAe,EAAE,IAAK;IACtBC,eAAe,EAAE,IAAK;IACtBC,SAAS,EAAE;EAAgB,GAE1Bd,EAAE,CAACe,KAAK,gBACLxB,KAAA,CAAAU,aAAA;IAAKa,SAAS,EAAC;EAAuC,GAAEd,EAAE,CAACe,KAAW,CAAC,GACvE,IAAI,EACPf,EAAE,CAACgB,IAAI,gBAAGzB,KAAA,CAAAU,aAAA,CAACR,QAAQ;IAACuB,IAAI,EAAEhB,EAAE,CAACgB;EAAK,CAAE,CAAC,GAAG,IACrC,CAAC;AAEjB,CACJ,CAAC","ignoreList":[]}

package/modules/pages/PageEditor/TopBar/SettingsButton.d.ts

@@ -1,8 +1,2 @@
 import React from "react";
-export interface PageSettingsOverlayProps {
-    open: boolean;
-    data: Record<string, any>;
-    onClose: () => void;
-    onSave: (data: Record<string, any>) => void;
-}
 export declare const SettingsButton: () => React.JSX.Element;

package/modules/pages/PageEditor/TopBar/SettingsButton.js

@@ -3,31 +3,17 @@ import React, { useCallback, useState } from "react";
 import { IconButton } from "@webiny/admin-ui";
 import { useHotkeys } from "@webiny/app-admin";
 import { ReactComponent as SettingsIcon } from "@webiny/icons/settings.svg";
+import { useFeature } from "@webiny/app";
 import { useDocumentEditor } from "../../../../DocumentEditor/index.js";
 import { useSelectFromDocument } from "../../../../BaseEditor/hooks/useSelectFromDocument.js";
-import { usePageEditorConfig } from "../usePageEditorConfig.js";
-import { PageSettingsDrawer } from "./Settings/PageSettingsDrawer.js";
-import { PageSettingsDialog } from "./Settings/PageSettingsDialog.js";
+import { PageSettingsFeature } from "../PageSettings/feature.js";
+import { PageSettingsDrawer } from "./PageSettingsDrawer.js";
 export const SettingsButton = () => {
   const editor = useDocumentEditor();
   const {
-    pageSettings
-  } = usePageEditorConfig();
+    presenter
+  } = useFeature(PageSettingsFeature);
   const [isOverlayOpen, setOverlayOpen] = useState(false);
-  const openOverlay = useCallback(() => {
-    setOverlayOpen(() => true);
-  }, []);
-  const closeOverlay = useCallback(() => {
-    setOverlayOpen(() => false);
-  }, []);
-  const saveSettings = useCallback(data => {
-    editor.updateDocument(document => {
-      document.properties = observable(data.properties);
-      document.metadata = observable(data.metadata);
-      document.extensions = observable(data.extensions);
-    });
-    closeOverlay();
-  }, []);
   const formData = useSelectFromDocument(document => {
     return structuredClone({
       properties: toJS(document.properties),
@@ -35,6 +21,24 @@ export const SettingsButton = () => {
       extensions: toJS(document.extensions)
     });
   });
+  const openOverlay = useCallback(() => {
+    presenter.init(formData);
+    setOverlayOpen(true);
+  }, [formData]);
+  const closeOverlay = useCallback(() => {
+    setOverlayOpen(false);
+  }, []);
+  const saveSettings = useCallback(async () => {
+    const result = await presenter.submit();
+    if (result) {
+      editor.updateDocument(document => {
+        document.properties = observable(result.properties);
+        document.metadata = observable(result.metadata);
+        document.extensions = observable(result.extensions);
+      });
+      closeOverlay();
+    }
+  }, []);
   useHotkeys({
     zIndex: 55,
     disabled: !isOverlayOpen,
@@ -42,19 +46,18 @@ export const SettingsButton = () => {
       esc: closeOverlay
     }
   });
-  const props = {
-    open: isOverlayOpen,
-    onClose: closeOverlay,
-    data: formData,
-    onSave: saveSettings
-  };
   return /*#__PURE__*/React.createElement("div", {
     className: "flex gap-x-sm"
   }, /*#__PURE__*/React.createElement(IconButton, {
     variant: "ghost",
     icon: /*#__PURE__*/React.createElement(SettingsIcon, null),
     onClick: openOverlay
-  }), pageSettings.viewMode === "dialog" ? /*#__PURE__*/React.createElement(PageSettingsDialog, props) : null, pageSettings.viewMode === "drawer" ? /*#__PURE__*/React.createElement(PageSettingsDrawer, props) : null);
+  }), /*#__PURE__*/React.createElement(PageSettingsDrawer, {
+    presenter: presenter,
+    open: isOverlayOpen,
+    onClose: closeOverlay,
+    onSave: saveSettings
+  }));
 };
 
 //# sourceMappingURL=SettingsButton.js.map

package/modules/pages/PageEditor/TopBar/SettingsButton.js.map

@@ -1 +1 @@
-{"version":3,"names":["observable","toJS","React","useCallback","useState","IconButton","useHotkeys","ReactComponent","SettingsIcon","useDocumentEditor","useSelectFromDocument","usePageEditorConfig","PageSettingsDrawer","PageSettingsDialog","SettingsButton","editor","pageSettings","isOverlayOpen","setOverlayOpen","openOverlay","closeOverlay","saveSettings","data","updateDocument","document","properties","metadata","extensions","formData","structuredClone","zIndex","disabled","keys","esc","props","open","onClose","onSave","createElement","className","variant","icon","onClick","viewMode"],"sources":["SettingsButton.tsx"],"sourcesContent":["import { observable, toJS } from \"mobx\";\nimport React, { useCallback, useState } from \"react\";\nimport { IconButton } from \"@webiny/admin-ui\";\nimport { useHotkeys } from \"@webiny/app-admin\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport type { GenericFormData } from \"@webiny/form\";\nimport { useDocumentEditor } from \"~/DocumentEditor/index.js\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument.js\";\nimport { usePageEditorConfig } from \"~/modules/pages/PageEditor/usePageEditorConfig.js\";\nimport { PageSettingsDrawer } from \"./Settings/PageSettingsDrawer.js\";\nimport { PageSettingsDialog } from \"./Settings/PageSettingsDialog.js\";\n\nexport interface PageSettingsOverlayProps {\n    open: boolean;\n    data: Record<string, any>;\n    onClose: () => void;\n    onSave: (data: Record<string, any>) => void;\n}\n\nexport const SettingsButton = () => {\n    const editor = useDocumentEditor();\n    const { pageSettings } = usePageEditorConfig();\n    const [isOverlayOpen, setOverlayOpen] = useState(false);\n\n    const openOverlay = useCallback(() => {\n        setOverlayOpen(() => true);\n    }, []);\n\n    const closeOverlay = useCallback(() => {\n        setOverlayOpen(() => false);\n    }, []);\n\n    const saveSettings = useCallback((data: GenericFormData) => {\n        editor.updateDocument(document => {\n            document.properties = observable(data.properties);\n            document.metadata = observable(data.metadata);\n            document.extensions = observable(data.extensions);\n        });\n        closeOverlay();\n    }, []);\n\n    const formData = useSelectFromDocument(document => {\n        return structuredClone({\n            properties: toJS(document.properties),\n            metadata: toJS(document.metadata),\n            extensions: toJS(document.extensions)\n        });\n    });\n\n    useHotkeys({\n        zIndex: 55,\n        disabled: !isOverlayOpen,\n        keys: {\n            esc: closeOverlay\n        }\n    });\n\n    const props: PageSettingsOverlayProps = {\n        open: isOverlayOpen,\n        onClose: closeOverlay,\n        data: formData,\n        onSave: saveSettings\n    };\n\n    return (\n        <div className={\"flex gap-x-sm\"}>\n            <IconButton variant=\"ghost\" icon={<SettingsIcon />} onClick={openOverlay} />\n            {pageSettings.viewMode === \"dialog\" ? <PageSettingsDialog {...props} /> : null}\n            {pageSettings.viewMode === \"drawer\" ? <PageSettingsDrawer {...props} /> : null}\n        </div>\n    );\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,IAAI,QAAQ,MAAM;AACvC,OAAOC,KAAK,IAAIC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACpD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,UAAU,QAAQ,mBAAmB;AAC9C,SAASC,cAAc,IAAIC,YAAY,QAAQ,4BAA4B;AAE3E,SAASC,iBAAiB;AAC1B,SAASC,qBAAqB;AAC9B,SAASC,mBAAmB;AAC5B,SAASC,kBAAkB;AAC3B,SAASC,kBAAkB;AAS3B,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAChC,MAAMC,MAAM,GAAGN,iBAAiB,CAAC,CAAC;EAClC,MAAM;IAAEO;EAAa,CAAC,GAAGL,mBAAmB,CAAC,CAAC;EAC9C,MAAM,CAACM,aAAa,EAAEC,cAAc,CAAC,GAAGd,QAAQ,CAAC,KAAK,CAAC;EAEvD,MAAMe,WAAW,GAAGhB,WAAW,CAAC,MAAM;IAClCe,cAAc,CAAC,MAAM,IAAI,CAAC;EAC9B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAME,YAAY,GAAGjB,WAAW,CAAC,MAAM;IACnCe,cAAc,CAAC,MAAM,KAAK,CAAC;EAC/B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMG,YAAY,GAAGlB,WAAW,CAAEmB,IAAqB,IAAK;IACxDP,MAAM,CAACQ,cAAc,CAACC,QAAQ,IAAI;MAC9BA,QAAQ,CAACC,UAAU,GAAGzB,UAAU,CAACsB,IAAI,CAACG,UAAU,CAAC;MACjDD,QAAQ,CAACE,QAAQ,GAAG1B,UAAU,CAACsB,IAAI,CAACI,QAAQ,CAAC;MAC7CF,QAAQ,CAACG,UAAU,GAAG3B,UAAU,CAACsB,IAAI,CAACK,UAAU,CAAC;IACrD,CAAC,CAAC;IACFP,YAAY,CAAC,CAAC;EAClB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMQ,QAAQ,GAAGlB,qBAAqB,CAACc,QAAQ,IAAI;IAC/C,OAAOK,eAAe,CAAC;MACnBJ,UAAU,EAAExB,IAAI,CAACuB,QAAQ,CAACC,UAAU,CAAC;MACrCC,QAAQ,EAAEzB,IAAI,CAACuB,QAAQ,CAACE,QAAQ,CAAC;MACjCC,UAAU,EAAE1B,IAAI,CAACuB,QAAQ,CAACG,UAAU;IACxC,CAAC,CAAC;EACN,CAAC,CAAC;EAEFrB,UAAU,CAAC;IACPwB,MAAM,EAAE,EAAE;IACVC,QAAQ,EAAE,CAACd,aAAa;IACxBe,IAAI,EAAE;MACFC,GAAG,EAAEb;IACT;EACJ,CAAC,CAAC;EAEF,MAAMc,KAA+B,GAAG;IACpCC,IAAI,EAAElB,aAAa;IACnBmB,OAAO,EAAEhB,YAAY;IACrBE,IAAI,EAAEM,QAAQ;IACdS,MAAM,EAAEhB;EACZ,CAAC;EAED,oBACInB,KAAA,CAAAoC,aAAA;IAAKC,SAAS,EAAE;EAAgB,gBAC5BrC,KAAA,CAAAoC,aAAA,CAACjC,UAAU;IAACmC,OAAO,EAAC,OAAO;IAACC,IAAI,eAAEvC,KAAA,CAAAoC,aAAA,CAAC9B,YAAY,MAAE,CAAE;IAACkC,OAAO,EAAEvB;EAAY,CAAE,CAAC,EAC3EH,YAAY,CAAC2B,QAAQ,KAAK,QAAQ,gBAAGzC,KAAA,CAAAoC,aAAA,CAACzB,kBAAkB,EAAKqB,KAAQ,CAAC,GAAG,IAAI,EAC7ElB,YAAY,CAAC2B,QAAQ,KAAK,QAAQ,gBAAGzC,KAAA,CAAAoC,aAAA,CAAC1B,kBAAkB,EAAKsB,KAAQ,CAAC,GAAG,IACzE,CAAC;AAEd,CAAC","ignoreList":[]}
+{"version":3,"names":["observable","toJS","React","useCallback","useState","IconButton","useHotkeys","ReactComponent","SettingsIcon","useFeature","useDocumentEditor","useSelectFromDocument","PageSettingsFeature","PageSettingsDrawer","SettingsButton","editor","presenter","isOverlayOpen","setOverlayOpen","formData","document","structuredClone","properties","metadata","extensions","openOverlay","init","closeOverlay","saveSettings","result","submit","updateDocument","zIndex","disabled","keys","esc","createElement","className","variant","icon","onClick","open","onClose","onSave"],"sources":["SettingsButton.tsx"],"sourcesContent":["import { observable, toJS } from \"mobx\";\nimport React, { useCallback, useState } from \"react\";\nimport { IconButton } from \"@webiny/admin-ui\";\nimport { useHotkeys } from \"@webiny/app-admin\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport { useFeature } from \"@webiny/app\";\nimport { useDocumentEditor } from \"~/DocumentEditor/index.js\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument.js\";\nimport { PageSettingsFeature } from \"~/modules/pages/PageEditor/PageSettings/feature.js\";\nimport { PageSettingsDrawer } from \"./PageSettingsDrawer.js\";\nimport { PageSettingsGroup } from \"~/modules/pages/PageEditor/PageSettings/index.js\";\n\nexport const SettingsButton = () => {\n    const editor = useDocumentEditor();\n    const { presenter } = useFeature(PageSettingsFeature);\n    const [isOverlayOpen, setOverlayOpen] = useState(false);\n\n    const formData = useSelectFromDocument(document => {\n        return structuredClone({\n            properties: toJS(document.properties),\n            metadata: toJS(document.metadata),\n            extensions: toJS(document.extensions)\n        }) as PageSettingsGroup.PageDocument;\n    });\n\n    const openOverlay = useCallback(() => {\n        presenter.init(formData);\n        setOverlayOpen(true);\n    }, [formData]);\n\n    const closeOverlay = useCallback(() => {\n        setOverlayOpen(false);\n    }, []);\n\n    const saveSettings = useCallback(async () => {\n        const result = await presenter.submit();\n        if (result) {\n            editor.updateDocument(document => {\n                document.properties = observable(result.properties);\n                document.metadata = observable(result.metadata);\n                document.extensions = observable(result.extensions);\n            });\n            closeOverlay();\n        }\n    }, []);\n\n    useHotkeys({\n        zIndex: 55,\n        disabled: !isOverlayOpen,\n        keys: {\n            esc: closeOverlay\n        }\n    });\n\n    return (\n        <div className={\"flex gap-x-sm\"}>\n            <IconButton variant=\"ghost\" icon={<SettingsIcon />} onClick={openOverlay} />\n            <PageSettingsDrawer\n                presenter={presenter}\n                open={isOverlayOpen}\n                onClose={closeOverlay}\n                onSave={saveSettings}\n            />\n        </div>\n    );\n};\n"],"mappings":"AAAA,SAASA,UAAU,EAAEC,IAAI,QAAQ,MAAM;AACvC,OAAOC,KAAK,IAAIC,WAAW,EAAEC,QAAQ,QAAQ,OAAO;AACpD,SAASC,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,UAAU,QAAQ,mBAAmB;AAC9C,SAASC,cAAc,IAAIC,YAAY,QAAQ,4BAA4B;AAC3E,SAASC,UAAU,QAAQ,aAAa;AACxC,SAASC,iBAAiB;AAC1B,SAASC,qBAAqB;AAC9B,SAASC,mBAAmB;AAC5B,SAASC,kBAAkB;AAG3B,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAChC,MAAMC,MAAM,GAAGL,iBAAiB,CAAC,CAAC;EAClC,MAAM;IAAEM;EAAU,CAAC,GAAGP,UAAU,CAACG,mBAAmB,CAAC;EACrD,MAAM,CAACK,aAAa,EAAEC,cAAc,CAAC,GAAGd,QAAQ,CAAC,KAAK,CAAC;EAEvD,MAAMe,QAAQ,GAAGR,qBAAqB,CAACS,QAAQ,IAAI;IAC/C,OAAOC,eAAe,CAAC;MACnBC,UAAU,EAAErB,IAAI,CAACmB,QAAQ,CAACE,UAAU,CAAC;MACrCC,QAAQ,EAAEtB,IAAI,CAACmB,QAAQ,CAACG,QAAQ,CAAC;MACjCC,UAAU,EAAEvB,IAAI,CAACmB,QAAQ,CAACI,UAAU;IACxC,CAAC,CAAC;EACN,CAAC,CAAC;EAEF,MAAMC,WAAW,GAAGtB,WAAW,CAAC,MAAM;IAClCa,SAAS,CAACU,IAAI,CAACP,QAAQ,CAAC;IACxBD,cAAc,CAAC,IAAI,CAAC;EACxB,CAAC,EAAE,CAACC,QAAQ,CAAC,CAAC;EAEd,MAAMQ,YAAY,GAAGxB,WAAW,CAAC,MAAM;IACnCe,cAAc,CAAC,KAAK,CAAC;EACzB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMU,YAAY,GAAGzB,WAAW,CAAC,YAAY;IACzC,MAAM0B,MAAM,GAAG,MAAMb,SAAS,CAACc,MAAM,CAAC,CAAC;IACvC,IAAID,MAAM,EAAE;MACRd,MAAM,CAACgB,cAAc,CAACX,QAAQ,IAAI;QAC9BA,QAAQ,CAACE,UAAU,GAAGtB,UAAU,CAAC6B,MAAM,CAACP,UAAU,CAAC;QACnDF,QAAQ,CAACG,QAAQ,GAAGvB,UAAU,CAAC6B,MAAM,CAACN,QAAQ,CAAC;QAC/CH,QAAQ,CAACI,UAAU,GAAGxB,UAAU,CAAC6B,MAAM,CAACL,UAAU,CAAC;MACvD,CAAC,CAAC;MACFG,YAAY,CAAC,CAAC;IAClB;EACJ,CAAC,EAAE,EAAE,CAAC;EAENrB,UAAU,CAAC;IACP0B,MAAM,EAAE,EAAE;IACVC,QAAQ,EAAE,CAAChB,aAAa;IACxBiB,IAAI,EAAE;MACFC,GAAG,EAAER;IACT;EACJ,CAAC,CAAC;EAEF,oBACIzB,KAAA,CAAAkC,aAAA;IAAKC,SAAS,EAAE;EAAgB,gBAC5BnC,KAAA,CAAAkC,aAAA,CAAC/B,UAAU;IAACiC,OAAO,EAAC,OAAO;IAACC,IAAI,eAAErC,KAAA,CAAAkC,aAAA,CAAC5B,YAAY,MAAE,CAAE;IAACgC,OAAO,EAAEf;EAAY,CAAE,CAAC,eAC5EvB,KAAA,CAAAkC,aAAA,CAACvB,kBAAkB;IACfG,SAAS,EAAEA,SAAU;IACrByB,IAAI,EAAExB,aAAc;IACpByB,OAAO,EAAEf,YAAa;IACtBgB,MAAM,EAAEf;EAAa,CACxB,CACA,CAAC;AAEd,CAAC","ignoreList":[]}

package/modules/pages/PageEditor/usePageEditorConfig.d.ts

@@ -1,20 +1,4 @@
-export interface PageSettingsElementConfig {
-    name: string;
-    element: JSX.Element;
-}
-export interface PageSettingsGroupConfig {
-    name: string;
-    title?: string;
-    description?: string;
-    icon?: React.ReactNode;
-    elements: PageSettingsElementConfig[];
-}
-export interface EditorPageSettings {
-    groups: PageSettingsGroupConfig[];
-    viewMode: "dialog" | "drawer";
-}
-interface PageEditorConfig {
-    pageSettings: EditorPageSettings;
-}
-export declare const usePageEditorConfig: () => PageEditorConfig;
-export {};
+export declare const usePageEditorConfig: () => {
+    elements: import("../../../BaseEditor/config/Element").ElementConfig[];
+    inputRenderers: import("../../../BaseEditor/config/ElementInput").ElementInputConfig[];
+} & Omit<import("~/BaseEditor/index.js").EditorConfig, "elements" | "inputRenderers">;

package/modules/pages/PageEditor/usePageEditorConfig.js

@@ -1,13 +1,6 @@
 import { useEditorConfig } from "../../../BaseEditor/index.js";
 export const usePageEditorConfig = () => {
-  const config = useEditorConfig();
-  return {
-    ...config,
-    pageSettings: {
-      groups: config.pageSettings.groups ?? [],
-      viewMode: config.pageSettings.viewMode ?? "dialog"
-    }
-  };
+  return useEditorConfig();
 };
 
 //# sourceMappingURL=usePageEditorConfig.js.map

package/modules/pages/PageEditor/usePageEditorConfig.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEditorConfig","usePageEditorConfig","config","pageSettings","groups","viewMode"],"sources":["usePageEditorConfig.ts"],"sourcesContent":["import { useEditorConfig } from \"~/BaseEditor/index.js\";\n\nexport interface PageSettingsElementConfig {\n    name: string;\n    element: JSX.Element;\n}\n\nexport interface PageSettingsGroupConfig {\n    name: string;\n    title?: string;\n    description?: string;\n    icon?: React.ReactNode;\n    elements: PageSettingsElementConfig[];\n}\n\nexport interface EditorPageSettings {\n    groups: PageSettingsGroupConfig[];\n    viewMode: \"dialog\" | \"drawer\";\n}\n\ninterface PageEditorConfig {\n    pageSettings: EditorPageSettings;\n}\n\nexport const usePageEditorConfig = (): PageEditorConfig => {\n    const config = useEditorConfig<PageEditorConfig>();\n\n    return {\n        ...config,\n        pageSettings: {\n            groups: config.pageSettings.groups ?? [],\n            viewMode: config.pageSettings.viewMode ?? \"dialog\"\n        }\n    };\n};\n"],"mappings":"AAAA,SAASA,eAAe;AAwBxB,OAAO,MAAMC,mBAAmB,GAAGA,CAAA,KAAwB;EACvD,MAAMC,MAAM,GAAGF,eAAe,CAAmB,CAAC;EAElD,OAAO;IACH,GAAGE,MAAM;IACTC,YAAY,EAAE;MACVC,MAAM,EAAEF,MAAM,CAACC,YAAY,CAACC,MAAM,IAAI,EAAE;MACxCC,QAAQ,EAAEH,MAAM,CAACC,YAAY,CAACE,QAAQ,IAAI;IAC9C;EACJ,CAAC;AACL,CAAC","ignoreList":[]}
+{"version":3,"names":["useEditorConfig","usePageEditorConfig"],"sources":["usePageEditorConfig.ts"],"sourcesContent":["import { useEditorConfig } from \"~/BaseEditor/index.js\";\n\nexport const usePageEditorConfig = () => {\n    return useEditorConfig();\n};\n"],"mappings":"AAAA,SAASA,eAAe;AAExB,OAAO,MAAMC,mBAAmB,GAAGA,CAAA,KAAM;EACrC,OAAOD,eAAe,CAAC,CAAC;AAC5B,CAAC","ignoreList":[]}

package/package.json

@@ -1,8 +1,11 @@
 {
 	"name": "@webiny/app-website-builder",
-	"version": "6.3.0-beta.2",
+	"version": "6.3.0-beta.4",
 	"type": "module",
-	"main": "index.js",
+	"exports": {
+		".": "./index.js",
+		"./*": "./*"
+	},
 	"repository": {
 		"type": "git",
 		"url": "https://github.com/webiny/webiny-js.git"
@@ -14,33 +17,33 @@
 		"@emotion/css": "11.13.5",
 		"@emotion/react": "11.14.0",
 		"@emotion/styled": "11.14.1",
-		"@lexical/utils": "0.43.0",
+		"@lexical/utils": "0.44.0",
 		"@monaco-editor/react": "4.7.0",
 		"@svgr/webpack": "8.1.0",
 		"@types/react": "18.3.28",
-		"@webiny/admin-ui": "6.3.0-beta.2",
-		"@webiny/app": "6.3.0-beta.2",
-		"@webiny/app-aco": "6.3.0-beta.2",
-		"@webiny/app-admin": "6.3.0-beta.2",
-		"@webiny/app-headless-cms-common": "6.3.0-beta.2",
-		"@webiny/app-trash-bin": "6.3.0-beta.2",
-		"@webiny/app-utils": "6.3.0-beta.2",
+		"@webiny/admin-ui": "6.3.0-beta.4",
+		"@webiny/app": "6.3.0-beta.4",
+		"@webiny/app-aco": "6.3.0-beta.4",
+		"@webiny/app-admin": "6.3.0-beta.4",
+		"@webiny/app-headless-cms-common": "6.3.0-beta.4",
+		"@webiny/app-trash-bin": "6.3.0-beta.4",
+		"@webiny/app-utils": "6.3.0-beta.4",
 		"@webiny/di": "0.2.3",
-		"@webiny/error": "6.3.0-beta.2",
-		"@webiny/feature": "6.3.0-beta.2",
-		"@webiny/form": "6.3.0-beta.2",
-		"@webiny/icons": "6.3.0-beta.2",
-		"@webiny/languages": "6.3.0-beta.2",
-		"@webiny/lexical-converter": "6.3.0-beta.2",
-		"@webiny/lexical-editor": "6.3.0-beta.2",
-		"@webiny/lexical-nodes": "6.3.0-beta.2",
-		"@webiny/lexical-theme": "6.3.0-beta.2",
-		"@webiny/react-composition": "6.3.0-beta.2",
-		"@webiny/react-properties": "6.3.0-beta.2",
-		"@webiny/ui": "6.3.0-beta.2",
-		"@webiny/utils": "6.3.0-beta.2",
-		"@webiny/validation": "6.3.0-beta.2",
-		"@webiny/website-builder-sdk": "6.3.0-beta.2",
+		"@webiny/error": "6.3.0-beta.4",
+		"@webiny/feature": "6.3.0-beta.4",
+		"@webiny/form": "6.3.0-beta.4",
+		"@webiny/icons": "6.3.0-beta.4",
+		"@webiny/languages": "6.3.0-beta.4",
+		"@webiny/lexical-converter": "6.3.0-beta.4",
+		"@webiny/lexical-editor": "6.3.0-beta.4",
+		"@webiny/lexical-nodes": "6.3.0-beta.4",
+		"@webiny/lexical-theme": "6.3.0-beta.4",
+		"@webiny/react-composition": "6.3.0-beta.4",
+		"@webiny/react-properties": "6.3.0-beta.4",
+		"@webiny/ui": "6.3.0-beta.4",
+		"@webiny/utils": "6.3.0-beta.4",
+		"@webiny/validation": "6.3.0-beta.4",
+		"@webiny/website-builder-sdk": "6.3.0-beta.4",
 		"apollo-cache": "1.3.5",
 		"apollo-client": "2.6.10",
 		"apollo-link": "1.2.14",
@@ -53,7 +56,7 @@
 		"lodash": "4.18.1",
 		"markdown-to-jsx": "9.7.16",
 		"matcher": "6.0.0",
-		"mobx": "6.15.0",
+		"mobx": "6.15.1",
 		"mobx-react-lite": "4.1.1",
 		"pluralize": "8.0.0",
 		"react": "18.3.1",
@@ -67,7 +70,7 @@
 		"@emotion/babel-plugin": "11.13.5",
 		"@types/deep-equal": "1.0.4",
 		"@types/is-hotkey": "0.1.10",
-		"@webiny/build-tools": "6.3.0-beta.2",
+		"@webiny/build-tools": "6.3.0-beta.4",
 		"execa": "5.1.1",
 		"rimraf": "6.1.3",
 		"typescript": "6.0.3",
@@ -89,5 +92,5 @@
 			]
 		}
 	},
-	"gitHead": "c5ae1dbcb99bf7457449ef67aef19c5b4b1ffc4c"
+	"gitHead": "7cefe15431dbd65504e1f58147dc9e55bcbfa693"
 }

package/presentation/navigation/Extension.js

@@ -1,6 +1,5 @@
 import React from "react";
 import { AdminConfig, useToggler } from "@webiny/app-admin";
-import { ReactComponent as SettingsIcon } from "@webiny/icons/settings.svg";
 import { NexjsConfigDialog } from "./NextjsConfig/NextjsConfigDialog.js";
 const {
   Menu
@@ -14,13 +13,13 @@ export const Extension = /*#__PURE__*/React.memo(() => {
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(NexjsConfigDialog, {
     open: on,
     onClose: toggleOff
-  }), /*#__PURE__*/React.createElement(Menu.Support, {
+  }), /*#__PURE__*/React.createElement(Menu, {
     name: "wb.nextjs",
-    element: /*#__PURE__*/React.createElement(Menu.Support.Item, {
+    parent: "wb",
+    pin: "end",
+    element: /*#__PURE__*/React.createElement(Menu.Item, {
       text: "Configure Next.js",
-      onClick: toggleOn,
-      icon: /*#__PURE__*/React.createElement(SettingsIcon, null),
-      className: "cursor-pointer"
+      onClick: toggleOn
     })
   }));
 });

package/presentation/navigation/Extension.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","AdminConfig","useToggler","ReactComponent","SettingsIcon","NexjsConfigDialog","Menu","Extension","memo","on","toggleOn","toggleOff","createElement","Fragment","open","onClose","Support","name","element","Item","text","onClick","icon","className","displayName"],"sources":["Extension.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig, useToggler } from \"@webiny/app-admin\";\nimport { ReactComponent as SettingsIcon } from \"@webiny/icons/settings.svg\";\nimport { NexjsConfigDialog } from \"./NextjsConfig/NextjsConfigDialog.js\";\n\nconst { Menu } = AdminConfig;\n\nexport const Extension = React.memo(() => {\n    const { on, toggleOn, toggleOff } = useToggler(false);\n\n    return (\n        <>\n            <NexjsConfigDialog open={on} onClose={toggleOff} />\n            <Menu.Support\n                name={\"wb.nextjs\"}\n                element={\n                    <Menu.Support.Item\n                        text={\"Configure Next.js\"}\n                        onClick={toggleOn}\n                        icon={<SettingsIcon />}\n                        className={\"cursor-pointer\"}\n                    />\n                }\n            />\n        </>\n    );\n});\n\nExtension.displayName = \"NavigationExtension\";\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,WAAW,EAAEC,UAAU,QAAQ,mBAAmB;AAC3D,SAASC,cAAc,IAAIC,YAAY,QAAQ,4BAA4B;AAC3E,SAASC,iBAAiB;AAE1B,MAAM;EAAEC;AAAK,CAAC,GAAGL,WAAW;AAE5B,OAAO,MAAMM,SAAS,gBAAGP,KAAK,CAACQ,IAAI,CAAC,MAAM;EACtC,MAAM;IAAEC,EAAE;IAAEC,QAAQ;IAAEC;EAAU,CAAC,GAAGT,UAAU,CAAC,KAAK,CAAC;EAErD,oBACIF,KAAA,CAAAY,aAAA,CAAAZ,KAAA,CAAAa,QAAA,qBACIb,KAAA,CAAAY,aAAA,CAACP,iBAAiB;IAACS,IAAI,EAAEL,EAAG;IAACM,OAAO,EAAEJ;EAAU,CAAE,CAAC,eACnDX,KAAA,CAAAY,aAAA,CAACN,IAAI,CAACU,OAAO;IACTC,IAAI,EAAE,WAAY;IAClBC,OAAO,eACHlB,KAAA,CAAAY,aAAA,CAACN,IAAI,CAACU,OAAO,CAACG,IAAI;MACdC,IAAI,EAAE,mBAAoB;MAC1BC,OAAO,EAAEX,QAAS;MAClBY,IAAI,eAAEtB,KAAA,CAAAY,aAAA,CAACR,YAAY,MAAE,CAAE;MACvBmB,SAAS,EAAE;IAAiB,CAC/B;EACJ,CACJ,CACH,CAAC;AAEX,CAAC,CAAC;AAEFhB,SAAS,CAACiB,WAAW,GAAG,qBAAqB","ignoreList":[]}
+{"version":3,"names":["React","AdminConfig","useToggler","NexjsConfigDialog","Menu","Extension","memo","on","toggleOn","toggleOff","createElement","Fragment","open","onClose","name","parent","pin","element","Item","text","onClick","displayName"],"sources":["Extension.tsx"],"sourcesContent":["import React from \"react\";\nimport { AdminConfig, useToggler } from \"@webiny/app-admin\";\nimport { NexjsConfigDialog } from \"./NextjsConfig/NextjsConfigDialog.js\";\n\nconst { Menu } = AdminConfig;\n\nexport const Extension = React.memo(() => {\n    const { on, toggleOn, toggleOff } = useToggler(false);\n\n    return (\n        <>\n            <NexjsConfigDialog open={on} onClose={toggleOff} />\n            <Menu\n                name={\"wb.nextjs\"}\n                parent={\"wb\"}\n                pin={\"end\"}\n                element={<Menu.Item text={\"Configure Next.js\"} onClick={toggleOn} />}\n            />\n        </>\n    );\n});\n\nExtension.displayName = \"NavigationExtension\";\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,WAAW,EAAEC,UAAU,QAAQ,mBAAmB;AAC3D,SAASC,iBAAiB;AAE1B,MAAM;EAAEC;AAAK,CAAC,GAAGH,WAAW;AAE5B,OAAO,MAAMI,SAAS,gBAAGL,KAAK,CAACM,IAAI,CAAC,MAAM;EACtC,MAAM;IAAEC,EAAE;IAAEC,QAAQ;IAAEC;EAAU,CAAC,GAAGP,UAAU,CAAC,KAAK,CAAC;EAErD,oBACIF,KAAA,CAAAU,aAAA,CAAAV,KAAA,CAAAW,QAAA,qBACIX,KAAA,CAAAU,aAAA,CAACP,iBAAiB;IAACS,IAAI,EAAEL,EAAG;IAACM,OAAO,EAAEJ;EAAU,CAAE,CAAC,eACnDT,KAAA,CAAAU,aAAA,CAACN,IAAI;IACDU,IAAI,EAAE,WAAY;IAClBC,MAAM,EAAE,IAAK;IACbC,GAAG,EAAE,KAAM;IACXC,OAAO,eAAEjB,KAAA,CAAAU,aAAA,CAACN,IAAI,CAACc,IAAI;MAACC,IAAI,EAAE,mBAAoB;MAACC,OAAO,EAAEZ;IAAS,CAAE;EAAE,CACxE,CACH,CAAC;AAEX,CAAC,CAAC;AAEFH,SAAS,CAACgB,WAAW,GAAG,qBAAqB","ignoreList":[]}

package/presentation/pages/CreatePage/AddLanguageModifier.js

@@ -15,7 +15,7 @@ class AddLanguagePageFormModifier {
   modifyForm(form) {
     void this.useCase.execute();
     form.fields(fields => ({
-      language: fields.select().label("Language").hidden().options(() => this.getLanguageOptions()).afterChange((value, form) => this.afterChange(value, form))
+      language: fields.text().label("Language").hidden().options(() => this.getLanguageOptions()).afterChange((value, form) => this.afterChange(value, form))
     }));
 
     // When path is set programmatically (e.g., product selection, title change), apply the language prefix.
@@ -25,7 +25,7 @@ class AddLanguagePageFormModifier {
       if (!path) {
         return;
       }
-      const langCode = String(f.field("language").getValue() || "");
+      const langCode = f.field("language").as("text").getValue() ?? "";
       if (!langCode || !this.shouldPrefixPath()) {
         return;
       }
@@ -60,7 +60,7 @@ class AddLanguagePageFormModifier {
   }
   mapFromForm(data, input) {
     if (data.language) {
-      input.properties ??= {};
+      input.properties = input.properties ?? {};
       input.properties.language = data.language;
     }
   }
@@ -78,14 +78,14 @@ class AddLanguagePageFormModifier {
   afterChange(value, f) {
     const langCode = String(value);
     const codes = this.getSupportedCodes();
-    const path = f.field("path").getValue() || "";
+    const path = f.field("path").as("text").getValue() || "";
     const stripped = PagePath.create(path).stripLanguageCode(codes);
     const needsPrefix = langCode && this.shouldPrefixPath();
 
     // Determine the bare path — either from existing path or from title.
     let barePath = stripped;
     if (barePath.isEmpty()) {
-      const title = f.field("title").getValue() || "";
+      const title = f.field("title").as("text").getValue() || "";
       if (title) {
         barePath = PagePath.fromTitle(title);
       }

package/presentation/pages/CreatePage/AddLanguageModifier.js.map

@@ -1 +1 @@
-{"version":3,"names":["reaction","ListLanguagesUseCase","ListLanguagesRepository","CreatePageFormModifier","PagePath","AddLanguagePageFormModifier","constructor","useCase","repository","modifyForm","form","execute","fields","language","select","label","hidden","options","getLanguageOptions","afterChange","value","field","addAfterSetValue","f","path","String","langCode","getValue","shouldPrefixPath","prefixed","create","setLanguageCode","getSupportedCodes","toString","setValue","layout","row","before","dispose","getLanguages","languages","length","languageField","defaultCode","getDefaultLanguageCode","current","setVisible","fireImmediately","mapFromForm","data","input","properties","map","l","code","defaultLang","find","isDefault","codes","stripped","stripLanguageCode","needsPrefix","barePath","isEmpty","title","fromTitle","setData","getData","lang","name","AddLanguageModifier","createImplementation","implementation","dependencies"],"sources":["AddLanguageModifier.ts"],"sourcesContent":["import { reaction } from \"mobx\";\nimport { FormModel } from \"@webiny/app-admin\";\nimport {\n    ListLanguagesUseCase,\n    ListLanguagesRepository\n} from \"@webiny/languages/admin/features/listLanguages/abstractions.js\";\nimport { CreatePageFormModifier } from \"~/presentation/pages/CreatePage/abstractions.js\";\nimport type { CreatePageParams } from \"~/features/pages/createPage/abstractions.js\";\nimport { PagePath } from \"~/shared/PagePath.js\";\n\n/**\n * Modifier that adds a language select field to the CreatePage form.\n * When a language is selected, the path is prefixed with the language code.\n */\nclass AddLanguagePageFormModifier implements CreatePageFormModifier.Interface {\n    constructor(\n        private useCase: ListLanguagesUseCase.Interface,\n        private repository: ListLanguagesRepository.Interface\n    ) {}\n\n    modifyForm(form: FormModel.Interface): void {\n        void this.useCase.execute();\n\n        form.fields(fields => ({\n            language: fields\n                .select()\n                .label(\"Language\")\n                .hidden()\n                .options(() => this.getLanguageOptions())\n                .afterChange((value, form) => this.afterChange(value, form))\n        }));\n\n        // When path is set programmatically (e.g., product selection, title change), apply the language prefix.\n        // afterSetValue only fires on programmatic setValue calls, not on UI typing.\n        form.field(\"path\").addAfterSetValue((value, f) => {\n            const path = String(value || \"\");\n            if (!path) {\n                return;\n            }\n            const langCode = String(f.field(\"language\").getValue() || \"\");\n            if (!langCode || !this.shouldPrefixPath()) {\n                return;\n            }\n            const prefixed = PagePath.create(path)\n                .setLanguageCode(langCode, this.getSupportedCodes())\n                .toString();\n            if (prefixed !== path) {\n                f.field(\"path\").setValue(prefixed);\n            }\n        });\n\n        // Field starts hidden. Show it once languages load (if 2+).\n        // - 0 languages: field stays hidden, no value.\n        // - 1 language: auto-assign, stay hidden (no dropdown, no prefix).\n        // - 2+ languages: make visible (show dropdown), preselect default, prefix paths.\n        form.layout(layout => [layout.row(\"language\").before(\"title\")]);\n\n        const dispose = reaction(\n            () => this.repository.getLanguages(),\n            languages => {\n                if (languages.length === 0) {\n                    return;\n                }\n\n                const languageField = form.field(\"language\");\n\n                const defaultCode = this.getDefaultLanguageCode();\n                const current = languageField.getValue();\n\n                if (!current && defaultCode) {\n                    languageField.setValue(defaultCode);\n                }\n\n                if (languages.length > 1) {\n                    languageField.setVisible(true);\n                }\n\n                dispose();\n            },\n            { fireImmediately: true }\n        );\n    }\n\n    mapFromForm(data: Record<string, unknown>, input: CreatePageParams): void {\n        if (data.language) {\n            input.properties ??= {};\n            input.properties.language = data.language;\n        }\n    }\n\n    private getSupportedCodes(): string[] {\n        return this.repository.getLanguages().map(l => l.code);\n    }\n\n    private getDefaultLanguageCode(): string | undefined {\n        const languages = this.repository.getLanguages();\n        const defaultLang = languages.find(l => l.isDefault);\n        return defaultLang?.code ?? languages[0]?.code;\n    }\n\n    private shouldPrefixPath(): boolean {\n        return this.repository.getLanguages().length > 1;\n    }\n\n    private afterChange(value: unknown, f: FormModel.Interface) {\n        const langCode = String(value);\n        const codes = this.getSupportedCodes();\n\n        const path = f.field(\"path\").getValue<string>() || \"\";\n        const stripped = PagePath.create(path).stripLanguageCode(codes);\n        const needsPrefix = langCode && this.shouldPrefixPath();\n\n        // Determine the bare path — either from existing path or from title.\n        let barePath = stripped;\n        if (barePath.isEmpty()) {\n            const title = f.field(\"title\").getValue<string>() || \"\";\n            if (title) {\n                barePath = PagePath.fromTitle(title);\n            }\n        }\n\n        if (barePath.isEmpty()) {\n            // No path and no title — nothing to do.\n            f.setData({ ...f.getData(), path: null });\n        } else if (needsPrefix) {\n            f.field(\"path\").setValue(barePath.setLanguageCode(langCode, codes).toString());\n        } else {\n            f.field(\"path\").setValue(barePath.toString());\n        }\n    }\n\n    private getLanguageOptions() {\n        return this.repository.getLanguages().map(lang => ({\n            label: `${lang.name} (${lang.code})`,\n            value: lang.code\n        }));\n    }\n}\n\nexport const AddLanguageModifier = CreatePageFormModifier.createImplementation({\n    implementation: AddLanguagePageFormModifier,\n    dependencies: [ListLanguagesUseCase, ListLanguagesRepository]\n});\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["reaction","ListLanguagesUseCase","ListLanguagesRepository","CreatePageFormModifier","PagePath","AddLanguagePageFormModifier","constructor","useCase","repository","modifyForm","form","execute","fields","language","text","label","hidden","options","getLanguageOptions","afterChange","value","field","addAfterSetValue","f","path","String","langCode","as","getValue","shouldPrefixPath","prefixed","create","setLanguageCode","getSupportedCodes","toString","setValue","layout","row","before","dispose","getLanguages","languages","length","languageField","defaultCode","getDefaultLanguageCode","current","setVisible","fireImmediately","mapFromForm","data","input","properties","map","l","code","defaultLang","find","isDefault","codes","stripped","stripLanguageCode","needsPrefix","barePath","isEmpty","title","fromTitle","setData","getData","lang","name","AddLanguageModifier","createImplementation","implementation","dependencies"],"sources":["AddLanguageModifier.ts"],"sourcesContent":["import { reaction } from \"mobx\";\nimport { FormModel } from \"@webiny/app-admin\";\nimport {\n    ListLanguagesUseCase,\n    ListLanguagesRepository\n} from \"@webiny/languages/admin/features/listLanguages/abstractions.js\";\nimport { CreatePageFormModifier } from \"~/presentation/pages/CreatePage/abstractions.js\";\nimport type { CreatePageParams } from \"~/features/pages/createPage/abstractions.js\";\nimport { PagePath } from \"~/shared/PagePath.js\";\n\n/**\n * Modifier that adds a language select field to the CreatePage form.\n * When a language is selected, the path is prefixed with the language code.\n */\nclass AddLanguagePageFormModifier implements CreatePageFormModifier.Interface {\n    constructor(\n        private useCase: ListLanguagesUseCase.Interface,\n        private repository: ListLanguagesRepository.Interface\n    ) {}\n\n    modifyForm(form: FormModel.Interface): void {\n        void this.useCase.execute();\n\n        form.fields(fields => ({\n            language: fields\n                .text()\n                .label(\"Language\")\n                .hidden()\n                .options(() => this.getLanguageOptions())\n                .afterChange((value, form) => this.afterChange(value, form))\n        }));\n\n        // When path is set programmatically (e.g., product selection, title change), apply the language prefix.\n        // afterSetValue only fires on programmatic setValue calls, not on UI typing.\n        form.field(\"path\").addAfterSetValue((value, f) => {\n            const path = String(value || \"\");\n            if (!path) {\n                return;\n            }\n            const langCode = f.field(\"language\").as(\"text\").getValue() ?? \"\";\n            if (!langCode || !this.shouldPrefixPath()) {\n                return;\n            }\n            const prefixed = PagePath.create(path)\n                .setLanguageCode(langCode, this.getSupportedCodes())\n                .toString();\n            if (prefixed !== path) {\n                f.field(\"path\").setValue(prefixed);\n            }\n        });\n\n        // Field starts hidden. Show it once languages load (if 2+).\n        // - 0 languages: field stays hidden, no value.\n        // - 1 language: auto-assign, stay hidden (no dropdown, no prefix).\n        // - 2+ languages: make visible (show dropdown), preselect default, prefix paths.\n        form.layout(layout => [layout.row(\"language\").before(\"title\")]);\n\n        const dispose = reaction(\n            () => this.repository.getLanguages(),\n            languages => {\n                if (languages.length === 0) {\n                    return;\n                }\n\n                const languageField = form.field(\"language\");\n\n                const defaultCode = this.getDefaultLanguageCode();\n                const current = languageField.getValue();\n\n                if (!current && defaultCode) {\n                    languageField.setValue(defaultCode);\n                }\n\n                if (languages.length > 1) {\n                    languageField.setVisible(true);\n                }\n\n                dispose();\n            },\n            { fireImmediately: true }\n        );\n    }\n\n    mapFromForm(data: Record<string, unknown>, input: CreatePageParams): void {\n        if (data.language) {\n            input.properties = input.properties ?? {};\n            input.properties.language = data.language;\n        }\n    }\n\n    private getSupportedCodes(): string[] {\n        return this.repository.getLanguages().map(l => l.code);\n    }\n\n    private getDefaultLanguageCode(): string | undefined {\n        const languages = this.repository.getLanguages();\n        const defaultLang = languages.find(l => l.isDefault);\n        return defaultLang?.code ?? languages[0]?.code;\n    }\n\n    private shouldPrefixPath(): boolean {\n        return this.repository.getLanguages().length > 1;\n    }\n\n    private afterChange(value: unknown, f: FormModel.Interface) {\n        const langCode = String(value);\n        const codes = this.getSupportedCodes();\n\n        const path = f.field(\"path\").as(\"text\").getValue() || \"\";\n        const stripped = PagePath.create(path).stripLanguageCode(codes);\n        const needsPrefix = langCode && this.shouldPrefixPath();\n\n        // Determine the bare path — either from existing path or from title.\n        let barePath = stripped;\n        if (barePath.isEmpty()) {\n            const title = f.field(\"title\").as(\"text\").getValue() || \"\";\n            if (title) {\n                barePath = PagePath.fromTitle(title);\n            }\n        }\n\n        if (barePath.isEmpty()) {\n            // No path and no title — nothing to do.\n            f.setData({ ...f.getData(), path: null });\n        } else if (needsPrefix) {\n            f.field(\"path\").setValue(barePath.setLanguageCode(langCode, codes).toString());\n        } else {\n            f.field(\"path\").setValue(barePath.toString());\n        }\n    }\n\n    private getLanguageOptions() {\n        return this.repository.getLanguages().map(lang => ({\n            label: `${lang.name} (${lang.code})`,\n            value: lang.code\n        }));\n    }\n}\n\nexport const AddLanguageModifier = CreatePageFormModifier.createImplementation({\n    implementation: AddLanguagePageFormModifier,\n    dependencies: [ListLanguagesUseCase, ListLanguagesRepository]\n});\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,MAAM;AAE/B,SACIC,oBAAoB,EACpBC,uBAAuB,QACpB,gEAAgE;AACvE,SAASC,sBAAsB;AAE/B,SAASC,QAAQ;;AAEjB;AACA;AACA;AACA;AACA,MAAMC,2BAA2B,CAA6C;EAC1EC,WAAWA,CACCC,OAAuC,EACvCC,UAA6C,EACvD;IAAA,KAFUD,OAAuC,GAAvCA,OAAuC;IAAA,KACvCC,UAA6C,GAA7CA,UAA6C;EACtD;EAEHC,UAAUA,CAACC,IAAyB,EAAQ;IACxC,KAAK,IAAI,CAACH,OAAO,CAACI,OAAO,CAAC,CAAC;IAE3BD,IAAI,CAACE,MAAM,CAACA,MAAM,KAAK;MACnBC,QAAQ,EAAED,MAAM,CACXE,IAAI,CAAC,CAAC,CACNC,KAAK,CAAC,UAAU,CAAC,CACjBC,MAAM,CAAC,CAAC,CACRC,OAAO,CAAC,MAAM,IAAI,CAACC,kBAAkB,CAAC,CAAC,CAAC,CACxCC,WAAW,CAAC,CAACC,KAAK,EAAEV,IAAI,KAAK,IAAI,CAACS,WAAW,CAACC,KAAK,EAAEV,IAAI,CAAC;IACnE,CAAC,CAAC,CAAC;;IAEH;IACA;IACAA,IAAI,CAACW,KAAK,CAAC,MAAM,CAAC,CAACC,gBAAgB,CAAC,CAACF,KAAK,EAAEG,CAAC,KAAK;MAC9C,MAAMC,IAAI,GAAGC,MAAM,CAACL,KAAK,IAAI,EAAE,CAAC;MAChC,IAAI,CAACI,IAAI,EAAE;QACP;MACJ;MACA,MAAME,QAAQ,GAAGH,CAAC,CAACF,KAAK,CAAC,UAAU,CAAC,CAACM,EAAE,CAAC,MAAM,CAAC,CAACC,QAAQ,CAAC,CAAC,IAAI,EAAE;MAChE,IAAI,CAACF,QAAQ,IAAI,CAAC,IAAI,CAACG,gBAAgB,CAAC,CAAC,EAAE;QACvC;MACJ;MACA,MAAMC,QAAQ,GAAG1B,QAAQ,CAAC2B,MAAM,CAACP,IAAI,CAAC,CACjCQ,eAAe,CAACN,QAAQ,EAAE,IAAI,CAACO,iBAAiB,CAAC,CAAC,CAAC,CACnDC,QAAQ,CAAC,CAAC;MACf,IAAIJ,QAAQ,KAAKN,IAAI,EAAE;QACnBD,CAAC,CAACF,KAAK,CAAC,MAAM,CAAC,CAACc,QAAQ,CAACL,QAAQ,CAAC;MACtC;IACJ,CAAC,CAAC;;IAEF;IACA;IACA;IACA;IACApB,IAAI,CAAC0B,MAAM,CAACA,MAAM,IAAI,CAACA,MAAM,CAACC,GAAG,CAAC,UAAU,CAAC,CAACC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC;IAE/D,MAAMC,OAAO,GAAGvC,QAAQ,CACpB,MAAM,IAAI,CAACQ,UAAU,CAACgC,YAAY,CAAC,CAAC,EACpCC,SAAS,IAAI;MACT,IAAIA,SAAS,CAACC,MAAM,KAAK,CAAC,EAAE;QACxB;MACJ;MAEA,MAAMC,aAAa,GAAGjC,IAAI,CAACW,KAAK,CAAC,UAAU,CAAC;MAE5C,MAAMuB,WAAW,GAAG,IAAI,CAACC,sBAAsB,CAAC,CAAC;MACjD,MAAMC,OAAO,GAAGH,aAAa,CAACf,QAAQ,CAAC,CAAC;MAExC,IAAI,CAACkB,OAAO,IAAIF,WAAW,EAAE;QACzBD,aAAa,CAACR,QAAQ,CAACS,WAAW,CAAC;MACvC;MAEA,IAAIH,SAAS,CAACC,MAAM,GAAG,CAAC,EAAE;QACtBC,aAAa,CAACI,UAAU,CAAC,IAAI,CAAC;MAClC;MAEAR,OAAO,CAAC,CAAC;IACb,CAAC,EACD;MAAES,eAAe,EAAE;IAAK,CAC5B,CAAC;EACL;EAEAC,WAAWA,CAACC,IAA6B,EAAEC,KAAuB,EAAQ;IACtE,IAAID,IAAI,CAACrC,QAAQ,EAAE;MACfsC,KAAK,CAACC,UAAU,GAAGD,KAAK,CAACC,UAAU,IAAI,CAAC,CAAC;MACzCD,KAAK,CAACC,UAAU,CAACvC,QAAQ,GAAGqC,IAAI,CAACrC,QAAQ;IAC7C;EACJ;EAEQoB,iBAAiBA,CAAA,EAAa;IAClC,OAAO,IAAI,CAACzB,UAAU,CAACgC,YAAY,CAAC,CAAC,CAACa,GAAG,CAACC,CAAC,IAAIA,CAAC,CAACC,IAAI,CAAC;EAC1D;EAEQV,sBAAsBA,CAAA,EAAuB;IACjD,MAAMJ,SAAS,GAAG,IAAI,CAACjC,UAAU,CAACgC,YAAY,CAAC,CAAC;IAChD,MAAMgB,WAAW,GAAGf,SAAS,CAACgB,IAAI,CAACH,CAAC,IAAIA,CAAC,CAACI,SAAS,CAAC;IACpD,OAAOF,WAAW,EAAED,IAAI,IAAId,SAAS,CAAC,CAAC,CAAC,EAAEc,IAAI;EAClD;EAEQ1B,gBAAgBA,CAAA,EAAY;IAChC,OAAO,IAAI,CAACrB,UAAU,CAACgC,YAAY,CAAC,CAAC,CAACE,MAAM,GAAG,CAAC;EACpD;EAEQvB,WAAWA,CAACC,KAAc,EAAEG,CAAsB,EAAE;IACxD,MAAMG,QAAQ,GAAGD,MAAM,CAACL,KAAK,CAAC;IAC9B,MAAMuC,KAAK,GAAG,IAAI,CAAC1B,iBAAiB,CAAC,CAAC;IAEtC,MAAMT,IAAI,GAAGD,CAAC,CAACF,KAAK,CAAC,MAAM,CAAC,CAACM,EAAE,CAAC,MAAM,CAAC,CAACC,QAAQ,CAAC,CAAC,IAAI,EAAE;IACxD,MAAMgC,QAAQ,GAAGxD,QAAQ,CAAC2B,MAAM,CAACP,IAAI,CAAC,CAACqC,iBAAiB,CAACF,KAAK,CAAC;IAC/D,MAAMG,WAAW,GAAGpC,QAAQ,IAAI,IAAI,CAACG,gBAAgB,CAAC,CAAC;;IAEvD;IACA,IAAIkC,QAAQ,GAAGH,QAAQ;IACvB,IAAIG,QAAQ,CAACC,OAAO,CAAC,CAAC,EAAE;MACpB,MAAMC,KAAK,GAAG1C,CAAC,CAACF,KAAK,CAAC,OAAO,CAAC,CAACM,EAAE,CAAC,MAAM,CAAC,CAACC,QAAQ,CAAC,CAAC,IAAI,EAAE;MAC1D,IAAIqC,KAAK,EAAE;QACPF,QAAQ,GAAG3D,QAAQ,CAAC8D,SAAS,CAACD,KAAK,CAAC;MACxC;IACJ;IAEA,IAAIF,QAAQ,CAACC,OAAO,CAAC,CAAC,EAAE;MACpB;MACAzC,CAAC,CAAC4C,OAAO,CAAC;QAAE,GAAG5C,CAAC,CAAC6C,OAAO,CAAC,CAAC;QAAE5C,IAAI,EAAE;MAAK,CAAC,CAAC;IAC7C,CAAC,MAAM,IAAIsC,WAAW,EAAE;MACpBvC,CAAC,CAACF,KAAK,CAAC,MAAM,CAAC,CAACc,QAAQ,CAAC4B,QAAQ,CAAC/B,eAAe,CAACN,QAAQ,EAAEiC,KAAK,CAAC,CAACzB,QAAQ,CAAC,CAAC,CAAC;IAClF,CAAC,MAAM;MACHX,CAAC,CAACF,KAAK,CAAC,MAAM,CAAC,CAACc,QAAQ,CAAC4B,QAAQ,CAAC7B,QAAQ,CAAC,CAAC,CAAC;IACjD;EACJ;EAEQhB,kBAAkBA,CAAA,EAAG;IACzB,OAAO,IAAI,CAACV,UAAU,CAACgC,YAAY,CAAC,CAAC,CAACa,GAAG,CAACgB,IAAI,KAAK;MAC/CtD,KAAK,EAAE,GAAGsD,IAAI,CAACC,IAAI,KAAKD,IAAI,CAACd,IAAI,GAAG;MACpCnC,KAAK,EAAEiD,IAAI,CAACd;IAChB,CAAC,CAAC,CAAC;EACP;AACJ;AAEA,OAAO,MAAMgB,mBAAmB,GAAGpE,sBAAsB,CAACqE,oBAAoB,CAAC;EAC3EC,cAAc,EAAEpE,2BAA2B;EAC3CqE,YAAY,EAAE,CAACzE,oBAAoB,EAAEC,uBAAuB;AAChE,CAAC,CAAC","ignoreList":[]}

package/presentation/pages/CreatePage/CreatePage.test.js

@@ -1,11 +1,9 @@
 import { describe, it, expect } from "vitest";
-import { FormModel as FormModelImpl } from "@webiny/app-admin/features/formModel/FormModel.js";
+import { Container } from "@webiny/di";
+import { FormModelFeature } from "@webiny/app-admin/features/formModel/feature.js";
+import { FormModelFactory } from "@webiny/app-admin/features/formModel/abstractions.js";
 import { AddLanguageModifier } from "./AddLanguageModifier.js";
 import { PagePath } from "../../../shared/PagePath.js";
-/**
- * Creates a mock use case + repository pair for the AddLanguageModifier.
- * Languages are pre-populated (simulating a completed fetch).
- */
 function createLanguageMocks(languages) {
   const repository = {
     execute: async () => languages,
@@ -19,13 +17,11 @@ function createLanguageMocks(languages) {
     repository
   };
 }
-
-/**
- * Creates the same base form that CreatePagePresenter builds,
- * without requiring DI or the page type cache.
- */
 function createBaseForm(config) {
-  return new FormModelImpl({
+  const container = new Container();
+  FormModelFeature.register(container);
+  const factory = container.resolve(FormModelFactory);
+  return factory.create({
     fields: fields => ({
       title: fields.text().label("Title").required("Title is required").onBlur((value, f) => {
         const currentPath = f.field("path").getValue();
@@ -127,7 +123,7 @@ describe("PageType + Modifier 3-layer architecture", () => {
     label: "Product Page",
     modifyForm(form) {
       form.fields(fields => ({
-        product: fields.select().label("Product").required("Product is required").options([{
+        product: fields.text().label("Product").required("Product is required").options([{
           label: "Shoes",
           value: "shoes"
         }, {
@@ -214,7 +210,7 @@ describe("Form rebuild on page type switch", () => {
     label: "Product Page",
     modifyForm(form) {
       form.fields(fields => ({
-        product: fields.select().label("Product").required("Product is required").options([{
+        product: fields.text().label("Product").required("Product is required").options([{
           label: "Shoes",
           value: "shoes"
         }, {