@webiny/app-website-builder 0.0.0-unstable.eb196ccd2f → 0.0.0-unstable.eb81deee7e

package/BaseEditor/config/EditorConfig.js

@@ -1,63 +1,54 @@
 import { createConfigurableComponent } from "@webiny/react-properties";
-import { Element } from "./Element";
-import { TopBar } from "./TopBar/TopBar";
-import { Layout } from "./Layout";
-import { Content } from "./Content/Content";
-import { Toolbar } from "./Toolbar/Toolbar";
-import { Sidebar } from "./Sidebar/Sidebar";
-import { Elements } from "./Elements";
-import { OnActiveElement } from "./OnActiveElement";
-import { NoActiveElement } from "./NoActiveElement";
-import { ElementProperties, ElementProperty } from "./ElementProperty";
-import { ElementAction, ElementActions } from "./ElementAction";
-import { ElementInput } from "./ElementInput";
-const base = createConfigurableComponent("DocumentEditorConfig");
-export const EditorConfig = Object.assign(base.Config, {
-  /**
-   * Components to configure editor UI.
-   */
-  Ui: {
-    Element,
-    Elements,
-    Layout,
-    Content,
-    TopBar,
-    Toolbar,
-    Sidebar,
-    OnActiveElement,
-    NoActiveElement
-  },
-  ElementInput,
-  /**
-   * Define a new element property.
-   */
-  ElementProperty,
-  /**
-   * Render element properties for the given group.
-   */
-  ElementProperties,
-  /**
-   * Define an element action.
-   */
-  ElementAction,
-  /**
-   * Render all element actions.
-   */
-  ElementActions,
-  /**
-   * Access full editor config. WARNING: very low-level, we don't recommend using this directly!
-   */
-  useEditorConfig
+import { Element } from "./Element.js";
+import { TopBar } from "./TopBar/TopBar.js";
+import { Layout } from "./Layout.js";
+import { Content } from "./Content/Content.js";
+import { Toolbar } from "./Toolbar/Toolbar.js";
+import { Sidebar } from "./Sidebar/Sidebar.js";
+import { Elements } from "./Elements.js";
+import { OnActiveElement } from "./OnActiveElement.js";
+import { NoActiveElement } from "./NoActiveElement.js";
+import { ElementProperties, ElementProperty } from "./ElementProperty.js";
+import { ElementAction, ElementActions } from "./ElementAction.js";
+import { ElementInput } from "./ElementInput.js";
+import { IsNotReadOnly } from "./IsNotReadOnly.js";
+import { IsReadOnly } from "./IsReadOnly.js";
+import { ElementOverlay } from "./ElementOverlay.js";
+const base = createConfigurableComponent("DocumentEditor");
+const EditorConfigComponents = {
+    Ui: {
+        Element: Element,
+        Elements: Elements,
+        Layout: Layout,
+        Content: Content,
+        TopBar: TopBar,
+        Toolbar: Toolbar,
+        Sidebar: Sidebar,
+        IsReadOnly: IsReadOnly,
+        IsNotReadOnly: IsNotReadOnly,
+        OnActiveElement: OnActiveElement,
+        NoActiveElement: NoActiveElement
+    },
+    ElementInput: ElementInput,
+    ElementProperty: ElementProperty,
+    ElementProperties: ElementProperties,
+    ElementAction: ElementAction,
+    ElementActions: ElementActions,
+    ElementOverlay: ElementOverlay,
+    useEditorConfig: useEditorConfig
+};
+const EditorConfig = Object.assign(base.Config, EditorConfigComponents);
+const EditorWithConfig = Object.assign(base.WithConfig, {
+    displayName: "EditorWithConfig"
 });
-export const EditorWithConfig = Object.assign(base.WithConfig, {
-  displayName: "EditorWithConfig"
-});
-export function useEditorConfig() {
-  const config = base.useConfig();
-  return {
-    elements: config.elements || [],
-    inputRenderers: config.inputRenderers || []
-  };
+function useEditorConfig() {
+    const { elements, inputRenderers, ...rest } = base.useConfig();
+    return {
+        elements: elements || [],
+        inputRenderers: inputRenderers || [],
+        ...rest
+    };
 }
+export { EditorConfig, EditorConfigComponents, EditorWithConfig, useEditorConfig };
 
 //# sourceMappingURL=EditorConfig.js.map

package/BaseEditor/config/EditorConfig.js.map

@@ -1 +1 @@
-{"version":3,"names":["createConfigurableComponent","Element","TopBar","Layout","Content","Toolbar","Sidebar","Elements","OnActiveElement","NoActiveElement","ElementProperties","ElementProperty","ElementAction","ElementActions","ElementInput","base","EditorConfig","Object","assign","Config","Ui","useEditorConfig","EditorWithConfig","WithConfig","displayName","config","useConfig","elements","inputRenderers"],"sources":["EditorConfig.tsx"],"sourcesContent":["import { createConfigurableComponent } from \"@webiny/react-properties\";\nimport type { ElementConfig } from \"./Element\";\nimport { Element } from \"./Element\";\nimport { TopBar } from \"./TopBar/TopBar\";\nimport { Layout } from \"./Layout\";\nimport { Content } from \"./Content/Content\";\nimport { Toolbar } from \"./Toolbar/Toolbar\";\nimport { Sidebar } from \"./Sidebar/Sidebar\";\nimport { Elements } from \"./Elements\";\nimport { OnActiveElement } from \"./OnActiveElement\";\nimport { NoActiveElement } from \"./NoActiveElement\";\nimport { ElementProperties, ElementProperty } from \"./ElementProperty\";\nimport { ElementAction, ElementActions } from \"./ElementAction\";\nimport type { ElementInputConfig } from \"./ElementInput\";\nimport { ElementInput } from \"./ElementInput\";\n\ninterface EditorConfig {\n    elements: ElementConfig[];\n    inputRenderers: ElementInputConfig[];\n}\n\nconst base = createConfigurableComponent<EditorConfig>(\"DocumentEditorConfig\");\n\nexport const EditorConfig = Object.assign(base.Config, {\n    /**\n     * Components to configure editor UI.\n     */\n    Ui: {\n        Element,\n        Elements,\n        Layout,\n        Content,\n        TopBar,\n        Toolbar,\n        Sidebar,\n        OnActiveElement,\n        NoActiveElement\n    },\n    ElementInput,\n    /**\n     * Define a new element property.\n     */\n    ElementProperty,\n    /**\n     * Render element properties for the given group.\n     */\n    ElementProperties,\n    /**\n     * Define an element action.\n     */\n    ElementAction,\n    /**\n     * Render all element actions.\n     */\n    ElementActions,\n    /**\n     * Access full editor config. WARNING: very low-level, we don't recommend using this directly!\n     */\n    useEditorConfig\n});\n\nexport const EditorWithConfig = Object.assign(base.WithConfig, { displayName: \"EditorWithConfig\" });\n\nexport function useEditorConfig() {\n    const config = base.useConfig();\n\n    return { elements: config.elements || [], inputRenderers: config.inputRenderers || [] };\n}\n"],"mappings":"AAAA,SAASA,2BAA2B,QAAQ,0BAA0B;AAEtE,SAASC,OAAO;AAChB,SAASC,MAAM;AACf,SAASC,MAAM;AACf,SAASC,OAAO;AAChB,SAASC,OAAO;AAChB,SAASC,OAAO;AAChB,SAASC,QAAQ;AACjB,SAASC,eAAe;AACxB,SAASC,eAAe;AACxB,SAASC,iBAAiB,EAAEC,eAAe;AAC3C,SAASC,aAAa,EAAEC,cAAc;AAEtC,SAASC,YAAY;AAOrB,MAAMC,IAAI,GAAGf,2BAA2B,CAAe,sBAAsB,CAAC;AAE9E,OAAO,MAAMgB,YAAY,GAAGC,MAAM,CAACC,MAAM,CAACH,IAAI,CAACI,MAAM,EAAE;EACnD;AACJ;AACA;EACIC,EAAE,EAAE;IACAnB,OAAO;IACPM,QAAQ;IACRJ,MAAM;IACNC,OAAO;IACPF,MAAM;IACNG,OAAO;IACPC,OAAO;IACPE,eAAe;IACfC;EACJ,CAAC;EACDK,YAAY;EACZ;AACJ;AACA;EACIH,eAAe;EACf;AACJ;AACA;EACID,iBAAiB;EACjB;AACJ;AACA;EACIE,aAAa;EACb;AACJ;AACA;EACIC,cAAc;EACd;AACJ;AACA;EACIQ;AACJ,CAAC,CAAC;AAEF,OAAO,MAAMC,gBAAgB,GAAGL,MAAM,CAACC,MAAM,CAACH,IAAI,CAACQ,UAAU,EAAE;EAAEC,WAAW,EAAE;AAAmB,CAAC,CAAC;AAEnG,OAAO,SAASH,eAAeA,CAAA,EAAG;EAC9B,MAAMI,MAAM,GAAGV,IAAI,CAACW,SAAS,CAAC,CAAC;EAE/B,OAAO;IAAEC,QAAQ,EAAEF,MAAM,CAACE,QAAQ,IAAI,EAAE;IAAEC,cAAc,EAAEH,MAAM,CAACG,cAAc,IAAI;EAAG,CAAC;AAC3F","ignoreList":[]}
+{"version":3,"file":"BaseEditor/config/EditorConfig.js","sources":["../../../src/BaseEditor/config/EditorConfig.tsx"],"sourcesContent":["import { createConfigurableComponent } from \"@webiny/react-properties\";\nimport type { ElementConfig } from \"./Element.js\";\nimport { Element } from \"./Element.js\";\nimport { TopBar } from \"./TopBar/TopBar.js\";\nimport { Layout } from \"./Layout.js\";\nimport { Content } from \"./Content/Content.js\";\nimport { Toolbar } from \"./Toolbar/Toolbar.js\";\nimport { Sidebar } from \"./Sidebar/Sidebar.js\";\nimport { Elements } from \"./Elements.js\";\nimport { OnActiveElement } from \"./OnActiveElement.js\";\nimport { NoActiveElement } from \"./NoActiveElement.js\";\nimport { ElementProperties, ElementProperty } from \"./ElementProperty.js\";\nimport { ElementAction, ElementActions } from \"./ElementAction.js\";\nimport type { ElementInputConfig } from \"./ElementInput.js\";\nimport { ElementInput } from \"./ElementInput.js\";\nimport { IsNotReadOnly } from \"~/BaseEditor/config/IsNotReadOnly.js\";\nimport { IsReadOnly } from \"~/BaseEditor/config/IsReadOnly.js\";\nimport { ElementOverlay } from \"./ElementOverlay.js\";\n\nexport interface EditorConfig {\n    elements: ElementConfig[];\n    inputRenderers: ElementInputConfig[];\n}\n\nconst base = createConfigurableComponent<EditorConfig>(\"DocumentEditor\");\n\nexport const EditorConfigComponents = {\n    /**\n     * Components to configure editor UI.\n     */\n    Ui: {\n        Element,\n        Elements,\n        Layout,\n        Content,\n        TopBar,\n        Toolbar,\n        Sidebar,\n        IsReadOnly,\n        IsNotReadOnly,\n        OnActiveElement,\n        NoActiveElement\n    },\n    ElementInput,\n    /**\n     * Define a new element property.\n     */\n    ElementProperty,\n    /**\n     * Render element properties for the given group.\n     */\n    ElementProperties,\n    /**\n     * Define an element action.\n     */\n    ElementAction,\n    /**\n     * Render all element actions.\n     */\n    ElementActions,\n    /**\n     * Customize ElementOverlay\n     */\n    ElementOverlay,\n    /**\n     * Access full editor config. WARNING: very low-level, we don't recommend using this directly!\n     */\n    useEditorConfig\n};\n\nexport const EditorConfig = Object.assign(base.Config, EditorConfigComponents);\n\nexport const EditorWithConfig = Object.assign(base.WithConfig, { displayName: \"EditorWithConfig\" });\n\nexport function useEditorConfig<TConfig = EditorConfig>() {\n    const { elements, inputRenderers, ...rest } = base.useConfig<TConfig & EditorConfig>();\n\n    return {\n        elements: elements || [],\n        inputRenderers: inputRenderers || [],\n        ...rest\n    };\n}\n"],"names":["base","createConfigurableComponent","EditorConfigComponents","Element","Elements","Layout","Content","TopBar","Toolbar","Sidebar","IsReadOnly","IsNotReadOnly","OnActiveElement","NoActiveElement","ElementInput","ElementProperty","ElementProperties","ElementAction","ElementActions","ElementOverlay","useEditorConfig","EditorConfig","Object","EditorWithConfig","elements","inputRenderers","rest"],"mappings":";;;;;;;;;;;;;;;;AAwBA,MAAMA,OAAOC,4BAA0C;AAEhD,MAAMC,yBAAyB;IAIlC,IAAI;QACAC,SAAOA;QACPC,UAAQA;QACRC,QAAMA;QACNC,SAAOA;QACPC,QAAMA;QACNC,SAAOA;QACPC,SAAOA;QACPC,YAAUA;QACVC,eAAaA;QACbC,iBAAeA;QACfC,iBAAeA;IACnB;IACAC,cAAYA;IAIZC,iBAAeA;IAIfC,mBAAiBA;IAIjBC,eAAaA;IAIbC,gBAAcA;IAIdC,gBAAcA;IAIdC,iBAAAA;AACJ;AAEO,MAAMC,eAAeC,OAAO,MAAM,CAACtB,KAAK,MAAM,EAAEE;AAEhD,MAAMqB,mBAAmBD,OAAO,MAAM,CAACtB,KAAK,UAAU,EAAE;IAAE,aAAa;AAAmB;AAE1F,SAASoB;IACZ,MAAM,EAAEI,QAAQ,EAAEC,cAAc,EAAE,GAAGC,MAAM,GAAG1B,KAAK,SAAS;IAE5D,OAAO;QACH,UAAUwB,YAAY,EAAE;QACxB,gBAAgBC,kBAAkB,EAAE;QACpC,GAAGC,IAAI;IACX;AACJ"}

package/BaseEditor/config/Element.d.ts

@@ -3,12 +3,12 @@ export interface ElementConfig {
     name: string;
     group: string;
     scope: string;
-    element: JSX.Element;
+    element: React.JSX.Element;
 }
 export interface ElementProps {
     name: string;
     id?: string;
-    element?: JSX.Element | null;
+    element?: React.JSX.Element | null;
     /**
      * `group` is a public prop that can be used by external developers to logically group elements.
      * For example: "actions", "buttons", etc.

package/BaseEditor/config/Element.js

@@ -1,44 +1,36 @@
-import React from "react";
+import react from "react";
 import { makeDecoratable } from "@webiny/app-admin";
 import { Property, useIdGenerator } from "@webiny/react-properties";
-export const Element = makeDecoratable("EditorElement", ({
-  id,
-  name,
-  element,
-  group,
-  scope,
-  remove,
-  before,
-  after
-}) => {
-  const getId = useIdGenerator("element");
-  const realId = id ?? name;
-  const placeAfter = after !== undefined ? getId(after) : undefined;
-  const placeBefore = before !== undefined ? getId(before) : undefined;
-  return /*#__PURE__*/React.createElement(Property, {
-    id: getId(realId),
-    name: "elements",
-    remove: remove,
-    array: true,
-    before: placeBefore,
-    after: placeAfter
-  }, /*#__PURE__*/React.createElement(Property, {
-    id: getId(realId, "name"),
-    name: "name",
-    value: name
-  }), element ? /*#__PURE__*/React.createElement(Property, {
-    id: getId(realId, "element"),
-    name: "element",
-    value: element
-  }) : null, group ? /*#__PURE__*/React.createElement(Property, {
-    id: getId(realId, "group"),
-    name: "group",
-    value: group
-  }) : null, scope ? /*#__PURE__*/React.createElement(Property, {
-    id: getId(realId, "scope"),
-    name: "scope",
-    value: scope
-  }) : null);
+const Element = makeDecoratable("EditorElement", ({ id, name, element, group, scope, remove, before, after })=>{
+    const getId = useIdGenerator("element");
+    const realId = id ?? name;
+    const placeAfter = void 0 !== after ? getId(after) : void 0;
+    const placeBefore = void 0 !== before ? getId(before) : void 0;
+    return /*#__PURE__*/ react.createElement(Property, {
+        id: getId(realId),
+        name: "elements",
+        remove: remove,
+        array: true,
+        before: placeBefore,
+        after: placeAfter
+    }, /*#__PURE__*/ react.createElement(Property, {
+        id: getId(realId, "name"),
+        name: "name",
+        value: name
+    }), element ? /*#__PURE__*/ react.createElement(Property, {
+        id: getId(realId, "element"),
+        name: "element",
+        value: element
+    }) : null, group ? /*#__PURE__*/ react.createElement(Property, {
+        id: getId(realId, "group"),
+        name: "group",
+        value: group
+    }) : null, scope ? /*#__PURE__*/ react.createElement(Property, {
+        id: getId(realId, "scope"),
+        name: "scope",
+        value: scope
+    }) : null);
 });
+export { Element };
 
 //# sourceMappingURL=Element.js.map

package/BaseEditor/config/Element.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","Property","useIdGenerator","Element","id","name","element","group","scope","remove","before","after","getId","realId","placeAfter","undefined","placeBefore","createElement","array","value"],"sources":["Element.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { Property, useIdGenerator } from \"@webiny/react-properties\";\n\nexport interface ElementConfig {\n    name: string;\n    group: string;\n    scope: string;\n    element: JSX.Element;\n}\n\nexport interface ElementProps {\n    name: string;\n    id?: string;\n    element?: JSX.Element | null;\n    /**\n     * `group` is a public prop that can be used by external developers to logically group elements.\n     * For example: \"actions\", \"buttons\", etc.\n     */\n    group?: string;\n    /**\n     * `scope` is used for internal grouping of elements. It is only used to create higher level components used by the 3rd party.\n     * For example: \"sidebar\", \"topBar\", \"toolbar\".\n     * This creates a scope within which we can then filter elements by their `group` prop.\n     */\n    scope?: string;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const Element = makeDecoratable(\n    \"EditorElement\",\n    ({ id, name, element, group, scope, remove, before, after }: ElementProps) => {\n        const getId = useIdGenerator(\"element\");\n        const realId = id ?? name;\n\n        const placeAfter = after !== undefined ? getId(after) : undefined;\n        const placeBefore = before !== undefined ? getId(before) : undefined;\n\n        return (\n            <Property\n                id={getId(realId)}\n                name={\"elements\"}\n                remove={remove}\n                array={true}\n                before={placeBefore}\n                after={placeAfter}\n            >\n                <Property id={getId(realId, \"name\")} name={\"name\"} value={name} />\n                {element ? (\n                    <Property id={getId(realId, \"element\")} name={\"element\"} value={element} />\n                ) : null}\n                {group ? (\n                    <Property id={getId(realId, \"group\")} name={\"group\"} value={group} />\n                ) : null}\n                {scope ? (\n                    <Property id={getId(realId, \"scope\")} name={\"scope\"} value={scope} />\n                ) : null}\n            </Property>\n        );\n    }\n);\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,mBAAmB;AACnD,SAASC,QAAQ,EAAEC,cAAc,QAAQ,0BAA0B;AA6BnE,OAAO,MAAMC,OAAO,GAAGH,eAAe,CAClC,eAAe,EACf,CAAC;EAAEI,EAAE;EAAEC,IAAI;EAAEC,OAAO;EAAEC,KAAK;EAAEC,KAAK;EAAEC,MAAM;EAAEC,MAAM;EAAEC;AAAoB,CAAC,KAAK;EAC1E,MAAMC,KAAK,GAAGV,cAAc,CAAC,SAAS,CAAC;EACvC,MAAMW,MAAM,GAAGT,EAAE,IAAIC,IAAI;EAEzB,MAAMS,UAAU,GAAGH,KAAK,KAAKI,SAAS,GAAGH,KAAK,CAACD,KAAK,CAAC,GAAGI,SAAS;EACjE,MAAMC,WAAW,GAAGN,MAAM,KAAKK,SAAS,GAAGH,KAAK,CAACF,MAAM,CAAC,GAAGK,SAAS;EAEpE,oBACIhB,KAAA,CAAAkB,aAAA,CAAChB,QAAQ;IACLG,EAAE,EAAEQ,KAAK,CAACC,MAAM,CAAE;IAClBR,IAAI,EAAE,UAAW;IACjBI,MAAM,EAAEA,MAAO;IACfS,KAAK,EAAE,IAAK;IACZR,MAAM,EAAEM,WAAY;IACpBL,KAAK,EAAEG;EAAW,gBAElBf,KAAA,CAAAkB,aAAA,CAAChB,QAAQ;IAACG,EAAE,EAAEQ,KAAK,CAACC,MAAM,EAAE,MAAM,CAAE;IAACR,IAAI,EAAE,MAAO;IAACc,KAAK,EAAEd;EAAK,CAAE,CAAC,EACjEC,OAAO,gBACJP,KAAA,CAAAkB,aAAA,CAAChB,QAAQ;IAACG,EAAE,EAAEQ,KAAK,CAACC,MAAM,EAAE,SAAS,CAAE;IAACR,IAAI,EAAE,SAAU;IAACc,KAAK,EAAEb;EAAQ,CAAE,CAAC,GAC3E,IAAI,EACPC,KAAK,gBACFR,KAAA,CAAAkB,aAAA,CAAChB,QAAQ;IAACG,EAAE,EAAEQ,KAAK,CAACC,MAAM,EAAE,OAAO,CAAE;IAACR,IAAI,EAAE,OAAQ;IAACc,KAAK,EAAEZ;EAAM,CAAE,CAAC,GACrE,IAAI,EACPC,KAAK,gBACFT,KAAA,CAAAkB,aAAA,CAAChB,QAAQ;IAACG,EAAE,EAAEQ,KAAK,CAACC,MAAM,EAAE,OAAO,CAAE;IAACR,IAAI,EAAE,OAAQ;IAACc,KAAK,EAAEX;EAAM,CAAE,CAAC,GACrE,IACE,CAAC;AAEnB,CACJ,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/config/Element.js","sources":["../../../src/BaseEditor/config/Element.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { Property, useIdGenerator } from \"@webiny/react-properties\";\n\nexport interface ElementConfig {\n    name: string;\n    group: string;\n    scope: string;\n    element: React.JSX.Element;\n}\n\nexport interface ElementProps {\n    name: string;\n    id?: string;\n    element?: React.JSX.Element | null;\n    /**\n     * `group` is a public prop that can be used by external developers to logically group elements.\n     * For example: \"actions\", \"buttons\", etc.\n     */\n    group?: string;\n    /**\n     * `scope` is used for internal grouping of elements. It is only used to create higher level components used by the 3rd party.\n     * For example: \"sidebar\", \"topBar\", \"toolbar\".\n     * This creates a scope within which we can then filter elements by their `group` prop.\n     */\n    scope?: string;\n    remove?: boolean;\n    before?: string;\n    after?: string;\n}\n\nexport const Element = makeDecoratable(\n    \"EditorElement\",\n    ({ id, name, element, group, scope, remove, before, after }: ElementProps) => {\n        const getId = useIdGenerator(\"element\");\n        const realId = id ?? name;\n\n        const placeAfter = after !== undefined ? getId(after) : undefined;\n        const placeBefore = before !== undefined ? getId(before) : undefined;\n\n        return (\n            <Property\n                id={getId(realId)}\n                name={\"elements\"}\n                remove={remove}\n                array={true}\n                before={placeBefore}\n                after={placeAfter}\n            >\n                <Property id={getId(realId, \"name\")} name={\"name\"} value={name} />\n                {element ? (\n                    <Property id={getId(realId, \"element\")} name={\"element\"} value={element} />\n                ) : null}\n                {group ? (\n                    <Property id={getId(realId, \"group\")} name={\"group\"} value={group} />\n                ) : null}\n                {scope ? (\n                    <Property id={getId(realId, \"scope\")} name={\"scope\"} value={scope} />\n                ) : null}\n            </Property>\n        );\n    }\n);\n"],"names":["Element","makeDecoratable","id","name","element","group","scope","remove","before","after","getId","useIdGenerator","realId","placeAfter","undefined","placeBefore","Property"],"mappings":";;;AA+BO,MAAMA,UAAUC,gBACnB,iBACA,CAAC,EAAEC,EAAE,EAAEC,IAAI,EAAEC,OAAO,EAAEC,KAAK,EAAEC,KAAK,EAAEC,MAAM,EAAEC,MAAM,EAAEC,KAAK,EAAgB;IACrE,MAAMC,QAAQC,eAAe;IAC7B,MAAMC,SAASV,MAAMC;IAErB,MAAMU,aAAaJ,AAAUK,WAAVL,QAAsBC,MAAMD,SAASK;IACxD,MAAMC,cAAcP,AAAWM,WAAXN,SAAuBE,MAAMF,UAAUM;IAE3D,OAAO,WAAP,GACI,oBAACE,UAAQA;QACL,IAAIN,MAAME;QACV,MAAM;QACN,QAAQL;QACR,OAAO;QACP,QAAQQ;QACR,OAAOF;qBAEP,oBAACG,UAAQA;QAAC,IAAIN,MAAME,QAAQ;QAAS,MAAM;QAAQ,OAAOT;QACzDC,UAAU,WAAVA,GACG,oBAACY,UAAQA;QAAC,IAAIN,MAAME,QAAQ;QAAY,MAAM;QAAW,OAAOR;SAChE,MACHC,QAAQ,WAARA,GACG,oBAACW,UAAQA;QAAC,IAAIN,MAAME,QAAQ;QAAU,MAAM;QAAS,OAAOP;SAC5D,MACHC,QAAQ,WAARA,GACG,oBAACU,UAAQA;QAAC,IAAIN,MAAME,QAAQ;QAAU,MAAM;QAAS,OAAON;SAC5D;AAGhB"}

package/BaseEditor/config/ElementAction.d.ts

@@ -1,5 +1,6 @@
 import React from "react";
-import type { ElementProps } from "./Element";
+import type { ElementProps } from "./Element.js";
+import { IconButton } from "./IconButton.js";
 export type ElementActionProps = Omit<ElementProps, "scope" | "group" | "id">;
 export declare const ElementActions: (() => React.JSX.Element) & {
     original: () => React.JSX.Element;
@@ -39,5 +40,5 @@ export declare const ElementAction: ((props: ElementActionProps) => React.JSX.El
         displayName: string;
     }>) => (props: unknown) => React.JSX.Element;
 } & {
-    IconButton: ({ label, icon, disabled, onClick }: import("./IconButton").IconButtonProps) => React.JSX.Element;
+    IconButton: typeof IconButton;
 };

package/BaseEditor/config/ElementAction.js

@@ -1,26 +1,25 @@
-import React from "react";
+import react from "react";
 import { makeDecoratable } from "@webiny/react-composition";
-import { Element } from "./Element";
-import { Elements } from "./Elements";
-import { IconButton } from "./IconButton";
-const getElementId = value => {
-  return ["elementAction", value].join(":");
-};
-const BaseElementAction = makeDecoratable("ElementAction", props => {
-  return /*#__PURE__*/React.createElement(Element, Object.assign({}, props, {
-    scope: "elementActions",
-    id: getElementId(props.name),
-    before: props.before ? getElementId(props.before) : undefined,
-    after: props.after ? getElementId(props.after) : undefined
-  }));
-});
-export const ElementActions = makeDecoratable("ElementActions", () => {
-  return /*#__PURE__*/React.createElement(Elements, {
-    scope: "elementActions"
-  });
-});
-export const ElementAction = Object.assign(BaseElementAction, {
-  IconButton
+import { Element } from "./Element.js";
+import { Elements } from "./Elements.js";
+import { IconButton } from "./IconButton.js";
+const getElementId = (value)=>[
+        "elementAction",
+        value
+    ].join(":");
+const BaseElementAction = makeDecoratable("ElementAction", (props)=>/*#__PURE__*/ react.createElement(Element, {
+        ...props,
+        scope: "elementActions",
+        id: getElementId(props.name),
+        before: props.before ? getElementId(props.before) : void 0,
+        after: props.after ? getElementId(props.after) : void 0
+    }));
+const ElementActions = makeDecoratable("ElementActions", ()=>/*#__PURE__*/ react.createElement(Elements, {
+        scope: "elementActions"
+    }));
+const ElementAction = Object.assign(BaseElementAction, {
+    IconButton: IconButton
 });
+export { ElementAction, ElementActions };
 
 //# sourceMappingURL=ElementAction.js.map

package/BaseEditor/config/ElementAction.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","Element","Elements","IconButton","getElementId","value","join","BaseElementAction","props","createElement","Object","assign","scope","id","name","before","undefined","after","ElementActions","ElementAction"],"sources":["ElementAction.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport type { ElementProps } from \"./Element\";\nimport { Element } from \"./Element\";\nimport { Elements } from \"./Elements\";\nimport { IconButton } from \"./IconButton\";\n\nconst getElementId = (value: string) => {\n    return [\"elementAction\", value].join(\":\");\n};\n\nexport type ElementActionProps = Omit<ElementProps, \"scope\" | \"group\" | \"id\">;\n\nconst BaseElementAction = makeDecoratable(\"ElementAction\", (props: ElementActionProps) => {\n    return (\n        <Element\n            {...props}\n            scope={\"elementActions\"}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nexport const ElementActions = makeDecoratable(\"ElementActions\", () => {\n    return <Elements scope={\"elementActions\"} />;\n});\n\nexport const ElementAction = Object.assign(BaseElementAction, { IconButton });\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,2BAA2B;AAE3D,SAASC,OAAO;AAChB,SAASC,QAAQ;AACjB,SAASC,UAAU;AAEnB,MAAMC,YAAY,GAAIC,KAAa,IAAK;EACpC,OAAO,CAAC,eAAe,EAAEA,KAAK,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;AAC7C,CAAC;AAID,MAAMC,iBAAiB,GAAGP,eAAe,CAAC,eAAe,EAAGQ,KAAyB,IAAK;EACtF,oBACIT,KAAA,CAAAU,aAAA,CAACR,OAAO,EAAAS,MAAA,CAAAC,MAAA,KACAH,KAAK;IACTI,KAAK,EAAE,gBAAiB;IACxBC,EAAE,EAAET,YAAY,CAACI,KAAK,CAACM,IAAI,CAAE;IAC7BC,MAAM,EAAEP,KAAK,CAACO,MAAM,GAAGX,YAAY,CAACI,KAAK,CAACO,MAAM,CAAC,GAAGC,SAAU;IAC9DC,KAAK,EAAET,KAAK,CAACS,KAAK,GAAGb,YAAY,CAACI,KAAK,CAACS,KAAK,CAAC,GAAGD;EAAU,EAC9D,CAAC;AAEV,CAAC,CAAC;AAEF,OAAO,MAAME,cAAc,GAAGlB,eAAe,CAAC,gBAAgB,EAAE,MAAM;EAClE,oBAAOD,KAAA,CAAAU,aAAA,CAACP,QAAQ;IAACU,KAAK,EAAE;EAAiB,CAAE,CAAC;AAChD,CAAC,CAAC;AAEF,OAAO,MAAMO,aAAa,GAAGT,MAAM,CAACC,MAAM,CAACJ,iBAAiB,EAAE;EAAEJ;AAAW,CAAC,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/config/ElementAction.js","sources":["../../../src/BaseEditor/config/ElementAction.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport type { ElementProps } from \"./Element.js\";\nimport { Element } from \"./Element.js\";\nimport { Elements } from \"./Elements.js\";\nimport { IconButton } from \"./IconButton.js\";\n\nconst getElementId = (value: string) => {\n    return [\"elementAction\", value].join(\":\");\n};\n\nexport type ElementActionProps = Omit<ElementProps, \"scope\" | \"group\" | \"id\">;\n\nconst BaseElementAction = makeDecoratable(\"ElementAction\", (props: ElementActionProps) => {\n    return (\n        <Element\n            {...props}\n            scope={\"elementActions\"}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nexport const ElementActions = makeDecoratable(\"ElementActions\", () => {\n    return <Elements scope={\"elementActions\"} />;\n});\n\nexport const ElementAction = Object.assign(BaseElementAction, { IconButton });\n"],"names":["getElementId","value","BaseElementAction","makeDecoratable","props","Element","undefined","ElementActions","Elements","ElementAction","Object","IconButton"],"mappings":";;;;;AAOA,MAAMA,eAAe,CAACC,QACX;QAAC;QAAiBA;KAAM,CAAC,IAAI,CAAC;AAKzC,MAAMC,oBAAoBC,gBAAgB,iBAAiB,CAACC,QACjD,WAAP,GACI,oBAACC,SAAOA;QACH,GAAGD,KAAK;QACT,OAAO;QACP,IAAIJ,aAAaI,MAAM,IAAI;QAC3B,QAAQA,MAAM,MAAM,GAAGJ,aAAaI,MAAM,MAAM,IAAIE;QACpD,OAAOF,MAAM,KAAK,GAAGJ,aAAaI,MAAM,KAAK,IAAIE;;AAKtD,MAAMC,iBAAiBJ,gBAAgB,kBAAkB,IACrD,WAAP,GAAO,oBAACK,UAAQA;QAAC,OAAO;;AAGrB,MAAMC,gBAAgBC,OAAO,MAAM,CAACR,mBAAmB;IAAES,YAAUA;AAAC"}

package/BaseEditor/config/ElementInput.d.ts

@@ -1,23 +1,36 @@
 import React from "react";
-import type { ComponentInput } from "@webiny/website-builder-sdk";
-import type { InputBindingOnChange } from "../defaultConfig/Sidebar/ElementSettings/useInputValue";
-import type { IMetadata } from "../metadata";
+import type { ComponentInput, DocumentElement, DocumentElementBindings, InputAstNode, TokenReference } from "@webiny/website-builder-sdk";
+import type { InputBindingOnChange } from "../defaultConfig/Sidebar/ElementSettings/useInputValue.js";
+import type { IMetadata } from "../../BaseEditor/metadata/index.js";
 export interface ElementInputRendererProps {
     label: React.ReactNode;
     metadata: IMetadata;
     value: any;
+    /**
+     * Set when this input is bound to a design token rather than a literal.
+     *
+     * Passed separately from `value` because a token binding has no `static` value — a picker that only
+     * received `value` could render the resolved colour but could not show *which* token is selected, so
+     * reopening it would look like nothing was chosen.
+     */
+    token?: TokenReference;
     onChange: InputBindingOnChange;
     onPreviewChange: InputBindingOnChange;
     input: ComponentInput;
+    node?: InputAstNode;
+    element?: DocumentElement;
+    bindings?: DocumentElementBindings["inputs"];
 }
 export interface RendererProps {
     name: string;
     component: React.ComponentType<any>;
 }
+declare const Renderer: (props: RendererProps) => React.JSX.Element;
 export interface ElementInputConfig {
     name: string;
     component: React.ComponentType<ElementInputRendererProps>;
 }
 export declare const ElementInput: {
-    Renderer: (props: RendererProps) => React.JSX.Element;
+    Renderer: typeof Renderer;
 };
+export {};

package/BaseEditor/config/ElementInput.js

@@ -1,27 +1,25 @@
-import React from "react";
+import react from "react";
 import { Property, useIdGenerator } from "@webiny/react-properties";
-const Renderer = props => {
-  const getId = useIdGenerator("inputRenderer");
-  const {
-    name,
-    component
-  } = props;
-  return /*#__PURE__*/React.createElement(Property, {
-    id: getId(name),
-    name: "inputRenderers",
-    array: true
-  }, /*#__PURE__*/React.createElement(Property, {
-    id: getId(name, "name"),
-    name: "name",
-    value: name
-  }), /*#__PURE__*/React.createElement(Property, {
-    id: getId(name, "component"),
-    name: "component",
-    value: component
-  }));
+const Renderer = (props)=>{
+    const getId = useIdGenerator("inputRenderer");
+    const { name, component } = props;
+    return /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name),
+        name: "inputRenderers",
+        array: true
+    }, /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name, "name"),
+        name: "name",
+        value: name
+    }), /*#__PURE__*/ react.createElement(Property, {
+        id: getId(name, "component"),
+        name: "component",
+        value: component
+    }));
 };
-export const ElementInput = {
-  Renderer
+const ElementInput = {
+    Renderer: Renderer
 };
+export { ElementInput };
 
 //# sourceMappingURL=ElementInput.js.map

package/BaseEditor/config/ElementInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Property","useIdGenerator","Renderer","props","getId","name","component","createElement","id","array","value","ElementInput"],"sources":["ElementInput.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property, useIdGenerator } from \"@webiny/react-properties\";\nimport type { ComponentInput } from \"@webiny/website-builder-sdk\";\nimport type { InputBindingOnChange } from \"../defaultConfig/Sidebar/ElementSettings/useInputValue\";\nimport type { IMetadata } from \"~/BaseEditor/metadata\";\n\nexport interface ElementInputRendererProps {\n    label: React.ReactNode;\n    metadata: IMetadata;\n    value: any;\n    onChange: InputBindingOnChange;\n    onPreviewChange: InputBindingOnChange;\n    input: ComponentInput;\n}\n\nexport interface RendererProps {\n    name: string;\n    component: React.ComponentType<any>;\n}\n\nconst Renderer = (props: RendererProps) => {\n    const getId = useIdGenerator(\"inputRenderer\");\n    const { name, component } = props;\n\n    return (\n        <Property id={getId(name)} name={\"inputRenderers\"} array={true}>\n            <Property id={getId(name, \"name\")} name={\"name\"} value={name} />\n            <Property id={getId(name, \"component\")} name={\"component\"} value={component} />\n        </Property>\n    );\n};\n\nexport interface ElementInputConfig {\n    name: string;\n    component: React.ComponentType<ElementInputRendererProps>;\n}\n\nexport const ElementInput = {\n    Renderer\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,EAAEC,cAAc,QAAQ,0BAA0B;AAmBnE,MAAMC,QAAQ,GAAIC,KAAoB,IAAK;EACvC,MAAMC,KAAK,GAAGH,cAAc,CAAC,eAAe,CAAC;EAC7C,MAAM;IAAEI,IAAI;IAAEC;EAAU,CAAC,GAAGH,KAAK;EAEjC,oBACIJ,KAAA,CAAAQ,aAAA,CAACP,QAAQ;IAACQ,EAAE,EAAEJ,KAAK,CAACC,IAAI,CAAE;IAACA,IAAI,EAAE,gBAAiB;IAACI,KAAK,EAAE;EAAK,gBAC3DV,KAAA,CAAAQ,aAAA,CAACP,QAAQ;IAACQ,EAAE,EAAEJ,KAAK,CAACC,IAAI,EAAE,MAAM,CAAE;IAACA,IAAI,EAAE,MAAO;IAACK,KAAK,EAAEL;EAAK,CAAE,CAAC,eAChEN,KAAA,CAAAQ,aAAA,CAACP,QAAQ;IAACQ,EAAE,EAAEJ,KAAK,CAACC,IAAI,EAAE,WAAW,CAAE;IAACA,IAAI,EAAE,WAAY;IAACK,KAAK,EAAEJ;EAAU,CAAE,CACxE,CAAC;AAEnB,CAAC;AAOD,OAAO,MAAMK,YAAY,GAAG;EACxBT;AACJ,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/config/ElementInput.js","sources":["../../../src/BaseEditor/config/ElementInput.tsx"],"sourcesContent":["import React from \"react\";\nimport { Property, useIdGenerator } from \"@webiny/react-properties\";\nimport type {\n    ComponentInput,\n    DocumentElement,\n    DocumentElementBindings,\n    InputAstNode,\n    TokenReference\n} from \"@webiny/website-builder-sdk\";\nimport type { InputBindingOnChange } from \"../defaultConfig/Sidebar/ElementSettings/useInputValue.js\";\nimport type { IMetadata } from \"~/BaseEditor/metadata/index.js\";\n\nexport interface ElementInputRendererProps {\n    label: React.ReactNode;\n    metadata: IMetadata;\n    value: any;\n    /**\n     * Set when this input is bound to a design token rather than a literal.\n     *\n     * Passed separately from `value` because a token binding has no `static` value — a picker that only\n     * received `value` could render the resolved colour but could not show *which* token is selected, so\n     * reopening it would look like nothing was chosen.\n     */\n    token?: TokenReference;\n    onChange: InputBindingOnChange;\n    onPreviewChange: InputBindingOnChange;\n    input: ComponentInput;\n    // The full AST node, owning element and element bindings - provided by `InputField` and used by\n    // renderers that recurse into child inputs (e.g. the object field renderer). Optional so other\n    // call sites that synthesize renderer props (e.g. the Lexical expanded-editor dialog) needn't.\n    node?: InputAstNode;\n    element?: DocumentElement;\n    bindings?: DocumentElementBindings[\"inputs\"];\n}\n\nexport interface RendererProps {\n    name: string;\n    component: React.ComponentType<any>;\n}\n\nconst Renderer = (props: RendererProps) => {\n    const getId = useIdGenerator(\"inputRenderer\");\n    const { name, component } = props;\n\n    return (\n        <Property id={getId(name)} name={\"inputRenderers\"} array={true}>\n            <Property id={getId(name, \"name\")} name={\"name\"} value={name} />\n            <Property id={getId(name, \"component\")} name={\"component\"} value={component} />\n        </Property>\n    );\n};\n\nexport interface ElementInputConfig {\n    name: string;\n    component: React.ComponentType<ElementInputRendererProps>;\n}\n\nexport const ElementInput = {\n    Renderer\n};\n"],"names":["Renderer","props","getId","useIdGenerator","name","component","Property","ElementInput"],"mappings":";;AAwCA,MAAMA,WAAW,CAACC;IACd,MAAMC,QAAQC,eAAe;IAC7B,MAAM,EAAEC,IAAI,EAAEC,SAAS,EAAE,GAAGJ;IAE5B,OAAO,WAAP,GACI,oBAACK,UAAQA;QAAC,IAAIJ,MAAME;QAAO,MAAM;QAAkB,OAAO;qBACtD,oBAACE,UAAQA;QAAC,IAAIJ,MAAME,MAAM;QAAS,MAAM;QAAQ,OAAOA;sBACxD,oBAACE,UAAQA;QAAC,IAAIJ,MAAME,MAAM;QAAc,MAAM;QAAa,OAAOC;;AAG9E;AAOO,MAAME,eAAe;IACxBP,UAAAA;AACJ"}

package/BaseEditor/config/ElementOverlay.d.ts

@@ -0,0 +1,22 @@
+import React from "react";
+import { type ElementProps as BaseElementProps } from "./Element.js";
+export type ElementProps = Pick<BaseElementProps, "name" | "element">;
+declare const Element: ({ name, element }: ElementProps) => React.JSX.Element;
+declare const Elements: () => React.JSX.Element;
+export interface ElementOverlayContainerProps {
+    position: {
+        top?: number;
+        left?: number;
+        bottom?: number;
+        right?: number;
+    };
+    children: React.ReactNode;
+}
+declare const Container: ({ position, children }: ElementOverlayContainerProps) => React.JSX.Element;
+export declare const ElementOverlay: {
+    Element: typeof Element & {
+        Container: typeof Container;
+    };
+    Elements: typeof Elements;
+};
+export {};

package/BaseEditor/config/ElementOverlay.js

@@ -0,0 +1,38 @@
+import react from "react";
+import { Element } from "./Element.js";
+import { Elements } from "./Elements.js";
+import { useElementOverlay } from "../hooks/useElementOverlay.js";
+const ElementOverlay_Element = ({ name, element })=>/*#__PURE__*/ react.createElement(Element, {
+        name: name,
+        element: element,
+        scope: "elementOverlay"
+    });
+const ElementOverlay_Elements = ()=>/*#__PURE__*/ react.createElement(Elements, {
+        scope: "elementOverlay"
+    });
+const empty = void 0;
+const Container = ({ position, children })=>{
+    const { box } = useElementOverlay();
+    const top = position.top !== empty ? box.top + position.top : empty;
+    const left = position.left !== empty ? box.left + position.left : empty;
+    const bottom = position.bottom !== empty ? box.top + box.height - position.bottom : empty;
+    const right = position.right !== empty ? box.left + box.width - position.right : empty;
+    return /*#__PURE__*/ react.createElement("div", {
+        "data-role": "element-overlay",
+        className: "absolute pointer-events-auto",
+        style: {
+            top: top ?? bottom,
+            left: left ?? right,
+            zIndex: 100 + box.depth + 100
+        }
+    }, children);
+};
+const ElementOverlay = {
+    Element: Object.assign(ElementOverlay_Element, {
+        Container: Container
+    }),
+    Elements: ElementOverlay_Elements
+};
+export { ElementOverlay };
+
+//# sourceMappingURL=ElementOverlay.js.map

package/BaseEditor/config/ElementOverlay.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseEditor/config/ElementOverlay.js","sources":["../../../src/BaseEditor/config/ElementOverlay.tsx"],"sourcesContent":["import React from \"react\";\nimport { Element as BaseElement, type ElementProps as BaseElementProps } from \"./Element.js\";\nimport { Elements as BaseElements } from \"./Elements.js\";\nimport { useElementOverlay } from \"~/BaseEditor/hooks/useElementOverlay.js\";\n\nexport type ElementProps = Pick<BaseElementProps, \"name\" | \"element\">;\n\nconst Element = ({ name, element }: ElementProps) => {\n    return <BaseElement name={name} element={element} scope={\"elementOverlay\"} />;\n};\n\nconst Elements = () => {\n    return <BaseElements scope={\"elementOverlay\"} />;\n};\n\nexport interface ElementOverlayContainerProps {\n    position: {\n        top?: number;\n        left?: number;\n        bottom?: number;\n        right?: number;\n    };\n    children: React.ReactNode;\n}\n\nconst empty = undefined;\n\nconst Container = ({ position, children }: ElementOverlayContainerProps) => {\n    const { box } = useElementOverlay();\n\n    const top = position.top !== empty ? box.top + position.top : empty;\n    const left = position.left !== empty ? box.left + position.left : empty;\n    const bottom = position.bottom !== empty ? box.top + box.height - position.bottom : empty;\n    const right = position.right !== empty ? box.left + box.width - position.right : empty;\n\n    return (\n        <div\n            data-role={\"element-overlay\"}\n            className={\"absolute pointer-events-auto\"}\n            style={{ top: top ?? bottom, left: left ?? right, zIndex: 100 + box.depth + 100 }}\n        >\n            {children}\n        </div>\n    );\n};\n\nexport const ElementOverlay = {\n    Element: Object.assign(Element, { Container }),\n    Elements\n};\n"],"names":["Element","name","element","BaseElement","Elements","BaseElements","empty","undefined","Container","position","children","box","useElementOverlay","top","left","bottom","right","ElementOverlay","Object"],"mappings":";;;;AAOA,MAAMA,yBAAU,CAAC,EAAEC,IAAI,EAAEC,OAAO,EAAgB,GACrC,WAAP,GAAO,oBAACC,SAAWA;QAAC,MAAMF;QAAM,SAASC;QAAS,OAAO;;AAG7D,MAAME,0BAAW,IACN,WAAP,GAAO,oBAACC,UAAYA;QAAC,OAAO;;AAahC,MAAMC,QAAQC;AAEd,MAAMC,YAAY,CAAC,EAAEC,QAAQ,EAAEC,QAAQ,EAAgC;IACnE,MAAM,EAAEC,GAAG,EAAE,GAAGC;IAEhB,MAAMC,MAAMJ,SAAS,GAAG,KAAKH,QAAQK,IAAI,GAAG,GAAGF,SAAS,GAAG,GAAGH;IAC9D,MAAMQ,OAAOL,SAAS,IAAI,KAAKH,QAAQK,IAAI,IAAI,GAAGF,SAAS,IAAI,GAAGH;IAClE,MAAMS,SAASN,SAAS,MAAM,KAAKH,QAAQK,IAAI,GAAG,GAAGA,IAAI,MAAM,GAAGF,SAAS,MAAM,GAAGH;IACpF,MAAMU,QAAQP,SAAS,KAAK,KAAKH,QAAQK,IAAI,IAAI,GAAGA,IAAI,KAAK,GAAGF,SAAS,KAAK,GAAGH;IAEjF,OAAO,WAAP,GACI,oBAAC;QACG,aAAW;QACX,WAAW;QACX,OAAO;YAAE,KAAKO,OAAOE;YAAQ,MAAMD,QAAQE;YAAO,QAAQ,MAAML,IAAI,KAAK,GAAG;QAAI;OAE/ED;AAGb;AAEO,MAAMO,iBAAiB;IAC1B,SAASC,OAAO,MAAM,CAAClB,wBAAS;QAAEQ,WAAAA;IAAU;IAC5CJ,UAAAA;AACJ"}

package/BaseEditor/config/ElementProperty.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import type { ElementProps } from "./Element";
-import type { ElementsProps } from "./Elements";
+import type { ElementProps } from "./Element.js";
+import type { ElementsProps } from "./Elements.js";
 export type ElementPropertyProps = Omit<ElementProps, "scope" | "id">;
 export declare const ElementProperty: ((props: ElementPropertyProps) => React.JSX.Element) & {
     original: (props: ElementPropertyProps) => React.JSX.Element;

package/BaseEditor/config/ElementProperty.js

@@ -1,30 +1,29 @@
-import React from "react";
+import react from "react";
 import { makeDecoratable } from "@webiny/react-composition";
-import { Element } from "./Element";
-import { Elements } from "./Elements";
+import { Element } from "./Element.js";
+import { Elements } from "./Elements.js";
 const SCOPE = "elementProperties";
-const getElementId = value => {
-  return ["elementProperty", value].join(":");
-};
-const BaseElementProperty = makeDecoratable("ElementProperty", props => {
-  return /*#__PURE__*/React.createElement(Element, Object.assign({}, props, {
-    scope: SCOPE,
-    id: getElementId(props.name),
-    before: props.before ? getElementId(props.before) : undefined,
-    after: props.after ? getElementId(props.after) : undefined
-  }));
-});
+const getElementId = (value)=>[
+        "elementProperty",
+        value
+    ].join(":");
+const BaseElementProperty = makeDecoratable("ElementProperty", (props)=>/*#__PURE__*/ react.createElement(Element, {
+        ...props,
+        scope: SCOPE,
+        id: getElementId(props.name),
+        before: props.before ? getElementId(props.before) : void 0,
+        after: props.after ? getElementId(props.after) : void 0
+    }));
 const ElementPropertyGroups = {
-  STYLE: "styleGroup",
-  ELEMENT: "elementGroup"
-};
-export const ElementProperty = Object.assign(BaseElementProperty, ElementPropertyGroups);
-export const ElementProperties = props => {
-  return /*#__PURE__*/React.createElement(Elements, {
-    group: props.group,
-    scope: SCOPE,
-    transform: props.transform
-  });
+    STYLE: "styleGroup",
+    ELEMENT: "elementGroup"
 };
+const ElementProperty = Object.assign(BaseElementProperty, ElementPropertyGroups);
+const ElementProperties = (props)=>/*#__PURE__*/ react.createElement(Elements, {
+        group: props.group,
+        scope: SCOPE,
+        transform: props.transform
+    });
+export { ElementProperties, ElementProperty };
 
 //# sourceMappingURL=ElementProperty.js.map

package/BaseEditor/config/ElementProperty.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","Element","Elements","SCOPE","getElementId","value","join","BaseElementProperty","props","createElement","Object","assign","scope","id","name","before","undefined","after","ElementPropertyGroups","STYLE","ELEMENT","ElementProperty","ElementProperties","group","transform"],"sources":["ElementProperty.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport type { ElementProps } from \"./Element\";\nimport { Element } from \"./Element\";\nimport type { ElementsProps } from \"./Elements\";\nimport { Elements } from \"./Elements\";\n\nconst SCOPE = \"elementProperties\";\n\nexport type ElementPropertyProps = Omit<ElementProps, \"scope\" | \"id\">;\n\nconst getElementId = (value: string) => {\n    return [\"elementProperty\", value].join(\":\");\n};\n\nconst BaseElementProperty = makeDecoratable(\"ElementProperty\", (props: ElementPropertyProps) => {\n    return (\n        <Element\n            {...props}\n            scope={SCOPE}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nconst ElementPropertyGroups = {\n    STYLE: \"styleGroup\",\n    ELEMENT: \"elementGroup\"\n};\n\nexport const ElementProperty = Object.assign(BaseElementProperty, ElementPropertyGroups);\n\nexport interface ElementPropertiesProps {\n    group?: string;\n    transform?: ElementsProps[\"transform\"];\n}\n\nexport const ElementProperties = (props: ElementPropertiesProps) => {\n    return <Elements group={props.group} scope={SCOPE} transform={props.transform} />;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,2BAA2B;AAE3D,SAASC,OAAO;AAEhB,SAASC,QAAQ;AAEjB,MAAMC,KAAK,GAAG,mBAAmB;AAIjC,MAAMC,YAAY,GAAIC,KAAa,IAAK;EACpC,OAAO,CAAC,iBAAiB,EAAEA,KAAK,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;AAC/C,CAAC;AAED,MAAMC,mBAAmB,GAAGP,eAAe,CAAC,iBAAiB,EAAGQ,KAA2B,IAAK;EAC5F,oBACIT,KAAA,CAAAU,aAAA,CAACR,OAAO,EAAAS,MAAA,CAAAC,MAAA,KACAH,KAAK;IACTI,KAAK,EAAET,KAAM;IACbU,EAAE,EAAET,YAAY,CAACI,KAAK,CAACM,IAAI,CAAE;IAC7BC,MAAM,EAAEP,KAAK,CAACO,MAAM,GAAGX,YAAY,CAACI,KAAK,CAACO,MAAM,CAAC,GAAGC,SAAU;IAC9DC,KAAK,EAAET,KAAK,CAACS,KAAK,GAAGb,YAAY,CAACI,KAAK,CAACS,KAAK,CAAC,GAAGD;EAAU,EAC9D,CAAC;AAEV,CAAC,CAAC;AAEF,MAAME,qBAAqB,GAAG;EAC1BC,KAAK,EAAE,YAAY;EACnBC,OAAO,EAAE;AACb,CAAC;AAED,OAAO,MAAMC,eAAe,GAAGX,MAAM,CAACC,MAAM,CAACJ,mBAAmB,EAAEW,qBAAqB,CAAC;AAOxF,OAAO,MAAMI,iBAAiB,GAAId,KAA6B,IAAK;EAChE,oBAAOT,KAAA,CAAAU,aAAA,CAACP,QAAQ;IAACqB,KAAK,EAAEf,KAAK,CAACe,KAAM;IAACX,KAAK,EAAET,KAAM;IAACqB,SAAS,EAAEhB,KAAK,CAACgB;EAAU,CAAE,CAAC;AACrF,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/config/ElementProperty.js","sources":["../../../src/BaseEditor/config/ElementProperty.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/react-composition\";\nimport type { ElementProps } from \"./Element.js\";\nimport { Element } from \"./Element.js\";\nimport type { ElementsProps } from \"./Elements.js\";\nimport { Elements } from \"./Elements.js\";\n\nconst SCOPE = \"elementProperties\";\n\nexport type ElementPropertyProps = Omit<ElementProps, \"scope\" | \"id\">;\n\nconst getElementId = (value: string) => {\n    return [\"elementProperty\", value].join(\":\");\n};\n\nconst BaseElementProperty = makeDecoratable(\"ElementProperty\", (props: ElementPropertyProps) => {\n    return (\n        <Element\n            {...props}\n            scope={SCOPE}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nconst ElementPropertyGroups = {\n    STYLE: \"styleGroup\",\n    ELEMENT: \"elementGroup\"\n};\n\nexport const ElementProperty = Object.assign(BaseElementProperty, ElementPropertyGroups);\n\nexport interface ElementPropertiesProps {\n    group?: string;\n    transform?: ElementsProps[\"transform\"];\n}\n\nexport const ElementProperties = (props: ElementPropertiesProps) => {\n    return <Elements group={props.group} scope={SCOPE} transform={props.transform} />;\n};\n"],"names":["SCOPE","getElementId","value","BaseElementProperty","makeDecoratable","props","Element","undefined","ElementPropertyGroups","ElementProperty","Object","ElementProperties","Elements"],"mappings":";;;;AAOA,MAAMA,QAAQ;AAId,MAAMC,eAAe,CAACC,QACX;QAAC;QAAmBA;KAAM,CAAC,IAAI,CAAC;AAG3C,MAAMC,sBAAsBC,gBAAgB,mBAAmB,CAACC,QACrD,WAAP,GACI,oBAACC,SAAOA;QACH,GAAGD,KAAK;QACT,OAAOL;QACP,IAAIC,aAAaI,MAAM,IAAI;QAC3B,QAAQA,MAAM,MAAM,GAAGJ,aAAaI,MAAM,MAAM,IAAIE;QACpD,OAAOF,MAAM,KAAK,GAAGJ,aAAaI,MAAM,KAAK,IAAIE;;AAK7D,MAAMC,wBAAwB;IAC1B,OAAO;IACP,SAAS;AACb;AAEO,MAAMC,kBAAkBC,OAAO,MAAM,CAACP,qBAAqBK;AAO3D,MAAMG,oBAAoB,CAACN,QACvB,WAAP,GAAO,oBAACO,UAAQA;QAAC,OAAOP,MAAM,KAAK;QAAE,OAAOL;QAAO,WAAWK,MAAM,SAAS"}