@webiny/app-website-builder 0.0.0-unstable.06b2ede40f

package/BaseEditor/defaultConfig/DocumentStateEditor/index.d.ts

@@ -0,0 +1 @@
+export * from "./DocumentStateEditor";

package/BaseEditor/defaultConfig/DocumentStateEditor/index.js

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

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.tsx"],"sourcesContent":["export * from \"./DocumentStateEditor\";\n"],"mappings":"AAAA","ignoreList":[]}

package/BaseEditor/defaultConfig/ElementInputRenderers.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const ElementInputRenderers: () => React.JSX.Element;

package/BaseEditor/defaultConfig/ElementInputRenderers.js

@@ -0,0 +1,48 @@
+import React from "react";
+import { EditorConfig } from "./..";
+import { TextInputRenderer } from "../../inputRenderers/TextInput";
+import { NumberInputRenderer } from "../../inputRenderers/NumberInput";
+import { BooleanInputRenderer } from "../../inputRenderers/BooleanInput";
+import { TextareaInputRenderer } from "../../inputRenderers/TextareaInput";
+import { LexicalInputRenderer } from "../../inputRenderers/LexicalInput/LexicalInput";
+import { DefaultLexicalConfig } from "../../inputRenderers/LexicalInput/DefaultLexicalConfig";
+import { SlotInputRenderer } from "../../inputRenderers/SlotInput";
+import { GridLayoutInputRenderer } from "../../inputRenderers/GridLayoutInput";
+import { SelectInputRenderer } from "../../inputRenderers/SelectInput";
+import { FileInputRenderer } from "../../inputRenderers/FileInput";
+import { FragmentSelectorInputRenderer } from "../../inputRenderers/FragmentSelectorInput";
+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
+  }));
+};
+
+//# sourceMappingURL=ElementInputRenderers.js.map

package/BaseEditor/defaultConfig/ElementInputRenderers.js.map

@@ -0,0 +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\";\nimport { TextInputRenderer } from \"~/inputRenderers/TextInput\";\nimport { NumberInputRenderer } from \"~/inputRenderers/NumberInput\";\nimport { BooleanInputRenderer } from \"~/inputRenderers/BooleanInput\";\nimport { TextareaInputRenderer } from \"~/inputRenderers/TextareaInput\";\nimport { LexicalInputRenderer } from \"~/inputRenderers/LexicalInput/LexicalInput\";\nimport { DefaultLexicalConfig } from \"~/inputRenderers/LexicalInput/DefaultLexicalConfig\";\nimport { SlotInputRenderer } from \"~/inputRenderers/SlotInput\";\nimport { GridLayoutInputRenderer } from \"~/inputRenderers/GridLayoutInput\";\nimport { SelectInputRenderer } from \"~/inputRenderers/SelectInput\";\nimport { FileInputRenderer } from \"~/inputRenderers/FileInput\";\nimport { FragmentSelectorInputRenderer } from \"~/inputRenderers/FragmentSelectorInput\";\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":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementActions.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export declare const COLORS: {
+    lightGray: string;
+    gray: string;
+    darkGray: string;
+    darkestGray: string;
+    black: string;
+};
+export declare const ElementActions: () => React.JSX.Element;

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

@@ -0,0 +1,30 @@
+import _styled from "@emotion/styled/base";
+import React from "react";
+import { EditorConfig } from "../../..";
+
+// 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,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkVsZW1lbnRBY3Rpb25zLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFhdUIiLCJmaWxlIjoiRWxlbWVudEFjdGlvbnMudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBFZGl0b3JDb25maWcgfSBmcm9tIFwifi9CYXNlRWRpdG9yXCI7XG5cbi8vIFRPRE86IGZpbmQgYSBnb29kIHBsYWNlIGZvciB0aGlzIVxuZXhwb3J0IGNvbnN0IENPTE9SUyA9IHtcbiAgICBsaWdodEdyYXk6IFwiaHNsYSgwLCAwJSwgOTclLCAxKVwiLFxuICAgIGdyYXk6IFwiaHNsYSgzMDAsIDIlLCA5MiUsIDEpXCIsXG4gICAgZGFya0dyYXk6IFwiaHNsYSgwLCAwJSwgNzAlLCAxKVwiLFxuICAgIGRhcmtlc3RHcmF5OiBcImhzbGEoMCwgMCUsIDIwJSwgMSlcIixcbiAgICBibGFjazogXCJoc2xhKDIwOCwgMTAwJSwgNSUsIDEpXCJcbn07XG5cbmNvbnN0IFNpZGViYXJBY3Rpb25zID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBkaXNwbGF5OiBcImZsZXhcIixcbiAgICBmbGV4V3JhcDogXCJ3cmFwXCIsXG4gICAgYm9yZGVyQm90dG9tOiBgMXB4IHNvbGlkICR7Q09MT1JTLmdyYXl9YCxcbiAgICBiYWNrZ3JvdW5kQ29sb3I6IENPTE9SUy5saWdodEdyYXksXG4gICAgYm9yZGVyVG9wOiBgMXB4IHNvbGlkICR7Q09MT1JTLmdyYXl9YCxcbiAgICBqdXN0aWZ5Q29udGVudDogXCJjZW50ZXJcIlxufSk7XG5cbmV4cG9ydCBjb25zdCBFbGVtZW50QWN0aW9ucyA9ICgpID0+IHtcbiAgICByZXR1cm4gKFxuICAgICAgICA8U2lkZWJhckFjdGlvbnM+XG4gICAgICAgICAgICA8RWRpdG9yQ29uZmlnLkVsZW1lbnRBY3Rpb25zIC8+XG4gICAgICAgIDwvU2lkZWJhckFjdGlvbnM+XG4gICAgKTtcbn07XG4iXX0= */");
+export const ElementActions = () => {
+  return /*#__PURE__*/React.createElement(SidebarActions, null, /*#__PURE__*/React.createElement(EditorConfig.ElementActions, null));
+};
+
+//# sourceMappingURL=ElementActions.js.map

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

@@ -0,0 +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\";\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,u0CAAC;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":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementInputs.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import type { DocumentElement } from "@webiny/website-builder-sdk";
+interface ElementInputsProps {
+    element: DocumentElement;
+}
+export declare const ElementInputs: ({ element }: ElementInputsProps) => React.JSX.Element | null;
+export {};

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

@@ -0,0 +1,81 @@
+import React, { useMemo } from "react";
+import { Grid } from "@webiny/admin-ui";
+import { useComponent } from "../../../hooks/useComponent";
+import { InputRenderer } from "./InputRenderer";
+import { ComponentManifestToAstConverter } from "@webiny/website-builder-sdk";
+import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument";
+import { InfoMessage } from "../InfoMessage";
+export const 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."
+    });
+  }
+  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>
+//     );
+// };
+
+//# sourceMappingURL=ElementInputs.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useMemo","Grid","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 type { DocumentElement } from \"@webiny/website-builder-sdk\";\nimport { useComponent } from \"~/BaseEditor/hooks/useComponent\";\nimport { InputRenderer } from \"./InputRenderer\";\nimport { ComponentManifestToAstConverter } from \"@webiny/website-builder-sdk\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument\";\nimport { InfoMessage } from \"~/BaseEditor/defaultConfig/Sidebar/InfoMessage\";\n\ninterface ElementInputsProps {\n    element: DocumentElement;\n}\n\nexport const 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;AAEvC,SAASC,YAAY;AACrB,SAASC,aAAa;AACtB,SAASC,+BAA+B,QAAQ,6BAA6B;AAC7E,SAASC,qBAAqB;AAC9B,SAASC,WAAW;AAMpB,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAAEC;AAA4B,CAAC,KAAK;EAC9D,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,GAAGf,OAAO,CAAC,MAAM;IAC5B,OAAOI,+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,GAAGjB,OAAO,CAAC,MAAM;IACpC,OAAOe,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,oBAAOlB,KAAA,CAAAuB,aAAA,CAAChB,WAAW;MAACiB,OAAO,EAAE;IAA8B,CAAE,CAAC;EAClE;EAEA,oBACIxB,KAAA,CAAAuB,aAAA,CAACrB,IAAI,qBAUDF,KAAA,CAAAuB,aAAA,CAACnB,aAAa;IAACqB,GAAG,EAAEhB,OAAO,CAACK,EAAG;IAACY,GAAG,EAAEV,SAAU;IAACJ,QAAQ,EAAEA,QAAQ,CAACG;EAAO,CAAE,CAC1E,CAAC;AAEf,CAAC;;AAED;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":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettings.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const ElementSettings: () => React.JSX.Element | null;

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

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

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useActiveElement","ElementInputs","ElementSettings","element","createElement"],"sources":["ElementSettings.tsx"],"sourcesContent":["import React from \"react\";\nimport { useActiveElement } from \"~/BaseEditor/hooks/useActiveElement\";\nimport { ElementInputs } from \"./ElementInputs\";\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":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ElementSettingsGroup.d.ts

@@ -0,0 +1,2 @@
+import React from "react";
+export declare const ElementSettingsGroup: () => React.JSX.Element;

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

@@ -0,0 +1,16 @@
+import React from "react";
+import { Sidebar } from "../../../config/Sidebar/Sidebar";
+import { ScrollableContainer } from "../../../config/Sidebar/ScrollableContainer";
+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"
+    })
+  }));
+};
+
+//# sourceMappingURL=ElementSettingsGroup.js.map

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

@@ -0,0 +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\";\nimport { ScrollableContainer } from \"~/BaseEditor/config/Sidebar/ScrollableContainer\";\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":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/ExpressionRenderer.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import type { ComponentInput, DocumentElement } from "@webiny/website-builder-sdk";
+interface ExpressionRendererProps {
+    element: DocumentElement;
+    input: ComponentInput;
+    value: string;
+    onChange: (value: string) => void;
+}
+export declare const ExpressionRenderer: ({ element, input, value, onChange }: ExpressionRendererProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,33 @@
+import React from "react";
+import { Select } from "@webiny/admin-ui";
+import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument";
+import { StatePathsExtractor } from "./StatePathsExtractor";
+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)
+  });
+};
+
+//# sourceMappingURL=ExpressionRenderer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Select","useSelectFromDocument","StatePathsExtractor","ExpressionRenderer","element","input","value","onChange","options","document","repeat","bindings","id","$repeat","state","getChildPaths","expression","values","getPaths","createElement","label","placeholder","undefined"],"sources":["ExpressionRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { Select } from \"@webiny/admin-ui\";\n\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument\";\nimport { StatePathsExtractor } from \"~/BaseEditor/defaultConfig/Sidebar/ElementSettings/StatePathsExtractor\";\nimport type { ComponentInput, DocumentElement } from \"@webiny/website-builder-sdk\";\n\ninterface ExpressionRendererProps {\n    element: DocumentElement;\n    input: ComponentInput;\n    value: string;\n    onChange: (value: string) => void;\n}\n\nexport const ExpressionRenderer = ({\n    element,\n    input,\n    value,\n    onChange\n}: ExpressionRendererProps) => {\n    const options = useSelectFromDocument(document => {\n        const repeat = document.bindings[element.id]?.$repeat;\n\n        if (repeat) {\n            return (\n                new StatePathsExtractor(document.state)\n                    .getChildPaths(repeat.expression)\n                    // TODO: implement data type adapters\n                    // .filter(option => option.type.matches(input.dataType))\n                    .values()\n            );\n        }\n        return (\n            new StatePathsExtractor(document.state)\n                .getPaths()\n                // TODO: implement data type adapters\n                // .filter(option => option.type.matches(input.dataType))\n                .values()\n        );\n    });\n\n    return (\n        <Select\n            label={input.label}\n            placeholder={\"Select binding\"}\n            options={options}\n            value={value}\n            onChange={value => onChange(value === \"\" ? undefined : value)}\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,QAAQ,kBAAkB;AAEzC,SAASC,qBAAqB;AAC9B,SAASC,mBAAmB;AAU5B,OAAO,MAAMC,kBAAkB,GAAGA,CAAC;EAC/BC,OAAO;EACPC,KAAK;EACLC,KAAK;EACLC;AACqB,CAAC,KAAK;EAC3B,MAAMC,OAAO,GAAGP,qBAAqB,CAACQ,QAAQ,IAAI;IAC9C,MAAMC,MAAM,GAAGD,QAAQ,CAACE,QAAQ,CAACP,OAAO,CAACQ,EAAE,CAAC,EAAEC,OAAO;IAErD,IAAIH,MAAM,EAAE;MACR,OACI,IAAIR,mBAAmB,CAACO,QAAQ,CAACK,KAAK,CAAC,CAClCC,aAAa,CAACL,MAAM,CAACM,UAAU;MAChC;MACA;MAAA,CACCC,MAAM,CAAC,CAAC;IAErB;IACA,OACI,IAAIf,mBAAmB,CAACO,QAAQ,CAACK,KAAK,CAAC,CAClCI,QAAQ,CAAC;IACV;IACA;IAAA,CACCD,MAAM,CAAC,CAAC;EAErB,CAAC,CAAC;EAEF,oBACIlB,KAAA,CAAAoB,aAAA,CAACnB,MAAM;IACHoB,KAAK,EAAEf,KAAK,CAACe,KAAM;IACnBC,WAAW,EAAE,gBAAiB;IAC9Bb,OAAO,EAAEA,OAAQ;IACjBF,KAAK,EAAEA,KAAM;IACbC,QAAQ,EAAED,KAAK,IAAIC,QAAQ,CAACD,KAAK,KAAK,EAAE,GAAGgB,SAAS,GAAGhB,KAAK;EAAE,CACjE,CAAC;AAEV,CAAC","ignoreList":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/FieldArray.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import type { InputAstNode } from "@webiny/website-builder-sdk";
+export declare function FieldArray({ node, bindings }: {
+    node: InputAstNode;
+    bindings: Record<string, any>;
+}): React.JSX.Element;

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

@@ -0,0 +1,34 @@
+// @ts-nocheck This is pending implementation!
+import React from "react";
+import { InputField } from "./InputField";
+export function FieldArray({
+  node,
+  bindings
+}) {
+  // Determine how many items there are
+  const items = new Set(Object.keys(bindings).filter(key => key.startsWith(`${node.name}[`)).map(key => {
+    const match = key.match(/\[(\d+)\]/);
+    return match ? Number(match[1]) : null;
+  }).filter(i => i !== null));
+  return /*#__PURE__*/React.createElement("fieldset", null, /*#__PURE__*/React.createElement("legend", null, node.input.label || node.name), [...items].map(index => {
+    return /*#__PURE__*/React.createElement("div", {
+      key: index,
+      style: {
+        border: "1px solid #ccc",
+        padding: "0.5em"
+      }
+    }, node.children.map(child => {
+      const cloned = {
+        ...child,
+        path: `${node.name}[${index}].${child.name}`
+      };
+      return /*#__PURE__*/React.createElement(InputField, {
+        key: cloned.path,
+        node: cloned,
+        bindings: bindings
+      });
+    }));
+  }));
+}
+
+//# sourceMappingURL=FieldArray.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","InputField","FieldArray","node","bindings","items","Set","Object","keys","filter","key","startsWith","name","map","match","Number","i","createElement","input","label","index","style","border","padding","children","child","cloned","path"],"sources":["FieldArray.tsx"],"sourcesContent":["// @ts-nocheck This is pending implementation!\nimport React from \"react\";\nimport type { InputAstNode } from \"@webiny/website-builder-sdk\";\nimport { InputField } from \"./InputField\";\n\nexport function FieldArray({\n    node,\n    bindings\n}: {\n    node: InputAstNode;\n    bindings: Record<string, any>;\n}) {\n    // Determine how many items there are\n    const items = new Set(\n        Object.keys(bindings)\n            .filter(key => key.startsWith(`${node.name}[`))\n            .map(key => {\n                const match = key.match(/\\[(\\d+)\\]/);\n                return match ? Number(match[1]) : null;\n            })\n            .filter((i): i is number => i !== null)\n    );\n\n    return (\n        <fieldset>\n            <legend>{node.input.label || node.name}</legend>\n            {[...items].map(index => {\n                return (\n                    <div key={index} style={{ border: \"1px solid #ccc\", padding: \"0.5em\" }}>\n                        {node.children.map(child => {\n                            const cloned = {\n                                ...child,\n                                path: `${node.name}[${index}].${child.name}`\n                            };\n                            return (\n                                <InputField key={cloned.path} node={cloned} bindings={bindings} />\n                            );\n                        })}\n                    </div>\n                );\n            })}\n        </fieldset>\n    );\n}\n"],"mappings":"AAAA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,UAAU;AAEnB,OAAO,SAASC,UAAUA,CAAC;EACvBC,IAAI;EACJC;AAIJ,CAAC,EAAE;EACC;EACA,MAAMC,KAAK,GAAG,IAAIC,GAAG,CACjBC,MAAM,CAACC,IAAI,CAACJ,QAAQ,CAAC,CAChBK,MAAM,CAACC,GAAG,IAAIA,GAAG,CAACC,UAAU,CAAC,GAAGR,IAAI,CAACS,IAAI,GAAG,CAAC,CAAC,CAC9CC,GAAG,CAACH,GAAG,IAAI;IACR,MAAMI,KAAK,GAAGJ,GAAG,CAACI,KAAK,CAAC,WAAW,CAAC;IACpC,OAAOA,KAAK,GAAGC,MAAM,CAACD,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI;EAC1C,CAAC,CAAC,CACDL,MAAM,CAAEO,CAAC,IAAkBA,CAAC,KAAK,IAAI,CAC9C,CAAC;EAED,oBACIhB,KAAA,CAAAiB,aAAA,gCACIjB,KAAA,CAAAiB,aAAA,iBAASd,IAAI,CAACe,KAAK,CAACC,KAAK,IAAIhB,IAAI,CAACS,IAAa,CAAC,EAC/C,CAAC,GAAGP,KAAK,CAAC,CAACQ,GAAG,CAACO,KAAK,IAAI;IACrB,oBACIpB,KAAA,CAAAiB,aAAA;MAAKP,GAAG,EAAEU,KAAM;MAACC,KAAK,EAAE;QAAEC,MAAM,EAAE,gBAAgB;QAAEC,OAAO,EAAE;MAAQ;IAAE,GAClEpB,IAAI,CAACqB,QAAQ,CAACX,GAAG,CAACY,KAAK,IAAI;MACxB,MAAMC,MAAM,GAAG;QACX,GAAGD,KAAK;QACRE,IAAI,EAAE,GAAGxB,IAAI,CAACS,IAAI,IAAIQ,KAAK,KAAKK,KAAK,CAACb,IAAI;MAC9C,CAAC;MACD,oBACIZ,KAAA,CAAAiB,aAAA,CAAChB,UAAU;QAACS,GAAG,EAAEgB,MAAM,CAACC,IAAK;QAACxB,IAAI,EAAEuB,MAAO;QAACtB,QAAQ,EAAEA;MAAS,CAAE,CAAC;IAE1E,CAAC,CACA,CAAC;EAEd,CAAC,CACK,CAAC;AAEnB","ignoreList":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/InputField.d.ts

@@ -0,0 +1,10 @@
+import React from "react";
+import type { InputAstNode } from "@webiny/website-builder-sdk";
+import type { DocumentElement, DocumentElementBindings } from "@webiny/website-builder-sdk";
+interface InputFieldProps {
+    node: InputAstNode;
+    element: DocumentElement;
+    bindings: DocumentElementBindings["inputs"];
+}
+export declare function InputField({ element, node }: InputFieldProps): React.JSX.Element | undefined;
+export {};

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

@@ -0,0 +1,73 @@
+import React from "react";
+// import { FieldArray } from "./FieldArray";
+import { useInputRenderer } from "./useInputRenderer";
+import { useInputValue } from "./useInputValue";
+import { InheritanceLabel } from "../InheritanceLabel";
+export function InputField({
+  element,
+  node
+}) {
+  const Renderer = useInputRenderer(node.input.renderer);
+  const {
+    value,
+    onChange,
+    onPreviewChange,
+    inheritanceMap,
+    metadata,
+    onReset
+  } = useInputValue(element.id, node);
+  const input = node.input;
+  if (input.type === "object") {
+    // TODO: nested inputs will be implemented at a later stage.
+    return;
+
+    /*if (node.list) {
+        return <FieldArray node={node} bindings={bindings} />;
+    }
+     return (
+        <fieldset>
+            <legend>{input.label}</legend>
+            {node.children.map(child => (
+                <InputField key={child.path} node={child} bindings={bindings} />
+            ))}
+        </fieldset>
+    );*/
+  }
+  const label = node.input.responsive ? /*#__PURE__*/React.createElement(InheritanceLabel, {
+    text: input.label,
+    inheritedFrom: inheritanceMap?.inheritedFrom,
+    isOverridden: inheritanceMap?.overridden ?? false,
+    onReset: onReset
+  }) : input.label;
+  return /*#__PURE__*/React.createElement(Renderer, {
+    metadata: metadata,
+    label: label,
+    value: value?.static,
+    onChange: onChange,
+    onPreviewChange: onPreviewChange,
+    input: node.input
+  });
+
+  // We'll implement expression bindings at a later stage.
+  /*return value.expression ? (
+      <WithBindingToggle type={"expression"} setBindingType={setBindingType}>
+          <ExpressionRenderer
+              element={activeElement!}
+              value={value.expression}
+              onChange={onChange}
+              input={input}
+          />
+      </WithBindingToggle>
+  ) : (
+      <WithBindingToggle type={"static"} setBindingType={setBindingType}>
+          <Renderer
+              value={value.static}
+              onChange={onChange}
+              onPreviewChange={onPreviewChange}
+              input={node.input}
+          />
+      </WithBindingToggle>
+  );*/
+}
+
+//# sourceMappingURL=InputField.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useInputRenderer","useInputValue","InheritanceLabel","InputField","element","node","Renderer","input","renderer","value","onChange","onPreviewChange","inheritanceMap","metadata","onReset","id","type","label","responsive","createElement","text","inheritedFrom","isOverridden","overridden","static"],"sources":["InputField.tsx"],"sourcesContent":["import React from \"react\";\nimport type { InputAstNode } from \"@webiny/website-builder-sdk\";\n// import { FieldArray } from \"./FieldArray\";\nimport { useInputRenderer } from \"./useInputRenderer\";\nimport { useInputValue } from \"./useInputValue\";\nimport type { DocumentElement, DocumentElementBindings } from \"@webiny/website-builder-sdk\";\nimport { InheritanceLabel } from \"../InheritanceLabel\";\n\ninterface InputFieldProps {\n    node: InputAstNode;\n    element: DocumentElement;\n    bindings: DocumentElementBindings[\"inputs\"];\n}\n\nexport function InputField({ element, node }: InputFieldProps) {\n    const Renderer = useInputRenderer(node.input.renderer!);\n    const { value, onChange, onPreviewChange, inheritanceMap, metadata, onReset } = useInputValue(\n        element.id,\n        node\n    );\n    const input = node.input;\n\n    if (input.type === \"object\") {\n        // TODO: nested inputs will be implemented at a later stage.\n        return;\n\n        /*if (node.list) {\n            return <FieldArray node={node} bindings={bindings} />;\n        }\n\n        return (\n            <fieldset>\n                <legend>{input.label}</legend>\n                {node.children.map(child => (\n                    <InputField key={child.path} node={child} bindings={bindings} />\n                ))}\n            </fieldset>\n        );*/\n    }\n\n    const label = node.input.responsive ? (\n        <InheritanceLabel\n            text={input.label}\n            inheritedFrom={inheritanceMap?.inheritedFrom}\n            isOverridden={inheritanceMap?.overridden ?? false}\n            onReset={onReset}\n        />\n    ) : (\n        input.label\n    );\n\n    return (\n        <Renderer\n            metadata={metadata}\n            label={label}\n            value={value?.static}\n            onChange={onChange}\n            onPreviewChange={onPreviewChange}\n            input={node.input}\n        />\n    );\n\n    // We'll implement expression bindings at a later stage.\n    /*return value.expression ? (\n        <WithBindingToggle type={\"expression\"} setBindingType={setBindingType}>\n            <ExpressionRenderer\n                element={activeElement!}\n                value={value.expression}\n                onChange={onChange}\n                input={input}\n            />\n        </WithBindingToggle>\n    ) : (\n        <WithBindingToggle type={\"static\"} setBindingType={setBindingType}>\n            <Renderer\n                value={value.static}\n                onChange={onChange}\n                onPreviewChange={onPreviewChange}\n                input={node.input}\n            />\n        </WithBindingToggle>\n    );*/\n}\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB;AACA,SAASC,gBAAgB;AACzB,SAASC,aAAa;AAEtB,SAASC,gBAAgB;AAQzB,OAAO,SAASC,UAAUA,CAAC;EAAEC,OAAO;EAAEC;AAAsB,CAAC,EAAE;EAC3D,MAAMC,QAAQ,GAAGN,gBAAgB,CAACK,IAAI,CAACE,KAAK,CAACC,QAAS,CAAC;EACvD,MAAM;IAAEC,KAAK;IAAEC,QAAQ;IAAEC,eAAe;IAAEC,cAAc;IAAEC,QAAQ;IAAEC;EAAQ,CAAC,GAAGb,aAAa,CACzFG,OAAO,CAACW,EAAE,EACVV,IACJ,CAAC;EACD,MAAME,KAAK,GAAGF,IAAI,CAACE,KAAK;EAExB,IAAIA,KAAK,CAACS,IAAI,KAAK,QAAQ,EAAE;IACzB;IACA;;IAEA;AACR;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;EAEI;EAEA,MAAMC,KAAK,GAAGZ,IAAI,CAACE,KAAK,CAACW,UAAU,gBAC/BnB,KAAA,CAAAoB,aAAA,CAACjB,gBAAgB;IACbkB,IAAI,EAAEb,KAAK,CAACU,KAAM;IAClBI,aAAa,EAAET,cAAc,EAAES,aAAc;IAC7CC,YAAY,EAAEV,cAAc,EAAEW,UAAU,IAAI,KAAM;IAClDT,OAAO,EAAEA;EAAQ,CACpB,CAAC,GAEFP,KAAK,CAACU,KACT;EAED,oBACIlB,KAAA,CAAAoB,aAAA,CAACb,QAAQ;IACLO,QAAQ,EAAEA,QAAS;IACnBI,KAAK,EAAEA,KAAM;IACbR,KAAK,EAAEA,KAAK,EAAEe,MAAO;IACrBd,QAAQ,EAAEA,QAAS;IACnBC,eAAe,EAAEA,eAAgB;IACjCJ,KAAK,EAAEF,IAAI,CAACE;EAAM,CACrB,CAAC;;EAGN;EACA;AACJ;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/InputRenderer.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+import type { InputAstNode } from "@webiny/website-builder-sdk";
+import type { DocumentElementBindings } from "@webiny/website-builder-sdk";
+export declare const InputRenderer: ({ ast, bindings }: {
+    ast: InputAstNode[];
+    bindings: DocumentElementBindings["inputs"];
+}) => React.JSX.Element;

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

@@ -0,0 +1,29 @@
+import React from "react";
+import { Grid } from "@webiny/admin-ui";
+import { InputField } from "./InputField";
+import { useActiveElement } from "../../../hooks/useActiveElement";
+export const InputRenderer = ({
+  ast,
+  bindings
+}) => {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, ast.map(node => node.input.hideFromUi ? null : /*#__PURE__*/React.createElement(Grid.Column, {
+    span: 12,
+    key: node.path
+  }, /*#__PURE__*/React.createElement(ActiveElement, null, element => /*#__PURE__*/React.createElement(InputField, {
+    key: node.path,
+    element: element,
+    node: node,
+    bindings: bindings
+  })))));
+};
+const ActiveElement = ({
+  children
+}) => {
+  const [element] = useActiveElement();
+  if (!element) {
+    return null;
+  }
+  return children(element);
+};
+
+//# sourceMappingURL=InputRenderer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","Grid","InputField","useActiveElement","InputRenderer","ast","bindings","createElement","Fragment","map","node","input","hideFromUi","Column","span","key","path","ActiveElement","element","children"],"sources":["InputRenderer.tsx"],"sourcesContent":["import React from \"react\";\nimport { Grid } from \"@webiny/admin-ui\";\nimport type { InputAstNode } from \"@webiny/website-builder-sdk\";\nimport { InputField } from \"./InputField\";\nimport type { DocumentElement, DocumentElementBindings } from \"@webiny/website-builder-sdk\";\nimport { useActiveElement } from \"~/BaseEditor/hooks/useActiveElement\";\n\nexport const InputRenderer = ({\n    ast,\n    bindings\n}: {\n    ast: InputAstNode[];\n    bindings: DocumentElementBindings[\"inputs\"];\n}) => {\n    return (\n        <>\n            {ast.map(node =>\n                node.input.hideFromUi ? null : (\n                    <Grid.Column span={12} key={node.path}>\n                        <ActiveElement>\n                            {element => (\n                                <InputField\n                                    key={node.path}\n                                    element={element}\n                                    node={node}\n                                    bindings={bindings}\n                                />\n                            )}\n                        </ActiveElement>\n                    </Grid.Column>\n                )\n            )}\n        </>\n    );\n};\n\ntype ActiveElementProps = {\n    children: (element: DocumentElement) => React.ReactNode;\n};\n\nconst ActiveElement = ({ children }: ActiveElementProps) => {\n    const [element] = useActiveElement();\n    if (!element) {\n        return null;\n    }\n\n    return children(element);\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,kBAAkB;AAEvC,SAASC,UAAU;AAEnB,SAASC,gBAAgB;AAEzB,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAC1BC,GAAG;EACHC;AAIJ,CAAC,KAAK;EACF,oBACIN,KAAA,CAAAO,aAAA,CAAAP,KAAA,CAAAQ,QAAA,QACKH,GAAG,CAACI,GAAG,CAACC,IAAI,IACTA,IAAI,CAACC,KAAK,CAACC,UAAU,GAAG,IAAI,gBACxBZ,KAAA,CAAAO,aAAA,CAACN,IAAI,CAACY,MAAM;IAACC,IAAI,EAAE,EAAG;IAACC,GAAG,EAAEL,IAAI,CAACM;EAAK,gBAClChB,KAAA,CAAAO,aAAA,CAACU,aAAa,QACTC,OAAO,iBACJlB,KAAA,CAAAO,aAAA,CAACL,UAAU;IACPa,GAAG,EAAEL,IAAI,CAACM,IAAK;IACfE,OAAO,EAAEA,OAAQ;IACjBR,IAAI,EAAEA,IAAK;IACXJ,QAAQ,EAAEA;EAAS,CACtB,CAEM,CACN,CAErB,CACF,CAAC;AAEX,CAAC;AAMD,MAAMW,aAAa,GAAGA,CAAC;EAAEE;AAA6B,CAAC,KAAK;EACxD,MAAM,CAACD,OAAO,CAAC,GAAGf,gBAAgB,CAAC,CAAC;EACpC,IAAI,CAACe,OAAO,EAAE;IACV,OAAO,IAAI;EACf;EAEA,OAAOC,QAAQ,CAACD,OAAO,CAAC;AAC5B,CAAC","ignoreList":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/PathType.d.ts

@@ -0,0 +1,8 @@
+export declare class PathType {
+    private readonly nativeType;
+    constructor(nativeType: string);
+    toString(): string;
+    matches(expected: string): boolean;
+    isArray(): boolean;
+    isScalar(): boolean;
+}

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

@@ -0,0 +1,30 @@
+const scalars = ["string", "number", "boolean"];
+export class PathType {
+  constructor(nativeType) {
+    this.nativeType = nativeType;
+  }
+  toString() {
+    return this.nativeType;
+  }
+  matches(expected) {
+    const map = {
+      text: ["string"],
+      longText: ["string"],
+      number: ["number"],
+      boolean: ["boolean"],
+      array: ["array"],
+      object: ["object"],
+      json: ["object"]
+    };
+    const allowed = map[expected] || [];
+    return allowed.includes(this.nativeType);
+  }
+  isArray() {
+    return this.nativeType === "array";
+  }
+  isScalar() {
+    return scalars.includes(this.nativeType);
+  }
+}
+
+//# sourceMappingURL=PathType.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["scalars","PathType","constructor","nativeType","toString","matches","expected","map","text","longText","number","boolean","array","object","json","allowed","includes","isArray","isScalar"],"sources":["PathType.ts"],"sourcesContent":["const scalars = [\"string\", \"number\", \"boolean\"];\n\nexport class PathType {\n    private readonly nativeType: string;\n\n    constructor(nativeType: string) {\n        this.nativeType = nativeType;\n    }\n\n    public toString(): string {\n        return this.nativeType;\n    }\n\n    public matches(expected: string): boolean {\n        const map: Record<string, string[]> = {\n            text: [\"string\"],\n            longText: [\"string\"],\n            number: [\"number\"],\n            boolean: [\"boolean\"],\n            array: [\"array\"],\n            object: [\"object\"],\n            json: [\"object\"]\n        };\n\n        const allowed = map[expected] || [];\n        return allowed.includes(this.nativeType);\n    }\n\n    isArray() {\n        return this.nativeType === \"array\";\n    }\n\n    isScalar() {\n        return scalars.includes(this.nativeType);\n    }\n}\n"],"mappings":"AAAA,MAAMA,OAAO,GAAG,CAAC,QAAQ,EAAE,QAAQ,EAAE,SAAS,CAAC;AAE/C,OAAO,MAAMC,QAAQ,CAAC;EAGlBC,WAAWA,CAACC,UAAkB,EAAE;IAC5B,IAAI,CAACA,UAAU,GAAGA,UAAU;EAChC;EAEOC,QAAQA,CAAA,EAAW;IACtB,OAAO,IAAI,CAACD,UAAU;EAC1B;EAEOE,OAAOA,CAACC,QAAgB,EAAW;IACtC,MAAMC,GAA6B,GAAG;MAClCC,IAAI,EAAE,CAAC,QAAQ,CAAC;MAChBC,QAAQ,EAAE,CAAC,QAAQ,CAAC;MACpBC,MAAM,EAAE,CAAC,QAAQ,CAAC;MAClBC,OAAO,EAAE,CAAC,SAAS,CAAC;MACpBC,KAAK,EAAE,CAAC,OAAO,CAAC;MAChBC,MAAM,EAAE,CAAC,QAAQ,CAAC;MAClBC,IAAI,EAAE,CAAC,QAAQ;IACnB,CAAC;IAED,MAAMC,OAAO,GAAGR,GAAG,CAACD,QAAQ,CAAC,IAAI,EAAE;IACnC,OAAOS,OAAO,CAACC,QAAQ,CAAC,IAAI,CAACb,UAAU,CAAC;EAC5C;EAEAc,OAAOA,CAAA,EAAG;IACN,OAAO,IAAI,CAACd,UAAU,KAAK,OAAO;EACtC;EAEAe,QAAQA,CAAA,EAAG;IACP,OAAOlB,OAAO,CAACgB,QAAQ,CAAC,IAAI,CAACb,UAAU,CAAC;EAC5C;AACJ","ignoreList":[]}

package/BaseEditor/defaultConfig/Sidebar/ElementSettings/StatePathsCollection.d.ts

@@ -0,0 +1,16 @@
+import type { PathType } from "./PathType";
+export type PathOption = {
+    value: string;
+    label: string;
+    type: PathType;
+};
+export declare class StatePathsCollection {
+    private readonly items;
+    constructor(items: PathOption[]);
+    map(callback: (item: PathOption, index: number) => any): StatePathsCollection;
+    filter(callback: (item: PathOption, index: number) => boolean): StatePathsCollection;
+    filterScalars(): StatePathsCollection;
+    filterArray(): StatePathsCollection;
+    sort(compareFn?: (a: PathOption, b: PathOption) => number): StatePathsCollection;
+    values(): PathOption[];
+}