@webiny/app-website-builder 6.3.0 → 6.4.0-beta.1

package/BaseEditor/defaultConfig/DocumentStateEditor/DocumentStateEditor.js

@@ -1,5 +1,5 @@
-import React, { useEffect, useState } from "react";
-import MonacoEditor from "@monaco-editor/react";
+import react, { useEffect, useState } from "react";
+import _monaco_editor_react from "@monaco-editor/react";
 import { Button } from "@webiny/admin-ui";
 import { useDialogs } from "@webiny/app-admin";
 import { Bind } from "@webiny/form";
@@ -7,63 +7,57 @@ import { useDocumentEditor } from "../../../DocumentEditor/index.js";
 import { autorun, toJS } from "mobx";
 import { observer } from "mobx-react-lite";
 const monacoOptions = {
-  minimap: {
-    enabled: false
-  }
-};
-const DialogForm = () => {
-  return /*#__PURE__*/React.createElement(Bind, {
-    name: "state"
-  }, ({
-    value,
-    onChange
-  }) => /*#__PURE__*/React.createElement("div", {
-    style: {
-      height: "60vh"
+    minimap: {
+        enabled: false
     }
-  }, /*#__PURE__*/React.createElement(MonacoEditor, {
-    language: "json",
-    defaultValue: value,
-    options: monacoOptions,
-    onChange: onChange
-  })));
 };
-export const DocumentStateEditor = observer(() => {
-  const dialog = useDialogs();
-  const editor = useDocumentEditor();
-  const [state, setState] = useState(() => JSON.stringify(toJS(editor.getDocumentState().read().state), null, 2));
-  useEffect(() => {
-    autorun(() => {
-      const state = editor.getDocumentState().read().state;
-      setState(JSON.stringify(toJS(state), null, 2));
-    });
-  }, []);
-  const openDialog = () => {
-    dialog.showDialog({
-      title: "Document State",
-      content: /*#__PURE__*/React.createElement(DialogForm, {
-        key: state
-      }),
-      formData: {
-        state
-      },
-      acceptLabel: "Save State",
-      cancelLabel: "Cancel",
-      onAccept: ({
-        state
-      }) => {
-        editor.updateDocument(document => {
-          document.state = JSON.parse(state);
+const DialogForm = ()=>/*#__PURE__*/ react.createElement(Bind, {
+        name: "state"
+    }, ({ value, onChange })=>/*#__PURE__*/ react.createElement("div", {
+            style: {
+                height: "60vh"
+            }
+        }, /*#__PURE__*/ react.createElement(_monaco_editor_react, {
+            language: "json",
+            defaultValue: value,
+            options: monacoOptions,
+            onChange: onChange
+        })));
+const DocumentStateEditor = observer(()=>{
+    const dialog = useDialogs();
+    const editor = useDocumentEditor();
+    const [state, setState] = useState(()=>JSON.stringify(toJS(editor.getDocumentState().read().state), null, 2));
+    useEffect(()=>{
+        autorun(()=>{
+            const state = editor.getDocumentState().read().state;
+            setState(JSON.stringify(toJS(state), null, 2));
+        });
+    }, []);
+    const openDialog = ()=>{
+        dialog.showDialog({
+            title: "Document State",
+            content: /*#__PURE__*/ react.createElement(DialogForm, {
+                key: state
+            }),
+            formData: {
+                state
+            },
+            acceptLabel: "Save State",
+            cancelLabel: "Cancel",
+            onAccept: ({ state })=>{
+                editor.updateDocument((document)=>{
+                    document.state = JSON.parse(state);
+                });
+            }
         });
-      }
+    };
+    return /*#__PURE__*/ react.createElement(Button, {
+        className: "absolute bottom-0 w-full",
+        variant: "secondary",
+        onClick: openDialog,
+        text: "Edit State"
     });
-  };
-  return /*#__PURE__*/React.createElement(Button, {
-    className: "absolute bottom-0 w-full",
-    variant: "secondary",
-    onClick: openDialog,
-    text: "Edit State"
-  });
 });
+export { DocumentStateEditor };
 
 //# sourceMappingURL=DocumentStateEditor.js.map

package/BaseEditor/defaultConfig/DocumentStateEditor/DocumentStateEditor.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useState","MonacoEditor","Button","useDialogs","Bind","useDocumentEditor","autorun","toJS","observer","monacoOptions","minimap","enabled","DialogForm","createElement","name","value","onChange","style","height","language","defaultValue","options","DocumentStateEditor","dialog","editor","state","setState","JSON","stringify","getDocumentState","read","openDialog","showDialog","title","content","key","formData","acceptLabel","cancelLabel","onAccept","updateDocument","document","parse","className","variant","onClick","text"],"sources":["DocumentStateEditor.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport MonacoEditor from \"@monaco-editor/react\";\nimport { Button } from \"@webiny/admin-ui\";\nimport { useDialogs } from \"@webiny/app-admin\";\nimport type { GenericFormData } from \"@webiny/form\";\nimport { Bind } from \"@webiny/form\";\nimport { useDocumentEditor } from \"~/DocumentEditor/index.js\";\nimport { autorun, toJS } from \"mobx\";\nimport { observer } from \"mobx-react-lite\";\nimport type { EditorDocument } from \"@webiny/website-builder-sdk\";\n\nconst monacoOptions = { minimap: { enabled: false } };\n\nconst DialogForm = () => {\n    return (\n        <Bind name={\"state\"}>\n            {({ value, onChange }) => (\n                <div style={{ height: \"60vh\" }}>\n                    <MonacoEditor\n                        language={\"json\"}\n                        defaultValue={value}\n                        options={monacoOptions}\n                        onChange={onChange}\n                    />\n                </div>\n            )}\n        </Bind>\n    );\n};\n\nexport const DocumentStateEditor = observer(() => {\n    const dialog = useDialogs();\n    const editor = useDocumentEditor<EditorDocument>();\n    const [state, setState] = useState(() =>\n        JSON.stringify(toJS(editor.getDocumentState().read().state), null, 2)\n    );\n\n    useEffect(() => {\n        autorun(() => {\n            const state = editor.getDocumentState().read().state;\n            setState(JSON.stringify(toJS(state), null, 2));\n        });\n    }, []);\n\n    const openDialog = () => {\n        dialog.showDialog({\n            title: \"Document State\",\n            content: <DialogForm key={state} />,\n            formData: {\n                state\n            },\n            acceptLabel: \"Save State\",\n            cancelLabel: \"Cancel\",\n            onAccept: ({ state }: GenericFormData) => {\n                editor.updateDocument(document => {\n                    document.state = JSON.parse(state);\n                });\n            }\n        });\n    };\n\n    return (\n        <Button\n            className=\"absolute bottom-0 w-full\"\n            variant=\"secondary\"\n            onClick={openDialog}\n            text=\"Edit State\"\n        />\n    );\n});\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAClD,OAAOC,YAAY,MAAM,sBAAsB;AAC/C,SAASC,MAAM,QAAQ,kBAAkB;AACzC,SAASC,UAAU,QAAQ,mBAAmB;AAE9C,SAASC,IAAI,QAAQ,cAAc;AACnC,SAASC,iBAAiB;AAC1B,SAASC,OAAO,EAAEC,IAAI,QAAQ,MAAM;AACpC,SAASC,QAAQ,QAAQ,iBAAiB;AAG1C,MAAMC,aAAa,GAAG;EAAEC,OAAO,EAAE;IAAEC,OAAO,EAAE;EAAM;AAAE,CAAC;AAErD,MAAMC,UAAU,GAAGA,CAAA,KAAM;EACrB,oBACId,KAAA,CAAAe,aAAA,CAACT,IAAI;IAACU,IAAI,EAAE;EAAQ,GACf,CAAC;IAAEC,KAAK;IAAEC;EAAS,CAAC,kBACjBlB,KAAA,CAAAe,aAAA;IAAKI,KAAK,EAAE;MAAEC,MAAM,EAAE;IAAO;EAAE,gBAC3BpB,KAAA,CAAAe,aAAA,CAACZ,YAAY;IACTkB,QAAQ,EAAE,MAAO;IACjBC,YAAY,EAAEL,KAAM;IACpBM,OAAO,EAAEZ,aAAc;IACvBO,QAAQ,EAAEA;EAAS,CACtB,CACA,CAEP,CAAC;AAEf,CAAC;AAED,OAAO,MAAMM,mBAAmB,GAAGd,QAAQ,CAAC,MAAM;EAC9C,MAAMe,MAAM,GAAGpB,UAAU,CAAC,CAAC;EAC3B,MAAMqB,MAAM,GAAGnB,iBAAiB,CAAiB,CAAC;EAClD,MAAM,CAACoB,KAAK,EAAEC,QAAQ,CAAC,GAAG1B,QAAQ,CAAC,MAC/B2B,IAAI,CAACC,SAAS,CAACrB,IAAI,CAACiB,MAAM,CAACK,gBAAgB,CAAC,CAAC,CAACC,IAAI,CAAC,CAAC,CAACL,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC,CACxE,CAAC;EAED1B,SAAS,CAAC,MAAM;IACZO,OAAO,CAAC,MAAM;MACV,MAAMmB,KAAK,GAAGD,MAAM,CAACK,gBAAgB,CAAC,CAAC,CAACC,IAAI,CAAC,CAAC,CAACL,KAAK;MACpDC,QAAQ,CAACC,IAAI,CAACC,SAAS,CAACrB,IAAI,CAACkB,KAAK,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;IAClD,CAAC,CAAC;EACN,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMM,UAAU,GAAGA,CAAA,KAAM;IACrBR,MAAM,CAACS,UAAU,CAAC;MACdC,KAAK,EAAE,gBAAgB;MACvBC,OAAO,eAAEpC,KAAA,CAAAe,aAAA,CAACD,UAAU;QAACuB,GAAG,EAAEV;MAAM,CAAE,CAAC;MACnCW,QAAQ,EAAE;QACNX;MACJ,CAAC;MACDY,WAAW,EAAE,YAAY;MACzBC,WAAW,EAAE,QAAQ;MACrBC,QAAQ,EAAEA,CAAC;QAAEd;MAAuB,CAAC,KAAK;QACtCD,MAAM,CAACgB,cAAc,CAACC,QAAQ,IAAI;UAC9BA,QAAQ,CAAChB,KAAK,GAAGE,IAAI,CAACe,KAAK,CAACjB,KAAK,CAAC;QACtC,CAAC,CAAC;MACN;IACJ,CAAC,CAAC;EACN,CAAC;EAED,oBACI3B,KAAA,CAAAe,aAAA,CAACX,MAAM;IACHyC,SAAS,EAAC,0BAA0B;IACpCC,OAAO,EAAC,WAAW;IACnBC,OAAO,EAAEd,UAAW;IACpBe,IAAI,EAAC;EAAY,CACpB,CAAC;AAEV,CAAC,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/DocumentStateEditor/DocumentStateEditor.js","sources":["../../../../src/BaseEditor/defaultConfig/DocumentStateEditor/DocumentStateEditor.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport MonacoEditor from \"@monaco-editor/react\";\nimport { Button } from \"@webiny/admin-ui\";\nimport { useDialogs } from \"@webiny/app-admin\";\nimport type { GenericFormData } from \"@webiny/form\";\nimport { Bind } from \"@webiny/form\";\nimport { useDocumentEditor } from \"~/DocumentEditor/index.js\";\nimport { autorun, toJS } from \"mobx\";\nimport { observer } from \"mobx-react-lite\";\nimport type { EditorDocument } from \"@webiny/website-builder-sdk\";\n\nconst monacoOptions = { minimap: { enabled: false } };\n\nconst DialogForm = () => {\n    return (\n        <Bind name={\"state\"}>\n            {({ value, onChange }) => (\n                <div style={{ height: \"60vh\" }}>\n                    <MonacoEditor\n                        language={\"json\"}\n                        defaultValue={value}\n                        options={monacoOptions}\n                        onChange={onChange}\n                    />\n                </div>\n            )}\n        </Bind>\n    );\n};\n\nexport const DocumentStateEditor = observer(() => {\n    const dialog = useDialogs();\n    const editor = useDocumentEditor<EditorDocument>();\n    const [state, setState] = useState(() =>\n        JSON.stringify(toJS(editor.getDocumentState().read().state), null, 2)\n    );\n\n    useEffect(() => {\n        autorun(() => {\n            const state = editor.getDocumentState().read().state;\n            setState(JSON.stringify(toJS(state), null, 2));\n        });\n    }, []);\n\n    const openDialog = () => {\n        dialog.showDialog({\n            title: \"Document State\",\n            content: <DialogForm key={state} />,\n            formData: {\n                state\n            },\n            acceptLabel: \"Save State\",\n            cancelLabel: \"Cancel\",\n            onAccept: ({ state }: GenericFormData) => {\n                editor.updateDocument(document => {\n                    document.state = JSON.parse(state);\n                });\n            }\n        });\n    };\n\n    return (\n        <Button\n            className=\"absolute bottom-0 w-full\"\n            variant=\"secondary\"\n            onClick={openDialog}\n            text=\"Edit State\"\n        />\n    );\n});\n"],"names":["monacoOptions","DialogForm","Bind","value","onChange","MonacoEditor","DocumentStateEditor","observer","dialog","useDialogs","editor","useDocumentEditor","state","setState","useState","JSON","toJS","useEffect","autorun","openDialog","document","Button"],"mappings":";;;;;;;;AAWA,MAAMA,gBAAgB;IAAE,SAAS;QAAE,SAAS;IAAM;AAAE;AAEpD,MAAMC,aAAa,IACR,WAAP,GACI,oBAACC,MAAIA;QAAC,MAAM;OACP,CAAC,EAAEC,KAAK,EAAEC,QAAQ,EAAE,iBACjB,oBAAC;YAAI,OAAO;gBAAE,QAAQ;YAAO;yBACzB,oBAACC,sBAAYA;YACT,UAAU;YACV,cAAcF;YACd,SAASH;YACT,UAAUI;;AAQ3B,MAAME,sBAAsBC,SAAS;IACxC,MAAMC,SAASC;IACf,MAAMC,SAASC;IACf,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAAS,IAC/BC,KAAK,SAAS,CAACC,KAAKN,OAAO,gBAAgB,GAAG,IAAI,GAAG,KAAK,GAAG,MAAM;IAGvEO,UAAU;QACNC,QAAQ;YACJ,MAAMN,QAAQF,OAAO,gBAAgB,GAAG,IAAI,GAAG,KAAK;YACpDG,SAASE,KAAK,SAAS,CAACC,KAAKJ,QAAQ,MAAM;QAC/C;IACJ,GAAG,EAAE;IAEL,MAAMO,aAAa;QACfX,OAAO,UAAU,CAAC;YACd,OAAO;YACP,SAAS,WAAT,GAAS,oBAACP,YAAUA;gBAAC,KAAKW;;YAC1B,UAAU;gBACNA;YACJ;YACA,aAAa;YACb,aAAa;YACb,UAAU,CAAC,EAAEA,KAAK,EAAmB;gBACjCF,OAAO,cAAc,CAACU,CAAAA;oBAClBA,SAAS,KAAK,GAAGL,KAAK,KAAK,CAACH;gBAChC;YACJ;QACJ;IACJ;IAEA,OAAO,WAAP,GACI,oBAACS,QAAMA;QACH,WAAU;QACV,SAAQ;QACR,SAASF;QACT,MAAK;;AAGjB"}

package/BaseEditor/defaultConfig/DocumentStateEditor/index.js

@@ -1,3 +1 @@
 export * from "./DocumentStateEditor.js";
-
-//# sourceMappingURL=index.js.map

package/BaseEditor/defaultConfig/ElementInputRenderers.js

@@ -1,4 +1,4 @@
-import React from "react";
+import react from "react";
 import { EditorConfig } from "../index.js";
 import { TextInputRenderer } from "../../inputRenderers/TextInput.js";
 import { NumberInputRenderer } from "../../inputRenderers/NumberInput.js";
@@ -11,38 +11,37 @@ import { GridLayoutInputRenderer } from "../../inputRenderers/GridLayoutInput.js
 import { SelectInputRenderer } from "../../inputRenderers/SelectInput.js";
 import { FileInputRenderer } from "../../inputRenderers/FileInput.js";
 import { FragmentSelectorInputRenderer } from "../../inputRenderers/FragmentSelectorInput.js";
-export const ElementInputRenderers = () => {
-  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/Slot",
-    component: SlotInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/Input",
-    component: TextInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/Select",
-    component: SelectInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/Textarea",
-    component: TextareaInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/Number",
-    component: NumberInputRenderer
-  }), /*#__PURE__*/React.createElement(DefaultLexicalConfig, null), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/Lexical",
-    component: LexicalInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/Switch",
-    component: BooleanInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/GridLayout",
-    component: GridLayoutInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/FileManager",
-    component: FileInputRenderer
-  }), /*#__PURE__*/React.createElement(EditorConfig.ElementInput.Renderer, {
-    name: "Webiny/FragmentSelector",
-    component: FragmentSelectorInputRenderer
-  }));
-};
+const ElementInputRenderers = ()=>/*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/Slot",
+        component: SlotInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/Input",
+        component: TextInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/Select",
+        component: SelectInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/Textarea",
+        component: TextareaInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/Number",
+        component: NumberInputRenderer
+    }), /*#__PURE__*/ react.createElement(DefaultLexicalConfig, null), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/Lexical",
+        component: LexicalInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/Switch",
+        component: BooleanInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/GridLayout",
+        component: GridLayoutInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/FileManager",
+        component: FileInputRenderer
+    }), /*#__PURE__*/ react.createElement(EditorConfig.ElementInput.Renderer, {
+        name: "Webiny/FragmentSelector",
+        component: FragmentSelectorInputRenderer
+    }));
+export { ElementInputRenderers };
 
 //# sourceMappingURL=ElementInputRenderers.js.map

package/BaseEditor/defaultConfig/ElementInputRenderers.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","EditorConfig","TextInputRenderer","NumberInputRenderer","BooleanInputRenderer","TextareaInputRenderer","LexicalInputRenderer","DefaultLexicalConfig","SlotInputRenderer","GridLayoutInputRenderer","SelectInputRenderer","FileInputRenderer","FragmentSelectorInputRenderer","ElementInputRenderers","createElement","Fragment","ElementInput","Renderer","name","component"],"sources":["ElementInputRenderers.tsx"],"sourcesContent":["import React from \"react\";\nimport { EditorConfig } from \"~/BaseEditor/index.js\";\nimport { TextInputRenderer } from \"~/inputRenderers/TextInput.js\";\nimport { NumberInputRenderer } from \"~/inputRenderers/NumberInput.js\";\nimport { BooleanInputRenderer } from \"~/inputRenderers/BooleanInput.js\";\nimport { TextareaInputRenderer } from \"~/inputRenderers/TextareaInput.js\";\nimport { LexicalInputRenderer } from \"~/inputRenderers/LexicalInput/LexicalInput.js\";\nimport { DefaultLexicalConfig } from \"~/inputRenderers/LexicalInput/DefaultLexicalConfig.js\";\nimport { SlotInputRenderer } from \"~/inputRenderers/SlotInput.js\";\nimport { GridLayoutInputRenderer } from \"~/inputRenderers/GridLayoutInput.js\";\nimport { SelectInputRenderer } from \"~/inputRenderers/SelectInput.js\";\nimport { FileInputRenderer } from \"~/inputRenderers/FileInput.js\";\nimport { FragmentSelectorInputRenderer } from \"~/inputRenderers/FragmentSelectorInput.js\";\n\nexport const ElementInputRenderers = () => {\n    return (\n        <>\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Slot\"}\n                component={SlotInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Input\"}\n                component={TextInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Select\"}\n                component={SelectInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Textarea\"}\n                component={TextareaInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Number\"}\n                component={NumberInputRenderer}\n            />\n            {/* Configure Lexical Editor*/}\n            <DefaultLexicalConfig />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Lexical\"}\n                component={LexicalInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Switch\"}\n                component={BooleanInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/GridLayout\"}\n                component={GridLayoutInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/FileManager\"}\n                component={FileInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/FragmentSelector\"}\n                component={FragmentSelectorInputRenderer}\n            />\n        </>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY;AACrB,SAASC,iBAAiB;AAC1B,SAASC,mBAAmB;AAC5B,SAASC,oBAAoB;AAC7B,SAASC,qBAAqB;AAC9B,SAASC,oBAAoB;AAC7B,SAASC,oBAAoB;AAC7B,SAASC,iBAAiB;AAC1B,SAASC,uBAAuB;AAChC,SAASC,mBAAmB;AAC5B,SAASC,iBAAiB;AAC1B,SAASC,6BAA6B;AAEtC,OAAO,MAAMC,qBAAqB,GAAGA,CAAA,KAAM;EACvC,oBACIb,KAAA,CAAAc,aAAA,CAAAd,KAAA,CAAAe,QAAA,qBACIf,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,aAAc;IACpBC,SAAS,EAAEX;EAAkB,CAChC,CAAC,eACFR,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,cAAe;IACrBC,SAAS,EAAEjB;EAAkB,CAChC,CAAC,eACFF,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,eAAgB;IACtBC,SAAS,EAAET;EAAoB,CAClC,CAAC,eACFV,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,iBAAkB;IACxBC,SAAS,EAAEd;EAAsB,CACpC,CAAC,eACFL,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,eAAgB;IACtBC,SAAS,EAAEhB;EAAoB,CAClC,CAAC,eAEFH,KAAA,CAAAc,aAAA,CAACP,oBAAoB,MAAE,CAAC,eACxBP,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,gBAAiB;IACvBC,SAAS,EAAEb;EAAqB,CACnC,CAAC,eACFN,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,eAAgB;IACtBC,SAAS,EAAEf;EAAqB,CACnC,CAAC,eACFJ,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,mBAAoB;IAC1BC,SAAS,EAAEV;EAAwB,CACtC,CAAC,eACFT,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,oBAAqB;IAC3BC,SAAS,EAAER;EAAkB,CAChC,CAAC,eACFX,KAAA,CAAAc,aAAA,CAACb,YAAY,CAACe,YAAY,CAACC,QAAQ;IAC/BC,IAAI,EAAE,yBAA0B;IAChCC,SAAS,EAAEP;EAA8B,CAC5C,CACH,CAAC;AAEX,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/ElementInputRenderers.js","sources":["../../../src/BaseEditor/defaultConfig/ElementInputRenderers.tsx"],"sourcesContent":["import React from \"react\";\nimport { EditorConfig } from \"~/BaseEditor/index.js\";\nimport { TextInputRenderer } from \"~/inputRenderers/TextInput.js\";\nimport { NumberInputRenderer } from \"~/inputRenderers/NumberInput.js\";\nimport { BooleanInputRenderer } from \"~/inputRenderers/BooleanInput.js\";\nimport { TextareaInputRenderer } from \"~/inputRenderers/TextareaInput.js\";\nimport { LexicalInputRenderer } from \"~/inputRenderers/LexicalInput/LexicalInput.js\";\nimport { DefaultLexicalConfig } from \"~/inputRenderers/LexicalInput/DefaultLexicalConfig.js\";\nimport { SlotInputRenderer } from \"~/inputRenderers/SlotInput.js\";\nimport { GridLayoutInputRenderer } from \"~/inputRenderers/GridLayoutInput.js\";\nimport { SelectInputRenderer } from \"~/inputRenderers/SelectInput.js\";\nimport { FileInputRenderer } from \"~/inputRenderers/FileInput.js\";\nimport { FragmentSelectorInputRenderer } from \"~/inputRenderers/FragmentSelectorInput.js\";\n\nexport const ElementInputRenderers = () => {\n    return (\n        <>\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Slot\"}\n                component={SlotInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Input\"}\n                component={TextInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Select\"}\n                component={SelectInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Textarea\"}\n                component={TextareaInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Number\"}\n                component={NumberInputRenderer}\n            />\n            {/* Configure Lexical Editor*/}\n            <DefaultLexicalConfig />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Lexical\"}\n                component={LexicalInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/Switch\"}\n                component={BooleanInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/GridLayout\"}\n                component={GridLayoutInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/FileManager\"}\n                component={FileInputRenderer}\n            />\n            <EditorConfig.ElementInput.Renderer\n                name={\"Webiny/FragmentSelector\"}\n                component={FragmentSelectorInputRenderer}\n            />\n        </>\n    );\n};\n"],"names":["ElementInputRenderers","EditorConfig","SlotInputRenderer","TextInputRenderer","SelectInputRenderer","TextareaInputRenderer","NumberInputRenderer","DefaultLexicalConfig","LexicalInputRenderer","BooleanInputRenderer","GridLayoutInputRenderer","FileInputRenderer","FragmentSelectorInputRenderer"],"mappings":";;;;;;;;;;;;;AAcO,MAAMA,wBAAwB,IAC1B,WAAP,GACI,wDACI,oBAACC,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWC;sBAEf,oBAACD,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWE;sBAEf,oBAACF,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWG;sBAEf,oBAACH,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWI;sBAEf,oBAACJ,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWK;sBAGf,oBAACC,sBAAoBA,OAAAA,WAAAA,GACrB,oBAACN,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWO;sBAEf,oBAACP,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWQ;sBAEf,oBAACR,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWS;sBAEf,oBAACT,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWU;sBAEf,oBAACV,aAAa,YAAY,CAAC,QAAQ;QAC/B,MAAM;QACN,WAAWW"}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementActions.js

@@ -1,30 +1,22 @@
-import _styled from "@emotion/styled/base";
-import React from "react";
+import react from "react";
+import styled from "@emotion/styled";
 import { EditorConfig } from "../../../index.js";
-
-// TODO: find a good place for this!
-export const COLORS = {
-  lightGray: "hsla(0, 0%, 97%, 1)",
-  gray: "hsla(300, 2%, 92%, 1)",
-  darkGray: "hsla(0, 0%, 70%, 1)",
-  darkestGray: "hsla(0, 0%, 20%, 1)",
-  black: "hsla(208, 100%, 5%, 1)"
-};
-const SidebarActions = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "production" ? {
-  target: "e1yqke5y0"
-} : {
-  target: "e1yqke5y0",
-  label: "SidebarActions"
-})({
-  display: "flex",
-  flexWrap: "wrap",
-  borderBottom: `1px solid ${COLORS.gray}`,
-  backgroundColor: COLORS.lightGray,
-  borderTop: `1px solid ${COLORS.gray}`,
-  justifyContent: "center"
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVsZW1lbnRBY3Rpb25zLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhdUIiLCJmaWxlIjoiRWxlbWVudEFjdGlvbnMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBFZGl0b3JDb25maWcgfSBmcm9tIFwifi9CYXNlRWRpdG9yL2luZGV4LmpzXCI7XG5cbi8vIFRPRE86IGZpbmQgYSBnb29kIHBsYWNlIGZvciB0aGlzIVxuZXhwb3J0IGNvbnN0IENPTE9SUyA9IHtcbiAgICBsaWdodEdyYXk6IFwiaHNsYSgwLCAwJSwgOTclLCAxKVwiLFxuICAgIGdyYXk6IFwiaHNsYSgzMDAsIDIlLCA5MiUsIDEpXCIsXG4gICAgZGFya0dyYXk6IFwiaHNsYSgwLCAwJSwgNzAlLCAxKVwiLFxuICAgIGRhcmtlc3RHcmF5OiBcImhzbGEoMCwgMCUsIDIwJSwgMSlcIixcbiAgICBibGFjazogXCJoc2xhKDIwOCwgMTAwJSwgNSUsIDEpXCJcbn07XG5cbmNvbnN0IFNpZGViYXJBY3Rpb25zID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBmbGV4V3JhcDogXCJ3cmFwXCIsXG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7Q09MT1JTLmdyYXl9YCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IENPTE9SUy5saWdodEdyYXksXG4gICAgYm9yZGVyVG9wOiBgMXB4IHNvbGlkICR7Q09MT1JTLmdyYXl9YCxcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIlxufSk7XG5cbmV4cG9ydCBjb25zdCBFbGVtZW50QWN0aW9ucyA9ICgpID0+IHtcbiAgICByZXR1cm4gKFxuICAgICAgICA8U2lkZWJhckFjdGlvbnM+XG4gICAgICAgICAgICA8RWRpdG9yQ29uZmlnLkVsZW1lbnRBY3Rpb25zIC8+XG4gICAgICAgIDwvU2lkZWJhckFjdGlvbnM+XG4gICAgKTtcbn07XG4iXX0= */");
-export const ElementActions = () => {
-  return /*#__PURE__*/React.createElement(SidebarActions, null, /*#__PURE__*/React.createElement(EditorConfig.ElementActions, null));
+const COLORS = {
+    lightGray: "hsla(0, 0%, 97%, 1)",
+    gray: "hsla(300, 2%, 92%, 1)",
+    darkGray: "hsla(0, 0%, 70%, 1)",
+    darkestGray: "hsla(0, 0%, 20%, 1)",
+    black: "hsla(208, 100%, 5%, 1)"
 };
+const SidebarActions = styled("div")({
+    display: "flex",
+    flexWrap: "wrap",
+    borderBottom: `1px solid ${COLORS.gray}`,
+    backgroundColor: COLORS.lightGray,
+    borderTop: `1px solid ${COLORS.gray}`,
+    justifyContent: "center"
+});
+const ElementActions = ()=>/*#__PURE__*/ react.createElement(SidebarActions, null, /*#__PURE__*/ react.createElement(EditorConfig.ElementActions, null));
+export { COLORS, ElementActions };
 
 //# sourceMappingURL=ElementActions.js.map

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementActions.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","EditorConfig","COLORS","lightGray","gray","darkGray","darkestGray","black","SidebarActions","_styled","process","env","NODE_ENV","target","label","display","flexWrap","borderBottom","backgroundColor","borderTop","justifyContent","ElementActions","createElement"],"sources":["ElementActions.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { EditorConfig } from \"~/BaseEditor/index.js\";\n\n// TODO: find a good place for this!\nexport const COLORS = {\n    lightGray: \"hsla(0, 0%, 97%, 1)\",\n    gray: \"hsla(300, 2%, 92%, 1)\",\n    darkGray: \"hsla(0, 0%, 70%, 1)\",\n    darkestGray: \"hsla(0, 0%, 20%, 1)\",\n    black: \"hsla(208, 100%, 5%, 1)\"\n};\n\nconst SidebarActions = styled(\"div\")({\n    display: \"flex\",\n    flexWrap: \"wrap\",\n    borderBottom: `1px solid ${COLORS.gray}`,\n    backgroundColor: COLORS.lightGray,\n    borderTop: `1px solid ${COLORS.gray}`,\n    justifyContent: \"center\"\n});\n\nexport const ElementActions = () => {\n    return (\n        <SidebarActions>\n            <EditorConfig.ElementActions />\n        </SidebarActions>\n    );\n};\n"],"mappings":";AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,YAAY;;AAErB;AACA,OAAO,MAAMC,MAAM,GAAG;EAClBC,SAAS,EAAE,qBAAqB;EAChCC,IAAI,EAAE,uBAAuB;EAC7BC,QAAQ,EAAE,qBAAqB;EAC/BC,WAAW,EAAE,qBAAqB;EAClCC,KAAK,EAAE;AACX,CAAC;AAED,MAAMC,cAAc,gBAAGC,OAAA,CAAO,KAAK,EAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,EAAC,CAAC;EACjCC,OAAO,EAAE,MAAM;EACfC,QAAQ,EAAE,MAAM;EAChBC,YAAY,EAAE,aAAaf,MAAM,CAACE,IAAI,EAAE;EACxCc,eAAe,EAAEhB,MAAM,CAACC,SAAS;EACjCgB,SAAS,EAAE,aAAajB,MAAM,CAACE,IAAI,EAAE;EACrCgB,cAAc,EAAE;AACpB,CAAC,EAAAV,OAAA,CAAAC,GAAA,CAAAC,QAAA,m1CAAC;AAEF,OAAO,MAAMS,cAAc,GAAGA,CAAA,KAAM;EAChC,oBACIrB,KAAA,CAAAsB,aAAA,CAACd,cAAc,qBACXR,KAAA,CAAAsB,aAAA,CAACrB,YAAY,CAACoB,cAAc,MAAE,CAClB,CAAC;AAEzB,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementActions.js","sources":["../../../../../src/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementActions.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { EditorConfig } from \"~/BaseEditor/index.js\";\n\n// TODO: find a good place for this!\nexport const COLORS = {\n    lightGray: \"hsla(0, 0%, 97%, 1)\",\n    gray: \"hsla(300, 2%, 92%, 1)\",\n    darkGray: \"hsla(0, 0%, 70%, 1)\",\n    darkestGray: \"hsla(0, 0%, 20%, 1)\",\n    black: \"hsla(208, 100%, 5%, 1)\"\n};\n\nconst SidebarActions = styled(\"div\")({\n    display: \"flex\",\n    flexWrap: \"wrap\",\n    borderBottom: `1px solid ${COLORS.gray}`,\n    backgroundColor: COLORS.lightGray,\n    borderTop: `1px solid ${COLORS.gray}`,\n    justifyContent: \"center\"\n});\n\nexport const ElementActions = () => {\n    return (\n        <SidebarActions>\n            <EditorConfig.ElementActions />\n        </SidebarActions>\n    );\n};\n"],"names":["COLORS","SidebarActions","styled","ElementActions","EditorConfig"],"mappings":";;;AAKO,MAAMA,SAAS;IAClB,WAAW;IACX,MAAM;IACN,UAAU;IACV,aAAa;IACb,OAAO;AACX;AAEA,MAAMC,iBAAiBC,OAAO,OAAO;IACjC,SAAS;IACT,UAAU;IACV,cAAc,CAAC,UAAU,EAAEF,OAAO,IAAI,EAAE;IACxC,iBAAiBA,OAAO,SAAS;IACjC,WAAW,CAAC,UAAU,EAAEA,OAAO,IAAI,EAAE;IACrC,gBAAgB;AACpB;AAEO,MAAMG,iBAAiB,IACnB,WAAP,GACI,oBAACF,gBAAcA,MAAAA,WAAAA,GACX,oBAACG,aAAa,cAAc"}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementInputs.js

@@ -1,4 +1,4 @@
-import React, { useMemo } from "react";
+import react, { useMemo } from "react";
 import { Grid } from "@webiny/admin-ui";
 import { makeDecoratable } from "@webiny/app-admin";
 import { useComponent } from "../../../hooks/useComponent.js";
@@ -6,77 +6,30 @@ import { InputRenderer } from "./InputRenderer.js";
 import { ComponentManifestToAstConverter } from "@webiny/website-builder-sdk";
 import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument.js";
 import { InfoMessage } from "../InfoMessage.js";
-export const ElementInputs = makeDecoratable("ElementInputs", ({
-  element
-}) => {
-  const component = useComponent(element.component.name);
-  const bindings = useSelectFromDocument(document => {
-    return document.bindings[element.id] ?? {
-      inputs: {}
-    };
-  }, [element.id]);
-  const inputsAst = useMemo(() => {
-    return ComponentManifestToAstConverter.convert(component.inputs ?? []);
-  }, [component.name, element.id]);
-  const hasEditableInputs = useMemo(() => {
-    return inputsAst.filter(input => input.type !== "slot").length > 0;
-  }, [inputsAst]);
-  if (!element) {
-    return null;
-  }
-  if (!hasEditableInputs) {
-    return /*#__PURE__*/React.createElement(InfoMessage, {
-      message: "This element has no inputs."
+const ElementInputs = makeDecoratable("ElementInputs", ({ element })=>{
+    const component = useComponent(element.component.name);
+    const bindings = useSelectFromDocument((document)=>document.bindings[element.id] ?? {
+            inputs: {}
+        }, [
+        element.id
+    ]);
+    const inputsAst = useMemo(()=>ComponentManifestToAstConverter.convert(component.inputs ?? []), [
+        component.name,
+        element.id
+    ]);
+    const hasEditableInputs = useMemo(()=>inputsAst.filter((input)=>"slot" !== input.type).length > 0, [
+        inputsAst
+    ]);
+    if (!element) return null;
+    if (!hasEditableInputs) return /*#__PURE__*/ react.createElement(InfoMessage, {
+        message: "This element has no inputs."
     });
-  }
-  return /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(InputRenderer, {
-    key: element.id,
-    ast: inputsAst,
-    bindings: bindings.inputs
-  }));
+    return /*#__PURE__*/ react.createElement(Grid, null, /*#__PURE__*/ react.createElement(InputRenderer, {
+        key: element.id,
+        ast: inputsAst,
+        bindings: bindings.inputs
+    }));
 });
-
-// interface ElementInputProps {
-//     element: DocumentElement;
-//     input: ComponentInput;
-// }
-//
-// const ElementInput = ({ element, input }: ElementInputProps) => {
-//     const Renderer = useInputRenderer(input.renderer || "__unknown__");
-//
-//     const { value, onChange, onPreviewChange, setBindingType } = useInputValue(element, input);
-//
-//     /*   return (
-//         <Renderer
-//             value={value.static}
-//             input={input}
-//             onChange={onChange}
-//             onPreviewChange={onPreviewChange}
-//         />
-//     );*/
-//     if (value.expression) {
-//         return (
-//             <WithBindingToggle type={"expression"} setBindingType={setBindingType}>
-//                 <ExpressionRenderer
-//                     element={element}
-//                     value={value.expression}
-//                     onChange={onChange}
-//                     input={input}
-//                 />
-//             </WithBindingToggle>
-//         );
-//     }
-//
-//     return (
-//         <WithBindingToggle type={"static"} setBindingType={setBindingType}>
-//             <Renderer
-//                 value={value.static}
-//                 input={input}
-//                 onChange={onChange}
-//                 onPreviewChange={onPreviewChange}
-//             />
-//         </WithBindingToggle>
-//     );
-// };
+export { ElementInputs };
 
 //# sourceMappingURL=ElementInputs.js.map

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementInputs.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","Grid","makeDecoratable","useComponent","InputRenderer","ComponentManifestToAstConverter","useSelectFromDocument","InfoMessage","ElementInputs","element","component","name","bindings","document","id","inputs","inputsAst","convert","hasEditableInputs","filter","input","type","length","createElement","message","key","ast"],"sources":["ElementInputs.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { Grid } from \"@webiny/admin-ui\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { DocumentElement } from \"@webiny/website-builder-sdk\";\nimport { useComponent } from \"~/BaseEditor/hooks/useComponent.js\";\nimport { InputRenderer } from \"./InputRenderer.js\";\nimport { ComponentManifestToAstConverter } from \"@webiny/website-builder-sdk\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument.js\";\nimport { InfoMessage } from \"~/BaseEditor/defaultConfig/Sidebar/InfoMessage.js\";\n\ninterface ElementInputsProps {\n    element: DocumentElement;\n}\n\nexport const ElementInputs = makeDecoratable(\"ElementInputs\", ({ element }: ElementInputsProps) => {\n    const component = useComponent(element.component.name);\n\n    const bindings = useSelectFromDocument(\n        document => {\n            return document.bindings[element.id] ?? { inputs: {} };\n        },\n        [element.id]\n    );\n\n    const inputsAst = useMemo(() => {\n        return ComponentManifestToAstConverter.convert(component.inputs ?? []);\n    }, [component.name, element.id]);\n\n    const hasEditableInputs = useMemo(() => {\n        return inputsAst.filter(input => input.type !== \"slot\").length > 0;\n    }, [inputsAst]);\n\n    if (!element) {\n        return null;\n    }\n\n    if (!hasEditableInputs) {\n        return <InfoMessage message={\"This element has no inputs.\"} />;\n    }\n\n    return (\n        <Grid>\n            {/*<Grid.Column key={\"repeat\"} span={12}>*/}\n            {/*    <Select*/}\n            {/*        label={\"Repeat for each\"}*/}\n            {/*        placeholder={\"Select binding\"}*/}\n            {/*        options={arrayOptions}*/}\n            {/*        value={repeat.value ?? \"\"}*/}\n            {/*        onChange={value => repeat.onChange(value === \"\" ? undefined : value)}*/}\n            {/*    />*/}\n            {/*</Grid.Column>*/}\n            <InputRenderer key={element.id} ast={inputsAst} bindings={bindings.inputs} />\n        </Grid>\n    );\n});\n\n// interface ElementInputProps {\n//     element: DocumentElement;\n//     input: ComponentInput;\n// }\n//\n// const ElementInput = ({ element, input }: ElementInputProps) => {\n//     const Renderer = useInputRenderer(input.renderer || \"__unknown__\");\n//\n//     const { value, onChange, onPreviewChange, setBindingType } = useInputValue(element, input);\n//\n//     /*   return (\n//         <Renderer\n//             value={value.static}\n//             input={input}\n//             onChange={onChange}\n//             onPreviewChange={onPreviewChange}\n//         />\n//     );*/\n//     if (value.expression) {\n//         return (\n//             <WithBindingToggle type={\"expression\"} setBindingType={setBindingType}>\n//                 <ExpressionRenderer\n//                     element={element}\n//                     value={value.expression}\n//                     onChange={onChange}\n//                     input={input}\n//                 />\n//             </WithBindingToggle>\n//         );\n//     }\n//\n//     return (\n//         <WithBindingToggle type={\"static\"} setBindingType={setBindingType}>\n//             <Renderer\n//                 value={value.static}\n//                 input={input}\n//                 onChange={onChange}\n//                 onPreviewChange={onPreviewChange}\n//             />\n//         </WithBindingToggle>\n//     );\n// };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,IAAI,QAAQ,kBAAkB;AACvC,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,YAAY;AACrB,SAASC,aAAa;AACtB,SAASC,+BAA+B,QAAQ,6BAA6B;AAC7E,SAASC,qBAAqB;AAC9B,SAASC,WAAW;AAMpB,OAAO,MAAMC,aAAa,GAAGN,eAAe,CAAC,eAAe,EAAE,CAAC;EAAEO;AAA4B,CAAC,KAAK;EAC/F,MAAMC,SAAS,GAAGP,YAAY,CAACM,OAAO,CAACC,SAAS,CAACC,IAAI,CAAC;EAEtD,MAAMC,QAAQ,GAAGN,qBAAqB,CAClCO,QAAQ,IAAI;IACR,OAAOA,QAAQ,CAACD,QAAQ,CAACH,OAAO,CAACK,EAAE,CAAC,IAAI;MAAEC,MAAM,EAAE,CAAC;IAAE,CAAC;EAC1D,CAAC,EACD,CAACN,OAAO,CAACK,EAAE,CACf,CAAC;EAED,MAAME,SAAS,GAAGhB,OAAO,CAAC,MAAM;IAC5B,OAAOK,+BAA+B,CAACY,OAAO,CAACP,SAAS,CAACK,MAAM,IAAI,EAAE,CAAC;EAC1E,CAAC,EAAE,CAACL,SAAS,CAACC,IAAI,EAAEF,OAAO,CAACK,EAAE,CAAC,CAAC;EAEhC,MAAMI,iBAAiB,GAAGlB,OAAO,CAAC,MAAM;IACpC,OAAOgB,SAAS,CAACG,MAAM,CAACC,KAAK,IAAIA,KAAK,CAACC,IAAI,KAAK,MAAM,CAAC,CAACC,MAAM,GAAG,CAAC;EACtE,CAAC,EAAE,CAACN,SAAS,CAAC,CAAC;EAEf,IAAI,CAACP,OAAO,EAAE;IACV,OAAO,IAAI;EACf;EAEA,IAAI,CAACS,iBAAiB,EAAE;IACpB,oBAAOnB,KAAA,CAAAwB,aAAA,CAAChB,WAAW;MAACiB,OAAO,EAAE;IAA8B,CAAE,CAAC;EAClE;EAEA,oBACIzB,KAAA,CAAAwB,aAAA,CAACtB,IAAI,qBAUDF,KAAA,CAAAwB,aAAA,CAACnB,aAAa;IAACqB,GAAG,EAAEhB,OAAO,CAACK,EAAG;IAACY,GAAG,EAAEV,SAAU;IAACJ,QAAQ,EAAEA,QAAQ,CAACG;EAAO,CAAE,CAC1E,CAAC;AAEf,CAAC,CAAC;;AAEF;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementInputs.js","sources":["../../../../../src/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementInputs.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { Grid } from \"@webiny/admin-ui\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { DocumentElement } from \"@webiny/website-builder-sdk\";\nimport { useComponent } from \"~/BaseEditor/hooks/useComponent.js\";\nimport { InputRenderer } from \"./InputRenderer.js\";\nimport { ComponentManifestToAstConverter } from \"@webiny/website-builder-sdk\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument.js\";\nimport { InfoMessage } from \"~/BaseEditor/defaultConfig/Sidebar/InfoMessage.js\";\n\ninterface ElementInputsProps {\n    element: DocumentElement;\n}\n\nexport const ElementInputs = makeDecoratable(\"ElementInputs\", ({ element }: ElementInputsProps) => {\n    const component = useComponent(element.component.name);\n\n    const bindings = useSelectFromDocument(\n        document => {\n            return document.bindings[element.id] ?? { inputs: {} };\n        },\n        [element.id]\n    );\n\n    const inputsAst = useMemo(() => {\n        return ComponentManifestToAstConverter.convert(component.inputs ?? []);\n    }, [component.name, element.id]);\n\n    const hasEditableInputs = useMemo(() => {\n        return inputsAst.filter(input => input.type !== \"slot\").length > 0;\n    }, [inputsAst]);\n\n    if (!element) {\n        return null;\n    }\n\n    if (!hasEditableInputs) {\n        return <InfoMessage message={\"This element has no inputs.\"} />;\n    }\n\n    return (\n        <Grid>\n            {/*<Grid.Column key={\"repeat\"} span={12}>*/}\n            {/*    <Select*/}\n            {/*        label={\"Repeat for each\"}*/}\n            {/*        placeholder={\"Select binding\"}*/}\n            {/*        options={arrayOptions}*/}\n            {/*        value={repeat.value ?? \"\"}*/}\n            {/*        onChange={value => repeat.onChange(value === \"\" ? undefined : value)}*/}\n            {/*    />*/}\n            {/*</Grid.Column>*/}\n            <InputRenderer key={element.id} ast={inputsAst} bindings={bindings.inputs} />\n        </Grid>\n    );\n});\n\n// interface ElementInputProps {\n//     element: DocumentElement;\n//     input: ComponentInput;\n// }\n//\n// const ElementInput = ({ element, input }: ElementInputProps) => {\n//     const Renderer = useInputRenderer(input.renderer || \"__unknown__\");\n//\n//     const { value, onChange, onPreviewChange, setBindingType } = useInputValue(element, input);\n//\n//     /*   return (\n//         <Renderer\n//             value={value.static}\n//             input={input}\n//             onChange={onChange}\n//             onPreviewChange={onPreviewChange}\n//         />\n//     );*/\n//     if (value.expression) {\n//         return (\n//             <WithBindingToggle type={\"expression\"} setBindingType={setBindingType}>\n//                 <ExpressionRenderer\n//                     element={element}\n//                     value={value.expression}\n//                     onChange={onChange}\n//                     input={input}\n//                 />\n//             </WithBindingToggle>\n//         );\n//     }\n//\n//     return (\n//         <WithBindingToggle type={\"static\"} setBindingType={setBindingType}>\n//             <Renderer\n//                 value={value.static}\n//                 input={input}\n//                 onChange={onChange}\n//                 onPreviewChange={onPreviewChange}\n//             />\n//         </WithBindingToggle>\n//     );\n// };\n"],"names":["ElementInputs","makeDecoratable","element","component","useComponent","bindings","useSelectFromDocument","document","inputsAst","useMemo","ComponentManifestToAstConverter","hasEditableInputs","input","InfoMessage","Grid","InputRenderer"],"mappings":";;;;;;;;AAcO,MAAMA,gBAAgBC,gBAAgB,iBAAiB,CAAC,EAAEC,OAAO,EAAsB;IAC1F,MAAMC,YAAYC,aAAaF,QAAQ,SAAS,CAAC,IAAI;IAErD,MAAMG,WAAWC,sBACbC,CAAAA,WACWA,SAAS,QAAQ,CAACL,QAAQ,EAAE,CAAC,IAAI;YAAE,QAAQ,CAAC;QAAE,GAEzD;QAACA,QAAQ,EAAE;KAAC;IAGhB,MAAMM,YAAYC,QAAQ,IACfC,gCAAgC,OAAO,CAACP,UAAU,MAAM,IAAI,EAAE,GACtE;QAACA,UAAU,IAAI;QAAED,QAAQ,EAAE;KAAC;IAE/B,MAAMS,oBAAoBF,QAAQ,IACvBD,UAAU,MAAM,CAACI,CAAAA,QAASA,AAAe,WAAfA,MAAM,IAAI,EAAa,MAAM,GAAG,GAClE;QAACJ;KAAU;IAEd,IAAI,CAACN,SACD,OAAO;IAGX,IAAI,CAACS,mBACD,OAAO,WAAP,GAAO,oBAACE,aAAWA;QAAC,SAAS;;IAGjC,OAAO,WAAP,GACI,oBAACC,MAAIA,MAAAA,WAAAA,GAUD,oBAACC,eAAaA;QAAC,KAAKb,QAAQ,EAAE;QAAE,KAAKM;QAAW,UAAUH,SAAS,MAAM;;AAGrF"}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettings.js

@@ -1,14 +1,13 @@
-import React from "react";
+import react from "react";
 import { useActiveElement } from "../../../hooks/useActiveElement.js";
 import { ElementInputs } from "./ElementInputs.js";
-export const ElementSettings = () => {
-  const [element] = useActiveElement();
-  if (!element) {
-    return null;
-  }
-  return /*#__PURE__*/React.createElement(ElementInputs, {
-    element: element
-  });
+const ElementSettings = ()=>{
+    const [element] = useActiveElement();
+    if (!element) return null;
+    return /*#__PURE__*/ react.createElement(ElementInputs, {
+        element: element
+    });
 };
+export { ElementSettings };
 
 //# sourceMappingURL=ElementSettings.js.map

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettings.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useActiveElement","ElementInputs","ElementSettings","element","createElement"],"sources":["ElementSettings.tsx"],"sourcesContent":["import React from \"react\";\nimport { useActiveElement } from \"~/BaseEditor/hooks/useActiveElement.js\";\nimport { ElementInputs } from \"./ElementInputs.js\";\n\nexport const ElementSettings = () => {\n    const [element] = useActiveElement();\n\n    if (!element) {\n        return null;\n    }\n\n    return <ElementInputs element={element} />;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB;AACzB,SAASC,aAAa;AAEtB,OAAO,MAAMC,eAAe,GAAGA,CAAA,KAAM;EACjC,MAAM,CAACC,OAAO,CAAC,GAAGH,gBAAgB,CAAC,CAAC;EAEpC,IAAI,CAACG,OAAO,EAAE;IACV,OAAO,IAAI;EACf;EAEA,oBAAOJ,KAAA,CAAAK,aAAA,CAACH,aAAa;IAACE,OAAO,EAAEA;EAAQ,CAAE,CAAC;AAC9C,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettings.js","sources":["../../../../../src/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettings.tsx"],"sourcesContent":["import React from \"react\";\nimport { useActiveElement } from \"~/BaseEditor/hooks/useActiveElement.js\";\nimport { ElementInputs } from \"./ElementInputs.js\";\n\nexport const ElementSettings = () => {\n    const [element] = useActiveElement();\n\n    if (!element) {\n        return null;\n    }\n\n    return <ElementInputs element={element} />;\n};\n"],"names":["ElementSettings","element","useActiveElement","ElementInputs"],"mappings":";;;AAIO,MAAMA,kBAAkB;IAC3B,MAAM,CAACC,QAAQ,GAAGC;IAElB,IAAI,CAACD,SACD,OAAO;IAGX,OAAO,WAAP,GAAO,oBAACE,eAAaA;QAAC,SAASF;;AACnC"}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettingsGroup.js

@@ -1,16 +1,15 @@
-import React from "react";
+import react from "react";
 import { Sidebar } from "../../../config/Sidebar/Sidebar.js";
 import { ScrollableContainer } from "../../../config/Sidebar/ScrollableContainer.js";
-export const ElementSettingsGroup = () => {
-  return /*#__PURE__*/React.createElement(ScrollableContainer, {
-    tabIndex: -1
-  }, /*#__PURE__*/React.createElement(Sidebar.Group.Tab, {
-    name: "element",
-    label: "Element",
-    element: /*#__PURE__*/React.createElement(Sidebar.Elements, {
-      group: "element"
-    })
-  }));
-};
+const ElementSettingsGroup = ()=>/*#__PURE__*/ react.createElement(ScrollableContainer, {
+        tabIndex: -1
+    }, /*#__PURE__*/ react.createElement(Sidebar.Group.Tab, {
+        name: "element",
+        label: "Element",
+        element: /*#__PURE__*/ react.createElement(Sidebar.Elements, {
+            group: "element"
+        })
+    }));
+export { ElementSettingsGroup };
 
 //# sourceMappingURL=ElementSettingsGroup.js.map

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettingsGroup.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Sidebar","ScrollableContainer","ElementSettingsGroup","createElement","tabIndex","Group","Tab","name","label","element","Elements","group"],"sources":["ElementSettingsGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { Sidebar } from \"~/BaseEditor/config/Sidebar/Sidebar.js\";\nimport { ScrollableContainer } from \"~/BaseEditor/config/Sidebar/ScrollableContainer.js\";\n\nexport const ElementSettingsGroup = () => {\n    return (\n        <ScrollableContainer tabIndex={-1}>\n            <Sidebar.Group.Tab\n                name={\"element\"}\n                label={\"Element\"}\n                element={<Sidebar.Elements group={\"element\"} />}\n            />\n        </ScrollableContainer>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,OAAO;AAChB,SAASC,mBAAmB;AAE5B,OAAO,MAAMC,oBAAoB,GAAGA,CAAA,KAAM;EACtC,oBACIH,KAAA,CAAAI,aAAA,CAACF,mBAAmB;IAACG,QAAQ,EAAE,CAAC;EAAE,gBAC9BL,KAAA,CAAAI,aAAA,CAACH,OAAO,CAACK,KAAK,CAACC,GAAG;IACdC,IAAI,EAAE,SAAU;IAChBC,KAAK,EAAE,SAAU;IACjBC,OAAO,eAAEV,KAAA,CAAAI,aAAA,CAACH,OAAO,CAACU,QAAQ;MAACC,KAAK,EAAE;IAAU,CAAE;EAAE,CACnD,CACgB,CAAC;AAE9B,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettingsGroup.js","sources":["../../../../../src/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettingsGroup.tsx"],"sourcesContent":["import React from \"react\";\nimport { Sidebar } from \"~/BaseEditor/config/Sidebar/Sidebar.js\";\nimport { ScrollableContainer } from \"~/BaseEditor/config/Sidebar/ScrollableContainer.js\";\n\nexport const ElementSettingsGroup = () => {\n    return (\n        <ScrollableContainer tabIndex={-1}>\n            <Sidebar.Group.Tab\n                name={\"element\"}\n                label={\"Element\"}\n                element={<Sidebar.Elements group={\"element\"} />}\n            />\n        </ScrollableContainer>\n    );\n};\n"],"names":["ElementSettingsGroup","ScrollableContainer","Sidebar"],"mappings":";;;AAIO,MAAMA,uBAAuB,IACzB,WAAP,GACI,oBAACC,qBAAmBA;QAAC,UAAU;qBAC3B,oBAACC,QAAQ,KAAK,CAAC,GAAG;QACd,MAAM;QACN,OAAO;QACP,uBAAS,oBAACA,QAAQ,QAAQ;YAAC,OAAO"}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ExpressionRenderer.js

@@ -1,33 +1,21 @@
-import React from "react";
+import react from "react";
 import { Select } from "@webiny/admin-ui";
 import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument.js";
 import { StatePathsExtractor } from "./StatePathsExtractor.js";
-export const ExpressionRenderer = ({
-  element,
-  input,
-  value,
-  onChange
-}) => {
-  const options = useSelectFromDocument(document => {
-    const repeat = document.bindings[element.id]?.$repeat;
-    if (repeat) {
-      return new StatePathsExtractor(document.state).getChildPaths(repeat.expression)
-      // TODO: implement data type adapters
-      // .filter(option => option.type.matches(input.dataType))
-      .values();
-    }
-    return new StatePathsExtractor(document.state).getPaths()
-    // TODO: implement data type adapters
-    // .filter(option => option.type.matches(input.dataType))
-    .values();
-  });
-  return /*#__PURE__*/React.createElement(Select, {
-    label: input.label,
-    placeholder: "Select binding",
-    options: options,
-    value: value,
-    onChange: value => onChange(value === "" ? undefined : value)
-  });
+const ExpressionRenderer = ({ element, input, value, onChange })=>{
+    const options = useSelectFromDocument((document)=>{
+        const repeat = document.bindings[element.id]?.$repeat;
+        if (repeat) return new StatePathsExtractor(document.state).getChildPaths(repeat.expression).values();
+        return new StatePathsExtractor(document.state).getPaths().values();
+    });
+    return /*#__PURE__*/ react.createElement(Select, {
+        label: input.label,
+        placeholder: "Select binding",
+        options: options,
+        value: value,
+        onChange: (value)=>onChange("" === value ? void 0 : value)
+    });
 };
+export { ExpressionRenderer };
 
 //# sourceMappingURL=ExpressionRenderer.js.map