@webiny/app-website-builder 6.0.0-alpha.0

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 { InputAstNode } from \"~/sdk/ComponentManifestToAstConverter\";\n// import { FieldArray } from \"./FieldArray\";\nimport { useInputRenderer } from \"./useInputRenderer\";\nimport { useInputValue } from \"./useInputValue\";\nimport type { DocumentElement, DocumentElementBindings } from \"~/sdk/types\";\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,CAACe,MAAO;IACpBd,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 "../../../../sdk/ComponentManifestToAstConverter";
+import type { DocumentElementBindings } from "../../../../sdk/types";
+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 \"~/sdk/ComponentManifestToAstConverter\";\nimport { InputField } from \"./InputField\";\nimport type { DocumentElement, DocumentElementBindings } from \"~/sdk/types\";\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 { 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[];
+}

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

@@ -0,0 +1,41 @@
+export class StatePathsCollection {
+  constructor(items) {
+    this.items = items;
+  }
+  map(callback) {
+    const mapped = this.items.map(callback);
+    return new StatePathsCollection(mapped);
+  }
+  filter(callback) {
+    const filtered = this.items.filter(callback);
+    return new StatePathsCollection(filtered);
+  }
+  filterScalars() {
+    const filtered = this.items.filter(item => {
+      return item.type.isScalar();
+    });
+    return new StatePathsCollection(filtered);
+  }
+  filterArray() {
+    const filtered = this.items.filter(item => {
+      return item.type.isArray();
+    });
+    return new StatePathsCollection(filtered);
+  }
+  sort(compareFn) {
+    const sorted = [...this.items];
+    if (compareFn) {
+      sorted.sort(compareFn);
+    } else {
+      sorted.sort((a, b) => {
+        return a.label.localeCompare(b.label);
+      });
+    }
+    return new StatePathsCollection(sorted);
+  }
+  values() {
+    return [...this.items];
+  }
+}
+
+//# sourceMappingURL=StatePathsCollection.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["StatePathsCollection","constructor","items","map","callback","mapped","filter","filtered","filterScalars","item","type","isScalar","filterArray","isArray","sort","compareFn","sorted","a","b","label","localeCompare","values"],"sources":["StatePathsCollection.ts"],"sourcesContent":["import { PathType } from \"./PathType\";\n\nexport type PathOption = {\n    value: string;\n    label: string;\n    type: PathType;\n};\n\nexport class StatePathsCollection {\n    private readonly items: PathOption[];\n\n    constructor(items: PathOption[]) {\n        this.items = items;\n    }\n\n    public map(callback: (item: PathOption, index: number) => any): StatePathsCollection {\n        const mapped = this.items.map(callback);\n        return new StatePathsCollection(mapped);\n    }\n\n    public filter(callback: (item: PathOption, index: number) => boolean): StatePathsCollection {\n        const filtered = this.items.filter(callback);\n        return new StatePathsCollection(filtered);\n    }\n\n    public filterScalars(): StatePathsCollection {\n        const filtered = this.items.filter(item => {\n            return item.type.isScalar();\n        });\n        return new StatePathsCollection(filtered);\n    }\n\n    public filterArray(): StatePathsCollection {\n        const filtered = this.items.filter(item => {\n            return item.type.isArray();\n        });\n        return new StatePathsCollection(filtered);\n    }\n\n    public sort(compareFn?: (a: PathOption, b: PathOption) => number): StatePathsCollection {\n        const sorted = [...this.items];\n\n        if (compareFn) {\n            sorted.sort(compareFn);\n        } else {\n            sorted.sort((a, b) => {\n                return a.label.localeCompare(b.label);\n            });\n        }\n\n        return new StatePathsCollection(sorted);\n    }\n\n    public values(): PathOption[] {\n        return [...this.items];\n    }\n}\n"],"mappings":"AAQA,OAAO,MAAMA,oBAAoB,CAAC;EAG9BC,WAAWA,CAACC,KAAmB,EAAE;IAC7B,IAAI,CAACA,KAAK,GAAGA,KAAK;EACtB;EAEOC,GAAGA,CAACC,QAAkD,EAAwB;IACjF,MAAMC,MAAM,GAAG,IAAI,CAACH,KAAK,CAACC,GAAG,CAACC,QAAQ,CAAC;IACvC,OAAO,IAAIJ,oBAAoB,CAACK,MAAM,CAAC;EAC3C;EAEOC,MAAMA,CAACF,QAAsD,EAAwB;IACxF,MAAMG,QAAQ,GAAG,IAAI,CAACL,KAAK,CAACI,MAAM,CAACF,QAAQ,CAAC;IAC5C,OAAO,IAAIJ,oBAAoB,CAACO,QAAQ,CAAC;EAC7C;EAEOC,aAAaA,CAAA,EAAyB;IACzC,MAAMD,QAAQ,GAAG,IAAI,CAACL,KAAK,CAACI,MAAM,CAACG,IAAI,IAAI;MACvC,OAAOA,IAAI,CAACC,IAAI,CAACC,QAAQ,CAAC,CAAC;IAC/B,CAAC,CAAC;IACF,OAAO,IAAIX,oBAAoB,CAACO,QAAQ,CAAC;EAC7C;EAEOK,WAAWA,CAAA,EAAyB;IACvC,MAAML,QAAQ,GAAG,IAAI,CAACL,KAAK,CAACI,MAAM,CAACG,IAAI,IAAI;MACvC,OAAOA,IAAI,CAACC,IAAI,CAACG,OAAO,CAAC,CAAC;IAC9B,CAAC,CAAC;IACF,OAAO,IAAIb,oBAAoB,CAACO,QAAQ,CAAC;EAC7C;EAEOO,IAAIA,CAACC,SAAoD,EAAwB;IACpF,MAAMC,MAAM,GAAG,CAAC,GAAG,IAAI,CAACd,KAAK,CAAC;IAE9B,IAAIa,SAAS,EAAE;MACXC,MAAM,CAACF,IAAI,CAACC,SAAS,CAAC;IAC1B,CAAC,MAAM;MACHC,MAAM,CAACF,IAAI,CAAC,CAACG,CAAC,EAAEC,CAAC,KAAK;QAClB,OAAOD,CAAC,CAACE,KAAK,CAACC,aAAa,CAACF,CAAC,CAACC,KAAK,CAAC;MACzC,CAAC,CAAC;IACN;IAEA,OAAO,IAAInB,oBAAoB,CAACgB,MAAM,CAAC;EAC3C;EAEOK,MAAMA,CAAA,EAAiB;IAC1B,OAAO,CAAC,GAAG,IAAI,CAACnB,KAAK,CAAC;EAC1B;AACJ","ignoreList":[]}

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

@@ -0,0 +1,11 @@
+import { StatePathsCollection } from "./StatePathsCollection";
+export declare class StatePathsExtractor {
+    private readonly state;
+    constructor(state: Record<string, any>);
+    getPaths(): StatePathsCollection;
+    private extractPaths;
+    getChildPaths(path: string): StatePathsCollection;
+    private extractRelativeNoIndexPaths;
+    private toLabel;
+    private getValueType;
+}

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

@@ -0,0 +1,102 @@
+import get from "lodash/get";
+import { StatePathsCollection } from "./StatePathsCollection";
+import { PathType } from "./PathType";
+export class StatePathsExtractor {
+  constructor(state) {
+    this.state = state;
+  }
+  getPaths() {
+    return new StatePathsCollection(this.extractPaths(this.state));
+  }
+  extractPaths(obj, path = [], labelPath = [], result = []) {
+    for (const [key, value] of Object.entries(obj)) {
+      const currentPath = [...path, key];
+      const currentLabelPath = [...labelPath, this.toLabel(key)];
+      const valueType = this.getValueType(value);
+      const dotPath = `$state.${currentPath.join(".")}`;
+      const label = currentLabelPath.join(" → ");
+      result.push({
+        value: dotPath,
+        label,
+        type: valueType
+      });
+      if (valueType.matches("object")) {
+        this.extractPaths(value, currentPath, currentLabelPath, result);
+      }
+      if (valueType.matches("array")) {
+        // @ts-expect-error We know it's an array.
+        for (let i = 0; i < value.length; i++) {
+          // @ts-expect-error We know it's an array.
+          const item = value[i];
+          const indexedPath = [...currentPath, String(i)];
+          const itemType = this.getValueType(item);
+          const labelWithIndex = `${this.toLabel(key)} [${i}]`;
+          const indexedLabelPath = [...labelPath, labelWithIndex];
+          const itemDotPath = `$state.${indexedPath.join(".")}`;
+          const itemLabel = indexedLabelPath.join(" → ");
+          result.push({
+            value: itemDotPath,
+            label: itemLabel,
+            type: itemType
+          });
+          if (itemType.matches("object")) {
+            this.extractPaths(item, indexedPath, indexedLabelPath, result);
+          }
+        }
+      }
+    }
+    return result;
+  }
+  getChildPaths(path) {
+    const rawPath = path.replace(/^\$state\./, "");
+    const node = get(this.state, rawPath);
+    if (node === undefined || node === null) {
+      return new StatePathsCollection([]);
+    }
+    const baseLabel = this.toLabel(rawPath.split(".").pop() || "");
+
+    // If array, assume inspecting the first item
+    const target = Array.isArray(node) ? node[0] : node;
+    if (typeof target !== "object" || target === null) {
+      return new StatePathsCollection([]);
+    }
+    const result = [];
+    this.extractRelativeNoIndexPaths(target, [], [baseLabel], result);
+    return new StatePathsCollection(result.map(opt => ({
+      ...opt,
+      value: `$.${opt.value}`
+    })));
+  }
+  extractRelativeNoIndexPaths(obj, path = [], labelPath = [], result = []) {
+    for (const [key, value] of Object.entries(obj)) {
+      const currentPath = [...path, key];
+      const currentLabelPath = [...labelPath, this.toLabel(key)];
+      const type = this.getValueType(value);
+      result.push({
+        value: currentPath.join("."),
+        label: currentLabelPath.join(" → "),
+        type
+      });
+      if (type.matches("object")) {
+        this.extractRelativeNoIndexPaths(value, currentPath, currentLabelPath, result);
+      }
+      if (type.isArray() && value.length > 0 && typeof value[0] === "object") {
+        this.extractRelativeNoIndexPaths(value[0], currentPath, currentLabelPath, result);
+      }
+    }
+  }
+  toLabel(key) {
+    return key.replace(/([a-z])([A-Z])/g, "$1 $2").replace(/^./, str => str.toUpperCase());
+  }
+  getValueType(value) {
+    if (Array.isArray(value)) {
+      return new PathType("array");
+    }
+    if (value === null) {
+      return new PathType("null");
+    }
+    return new PathType(typeof value);
+  }
+}
+
+//# sourceMappingURL=StatePathsExtractor.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["get","StatePathsCollection","PathType","StatePathsExtractor","constructor","state","getPaths","extractPaths","obj","path","labelPath","result","key","value","Object","entries","currentPath","currentLabelPath","toLabel","valueType","getValueType","dotPath","join","label","push","type","matches","i","length","item","indexedPath","String","itemType","labelWithIndex","indexedLabelPath","itemDotPath","itemLabel","getChildPaths","rawPath","replace","node","undefined","baseLabel","split","pop","target","Array","isArray","extractRelativeNoIndexPaths","map","opt","str","toUpperCase"],"sources":["StatePathsExtractor.ts"],"sourcesContent":["import get from \"lodash/get\";\nimport { StatePathsCollection, type PathOption } from \"./StatePathsCollection\";\nimport { PathType } from \"./PathType\";\n\nexport class StatePathsExtractor {\n    private readonly state: Record<string, any>;\n\n    constructor(state: Record<string, any>) {\n        this.state = state;\n    }\n\n    public getPaths(): StatePathsCollection {\n        return new StatePathsCollection(this.extractPaths(this.state));\n    }\n\n    private extractPaths(\n        obj: any,\n        path: string[] = [],\n        labelPath: string[] = [],\n        result: PathOption[] = []\n    ): PathOption[] {\n        for (const [key, value] of Object.entries(obj)) {\n            const currentPath = [...path, key];\n            const currentLabelPath = [...labelPath, this.toLabel(key)];\n            const valueType = this.getValueType(value);\n\n            const dotPath = `$state.${currentPath.join(\".\")}`;\n            const label = currentLabelPath.join(\" → \");\n\n            result.push({ value: dotPath, label, type: valueType });\n\n            if (valueType.matches(\"object\")) {\n                this.extractPaths(value, currentPath, currentLabelPath, result);\n            }\n\n            if (valueType.matches(\"array\")) {\n                // @ts-expect-error We know it's an array.\n                for (let i = 0; i < value.length; i++) {\n                    // @ts-expect-error We know it's an array.\n                    const item = value[i];\n                    const indexedPath = [...currentPath, String(i)];\n                    const itemType = this.getValueType(item);\n\n                    const labelWithIndex = `${this.toLabel(key)} [${i}]`;\n                    const indexedLabelPath = [...labelPath, labelWithIndex];\n\n                    const itemDotPath = `$state.${indexedPath.join(\".\")}`;\n                    const itemLabel = indexedLabelPath.join(\" → \");\n\n                    result.push({ value: itemDotPath, label: itemLabel, type: itemType });\n\n                    if (itemType.matches(\"object\")) {\n                        this.extractPaths(item, indexedPath, indexedLabelPath, result);\n                    }\n                }\n            }\n        }\n\n        return result;\n    }\n\n    public getChildPaths(path: string): StatePathsCollection {\n        const rawPath = path.replace(/^\\$state\\./, \"\");\n        const node = get(this.state, rawPath);\n\n        if (node === undefined || node === null) {\n            return new StatePathsCollection([]);\n        }\n\n        const baseLabel = this.toLabel(rawPath.split(\".\").pop() || \"\");\n\n        // If array, assume inspecting the first item\n        const target = Array.isArray(node) ? node[0] : node;\n\n        if (typeof target !== \"object\" || target === null) {\n            return new StatePathsCollection([]);\n        }\n\n        const result: PathOption[] = [];\n        this.extractRelativeNoIndexPaths(target, [], [baseLabel], result);\n\n        return new StatePathsCollection(\n            result.map(opt => ({\n                ...opt,\n                value: `$.${opt.value}`\n            }))\n        );\n    }\n\n    private extractRelativeNoIndexPaths(\n        obj: any,\n        path: string[] = [],\n        labelPath: string[] = [],\n        result: PathOption[] = []\n    ): void {\n        for (const [key, value] of Object.entries<any>(obj)) {\n            const currentPath = [...path, key];\n            const currentLabelPath = [...labelPath, this.toLabel(key)];\n            const type = this.getValueType(value);\n\n            result.push({\n                value: currentPath.join(\".\"),\n                label: currentLabelPath.join(\" → \"),\n                type\n            });\n\n            if (type.matches(\"object\")) {\n                this.extractRelativeNoIndexPaths(value, currentPath, currentLabelPath, result);\n            }\n\n            if (type.isArray() && value.length > 0 && typeof value[0] === \"object\") {\n                this.extractRelativeNoIndexPaths(value[0], currentPath, currentLabelPath, result);\n            }\n        }\n    }\n\n    private toLabel(key: string): string {\n        return key.replace(/([a-z])([A-Z])/g, \"$1 $2\").replace(/^./, str => str.toUpperCase());\n    }\n\n    private getValueType(value: any): PathType {\n        if (Array.isArray(value)) {\n            return new PathType(\"array\");\n        }\n\n        if (value === null) {\n            return new PathType(\"null\");\n        }\n\n        return new PathType(typeof value);\n    }\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1 @@
+export {};

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

@@ -0,0 +1,127 @@
+import { StatePathsExtractor } from "./StatePathsExtractor";
+describe("StatePathsExtractor", () => {
+  it("extracts all paths including array indexes", () => {
+    const state = {
+      users: [{
+        name: "Alice",
+        age: 30
+      }, {
+        name: "Bob",
+        age: 25
+      }],
+      settings: {
+        enabled: true,
+        theme: "dark"
+      }
+    };
+    const extractor = new StatePathsExtractor(state);
+    const paths = extractor.getPaths().values();
+    expect(paths).toEqual(expect.arrayContaining([{
+      value: "$state.users",
+      label: "Users",
+      type: "array"
+    }, {
+      value: "$state.users.0",
+      label: "Users [0]",
+      type: "object"
+    }, {
+      value: "$state.users.0.name",
+      label: "Users [0] → Name",
+      type: "string"
+    }, {
+      value: "$state.users.0.age",
+      label: "Users [0] → Age",
+      type: "number"
+    }, {
+      value: "$state.settings",
+      label: "Settings",
+      type: "object"
+    }, {
+      value: "$state.settings.enabled",
+      label: "Settings → Enabled",
+      type: "boolean"
+    }, {
+      value: "$state.settings.theme",
+      label: "Settings → Theme",
+      type: "string"
+    }]));
+  });
+  it("getChildPaths() returns deeply nested fields without array index", () => {
+    const state = {
+      users: [{
+        name: "Alice",
+        address: {
+          city: "NY",
+          zip: 10001
+        }
+      }]
+    };
+    const extractor = new StatePathsExtractor(state);
+    const childPaths = extractor.getChildPaths("$state.users");
+    expect(childPaths).toEqual([{
+      value: "$.name",
+      label: "Users → Name",
+      type: "string"
+    }, {
+      value: "$.address",
+      label: "Users → Address",
+      type: "object"
+    }, {
+      value: "$.address.city",
+      label: "Users → Address → City",
+      type: "string"
+    }, {
+      value: "$.address.zip",
+      label: "Users → Address → Zip",
+      type: "number"
+    }]);
+  });
+  it("getChildPaths() handles root objects", () => {
+    const state = {
+      settings: {
+        mode: "dark",
+        debug: false
+      }
+    };
+    const extractor = new StatePathsExtractor(state);
+    const childPaths = extractor.getChildPaths("$state.settings");
+    expect(childPaths).toEqual([{
+      value: "$.mode",
+      label: "Settings → Mode",
+      type: "string"
+    }, {
+      value: "$.debug",
+      label: "Settings → Debug",
+      type: "boolean"
+    }]);
+  });
+  it("getChildPaths() returns empty array for primitives or undefined paths", () => {
+    const state = {
+      flag: true,
+      count: 5
+    };
+    const extractor = new StatePathsExtractor(state);
+    expect(extractor.getChildPaths("$state.flag")).toEqual([]);
+    expect(extractor.getChildPaths("$state.count")).toEqual([]);
+    expect(extractor.getChildPaths("$state.missing")).toEqual([]);
+  });
+  it("getChildPaths() handles arrays with non-object items", () => {
+    const state = {
+      tags: ["a", "b", "c"]
+    };
+    const extractor = new StatePathsExtractor(state);
+    const childPaths = extractor.getChildPaths("$state.tags");
+    expect(childPaths).toEqual([]);
+  });
+  it("getChildPaths() handles arrays with null or empty items", () => {
+    const state = {
+      logs: [null],
+      events: []
+    };
+    const extractor = new StatePathsExtractor(state);
+    expect(extractor.getChildPaths("$state.logs")).toEqual([]);
+    expect(extractor.getChildPaths("$state.events")).toEqual([]);
+  });
+});
+
+//# sourceMappingURL=StatePathsExtractor.test.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["StatePathsExtractor","describe","it","state","users","name","age","settings","enabled","theme","extractor","paths","getPaths","values","expect","toEqual","arrayContaining","value","label","type","address","city","zip","childPaths","getChildPaths","mode","debug","flag","count","tags","logs","events"],"sources":["StatePathsExtractor.test.ts"],"sourcesContent":["import { StatePathsExtractor } from \"./StatePathsExtractor\";\n\ndescribe(\"StatePathsExtractor\", () => {\n    it(\"extracts all paths including array indexes\", () => {\n        const state = {\n            users: [\n                { name: \"Alice\", age: 30 },\n                { name: \"Bob\", age: 25 }\n            ],\n            settings: {\n                enabled: true,\n                theme: \"dark\"\n            }\n        };\n\n        const extractor = new StatePathsExtractor(state);\n        const paths = extractor.getPaths().values();\n\n        expect(paths).toEqual(\n            expect.arrayContaining([\n                { value: \"$state.users\", label: \"Users\", type: \"array\" },\n                { value: \"$state.users.0\", label: \"Users [0]\", type: \"object\" },\n                { value: \"$state.users.0.name\", label: \"Users [0] → Name\", type: \"string\" },\n                { value: \"$state.users.0.age\", label: \"Users [0] → Age\", type: \"number\" },\n                { value: \"$state.settings\", label: \"Settings\", type: \"object\" },\n                { value: \"$state.settings.enabled\", label: \"Settings → Enabled\", type: \"boolean\" },\n                { value: \"$state.settings.theme\", label: \"Settings → Theme\", type: \"string\" }\n            ])\n        );\n    });\n\n    it(\"getChildPaths() returns deeply nested fields without array index\", () => {\n        const state = {\n            users: [\n                {\n                    name: \"Alice\",\n                    address: {\n                        city: \"NY\",\n                        zip: 10001\n                    }\n                }\n            ]\n        };\n\n        const extractor = new StatePathsExtractor(state);\n        const childPaths = extractor.getChildPaths(\"$state.users\");\n\n        expect(childPaths).toEqual([\n            { value: \"$.name\", label: \"Users → Name\", type: \"string\" },\n            { value: \"$.address\", label: \"Users → Address\", type: \"object\" },\n            { value: \"$.address.city\", label: \"Users → Address → City\", type: \"string\" },\n            { value: \"$.address.zip\", label: \"Users → Address → Zip\", type: \"number\" }\n        ]);\n    });\n\n    it(\"getChildPaths() handles root objects\", () => {\n        const state = {\n            settings: {\n                mode: \"dark\",\n                debug: false\n            }\n        };\n\n        const extractor = new StatePathsExtractor(state);\n        const childPaths = extractor.getChildPaths(\"$state.settings\");\n\n        expect(childPaths).toEqual([\n            { value: \"$.mode\", label: \"Settings → Mode\", type: \"string\" },\n            { value: \"$.debug\", label: \"Settings → Debug\", type: \"boolean\" }\n        ]);\n    });\n\n    it(\"getChildPaths() returns empty array for primitives or undefined paths\", () => {\n        const state = {\n            flag: true,\n            count: 5\n        };\n\n        const extractor = new StatePathsExtractor(state);\n\n        expect(extractor.getChildPaths(\"$state.flag\")).toEqual([]);\n        expect(extractor.getChildPaths(\"$state.count\")).toEqual([]);\n        expect(extractor.getChildPaths(\"$state.missing\")).toEqual([]);\n    });\n\n    it(\"getChildPaths() handles arrays with non-object items\", () => {\n        const state = {\n            tags: [\"a\", \"b\", \"c\"]\n        };\n\n        const extractor = new StatePathsExtractor(state);\n        const childPaths = extractor.getChildPaths(\"$state.tags\");\n\n        expect(childPaths).toEqual([]);\n    });\n\n    it(\"getChildPaths() handles arrays with null or empty items\", () => {\n        const state = {\n            logs: [null],\n            events: []\n        };\n\n        const extractor = new StatePathsExtractor(state);\n\n        expect(extractor.getChildPaths(\"$state.logs\")).toEqual([]);\n        expect(extractor.getChildPaths(\"$state.events\")).toEqual([]);\n    });\n});\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,8 @@
+import React from "react";
+interface WithBindingToggleProps {
+    type: "static" | "expression";
+    setBindingType: (value: "static" | "expression") => void;
+    children: React.ReactNode;
+}
+export declare const WithBindingToggle: ({ setBindingType, type, children }: WithBindingToggleProps) => React.JSX.Element;
+export {};

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

@@ -0,0 +1,26 @@
+import { IconButton } from "@webiny/admin-ui";
+import { ReactComponent as AddLinkIcon } from "@webiny/icons/add_link.svg";
+import { ReactComponent as RemoveLinkIcon } from "@webiny/icons/link_off.svg";
+import React, { useCallback } from "react";
+const addIcon = /*#__PURE__*/React.createElement(AddLinkIcon, null);
+const removeIcon = /*#__PURE__*/React.createElement(RemoveLinkIcon, null);
+export const WithBindingToggle = ({
+  setBindingType,
+  type,
+  children
+}) => {
+  const onClick = useCallback(() => {
+    setBindingType(type === "static" ? "expression" : "static");
+  }, [type, setBindingType]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "wby-relative"
+  }, /*#__PURE__*/React.createElement(IconButton, {
+    className: "wby-absolute wby-right-0",
+    variant: "ghost",
+    size: "sm",
+    icon: type === "static" ? addIcon : removeIcon,
+    onClick: onClick
+  }), children);
+};
+
+//# sourceMappingURL=WithBindingToggle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["IconButton","ReactComponent","AddLinkIcon","RemoveLinkIcon","React","useCallback","addIcon","createElement","removeIcon","WithBindingToggle","setBindingType","type","children","onClick","className","variant","size","icon"],"sources":["WithBindingToggle.tsx"],"sourcesContent":["import { IconButton } from \"@webiny/admin-ui\";\nimport { ReactComponent as AddLinkIcon } from \"@webiny/icons/add_link.svg\";\nimport { ReactComponent as RemoveLinkIcon } from \"@webiny/icons/link_off.svg\";\nimport React, { useCallback } from \"react\";\n\ninterface WithBindingToggleProps {\n    type: \"static\" | \"expression\";\n    setBindingType: (value: \"static\" | \"expression\") => void;\n    children: React.ReactNode;\n}\n\nconst addIcon = <AddLinkIcon />;\nconst removeIcon = <RemoveLinkIcon />;\n\nexport const WithBindingToggle = ({ setBindingType, type, children }: WithBindingToggleProps) => {\n    const onClick = useCallback(() => {\n        setBindingType(type === \"static\" ? \"expression\" : \"static\");\n    }, [type, setBindingType]);\n\n    return (\n        <div className={\"wby-relative\"}>\n            <IconButton\n                className={\"wby-absolute wby-right-0\"}\n                variant={\"ghost\"}\n                size={\"sm\"}\n                icon={type === \"static\" ? addIcon : removeIcon}\n                onClick={onClick}\n            />\n            {children}\n        </div>\n    );\n};\n"],"mappings":"AAAA,SAASA,UAAU,QAAQ,kBAAkB;AAC7C,SAASC,cAAc,IAAIC,WAAW,QAAQ,4BAA4B;AAC1E,SAASD,cAAc,IAAIE,cAAc,QAAQ,4BAA4B;AAC7E,OAAOC,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAQ1C,MAAMC,OAAO,gBAAGF,KAAA,CAAAG,aAAA,CAACL,WAAW,MAAE,CAAC;AAC/B,MAAMM,UAAU,gBAAGJ,KAAA,CAAAG,aAAA,CAACJ,cAAc,MAAE,CAAC;AAErC,OAAO,MAAMM,iBAAiB,GAAGA,CAAC;EAAEC,cAAc;EAAEC,IAAI;EAAEC;AAAiC,CAAC,KAAK;EAC7F,MAAMC,OAAO,GAAGR,WAAW,CAAC,MAAM;IAC9BK,cAAc,CAACC,IAAI,KAAK,QAAQ,GAAG,YAAY,GAAG,QAAQ,CAAC;EAC/D,CAAC,EAAE,CAACA,IAAI,EAAED,cAAc,CAAC,CAAC;EAE1B,oBACIN,KAAA,CAAAG,aAAA;IAAKO,SAAS,EAAE;EAAe,gBAC3BV,KAAA,CAAAG,aAAA,CAACP,UAAU;IACPc,SAAS,EAAE,0BAA2B;IACtCC,OAAO,EAAE,OAAQ;IACjBC,IAAI,EAAE,IAAK;IACXC,IAAI,EAAEN,IAAI,KAAK,QAAQ,GAAGL,OAAO,GAAGE,UAAW;IAC/CK,OAAO,EAAEA;EAAQ,CACpB,CAAC,EACDD,QACA,CAAC;AAEd,CAAC","ignoreList":[]}