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

package/BaseEditor/hooks/useKeyHandler.js

@@ -0,0 +1,63 @@
+import React from "react";
+import isHotkey from "is-hotkey";
+import { mdbid } from "@webiny/utils";
+const keyStack = {};
+let listener = false;
+const filter = ["TEXTAREA", "INPUT"];
+const isContentEditable = value => {
+  return ["true", true].includes(value);
+};
+const setupListener = () => {
+  if (listener || !document.body) {
+    return;
+  }
+  document.body.addEventListener("keydown", ev => {
+    if (!ev.target) {
+      return;
+    }
+    const target = ev.target;
+    // We ignore all keyboard events coming from within contentEditable element and inputs.
+    if (filter.includes(target.nodeName) || isContentEditable(target.contentEditable)) {
+      return;
+    }
+    const matchedKey = Object.keys(keyStack).find(key => isHotkey(key, ev));
+    if (matchedKey && keyStack[matchedKey].length > 0) {
+      const item = keyStack[matchedKey][0];
+      item.handler(ev);
+      ev.stopPropagation();
+    }
+  });
+  listener = true;
+};
+const addKeyHandler = (id, key, handler) => {
+  setupListener();
+  keyStack[key] = keyStack[key] || [];
+  if (!keyStack[key].find(item => item.id === id)) {
+    keyStack[key].unshift({
+      id,
+      handler
+    });
+  }
+};
+const removeKeyHandler = (id, key) => {
+  if (!keyStack[key]) {
+    return;
+  }
+  const index = keyStack[key].findIndex(item => item.id === id);
+  if (index >= 0) {
+    keyStack[key].splice(index, 1);
+  }
+};
+export function useKeyHandler() {
+  const idRef = React.useRef(mdbid());
+  return React.useMemo(() => ({
+    addKeyHandler(key, handler) {
+      addKeyHandler(idRef.current, key, handler);
+    },
+    removeKeyHandler(key) {
+      removeKeyHandler(idRef.current, key);
+    }
+  }), []);
+}
+
+//# sourceMappingURL=useKeyHandler.js.map

package/BaseEditor/hooks/useKeyHandler.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","isHotkey","mdbid","keyStack","listener","filter","isContentEditable","value","includes","setupListener","document","body","addEventListener","ev","target","nodeName","contentEditable","matchedKey","Object","keys","find","key","length","item","handler","stopPropagation","addKeyHandler","id","unshift","removeKeyHandler","index","findIndex","splice","useKeyHandler","idRef","useRef","useMemo","current"],"sources":["useKeyHandler.ts"],"sourcesContent":["import React, { SyntheticEvent } from \"react\";\nimport isHotkey from \"is-hotkey\";\nimport { mdbid } from \"@webiny/utils\";\n\ninterface KeyHandler {\n    id: string;\n    handler: any;\n}\nconst keyStack: Record<string, KeyHandler[]> = {};\n\nlet listener = false;\nconst filter = [\"TEXTAREA\", \"INPUT\"];\n\nconst isContentEditable = (value: any) => {\n    return [\"true\", true].includes(value);\n};\n\nconst setupListener = (): void => {\n    if (listener || !document.body) {\n        return;\n    }\n    document.body.addEventListener(\"keydown\", ev => {\n        if (!ev.target) {\n            return;\n        }\n        const target = ev.target as HTMLElement;\n        // We ignore all keyboard events coming from within contentEditable element and inputs.\n        if (filter.includes(target.nodeName) || isContentEditable(target.contentEditable)) {\n            return;\n        }\n\n        const matchedKey = Object.keys(keyStack).find(key => isHotkey(key, ev));\n\n        if (matchedKey && keyStack[matchedKey].length > 0) {\n            const item = keyStack[matchedKey][0];\n            item.handler(ev);\n            ev.stopPropagation();\n        }\n    });\n\n    listener = true;\n};\n\nconst addKeyHandler = (\n    id: string,\n    key: string,\n    handler: (e: SyntheticEvent<HTMLElement>) => void\n) => {\n    setupListener();\n    keyStack[key] = keyStack[key] || [];\n    if (!keyStack[key].find(item => item.id === id)) {\n        keyStack[key].unshift({ id, handler });\n    }\n};\n\nconst removeKeyHandler = (id: string, key: string): void => {\n    if (!keyStack[key]) {\n        return;\n    }\n\n    const index = keyStack[key].findIndex(item => item.id === id);\n    if (index >= 0) {\n        keyStack[key].splice(index, 1);\n    }\n};\n\ntype AddKeyHandlerType = (key: string, handler: (e: SyntheticEvent<HTMLElement>) => void) => void;\n\ntype RemoveKeyHandlerType = (key: string) => void;\n\nexport function useKeyHandler(): {\n    addKeyHandler: AddKeyHandlerType;\n    removeKeyHandler: RemoveKeyHandlerType;\n} {\n    const idRef = React.useRef(mdbid());\n\n    return React.useMemo(\n        () => ({\n            addKeyHandler(key, handler) {\n                addKeyHandler(idRef.current, key, handler);\n            },\n            removeKeyHandler(key) {\n                removeKeyHandler(idRef.current, key);\n            }\n        }),\n        []\n    );\n}\n"],"mappings":"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","ignoreList":[]}

package/BaseEditor/hooks/usePreviewData.d.ts

@@ -0,0 +1,8 @@
+import { Boxes } from "./Boxes";
+export declare const usePreviewData: () => {
+    viewport: import("../../sdk").EditorViewportInfo;
+    boxes: {
+        preview: Boxes;
+        editor: Boxes;
+    };
+};

package/BaseEditor/hooks/usePreviewData.js

@@ -0,0 +1,22 @@
+import { useSelectFromEditor } from "./useSelectFromEditor";
+import { Boxes } from "./Boxes";
+export const usePreviewData = () => {
+  const {
+    viewport,
+    boxes
+  } = useSelectFromEditor(state => {
+    return {
+      viewport: state.viewport,
+      boxes: state.boxes
+    };
+  });
+  return {
+    viewport,
+    boxes: {
+      preview: new Boxes(boxes.preview),
+      editor: new Boxes(boxes.editor)
+    }
+  };
+};
+
+//# sourceMappingURL=usePreviewData.js.map

package/BaseEditor/hooks/usePreviewData.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useSelectFromEditor","Boxes","usePreviewData","viewport","boxes","state","preview","editor"],"sources":["usePreviewData.ts"],"sourcesContent":["import { useSelectFromEditor } from \"./useSelectFromEditor\";\nimport { Boxes } from \"./Boxes\";\n\nexport const usePreviewData = () => {\n    const { viewport, boxes } = useSelectFromEditor(state => {\n        return {\n            viewport: state.viewport,\n            boxes: state.boxes\n        };\n    });\n\n    return {\n        viewport,\n        boxes: {\n            preview: new Boxes(boxes.preview),\n            editor: new Boxes(boxes.editor)\n        }\n    };\n};\n"],"mappings":"AAAA,SAASA,mBAAmB;AAC5B,SAASC,KAAK;AAEd,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAChC,MAAM;IAAEC,QAAQ;IAAEC;EAAM,CAAC,GAAGJ,mBAAmB,CAACK,KAAK,IAAI;IACrD,OAAO;MACHF,QAAQ,EAAEE,KAAK,CAACF,QAAQ;MACxBC,KAAK,EAAEC,KAAK,CAACD;IACjB,CAAC;EACL,CAAC,CAAC;EAEF,OAAO;IACHD,QAAQ;IACRC,KAAK,EAAE;MACHE,OAAO,EAAE,IAAIL,KAAK,CAACG,KAAK,CAACE,OAAO,CAAC;MACjCC,MAAM,EAAE,IAAIN,KAAK,CAACG,KAAK,CAACG,MAAM;IAClC;EACJ,CAAC;AACL,CAAC","ignoreList":[]}

package/BaseEditor/hooks/useSelectFromDocument.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import type { EditorDocument } from "../../sdk/types";
+type Equals<T> = (a: T, b: T) => boolean;
+/**
+ * Subscribe to part of the document state.
+ * @param selector   Pick the slice of state you care about.
+ * @param equals     (optional) comparator, defaults to Object.is
+ */
+export declare function useSelectFromDocument<TReturn, TDocument extends EditorDocument>(selector: (doc: TDocument) => TReturn, deps?: React.DependencyList, equals?: Equals<TReturn>): TReturn;
+export {};

package/BaseEditor/hooks/useSelectFromDocument.js

@@ -0,0 +1,14 @@
+import deepEqual from "deep-equal";
+import { useDocumentEditor } from "../../DocumentEditor";
+import { useSelectFromState } from "./useSelectFromState";
+/**
+ * Subscribe to part of the document state.
+ * @param selector   Pick the slice of state you care about.
+ * @param equals     (optional) comparator, defaults to Object.is
+ */
+export function useSelectFromDocument(selector, deps = [], equals = deepEqual) {
+  const editor = useDocumentEditor();
+  return useSelectFromState(() => editor.getDocumentState().read(), selector, [editor, editor.getDocumentState().read(), ...deps], equals);
+}
+
+//# sourceMappingURL=useSelectFromDocument.js.map

package/BaseEditor/hooks/useSelectFromDocument.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["deepEqual","useDocumentEditor","useSelectFromState","useSelectFromDocument","selector","deps","equals","editor","getDocumentState","read"],"sources":["useSelectFromDocument.ts"],"sourcesContent":["import deepEqual from \"deep-equal\";\nimport type { EditorDocument } from \"~/sdk/types\";\nimport { useDocumentEditor } from \"~/DocumentEditor\";\nimport { useSelectFromState } from \"./useSelectFromState\";\n\ntype Equals<T> = (a: T, b: T) => boolean;\n\n/**\n * Subscribe to part of the document state.\n * @param selector   Pick the slice of state you care about.\n * @param equals     (optional) comparator, defaults to Object.is\n */\nexport function useSelectFromDocument<TReturn, TDocument extends EditorDocument>(\n    selector: (doc: TDocument) => TReturn,\n    deps: React.DependencyList = [],\n    equals: Equals<TReturn> = deepEqual\n): TReturn {\n    const editor = useDocumentEditor<TDocument>();\n\n    return useSelectFromState(\n        () => editor.getDocumentState().read(),\n        selector,\n        [editor, editor.getDocumentState().read(), ...deps],\n        equals\n    );\n}\n"],"mappings":"AAAA,OAAOA,SAAS,MAAM,YAAY;AAElC,SAASC,iBAAiB;AAC1B,SAASC,kBAAkB;AAI3B;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,qBAAqBA,CACjCC,QAAqC,EACrCC,IAA0B,GAAG,EAAE,EAC/BC,MAAuB,GAAGN,SAAS,EAC5B;EACP,MAAMO,MAAM,GAAGN,iBAAiB,CAAY,CAAC;EAE7C,OAAOC,kBAAkB,CACrB,MAAMK,MAAM,CAACC,gBAAgB,CAAC,CAAC,CAACC,IAAI,CAAC,CAAC,EACtCL,QAAQ,EACR,CAACG,MAAM,EAAEA,MAAM,CAACC,gBAAgB,CAAC,CAAC,CAACC,IAAI,CAAC,CAAC,EAAE,GAAGJ,IAAI,CAAC,EACnDC,MACJ,CAAC;AACL","ignoreList":[]}

package/BaseEditor/hooks/useSelectFromEditor.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { EditorState } from "../../editorSdk/Editor";
+type Equals<T> = (a: T, b: T) => boolean;
+/**
+ * Subscribe to part of the document state.
+ * @param selector   Pick the slice of state you care about.
+ * @param equals     (optional) comparator, defaults to Object.is
+ */
+export declare function useSelectFromEditor<T>(selector: (doc: EditorState) => T, deps?: React.DependencyList, equals?: Equals<T>): T;
+export {};

package/BaseEditor/hooks/useSelectFromEditor.js

@@ -0,0 +1,14 @@
+import deepEqual from "deep-equal";
+import { useDocumentEditor } from "../../DocumentEditor";
+import { useSelectFromState } from "./useSelectFromState";
+/**
+ * Subscribe to part of the document state.
+ * @param selector   Pick the slice of state you care about.
+ * @param equals     (optional) comparator, defaults to Object.is
+ */
+export function useSelectFromEditor(selector, deps = [], equals = deepEqual) {
+  const editor = useDocumentEditor();
+  return useSelectFromState(() => editor.getEditorState().read(), selector, [editor, ...deps], equals);
+}
+
+//# sourceMappingURL=useSelectFromEditor.js.map

package/BaseEditor/hooks/useSelectFromEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["deepEqual","useDocumentEditor","useSelectFromState","useSelectFromEditor","selector","deps","equals","editor","getEditorState","read"],"sources":["useSelectFromEditor.ts"],"sourcesContent":["import deepEqual from \"deep-equal\";\nimport { useDocumentEditor } from \"~/DocumentEditor\";\nimport { EditorState } from \"~/editorSdk/Editor\";\nimport { useSelectFromState } from \"~/BaseEditor/hooks/useSelectFromState\";\n\ntype Equals<T> = (a: T, b: T) => boolean;\n\n/**\n * Subscribe to part of the document state.\n * @param selector   Pick the slice of state you care about.\n * @param equals     (optional) comparator, defaults to Object.is\n */\nexport function useSelectFromEditor<T>(\n    selector: (doc: EditorState) => T,\n    deps: React.DependencyList = [],\n    equals: Equals<T> = deepEqual\n): T {\n    const editor = useDocumentEditor();\n\n    return useSelectFromState(\n        () => editor.getEditorState().read(),\n        selector,\n        [editor, ...deps],\n        equals\n    );\n}\n"],"mappings":"AAAA,OAAOA,SAAS,MAAM,YAAY;AAClC,SAASC,iBAAiB;AAE1B,SAASC,kBAAkB;AAI3B;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,mBAAmBA,CAC/BC,QAAiC,EACjCC,IAA0B,GAAG,EAAE,EAC/BC,MAAiB,GAAGN,SAAS,EAC5B;EACD,MAAMO,MAAM,GAAGN,iBAAiB,CAAC,CAAC;EAElC,OAAOC,kBAAkB,CACrB,MAAMK,MAAM,CAACC,cAAc,CAAC,CAAC,CAACC,IAAI,CAAC,CAAC,EACpCL,QAAQ,EACR,CAACG,MAAM,EAAE,GAAGF,IAAI,CAAC,EACjBC,MACJ,CAAC;AACL","ignoreList":[]}

package/BaseEditor/hooks/useSelectFromState.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+type Equals<T> = (a: T, b: T) => boolean;
+/**
+ * Subscribe to part of the document state.
+ * @param selector   Pick the slice of state you care about.
+ * @param equals     (optional) comparator, defaults to Object.is
+ */
+export declare function useSelectFromState<TState, T>(getState: () => TState, selector: (doc: TState) => T, deps?: React.DependencyList, equals?: Equals<T>): T;
+export {};

package/BaseEditor/hooks/useSelectFromState.js

@@ -0,0 +1,30 @@
+import deepEqual from "deep-equal";
+import { useState, useEffect, useMemo } from "react";
+import { autorun } from "mobx";
+/**
+ * Subscribe to part of the document state.
+ * @param selector   Pick the slice of state you care about.
+ * @param equals     (optional) comparator, defaults to Object.is
+ */
+export function useSelectFromState(getState, selector, deps = [], equals = deepEqual) {
+  // Pull the initial slice synchronously
+  const initialValue = useMemo(() => selector(getState()), deps);
+  const [value, setValue] = useState(initialValue);
+  useEffect(() => {
+    setValue(selector(getState())); // reset state on dep change
+  }, deps);
+  useEffect(() => {
+    let previous = selector(getState());
+    const disposer = autorun(() => {
+      const next = selector(getState());
+      if (!equals(previous, next)) {
+        setValue(next);
+        previous = next;
+      }
+    });
+    return () => disposer();
+  }, [...deps]);
+  return value;
+}
+
+//# sourceMappingURL=useSelectFromState.js.map

package/BaseEditor/hooks/useSelectFromState.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["deepEqual","useState","useEffect","useMemo","autorun","useSelectFromState","getState","selector","deps","equals","initialValue","value","setValue","previous","disposer","next"],"sources":["useSelectFromState.ts"],"sourcesContent":["import deepEqual from \"deep-equal\";\nimport { useState, useEffect, useMemo } from \"react\";\nimport { autorun } from \"mobx\";\n\ntype Equals<T> = (a: T, b: T) => boolean;\n\n/**\n * Subscribe to part of the document state.\n * @param selector   Pick the slice of state you care about.\n * @param equals     (optional) comparator, defaults to Object.is\n */\nexport function useSelectFromState<TState, T>(\n    getState: () => TState,\n    selector: (doc: TState) => T,\n    deps: React.DependencyList = [],\n    equals: Equals<T> = deepEqual\n): T {\n    // Pull the initial slice synchronously\n    const initialValue = useMemo(() => selector(getState()), deps);\n    const [value, setValue] = useState<T>(initialValue);\n\n    useEffect(() => {\n        setValue(selector(getState())); // reset state on dep change\n    }, deps);\n\n    useEffect(() => {\n        let previous = selector(getState());\n\n        const disposer = autorun(() => {\n            const next = selector(getState());\n            if (!equals(previous, next)) {\n                setValue(next);\n                previous = next;\n            }\n        });\n\n        return () => disposer();\n    }, [...deps]);\n\n    return value;\n}\n"],"mappings":"AAAA,OAAOA,SAAS,MAAM,YAAY;AAClC,SAASC,QAAQ,EAAEC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AACpD,SAASC,OAAO,QAAQ,MAAM;AAI9B;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,kBAAkBA,CAC9BC,QAAsB,EACtBC,QAA4B,EAC5BC,IAA0B,GAAG,EAAE,EAC/BC,MAAiB,GAAGT,SAAS,EAC5B;EACD;EACA,MAAMU,YAAY,GAAGP,OAAO,CAAC,MAAMI,QAAQ,CAACD,QAAQ,CAAC,CAAC,CAAC,EAAEE,IAAI,CAAC;EAC9D,MAAM,CAACG,KAAK,EAAEC,QAAQ,CAAC,GAAGX,QAAQ,CAAIS,YAAY,CAAC;EAEnDR,SAAS,CAAC,MAAM;IACZU,QAAQ,CAACL,QAAQ,CAACD,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;EACpC,CAAC,EAAEE,IAAI,CAAC;EAERN,SAAS,CAAC,MAAM;IACZ,IAAIW,QAAQ,GAAGN,QAAQ,CAACD,QAAQ,CAAC,CAAC,CAAC;IAEnC,MAAMQ,QAAQ,GAAGV,OAAO,CAAC,MAAM;MAC3B,MAAMW,IAAI,GAAGR,QAAQ,CAACD,QAAQ,CAAC,CAAC,CAAC;MACjC,IAAI,CAACG,MAAM,CAACI,QAAQ,EAAEE,IAAI,CAAC,EAAE;QACzBH,QAAQ,CAACG,IAAI,CAAC;QACdF,QAAQ,GAAGE,IAAI;MACnB;IACJ,CAAC,CAAC;IAEF,OAAO,MAAMD,QAAQ,CAAC,CAAC;EAC3B,CAAC,EAAE,CAAC,GAAGN,IAAI,CAAC,CAAC;EAEb,OAAOG,KAAK;AAChB","ignoreList":[]}

package/BaseEditor/hooks/useStyles.d.ts

@@ -0,0 +1 @@
+export * from "../defaultConfig/Sidebar/StyleSettings/useStyles";

package/BaseEditor/hooks/useStyles.js

@@ -0,0 +1,3 @@
+export * from "../defaultConfig/Sidebar/StyleSettings/useStyles";
+
+//# sourceMappingURL=useStyles.js.map

package/BaseEditor/hooks/useStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["useStyles.ts"],"sourcesContent":["export * from \"../defaultConfig/Sidebar/StyleSettings/useStyles\"\n"],"mappings":"AAAA","ignoreList":[]}

package/BaseEditor/index.d.ts

@@ -0,0 +1,4 @@
+export { DefaultEditorConfig } from "./defaultConfig/DefaultEditorConfig";
+export * from "./config";
+export * from "./commands";
+export { ElementInputRendererProps } from "./config/ElementInput";

package/BaseEditor/index.js

@@ -0,0 +1,6 @@
+export { DefaultEditorConfig } from "./defaultConfig/DefaultEditorConfig";
+export * from "./config";
+export * from "./commands";
+export { ElementInputRendererProps } from "./config/ElementInput";
+
+//# sourceMappingURL=index.js.map

package/BaseEditor/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["DefaultEditorConfig","ElementInputRendererProps"],"sources":["index.tsx"],"sourcesContent":["export { DefaultEditorConfig } from \"./defaultConfig/DefaultEditorConfig\";\nexport * from \"./config\";\nexport * from \"./commands\";\nexport { ElementInputRendererProps } from \"./config/ElementInput\"\n"],"mappings":"AAAA,SAASA,mBAAmB;AAC5B;AACA;AACA,SAASC,yBAAyB","ignoreList":[]}

package/BaseEditor/metadata/BreakpointElementMetadata.d.ts

@@ -0,0 +1,12 @@
+import type { Document } from "../../sdk/types";
+import type { IMetadata } from "./IMetadata";
+export declare class BreakpointElementMetadata implements IMetadata {
+    private readonly breakpoints;
+    private readonly currentBreakpoint;
+    private metadata;
+    constructor(breakpoints: string[], currentBreakpoint: string, metadata: IMetadata);
+    applyToDocument(document: Document): void;
+    get<T = unknown>(id: string): T | undefined;
+    set(id: string, data: any): void;
+    unset(id: string): void;
+}

package/BaseEditor/metadata/BreakpointElementMetadata.js

@@ -0,0 +1,29 @@
+export class BreakpointElementMetadata {
+  constructor(breakpoints, currentBreakpoint, metadata) {
+    this.breakpoints = breakpoints;
+    this.currentBreakpoint = currentBreakpoint;
+    this.metadata = metadata;
+  }
+  applyToDocument(document) {
+    this.metadata.applyToDocument(document);
+  }
+  get(id) {
+    const upTo = this.breakpoints.indexOf(this.currentBreakpoint);
+    for (let i = upTo; i >= 0; i--) {
+      const breakpoint = this.breakpoints[i];
+      const data = this.metadata.get(`${id}/${breakpoint}`);
+      if (data !== undefined) {
+        return data;
+      }
+    }
+    return undefined;
+  }
+  set(id, data) {
+    this.metadata.set(`${id}/${this.currentBreakpoint}`, data);
+  }
+  unset(id) {
+    this.metadata.unset(`${id}/${this.currentBreakpoint}`);
+  }
+}
+
+//# sourceMappingURL=BreakpointElementMetadata.js.map

package/BaseEditor/metadata/BreakpointElementMetadata.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["BreakpointElementMetadata","constructor","breakpoints","currentBreakpoint","metadata","applyToDocument","document","get","id","upTo","indexOf","i","breakpoint","data","undefined","set","unset"],"sources":["BreakpointElementMetadata.ts"],"sourcesContent":["import type { Document } from \"~/sdk/types\";\nimport type { IMetadata } from \"./IMetadata\";\n\nexport class BreakpointElementMetadata implements IMetadata {\n    private readonly breakpoints: string[];\n    private readonly currentBreakpoint: string;\n    private metadata: IMetadata;\n\n    constructor(breakpoints: string[], currentBreakpoint: string, metadata: IMetadata) {\n        this.breakpoints = breakpoints;\n        this.currentBreakpoint = currentBreakpoint;\n        this.metadata = metadata;\n    }\n\n    applyToDocument(document: Document): void {\n        this.metadata.applyToDocument(document);\n    }\n\n    get<T = unknown>(id: string): T | undefined {\n        const upTo = this.breakpoints.indexOf(this.currentBreakpoint);\n\n        for (let i = upTo; i >= 0; i--) {\n            const breakpoint = this.breakpoints[i];\n            const data = this.metadata.get<T>(`${id}/${breakpoint}`);\n            if (data !== undefined) {\n                return data;\n            }\n        }\n\n        return undefined;\n    }\n\n    set(id: string, data: any): void {\n        this.metadata.set(`${id}/${this.currentBreakpoint}`, data);\n    }\n\n    unset(id: string): void {\n        this.metadata.unset(`${id}/${this.currentBreakpoint}`);\n    }\n}\n"],"mappings":"AAGA,OAAO,MAAMA,yBAAyB,CAAsB;EAKxDC,WAAWA,CAACC,WAAqB,EAAEC,iBAAyB,EAAEC,QAAmB,EAAE;IAC/E,IAAI,CAACF,WAAW,GAAGA,WAAW;IAC9B,IAAI,CAACC,iBAAiB,GAAGA,iBAAiB;IAC1C,IAAI,CAACC,QAAQ,GAAGA,QAAQ;EAC5B;EAEAC,eAAeA,CAACC,QAAkB,EAAQ;IACtC,IAAI,CAACF,QAAQ,CAACC,eAAe,CAACC,QAAQ,CAAC;EAC3C;EAEAC,GAAGA,CAAcC,EAAU,EAAiB;IACxC,MAAMC,IAAI,GAAG,IAAI,CAACP,WAAW,CAACQ,OAAO,CAAC,IAAI,CAACP,iBAAiB,CAAC;IAE7D,KAAK,IAAIQ,CAAC,GAAGF,IAAI,EAAEE,CAAC,IAAI,CAAC,EAAEA,CAAC,EAAE,EAAE;MAC5B,MAAMC,UAAU,GAAG,IAAI,CAACV,WAAW,CAACS,CAAC,CAAC;MACtC,MAAME,IAAI,GAAG,IAAI,CAACT,QAAQ,CAACG,GAAG,CAAI,GAAGC,EAAE,IAAII,UAAU,EAAE,CAAC;MACxD,IAAIC,IAAI,KAAKC,SAAS,EAAE;QACpB,OAAOD,IAAI;MACf;IACJ;IAEA,OAAOC,SAAS;EACpB;EAEAC,GAAGA,CAACP,EAAU,EAAEK,IAAS,EAAQ;IAC7B,IAAI,CAACT,QAAQ,CAACW,GAAG,CAAC,GAAGP,EAAE,IAAI,IAAI,CAACL,iBAAiB,EAAE,EAAEU,IAAI,CAAC;EAC9D;EAEAG,KAAKA,CAACR,EAAU,EAAQ;IACpB,IAAI,CAACJ,QAAQ,CAACY,KAAK,CAAC,GAAGR,EAAE,IAAI,IAAI,CAACL,iBAAiB,EAAE,CAAC;EAC1D;AACJ","ignoreList":[]}

package/BaseEditor/metadata/ElementMetadata.d.ts

@@ -0,0 +1,11 @@
+import type { Document } from "../../sdk/types";
+import type { IMetadata, Metadata } from "./IMetadata";
+export declare class ElementMetadata implements IMetadata {
+    private readonly elementId;
+    private readonly metadata;
+    constructor(elementId: string, metadata?: Record<string, any>);
+    get<T = unknown>(id: string): T | undefined;
+    set(id: string, data: Metadata): void;
+    unset(id: string): void;
+    applyToDocument(document: Document): void;
+}

package/BaseEditor/metadata/ElementMetadata.js

@@ -0,0 +1,30 @@
+import micromatch from "micromatch";
+export class ElementMetadata {
+  constructor(elementId, metadata = {}) {
+    this.elementId = elementId;
+    this.metadata = metadata;
+  }
+  get(id) {
+    return this.metadata[id];
+  }
+  set(id, data) {
+    this.metadata[id] = data;
+  }
+  unset(id) {
+    // Support wildcard paths using micromatch
+    if (id.includes("*")) {
+      const keys = Object.keys(this.metadata);
+      const matches = micromatch(keys, id);
+      for (const key of matches) {
+        delete this.metadata[key];
+      }
+    } else {
+      delete this.metadata[id];
+    }
+  }
+  applyToDocument(document) {
+    document.bindings[this.elementId].metadata = this.metadata;
+  }
+}
+
+//# sourceMappingURL=ElementMetadata.js.map

package/BaseEditor/metadata/ElementMetadata.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["micromatch","ElementMetadata","constructor","elementId","metadata","get","id","set","data","unset","includes","keys","Object","matches","key","applyToDocument","document","bindings"],"sources":["ElementMetadata.ts"],"sourcesContent":["import micromatch from \"micromatch\";\nimport type { Document } from \"~/sdk/types\";\nimport type { IMetadata, Metadata } from \"./IMetadata\";\n\nexport class ElementMetadata implements IMetadata {\n    private readonly elementId: string;\n    private readonly metadata: Record<string, any>;\n\n    constructor(elementId: string, metadata: Record<string, any> = {}) {\n        this.elementId = elementId;\n        this.metadata = metadata;\n    }\n\n    get<T = unknown>(id: string): T | undefined {\n        return this.metadata[id];\n    }\n\n    set(id: string, data: Metadata): void {\n        this.metadata[id] = data;\n    }\n\n    unset(id: string): void {\n        // Support wildcard paths using micromatch\n        if (id.includes(\"*\")) {\n            const keys = Object.keys(this.metadata);\n            const matches = micromatch(keys, id);\n            for (const key of matches) {\n                delete this.metadata[key];\n            }\n        } else {\n            delete this.metadata[id];\n        }\n    }\n\n    applyToDocument(document: Document) {\n        document.bindings[this.elementId].metadata = this.metadata;\n    }\n}\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,YAAY;AAInC,OAAO,MAAMC,eAAe,CAAsB;EAI9CC,WAAWA,CAACC,SAAiB,EAAEC,QAA6B,GAAG,CAAC,CAAC,EAAE;IAC/D,IAAI,CAACD,SAAS,GAAGA,SAAS;IAC1B,IAAI,CAACC,QAAQ,GAAGA,QAAQ;EAC5B;EAEAC,GAAGA,CAAcC,EAAU,EAAiB;IACxC,OAAO,IAAI,CAACF,QAAQ,CAACE,EAAE,CAAC;EAC5B;EAEAC,GAAGA,CAACD,EAAU,EAAEE,IAAc,EAAQ;IAClC,IAAI,CAACJ,QAAQ,CAACE,EAAE,CAAC,GAAGE,IAAI;EAC5B;EAEAC,KAAKA,CAACH,EAAU,EAAQ;IACpB;IACA,IAAIA,EAAE,CAACI,QAAQ,CAAC,GAAG,CAAC,EAAE;MAClB,MAAMC,IAAI,GAAGC,MAAM,CAACD,IAAI,CAAC,IAAI,CAACP,QAAQ,CAAC;MACvC,MAAMS,OAAO,GAAGb,UAAU,CAACW,IAAI,EAAEL,EAAE,CAAC;MACpC,KAAK,MAAMQ,GAAG,IAAID,OAAO,EAAE;QACvB,OAAO,IAAI,CAACT,QAAQ,CAACU,GAAG,CAAC;MAC7B;IACJ,CAAC,MAAM;MACH,OAAO,IAAI,CAACV,QAAQ,CAACE,EAAE,CAAC;IAC5B;EACJ;EAEAS,eAAeA,CAACC,QAAkB,EAAE;IAChCA,QAAQ,CAACC,QAAQ,CAAC,IAAI,CAACd,SAAS,CAAC,CAACC,QAAQ,GAAG,IAAI,CAACA,QAAQ;EAC9D;AACJ","ignoreList":[]}

package/BaseEditor/metadata/IMetadata.d.ts

@@ -0,0 +1,8 @@
+import type { Document } from "../../sdk/types";
+export type Metadata = Record<string, any>;
+export interface IMetadata {
+    get<T = unknown>(id: string): T | undefined;
+    set(id: string, data: any): void;
+    unset(id?: string): void;
+    applyToDocument(document: Document): void;
+}

package/BaseEditor/metadata/IMetadata.js

@@ -0,0 +1,3 @@
+export {};
+
+//# sourceMappingURL=IMetadata.js.map

package/BaseEditor/metadata/IMetadata.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["IMetadata.ts"],"sourcesContent":["import type { Document } from \"~/sdk/types\";\n\nexport type Metadata = Record<string, any>;\n\nexport interface IMetadata {\n    get<T = unknown>(id: string): T | undefined;\n    set(id: string, data: any): void;\n    unset(id?: string): void;\n    applyToDocument(document: Document): void;\n}\n"],"mappings":"","ignoreList":[]}

package/BaseEditor/metadata/InputMetadata.d.ts

@@ -0,0 +1,12 @@
+import type { Document } from "../../sdk/types";
+import type { IMetadata } from "./IMetadata";
+export declare class InputMetadata implements IMetadata {
+    private readonly inputId;
+    private metadata;
+    private prefix;
+    constructor(inputId: string, metadata: IMetadata);
+    applyToDocument(document: Document): void;
+    get<T = unknown>(id: string): T | undefined;
+    set(id: string, data: any): void;
+    unset(id?: string): void;
+}

package/BaseEditor/metadata/InputMetadata.js

@@ -0,0 +1,21 @@
+export class InputMetadata {
+  prefix = "inputs/";
+  constructor(inputId, metadata) {
+    this.inputId = inputId;
+    this.metadata = metadata;
+  }
+  applyToDocument(document) {
+    this.metadata.applyToDocument(document);
+  }
+  get(id) {
+    return this.metadata.get(`${this.prefix}${this.inputId}/${id}`);
+  }
+  set(id, data) {
+    this.metadata.set(`${this.prefix}${this.inputId}/${id}`, data);
+  }
+  unset(id = "*") {
+    this.metadata.unset(`${this.prefix}${this.inputId}/${id}`);
+  }
+}
+
+//# sourceMappingURL=InputMetadata.js.map

package/BaseEditor/metadata/InputMetadata.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["InputMetadata","prefix","constructor","inputId","metadata","applyToDocument","document","get","id","set","data","unset"],"sources":["InputMetadata.ts"],"sourcesContent":["import type { Document } from \"~/sdk/types\";\nimport type { IMetadata } from \"./IMetadata\";\n\nexport class InputMetadata implements IMetadata {\n    private readonly inputId: string;\n    private metadata: IMetadata;\n    private prefix = \"inputs/\";\n\n    constructor(inputId: string, metadata: IMetadata) {\n        this.inputId = inputId;\n        this.metadata = metadata;\n    }\n\n    applyToDocument(document: Document): void {\n        this.metadata.applyToDocument(document);\n    }\n\n    get<T = unknown>(id: string): T | undefined {\n        return this.metadata.get(`${this.prefix}${this.inputId}/${id}`);\n    }\n\n    set(id: string, data: any): void {\n        this.metadata.set(`${this.prefix}${this.inputId}/${id}`, data);\n    }\n\n    unset(id: string = \"*\"): void {\n        this.metadata.unset(`${this.prefix}${this.inputId}/${id}`);\n    }\n}\n"],"mappings":"AAGA,OAAO,MAAMA,aAAa,CAAsB;EAGpCC,MAAM,GAAG,SAAS;EAE1BC,WAAWA,CAACC,OAAe,EAAEC,QAAmB,EAAE;IAC9C,IAAI,CAACD,OAAO,GAAGA,OAAO;IACtB,IAAI,CAACC,QAAQ,GAAGA,QAAQ;EAC5B;EAEAC,eAAeA,CAACC,QAAkB,EAAQ;IACtC,IAAI,CAACF,QAAQ,CAACC,eAAe,CAACC,QAAQ,CAAC;EAC3C;EAEAC,GAAGA,CAAcC,EAAU,EAAiB;IACxC,OAAO,IAAI,CAACJ,QAAQ,CAACG,GAAG,CAAC,GAAG,IAAI,CAACN,MAAM,GAAG,IAAI,CAACE,OAAO,IAAIK,EAAE,EAAE,CAAC;EACnE;EAEAC,GAAGA,CAACD,EAAU,EAAEE,IAAS,EAAQ;IAC7B,IAAI,CAACN,QAAQ,CAACK,GAAG,CAAC,GAAG,IAAI,CAACR,MAAM,GAAG,IAAI,CAACE,OAAO,IAAIK,EAAE,EAAE,EAAEE,IAAI,CAAC;EAClE;EAEAC,KAAKA,CAACH,EAAU,GAAG,GAAG,EAAQ;IAC1B,IAAI,CAACJ,QAAQ,CAACO,KAAK,CAAC,GAAG,IAAI,CAACV,MAAM,GAAG,IAAI,CAACE,OAAO,IAAIK,EAAE,EAAE,CAAC;EAC9D;AACJ","ignoreList":[]}

package/BaseEditor/metadata/NullMetadata.d.ts

@@ -0,0 +1,7 @@
+import type { IMetadata } from "./IMetadata";
+export declare class NullMetadata implements IMetadata {
+    applyToDocument(): void;
+    get<T = unknown>(): T | undefined;
+    set(): void;
+    unset(): void;
+}

package/BaseEditor/metadata/NullMetadata.js

@@ -0,0 +1,10 @@
+export class NullMetadata {
+  applyToDocument() {}
+  get() {
+    return undefined;
+  }
+  set() {}
+  unset() {}
+}
+
+//# sourceMappingURL=NullMetadata.js.map

package/BaseEditor/metadata/NullMetadata.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["NullMetadata","applyToDocument","get","undefined","set","unset"],"sources":["NullMetadata.ts"],"sourcesContent":["import type { IMetadata } from \"./IMetadata\";\n\nexport class NullMetadata implements IMetadata {\n    applyToDocument(): void {}\n\n    get<T = unknown>(): T | undefined {\n        return undefined;\n    }\n\n    set(): void {}\n\n    unset(): void {}\n}\n"],"mappings":"AAEA,OAAO,MAAMA,YAAY,CAAsB;EAC3CC,eAAeA,CAAA,EAAS,CAAC;EAEzBC,GAAGA,CAAA,EAA+B;IAC9B,OAAOC,SAAS;EACpB;EAEAC,GAAGA,CAAA,EAAS,CAAC;EAEbC,KAAKA,CAAA,EAAS,CAAC;AACnB","ignoreList":[]}

package/BaseEditor/metadata/StylesMetadata.d.ts

@@ -0,0 +1,11 @@
+import type { Document } from "../../sdk/types";
+import type { IMetadata } from "./IMetadata";
+export declare class StylesMetadata implements IMetadata {
+    private metadata;
+    private prefix;
+    constructor(metadata: IMetadata);
+    applyToDocument(document: Document): void;
+    get<T = unknown>(id: string): T | undefined;
+    set(id: string, data: any): void;
+    unset(id: string): void;
+}

package/BaseEditor/metadata/StylesMetadata.js

@@ -0,0 +1,20 @@
+export class StylesMetadata {
+  prefix = "styles/";
+  constructor(metadata) {
+    this.metadata = metadata;
+  }
+  applyToDocument(document) {
+    this.metadata.applyToDocument(document);
+  }
+  get(id) {
+    return this.metadata.get(`${this.prefix}${id}`);
+  }
+  set(id, data) {
+    this.metadata.set(`${this.prefix}${id}`, data);
+  }
+  unset(id) {
+    this.metadata.unset(`${this.prefix}${id}`);
+  }
+}
+
+//# sourceMappingURL=StylesMetadata.js.map

package/BaseEditor/metadata/StylesMetadata.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["StylesMetadata","prefix","constructor","metadata","applyToDocument","document","get","id","set","data","unset"],"sources":["StylesMetadata.ts"],"sourcesContent":["import type { Document } from \"~/sdk/types\";\nimport type { IMetadata } from \"./IMetadata\";\n\nexport class StylesMetadata implements IMetadata {\n    private metadata: IMetadata;\n    private prefix = \"styles/\";\n\n    constructor(metadata: IMetadata) {\n        this.metadata = metadata;\n    }\n\n    applyToDocument(document: Document): void {\n        this.metadata.applyToDocument(document);\n    }\n\n    get<T = unknown>(id: string): T | undefined {\n        return this.metadata.get(`${this.prefix}${id}`);\n    }\n\n    set(id: string, data: any): void {\n        this.metadata.set(`${this.prefix}${id}`, data);\n    }\n\n    unset(id: string): void {\n        this.metadata.unset(`${this.prefix}${id}`);\n    }\n}\n"],"mappings":"AAGA,OAAO,MAAMA,cAAc,CAAsB;EAErCC,MAAM,GAAG,SAAS;EAE1BC,WAAWA,CAACC,QAAmB,EAAE;IAC7B,IAAI,CAACA,QAAQ,GAAGA,QAAQ;EAC5B;EAEAC,eAAeA,CAACC,QAAkB,EAAQ;IACtC,IAAI,CAACF,QAAQ,CAACC,eAAe,CAACC,QAAQ,CAAC;EAC3C;EAEAC,GAAGA,CAAcC,EAAU,EAAiB;IACxC,OAAO,IAAI,CAACJ,QAAQ,CAACG,GAAG,CAAC,GAAG,IAAI,CAACL,MAAM,GAAGM,EAAE,EAAE,CAAC;EACnD;EAEAC,GAAGA,CAACD,EAAU,EAAEE,IAAS,EAAQ;IAC7B,IAAI,CAACN,QAAQ,CAACK,GAAG,CAAC,GAAG,IAAI,CAACP,MAAM,GAAGM,EAAE,EAAE,EAAEE,IAAI,CAAC;EAClD;EAEAC,KAAKA,CAACH,EAAU,EAAQ;IACpB,IAAI,CAACJ,QAAQ,CAACO,KAAK,CAAC,GAAG,IAAI,CAACT,MAAM,GAAGM,EAAE,EAAE,CAAC;EAC9C;AACJ","ignoreList":[]}

package/BaseEditor/metadata/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./IMetadata";
+export * from "./InputMetadata";
+export * from "./ElementMetadata";
+export * from "./BreakpointElementMetadata";
+export * from "./StylesMetadata";
+export * from "./NullMetadata";

package/BaseEditor/metadata/index.js

@@ -0,0 +1,8 @@
+export * from "./IMetadata";
+export * from "./InputMetadata";
+export * from "./ElementMetadata";
+export * from "./BreakpointElementMetadata";
+export * from "./StylesMetadata";
+export * from "./NullMetadata";
+
+//# sourceMappingURL=index.js.map

package/BaseEditor/metadata/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export * from \"./IMetadata\";\nexport * from \"./InputMetadata\";\nexport * from \"./ElementMetadata\";\nexport * from \"./BreakpointElementMetadata\";\nexport * from \"./StylesMetadata\";\nexport * from \"./NullMetadata\";\n"],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA","ignoreList":[]}

package/DocumentEditor/ConnectEditorToPreview.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+import { Messenger } from "../sdk/messenger";
+import { usePreviewData } from "../BaseEditor/hooks/usePreviewData";
+type ConnectEditorToPreviewProps = {
+    iframeRef: React.RefObject<HTMLIFrameElement>;
+    onConnected: (messenger: Messenger, elementPositionsHook?: ReturnType<typeof usePreviewData>) => void;
+};
+export declare function ConnectEditorToPreview({ iframeRef, onConnected }: ConnectEditorToPreviewProps): null;
+export {};

package/DocumentEditor/ConnectEditorToPreview.js

@@ -0,0 +1,31 @@
+import { useEffect, useRef } from "react";
+import { MessageOrigin, Messenger } from "../sdk/messenger";
+export function ConnectEditorToPreview({
+  iframeRef,
+  onConnected
+}) {
+  const messengerRef = useRef(null);
+  useEffect(() => {
+    if (!iframeRef.current?.contentWindow) {
+      return;
+    }
+    const targetWindow = () => iframeRef.current.contentWindow;
+    const targetOrigin = new URL(iframeRef.current.src).origin;
+    const editorOrigin = new MessageOrigin(() => window, window.location.origin);
+    const previewTarget = new MessageOrigin(targetWindow, targetOrigin);
+    const messenger = new Messenger(editorOrigin, previewTarget, "wb.editor.*");
+    messengerRef.current = messenger;
+
+    // Listen for "preview-ready"
+    const off = messenger.on("preview.ready", () => {
+      onConnected(messenger);
+    });
+    return () => {
+      off(); // Remove listener
+      messenger.dispose();
+    };
+  }, [iframeRef, onConnected]);
+  return null;
+}
+
+//# sourceMappingURL=ConnectEditorToPreview.js.map

package/DocumentEditor/ConnectEditorToPreview.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useRef","MessageOrigin","Messenger","ConnectEditorToPreview","iframeRef","onConnected","messengerRef","current","contentWindow","targetWindow","targetOrigin","URL","src","origin","editorOrigin","window","location","previewTarget","messenger","off","on","dispose"],"sources":["ConnectEditorToPreview.tsx"],"sourcesContent":["import React, { useEffect, useRef } from \"react\";\nimport { MessageOrigin, Messenger } from \"../sdk/messenger\";\nimport { usePreviewData } from \"~/BaseEditor/hooks/usePreviewData\";\n\ntype ConnectEditorToPreviewProps = {\n    iframeRef: React.RefObject<HTMLIFrameElement>;\n    onConnected: (\n        messenger: Messenger,\n        elementPositionsHook?: ReturnType<typeof usePreviewData>\n    ) => void;\n};\n\nexport function ConnectEditorToPreview({ iframeRef, onConnected }: ConnectEditorToPreviewProps) {\n    const messengerRef = useRef<Messenger | null>(null);\n\n    useEffect(() => {\n        if (!iframeRef.current?.contentWindow) {\n            return;\n        }\n\n        const targetWindow = () => iframeRef.current!.contentWindow!;\n        const targetOrigin = new URL(iframeRef.current.src).origin;\n\n        const editorOrigin = new MessageOrigin(() => window, window.location.origin);\n        const previewTarget = new MessageOrigin(targetWindow, targetOrigin);\n\n        const messenger = new Messenger(editorOrigin, previewTarget, \"wb.editor.*\");\n        messengerRef.current = messenger;\n\n        // Listen for \"preview-ready\"\n        const off = messenger.on(\"preview.ready\", () => {\n            onConnected(messenger);\n        });\n\n        return () => {\n            off(); // Remove listener\n            messenger.dispose();\n        };\n    }, [iframeRef, onConnected]);\n\n    return null;\n}\n"],"mappings":"AAAA,SAAgBA,SAAS,EAAEC,MAAM,QAAQ,OAAO;AAChD,SAASC,aAAa,EAAEC,SAAS;AAWjC,OAAO,SAASC,sBAAsBA,CAAC;EAAEC,SAAS;EAAEC;AAAyC,CAAC,EAAE;EAC5F,MAAMC,YAAY,GAAGN,MAAM,CAAmB,IAAI,CAAC;EAEnDD,SAAS,CAAC,MAAM;IACZ,IAAI,CAACK,SAAS,CAACG,OAAO,EAAEC,aAAa,EAAE;MACnC;IACJ;IAEA,MAAMC,YAAY,GAAGA,CAAA,KAAML,SAAS,CAACG,OAAO,CAAEC,aAAc;IAC5D,MAAME,YAAY,GAAG,IAAIC,GAAG,CAACP,SAAS,CAACG,OAAO,CAACK,GAAG,CAAC,CAACC,MAAM;IAE1D,MAAMC,YAAY,GAAG,IAAIb,aAAa,CAAC,MAAMc,MAAM,EAAEA,MAAM,CAACC,QAAQ,CAACH,MAAM,CAAC;IAC5E,MAAMI,aAAa,GAAG,IAAIhB,aAAa,CAACQ,YAAY,EAAEC,YAAY,CAAC;IAEnE,MAAMQ,SAAS,GAAG,IAAIhB,SAAS,CAACY,YAAY,EAAEG,aAAa,EAAE,aAAa,CAAC;IAC3EX,YAAY,CAACC,OAAO,GAAGW,SAAS;;IAEhC;IACA,MAAMC,GAAG,GAAGD,SAAS,CAACE,EAAE,CAAC,eAAe,EAAE,MAAM;MAC5Cf,WAAW,CAACa,SAAS,CAAC;IAC1B,CAAC,CAAC;IAEF,OAAO,MAAM;MACTC,GAAG,CAAC,CAAC,CAAC,CAAC;MACPD,SAAS,CAACG,OAAO,CAAC,CAAC;IACvB,CAAC;EACL,CAAC,EAAE,CAACjB,SAAS,EAAEC,WAAW,CAAC,CAAC;EAE5B,OAAO,IAAI;AACf","ignoreList":[]}

package/DocumentEditor/DocumentEditor.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import type { EditorDocument } from "../sdk/types.js";
+import { Editor } from "../editorSdk/Editor";
+export declare const DocumentEditorContext: React.Context<Editor<any> | undefined>;
+export declare function useDocumentEditor<TDocument extends EditorDocument>(): Editor<TDocument>;
+interface DocumentEditorProps<TDocument> {
+    document: TDocument;
+    name: string;
+    children?: React.ReactNode;
+}
+declare function BaseDocumentEditor<TDocument extends EditorDocument>({ document, name, children }: DocumentEditorProps<TDocument>): React.JSX.Element;
+export declare const DocumentEditor: typeof BaseDocumentEditor & {
+    displayName: string;
+};
+export {};

package/DocumentEditor/DocumentEditor.js

@@ -0,0 +1,36 @@
+import React, { useMemo } from "react";
+import { HTML5Backend } from "react-dnd-html5-backend";
+import { DndProvider } from "react-dnd";
+import { Editor as EditorComponent } from "../BaseEditor/components";
+import { Editor } from "../editorSdk/Editor";
+import { observer } from "mobx-react-lite";
+import { StateInspector } from "./StateInspector";
+import { CompositionScope } from "@webiny/react-composition";
+export const DocumentEditorContext = /*#__PURE__*/React.createContext(undefined);
+export function useDocumentEditor() {
+  const context = React.useContext(DocumentEditorContext);
+  if (!context) {
+    throw new Error("useDocumentEditor must be used within a <DocumentEditor /> context!");
+  }
+  return context;
+}
+function BaseDocumentEditor({
+  document,
+  name,
+  children
+}) {
+  const editor = useMemo(() => new Editor(document), [document]);
+  return /*#__PURE__*/React.createElement(DndProvider, {
+    backend: HTML5Backend
+  }, /*#__PURE__*/React.createElement(StateInspector, {
+    editor: editor
+  }), /*#__PURE__*/React.createElement(DocumentEditorContext.Provider, {
+    value: editor
+  }, children ? /*#__PURE__*/React.createElement(React.Fragment, null, children) : null, /*#__PURE__*/React.createElement(CompositionScope, {
+    name: name
+  }, /*#__PURE__*/React.createElement(EditorComponent, null))));
+}
+const WithObserver = observer(BaseDocumentEditor);
+export const DocumentEditor = WithObserver;
+
+//# sourceMappingURL=DocumentEditor.js.map