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

package/BaseEditor/defaultConfig/Content/AddressBar/usePreviewLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseEditor/defaultConfig/Content/AddressBar/usePreviewLink.js","sources":["../../../../../src/BaseEditor/defaultConfig/Content/AddressBar/usePreviewLink.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport { useIframeUrl } from \"~/BaseEditor/defaultConfig/Content/Preview/useIframeUrl.js\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument.js\";\n\nexport const usePreviewLink = () => {\n    const iframeUrl = useIframeUrl();\n    const id = useSelectFromDocument(document => document.id);\n    const path = useSelectFromDocument(document => document.properties.path);\n    const documentType = useSelectFromDocument(document => document.metadata.documentType);\n    // // Set when the edited document is an A/B variant (see variantDocument.ts). When present, the\n    // // preview must open the variant's draft — not the page the document borrows its identity from.\n    // const previewVariantId = useSelectFromDocument(\n    //     document =>\n    //         (document.metadata as Record<string, any>).wbVariantPreviewId as string | undefined\n    // );\n\n    return useMemo(() => {\n        if (!iframeUrl) {\n            return \"\";\n        }\n        const url = new URL(iframeUrl);\n\n        // Remove all `wb.` params\n        url.searchParams.forEach((_, key) => {\n            if (key.startsWith(\"wb.\")) {\n                url.searchParams.delete(key);\n            }\n        });\n\n        // if (previewVariantId) {\n        //     // Variant draft preview — the site renders this variant's draft content on its page.\n        //     url.searchParams.set(\"wb-variant-draft\", previewVariantId);\n        //     return url.toString();\n        // }\n\n        // Add preview params\n        url.searchParams.set(\"wb.preview\", \"true\");\n        url.searchParams.set(\"wb.type\", documentType);\n        url.searchParams.set(\"wb.id\", String(id));\n        url.searchParams.set(\"wb.path\", path);\n        return url.toString();\n    }, [iframeUrl, id, path, documentType /*previewVariantId*/]);\n};\n"],"names":["usePreviewLink","iframeUrl","useIframeUrl","id","useSelectFromDocument","document","path","documentType","useMemo","url","URL","_","key","String"],"mappings":";;;AAIO,MAAMA,iBAAiB;IAC1B,MAAMC,YAAYC;IAClB,MAAMC,KAAKC,sBAAsBC,CAAAA,WAAYA,SAAS,EAAE;IACxD,MAAMC,OAAOF,sBAAsBC,CAAAA,WAAYA,SAAS,UAAU,CAAC,IAAI;IACvE,MAAME,eAAeH,sBAAsBC,CAAAA,WAAYA,SAAS,QAAQ,CAAC,YAAY;IAQrF,OAAOG,QAAQ;QACX,IAAI,CAACP,WACD,OAAO;QAEX,MAAMQ,MAAM,IAAIC,IAAIT;QAGpBQ,IAAI,YAAY,CAAC,OAAO,CAAC,CAACE,GAAGC;YACzB,IAAIA,IAAI,UAAU,CAAC,QACfH,IAAI,YAAY,CAAC,MAAM,CAACG;QAEhC;QASAH,IAAI,YAAY,CAAC,GAAG,CAAC,cAAc;QACnCA,IAAI,YAAY,CAAC,GAAG,CAAC,WAAWF;QAChCE,IAAI,YAAY,CAAC,GAAG,CAAC,SAASI,OAAOV;QACrCM,IAAI,YAAY,CAAC,GAAG,CAAC,WAAWH;QAChC,OAAOG,IAAI,QAAQ;IACvB,GAAG;QAACR;QAAWE;QAAIG;QAAMC;KAAkC;AAC/D"}

package/BaseEditor/defaultConfig/Content/Breadcrumbs/Breadcrumbs.js

@@ -1,62 +1,57 @@
-import React, { useCallback } from "react";
-import { breadcrumbs } from "./styles";
-import { useActiveElement } from "../../../hooks/useActiveElement";
-import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument";
-import { $getComponentManifestByElementId } from "../../../../editorSdk/utils";
-import { useDocumentEditor } from "../../../../DocumentEditor";
-import { Commands } from "../../..";
-export const Breadcrumbs = () => {
-  const [activeElement] = useActiveElement();
-  const editor = useDocumentEditor();
-  const items = useSelectFromDocument(document => {
-    if (!activeElement) {
-      return [];
-    }
-    const items = [];
-    let element = document.elements[activeElement.id];
-    while (element) {
-      const component = $getComponentManifestByElementId(editor, element.id);
-      if (!component) {
-        continue;
-      }
-      items.push({
-        id: element.id,
-        label: component.label
-      });
-      if (element.parent?.id === "root") {
-        break;
-      }
-      element = document.elements[element.parent.id];
-    }
-    return items.reverse();
-  }, [activeElement?.id]);
-  const highlightElement = useCallback(id => {
-    editor.executeCommand(Commands.HighlightElement, {
-      id
-    });
-  }, []);
-  const activateElement = useCallback(id => {
-    editor.executeCommand(Commands.SelectElement, {
-      id
-    });
-  }, []);
-  return /*#__PURE__*/React.createElement("ul", {
-    className: breadcrumbs,
-    "data-role": "content-breadcrumbs",
-    "data-hover-manager": "ignore"
-  }, items.map(({
-    id,
-    label
-  }, index) => /*#__PURE__*/React.createElement("li", {
-    key: id,
-    onMouseOver: () => highlightElement(id),
-    onClick: () => activateElement(id)
-  }, /*#__PURE__*/React.createElement("span", {
-    className: "element",
-    style: {
-      "--element-count": index
-    }
-  }, label))));
+import react, { useCallback } from "react";
+import { breadcrumbs } from "./styles.js";
+import { useActiveElement } from "../../../hooks/useActiveElement.js";
+import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument.js";
+import { $getComponentManifestByElementId } from "../../../../editorSdk/utils/index.js";
+import { useDocumentEditor } from "../../../../DocumentEditor/index.js";
+import { Commands } from "../../../index.js";
+const Breadcrumbs = ()=>{
+    const [activeElement] = useActiveElement();
+    const editor = useDocumentEditor();
+    const items = useSelectFromDocument((document)=>{
+        if (!activeElement) return [];
+        const items = [];
+        let element = document.elements[activeElement.id];
+        while(element){
+            const component = $getComponentManifestByElementId(editor, element.id);
+            if (!component) continue;
+            items.push({
+                id: element.id,
+                label: component.label
+            });
+            if (element.parent?.id === "root") break;
+            element = document.elements[element.parent.id];
+        }
+        return items.reverse();
+    }, [
+        activeElement?.id
+    ]);
+    const highlightElement = useCallback((id)=>{
+        editor.executeCommand(Commands.HighlightElement, {
+            id
+        });
+    }, []);
+    const activateElement = useCallback((id)=>{
+        editor.executeCommand(Commands.SelectElement, {
+            id
+        });
+    }, []);
+    return /*#__PURE__*/ react.createElement("ul", {
+        className: breadcrumbs,
+        "data-role": "content-breadcrumbs",
+        "data-hover-manager": "ignore",
+        "data-affects-preview": "height"
+    }, items.map(({ id, label }, index)=>/*#__PURE__*/ react.createElement("li", {
+            key: id,
+            onMouseOver: ()=>highlightElement(id),
+            onClick: ()=>activateElement(id)
+        }, /*#__PURE__*/ react.createElement("span", {
+            className: "element",
+            style: {
+                "--element-count": index
+            }
+        }, label))));
 };
+export { Breadcrumbs };
 
 //# sourceMappingURL=Breadcrumbs.js.map

package/BaseEditor/defaultConfig/Content/Breadcrumbs/Breadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","breadcrumbs","useActiveElement","useSelectFromDocument","$getComponentManifestByElementId","useDocumentEditor","Commands","Breadcrumbs","activeElement","editor","items","document","element","elements","id","component","push","label","parent","reverse","highlightElement","executeCommand","HighlightElement","activateElement","SelectElement","createElement","className","map","index","key","onMouseOver","onClick","style"],"sources":["Breadcrumbs.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { breadcrumbs } from \"./styles\";\nimport { useActiveElement } from \"~/BaseEditor/hooks/useActiveElement\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument\";\nimport { $getComponentManifestByElementId } from \"~/editorSdk/utils\";\nimport { useDocumentEditor } from \"~/DocumentEditor\";\nimport { Commands } from \"~/BaseEditor\";\n\nexport const Breadcrumbs = () => {\n    const [activeElement] = useActiveElement();\n    const editor = useDocumentEditor();\n\n    const items = useSelectFromDocument(\n        document => {\n            if (!activeElement) {\n                return [];\n            }\n\n            const items = [];\n            let element = document.elements[activeElement.id];\n\n            while (element) {\n                const component = $getComponentManifestByElementId(editor, element.id)!;\n                if (!component) {\n                    continue;\n                }\n\n                items.push({\n                    id: element.id,\n                    label: component.label\n                });\n\n                if (element.parent?.id === \"root\") {\n                    break;\n                }\n\n                element = document.elements[element.parent!.id];\n            }\n\n            return items.reverse();\n        },\n        [activeElement?.id]\n    );\n\n    const highlightElement = useCallback((id: string) => {\n        editor.executeCommand(Commands.HighlightElement, { id });\n    }, []);\n\n    const activateElement = useCallback((id: string) => {\n        editor.executeCommand(Commands.SelectElement, { id });\n    }, []);\n\n    return (\n        <ul className={breadcrumbs} data-role={\"content-breadcrumbs\"} data-hover-manager={\"ignore\"}>\n            {items.map(({ id, label }, index) => (\n                <li\n                    key={id}\n                    onMouseOver={() => highlightElement(id)}\n                    onClick={() => activateElement(id)}\n                >\n                    <span\n                        className={\"element\"}\n                        style={{ \"--element-count\": index } as React.CSSProperties}\n                    >\n                        {label}\n                    </span>\n                </li>\n            ))}\n        </ul>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,SAASC,WAAW;AACpB,SAASC,gBAAgB;AACzB,SAASC,qBAAqB;AAC9B,SAASC,gCAAgC;AACzC,SAASC,iBAAiB;AAC1B,SAASC,QAAQ;AAEjB,OAAO,MAAMC,WAAW,GAAGA,CAAA,KAAM;EAC7B,MAAM,CAACC,aAAa,CAAC,GAAGN,gBAAgB,CAAC,CAAC;EAC1C,MAAMO,MAAM,GAAGJ,iBAAiB,CAAC,CAAC;EAElC,MAAMK,KAAK,GAAGP,qBAAqB,CAC/BQ,QAAQ,IAAI;IACR,IAAI,CAACH,aAAa,EAAE;MAChB,OAAO,EAAE;IACb;IAEA,MAAME,KAAK,GAAG,EAAE;IAChB,IAAIE,OAAO,GAAGD,QAAQ,CAACE,QAAQ,CAACL,aAAa,CAACM,EAAE,CAAC;IAEjD,OAAOF,OAAO,EAAE;MACZ,MAAMG,SAAS,GAAGX,gCAAgC,CAACK,MAAM,EAAEG,OAAO,CAACE,EAAE,CAAE;MACvE,IAAI,CAACC,SAAS,EAAE;QACZ;MACJ;MAEAL,KAAK,CAACM,IAAI,CAAC;QACPF,EAAE,EAAEF,OAAO,CAACE,EAAE;QACdG,KAAK,EAAEF,SAAS,CAACE;MACrB,CAAC,CAAC;MAEF,IAAIL,OAAO,CAACM,MAAM,EAAEJ,EAAE,KAAK,MAAM,EAAE;QAC/B;MACJ;MAEAF,OAAO,GAAGD,QAAQ,CAACE,QAAQ,CAACD,OAAO,CAACM,MAAM,CAAEJ,EAAE,CAAC;IACnD;IAEA,OAAOJ,KAAK,CAACS,OAAO,CAAC,CAAC;EAC1B,CAAC,EACD,CAACX,aAAa,EAAEM,EAAE,CACtB,CAAC;EAED,MAAMM,gBAAgB,GAAGpB,WAAW,CAAEc,EAAU,IAAK;IACjDL,MAAM,CAACY,cAAc,CAACf,QAAQ,CAACgB,gBAAgB,EAAE;MAAER;IAAG,CAAC,CAAC;EAC5D,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMS,eAAe,GAAGvB,WAAW,CAAEc,EAAU,IAAK;IAChDL,MAAM,CAACY,cAAc,CAACf,QAAQ,CAACkB,aAAa,EAAE;MAAEV;IAAG,CAAC,CAAC;EACzD,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIf,KAAA,CAAA0B,aAAA;IAAIC,SAAS,EAAEzB,WAAY;IAAC,aAAW,qBAAsB;IAAC,sBAAoB;EAAS,GACtFS,KAAK,CAACiB,GAAG,CAAC,CAAC;IAAEb,EAAE;IAAEG;EAAM,CAAC,EAAEW,KAAK,kBAC5B7B,KAAA,CAAA0B,aAAA;IACII,GAAG,EAAEf,EAAG;IACRgB,WAAW,EAAEA,CAAA,KAAMV,gBAAgB,CAACN,EAAE,CAAE;IACxCiB,OAAO,EAAEA,CAAA,KAAMR,eAAe,CAACT,EAAE;EAAE,gBAEnCf,KAAA,CAAA0B,aAAA;IACIC,SAAS,EAAE,SAAU;IACrBM,KAAK,EAAE;MAAE,iBAAiB,EAAEJ;IAAM;EAAyB,GAE1DX,KACC,CACN,CACP,CACD,CAAC;AAEb,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Content/Breadcrumbs/Breadcrumbs.js","sources":["../../../../../src/BaseEditor/defaultConfig/Content/Breadcrumbs/Breadcrumbs.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { breadcrumbs } from \"./styles.js\";\nimport { useActiveElement } from \"~/BaseEditor/hooks/useActiveElement.js\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument.js\";\nimport { $getComponentManifestByElementId } from \"~/editorSdk/utils/index.js\";\nimport { useDocumentEditor } from \"~/DocumentEditor/index.js\";\nimport { Commands } from \"~/BaseEditor/index.js\";\n\nexport const Breadcrumbs = () => {\n    const [activeElement] = useActiveElement();\n    const editor = useDocumentEditor();\n\n    const items = useSelectFromDocument(\n        document => {\n            if (!activeElement) {\n                return [];\n            }\n\n            const items = [];\n            let element = document.elements[activeElement.id];\n\n            while (element) {\n                const component = $getComponentManifestByElementId(editor, element.id)!;\n                if (!component) {\n                    continue;\n                }\n\n                items.push({\n                    id: element.id,\n                    label: component.label\n                });\n\n                if (element.parent?.id === \"root\") {\n                    break;\n                }\n\n                element = document.elements[element.parent!.id];\n            }\n\n            return items.reverse();\n        },\n        [activeElement?.id]\n    );\n\n    const highlightElement = useCallback((id: string) => {\n        editor.executeCommand(Commands.HighlightElement, { id });\n    }, []);\n\n    const activateElement = useCallback((id: string) => {\n        editor.executeCommand(Commands.SelectElement, { id });\n    }, []);\n\n    return (\n        <ul\n            className={breadcrumbs}\n            data-role={\"content-breadcrumbs\"}\n            data-hover-manager={\"ignore\"}\n            data-affects-preview={\"height\"}\n        >\n            {items.map(({ id, label }, index) => (\n                <li\n                    key={id}\n                    onMouseOver={() => highlightElement(id)}\n                    onClick={() => activateElement(id)}\n                >\n                    <span\n                        className={\"element\"}\n                        style={{ \"--element-count\": index } as React.CSSProperties}\n                    >\n                        {label}\n                    </span>\n                </li>\n            ))}\n        </ul>\n    );\n};\n"],"names":["Breadcrumbs","activeElement","useActiveElement","editor","useDocumentEditor","items","useSelectFromDocument","document","element","component","$getComponentManifestByElementId","highlightElement","useCallback","id","Commands","activateElement","breadcrumbs","label","index"],"mappings":";;;;;;;AAQO,MAAMA,cAAc;IACvB,MAAM,CAACC,cAAc,GAAGC;IACxB,MAAMC,SAASC;IAEf,MAAMC,QAAQC,sBACVC,CAAAA;QACI,IAAI,CAACN,eACD,OAAO,EAAE;QAGb,MAAMI,QAAQ,EAAE;QAChB,IAAIG,UAAUD,SAAS,QAAQ,CAACN,cAAc,EAAE,CAAC;QAEjD,MAAOO,QAAS;YACZ,MAAMC,YAAYC,iCAAiCP,QAAQK,QAAQ,EAAE;YACrE,IAAI,CAACC,WACD;YAGJJ,MAAM,IAAI,CAAC;gBACP,IAAIG,QAAQ,EAAE;gBACd,OAAOC,UAAU,KAAK;YAC1B;YAEA,IAAID,QAAQ,MAAM,EAAE,OAAO,QACvB;YAGJA,UAAUD,SAAS,QAAQ,CAACC,QAAQ,MAAM,CAAE,EAAE,CAAC;QACnD;QAEA,OAAOH,MAAM,OAAO;IACxB,GACA;QAACJ,eAAe;KAAG;IAGvB,MAAMU,mBAAmBC,YAAY,CAACC;QAClCV,OAAO,cAAc,CAACW,SAAS,gBAAgB,EAAE;YAAED;QAAG;IAC1D,GAAG,EAAE;IAEL,MAAME,kBAAkBH,YAAY,CAACC;QACjCV,OAAO,cAAc,CAACW,SAAS,aAAa,EAAE;YAAED;QAAG;IACvD,GAAG,EAAE;IAEL,OAAO,WAAP,GACI,oBAAC;QACG,WAAWG;QACX,aAAW;QACX,sBAAoB;QACpB,wBAAsB;OAErBX,MAAM,GAAG,CAAC,CAAC,EAAEQ,EAAE,EAAEI,KAAK,EAAE,EAAEC,QAAAA,WAAAA,GACvB,oBAAC;YACG,KAAKL;YACL,aAAa,IAAMF,iBAAiBE;YACpC,SAAS,IAAME,gBAAgBF;yBAE/B,oBAAC;YACG,WAAW;YACX,OAAO;gBAAE,mBAAmBK;YAAM;WAEjCD;AAMzB"}

package/BaseEditor/defaultConfig/Content/Breadcrumbs/dual-tone-arrow.js

@@ -0,0 +1,21 @@
+import __rslib_svgr_url__0__ from "../../../../static/svg/dual-tone-arrow.ceb892b6.svg";
+import * as __rspack_external_react from "react";
+const SvgDualToneArrow = (props)=>/*#__PURE__*/ __rspack_external_react.createElement("svg", {
+        xmlns: "http://www.w3.org/2000/svg",
+        width: 7,
+        height: 28,
+        fill: "none",
+        viewBox: "0 0 7 28",
+        ...props
+    }, /*#__PURE__*/ __rspack_external_react.createElement("path", {
+        fill: "#858585",
+        d: "M1 0H0l6 14-6 14h1l6-14z"
+    }), /*#__PURE__*/ __rspack_external_react.createElement("path", {
+        fill: "#000",
+        d: "M0 28V0l6 14z"
+    }));
+const dual_tone_arrow = __rslib_svgr_url__0__;
+export default dual_tone_arrow;
+export { SvgDualToneArrow as ReactComponent };
+
+//# sourceMappingURL=dual-tone-arrow.js.map

package/BaseEditor/defaultConfig/Content/Breadcrumbs/dual-tone-arrow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseEditor/defaultConfig/Content/Breadcrumbs/dual-tone-arrow.js","sources":["../../../../../src/BaseEditor/defaultConfig/Content/Breadcrumbs/dual-tone-arrow.svg"],"sourcesContent":["import * as React from \"react\";\nconst SvgDualToneArrow = props => <svg xmlns=\"http://www.w3.org/2000/svg\" width={7} height={28} fill=\"none\" viewBox=\"0 0 7 28\" {...props}><path fill=\"#858585\" d=\"M1 0H0l6 14-6 14h1l6-14z\" /><path fill=\"#000\" d=\"M0 28V0l6 14z\" /></svg>;\nexport { SvgDualToneArrow as ReactComponent };\nexport default \"__RSLIB_SVGR_AUTO_PUBLIC_PATH__static/svg/dual-tone-arrow.ceb892b6.svg\";"],"names":["SvgDualToneArrow","props"],"mappings":";;AACA,MAAMA,mBAAmBC,CAAAA,QAAAA,WAAAA,GAAS,sCAAC;QAAI,OAAM;QAA6B,OAAO;QAAG,QAAQ;QAAI,MAAK;QAAO,SAAQ;QAAY,GAAGA,KAAK;qBAAE,sCAAC;QAAK,MAAK;QAAU,GAAE;sBAA6B,sCAAC;QAAK,MAAK;QAAO,GAAE;;AAElN"}

package/BaseEditor/defaultConfig/Content/Breadcrumbs/index.d.ts

@@ -1 +1 @@
-export * from "./Breadcrumbs";
+export * from "./Breadcrumbs.js";

package/BaseEditor/defaultConfig/Content/Breadcrumbs/index.js

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

package/BaseEditor/defaultConfig/Content/Breadcrumbs/styles.js

@@ -1,72 +1,70 @@
-import { css } from "emotion";
-export const breadcrumbs = css({
-  display: "flex",
-  zIndex: 100,
-  flexDirection: "row",
-  padding: 0,
-  position: "absolute",
-  left: 300,
-  bottom: 0,
-  width: "calc(100% - 600px)",
-  height: "31px",
-  backgroundColor: "var(--mdc-theme-surface)",
-  borderTop: "1px solid var(--mdc-theme-background)",
-  fontSize: "12px",
-  overflow: "hidden",
-  "> li": {
-    cursor: "pointer",
+import { css } from "@emotion/css";
+const breadcrumbs = css({
     display: "flex",
-    "& .element": {
-      color: "var(--text-neutral-strong)",
-      textDecoration: "none",
-      textTransform: "capitalize",
-      padding: "5px 0 5px 30px",
-      background: "hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)",
-      position: "relative",
-      display: "block"
+    zIndex: 100,
+    flexDirection: "row",
+    padding: 0,
+    position: "absolute",
+    left: "var(--wb-spacing-toolbar)",
+    bottom: 0,
+    width: "calc(100% - calc(var(--wb-spacing-sidebar) * 2))",
+    height: "31px",
+    backgroundColor: "var(--color-neutral-dimmed)",
+    borderTop: "1px solid var( --color-neutral-dimmed)",
+    fontSize: "12px",
+    overflow: "hidden",
+    "> li": {
+        cursor: "pointer",
+        display: "flex",
+        "& .element": {
+            color: "var(--text-neutral-strong)",
+            textDecoration: "none",
+            textTransform: "capitalize",
+            padding: "5px 0 5px 30px",
+            background: "hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)",
+            position: "relative",
+            display: "block"
+        },
+        "& .element::after": {
+            content: '" "',
+            display: "block",
+            width: "0",
+            height: "0",
+            borderTop: "50px solid transparent",
+            borderBottom: "50px solid transparent",
+            borderLeft: "20px solid hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)   ",
+            position: "absolute",
+            top: "50%",
+            marginTop: "-50px",
+            left: "100%",
+            zIndex: 2
+        },
+        "& .element::before": {
+            content: '" "',
+            display: "block",
+            width: "0",
+            height: "0",
+            borderTop: "50px solid transparent",
+            borderBottom: "50px solid transparent",
+            borderLeft: "20px solid hsla(0, 0%, 100%, 1)",
+            position: "absolute",
+            top: "50%",
+            marginTop: "-50px",
+            marginLeft: "1px",
+            left: "100%",
+            zIndex: 1
+        }
     },
-    "& .element::after": {
-      content: '" "',
-      display: "block",
-      width: "0",
-      height: "0",
-      borderTop: "50px solid transparent",
-      borderBottom: "50px solid transparent",
-      borderLeft: "20px solid hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)   ",
-      position: "absolute",
-      top: "50%",
-      marginTop: "-50px",
-      left: "100%",
-      zIndex: 2
+    "& li:first-child .element": {
+        paddingLeft: "10px"
     },
-    "& .element::before": {
-      content: '" "',
-      display: "block",
-      width: "0",
-      height: "0",
-      borderTop: "50px solid transparent",
-      borderBottom: "50px solid transparent",
-      borderLeft: "20px solid hsla(0, 0%, 100%, 1)",
-      position: "absolute",
-      top: "50%",
-      marginTop: "-50px",
-      marginLeft: "1px",
-      left: "100%",
-      zIndex: 1
+    "& li .element:hover": {
+        background: "var(--color-neutral-muted)"
+    },
+    "& li .element:hover:after": {
+        borderLeftColor: "var(--color-neutral-muted) !important"
     }
-  },
-  "& li:first-child .element": {
-    paddingLeft: "10px"
-  },
-  // Handle active state
-  "& li .element:hover": {
-    color: "var(--mdc-theme-surface)",
-    background: "var(--mdc-theme-secondary)"
-  },
-  "& li .element:hover:after": {
-    color: "var(--mdc-theme-surface)",
-    borderLeftColor: "var(--mdc-theme-secondary) !important"
-  }
 });
+export { breadcrumbs };
 
 //# sourceMappingURL=styles.js.map

package/BaseEditor/defaultConfig/Content/Breadcrumbs/styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["css","breadcrumbs","display","zIndex","flexDirection","padding","position","left","bottom","width","height","backgroundColor","borderTop","fontSize","overflow","cursor","color","textDecoration","textTransform","background","content","borderBottom","borderLeft","top","marginTop","marginLeft","paddingLeft","borderLeftColor"],"sources":["styles.ts"],"sourcesContent":["import { css } from \"emotion\";\n\nexport const breadcrumbs = css({\n    display: \"flex\",\n    zIndex: 100,\n    flexDirection: \"row\",\n    padding: 0,\n    position: \"absolute\",\n    left: 300,\n    bottom: 0,\n    width: \"calc(100% - 600px)\",\n    height: \"31px\",\n    backgroundColor: \"var(--mdc-theme-surface)\",\n    borderTop: \"1px solid var(--mdc-theme-background)\",\n    fontSize: \"12px\",\n    overflow: \"hidden\",\n    \"> li\": {\n        cursor: \"pointer\",\n        display: \"flex\",\n        \"& .element\": {\n            color: \"var(--text-neutral-strong)\",\n            textDecoration: \"none\",\n            textTransform: \"capitalize\",\n            padding: \"5px 0 5px 30px\",\n            background: \"hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)\",\n            position: \"relative\",\n            display: \"block\"\n        },\n        \"& .element::after\": {\n            content: '\" \"',\n            display: \"block\",\n            width: \"0\",\n            height: \"0\",\n            borderTop: \"50px solid transparent\",\n            borderBottom: \"50px solid transparent\",\n            borderLeft: \"20px solid hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)   \",\n            position: \"absolute\",\n            top: \"50%\",\n            marginTop: \"-50px\",\n            left: \"100%\",\n            zIndex: 2\n        },\n        \"& .element::before\": {\n            content: '\" \"',\n            display: \"block\",\n            width: \"0\",\n            height: \"0\",\n            borderTop: \"50px solid transparent\",\n            borderBottom: \"50px solid transparent\",\n            borderLeft: \"20px solid hsla(0, 0%, 100%, 1)\",\n            position: \"absolute\",\n            top: \"50%\",\n            marginTop: \"-50px\",\n            marginLeft: \"1px\",\n            left: \"100%\",\n            zIndex: 1\n        }\n    },\n    \"& li:first-child .element\": { paddingLeft: \"10px\" },\n\n    // Handle active state\n    \"& li .element:hover\": {\n        color: \"var(--mdc-theme-surface)\",\n        background: \"var(--mdc-theme-secondary)\"\n    },\n    \"& li .element:hover:after\": {\n        color: \"var(--mdc-theme-surface)\",\n        borderLeftColor: \"var(--mdc-theme-secondary) !important\"\n    }\n});\n"],"mappings":"AAAA,SAASA,GAAG,QAAQ,SAAS;AAE7B,OAAO,MAAMC,WAAW,GAAGD,GAAG,CAAC;EAC3BE,OAAO,EAAE,MAAM;EACfC,MAAM,EAAE,GAAG;EACXC,aAAa,EAAE,KAAK;EACpBC,OAAO,EAAE,CAAC;EACVC,QAAQ,EAAE,UAAU;EACpBC,IAAI,EAAE,GAAG;EACTC,MAAM,EAAE,CAAC;EACTC,KAAK,EAAE,oBAAoB;EAC3BC,MAAM,EAAE,MAAM;EACdC,eAAe,EAAE,0BAA0B;EAC3CC,SAAS,EAAE,uCAAuC;EAClDC,QAAQ,EAAE,MAAM;EAChBC,QAAQ,EAAE,QAAQ;EAClB,MAAM,EAAE;IACJC,MAAM,EAAE,SAAS;IACjBb,OAAO,EAAE,MAAM;IACf,YAAY,EAAE;MACVc,KAAK,EAAE,4BAA4B;MACnCC,cAAc,EAAE,MAAM;MACtBC,aAAa,EAAE,YAAY;MAC3Bb,OAAO,EAAE,gBAAgB;MACzBc,UAAU,EAAE,yDAAyD;MACrEb,QAAQ,EAAE,UAAU;MACpBJ,OAAO,EAAE;IACb,CAAC;IACD,mBAAmB,EAAE;MACjBkB,OAAO,EAAE,KAAK;MACdlB,OAAO,EAAE,OAAO;MAChBO,KAAK,EAAE,GAAG;MACVC,MAAM,EAAE,GAAG;MACXE,SAAS,EAAE,wBAAwB;MACnCS,YAAY,EAAE,wBAAwB;MACtCC,UAAU,EAAE,uEAAuE;MACnFhB,QAAQ,EAAE,UAAU;MACpBiB,GAAG,EAAE,KAAK;MACVC,SAAS,EAAE,OAAO;MAClBjB,IAAI,EAAE,MAAM;MACZJ,MAAM,EAAE;IACZ,CAAC;IACD,oBAAoB,EAAE;MAClBiB,OAAO,EAAE,KAAK;MACdlB,OAAO,EAAE,OAAO;MAChBO,KAAK,EAAE,GAAG;MACVC,MAAM,EAAE,GAAG;MACXE,SAAS,EAAE,wBAAwB;MACnCS,YAAY,EAAE,wBAAwB;MACtCC,UAAU,EAAE,iCAAiC;MAC7ChB,QAAQ,EAAE,UAAU;MACpBiB,GAAG,EAAE,KAAK;MACVC,SAAS,EAAE,OAAO;MAClBC,UAAU,EAAE,KAAK;MACjBlB,IAAI,EAAE,MAAM;MACZJ,MAAM,EAAE;IACZ;EACJ,CAAC;EACD,2BAA2B,EAAE;IAAEuB,WAAW,EAAE;EAAO,CAAC;EAEpD;EACA,qBAAqB,EAAE;IACnBV,KAAK,EAAE,0BAA0B;IACjCG,UAAU,EAAE;EAChB,CAAC;EACD,2BAA2B,EAAE;IACzBH,KAAK,EAAE,0BAA0B;IACjCW,eAAe,EAAE;EACrB;AACJ,CAAC,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Content/Breadcrumbs/styles.js","sources":["../../../../../src/BaseEditor/defaultConfig/Content/Breadcrumbs/styles.ts"],"sourcesContent":["import { css } from \"@emotion/css\";\n\nexport const breadcrumbs = css({\n    display: \"flex\",\n    zIndex: 100,\n    flexDirection: \"row\",\n    padding: 0,\n    position: \"absolute\",\n    left: \"var(--wb-spacing-toolbar)\",\n    bottom: 0,\n    width: \"calc(100% - calc(var(--wb-spacing-sidebar) * 2))\",\n    height: \"31px\",\n    backgroundColor: \"var(--color-neutral-dimmed)\",\n    borderTop: \"1px solid var( --color-neutral-dimmed)\",\n    fontSize: \"12px\",\n    overflow: \"hidden\",\n    \"> li\": {\n        cursor: \"pointer\",\n        display: \"flex\",\n        \"& .element\": {\n            color: \"var(--text-neutral-strong)\",\n            textDecoration: \"none\",\n            textTransform: \"capitalize\",\n            padding: \"5px 0 5px 30px\",\n            background: \"hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)\",\n            position: \"relative\",\n            display: \"block\"\n        },\n        \"& .element::after\": {\n            content: '\" \"',\n            display: \"block\",\n            width: \"0\",\n            height: \"0\",\n            borderTop: \"50px solid transparent\",\n            borderBottom: \"50px solid transparent\",\n            borderLeft: \"20px solid hsla(300, 2%, calc(92% - var(--element-count) * 1%), 1)   \",\n            position: \"absolute\",\n            top: \"50%\",\n            marginTop: \"-50px\",\n            left: \"100%\",\n            zIndex: 2\n        },\n        \"& .element::before\": {\n            content: '\" \"',\n            display: \"block\",\n            width: \"0\",\n            height: \"0\",\n            borderTop: \"50px solid transparent\",\n            borderBottom: \"50px solid transparent\",\n            borderLeft: \"20px solid hsla(0, 0%, 100%, 1)\",\n            position: \"absolute\",\n            top: \"50%\",\n            marginTop: \"-50px\",\n            marginLeft: \"1px\",\n            left: \"100%\",\n            zIndex: 1\n        }\n    },\n    \"& li:first-child .element\": { paddingLeft: \"10px\" },\n\n    // Handle active state\n    \"& li .element:hover\": {\n        background: \"var(--color-neutral-muted)\"\n    },\n    \"& li .element:hover:after\": {\n        borderLeftColor: \"var(--color-neutral-muted) !important\"\n    }\n});\n"],"names":["breadcrumbs","css"],"mappings":";AAEO,MAAMA,cAAcC,IAAI;IAC3B,SAAS;IACT,QAAQ;IACR,eAAe;IACf,SAAS;IACT,UAAU;IACV,MAAM;IACN,QAAQ;IACR,OAAO;IACP,QAAQ;IACR,iBAAiB;IACjB,WAAW;IACX,UAAU;IACV,UAAU;IACV,QAAQ;QACJ,QAAQ;QACR,SAAS;QACT,cAAc;YACV,OAAO;YACP,gBAAgB;YAChB,eAAe;YACf,SAAS;YACT,YAAY;YACZ,UAAU;YACV,SAAS;QACb;QACA,qBAAqB;YACjB,SAAS;YACT,SAAS;YACT,OAAO;YACP,QAAQ;YACR,WAAW;YACX,cAAc;YACd,YAAY;YACZ,UAAU;YACV,KAAK;YACL,WAAW;YACX,MAAM;YACN,QAAQ;QACZ;QACA,sBAAsB;YAClB,SAAS;YACT,SAAS;YACT,OAAO;YACP,QAAQ;YACR,WAAW;YACX,cAAc;YACd,YAAY;YACZ,UAAU;YACV,KAAK;YACL,WAAW;YACX,YAAY;YACZ,MAAM;YACN,QAAQ;QACZ;IACJ;IACA,6BAA6B;QAAE,aAAa;IAAO;IAGnD,uBAAuB;QACnB,YAAY;IAChB;IACA,6BAA6B;QACzB,iBAAiB;IACrB;AACJ"}

package/BaseEditor/defaultConfig/Content/ContentPreviewConfig.d.ts

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

package/BaseEditor/defaultConfig/Content/ContentPreviewConfig.js

@@ -0,0 +1,32 @@
+import react from "react";
+import { EditorConfig } from "../../index.js";
+import { Breadcrumbs } from "./Breadcrumbs/index.js";
+import { DocumentPreview } from "./Preview/DocumentPreview.js";
+import { AddressBar } from "./AddressBar/AddressBar.js";
+import { BreakpointSelector } from "./AddressBar/BreakpointSelector.js";
+import { ThemeModeSwitcher } from "./AddressBar/ThemeModeSwitcher.js";
+const ContentPreviewConfig = ()=>{
+    const { Ui } = EditorConfig;
+    return /*#__PURE__*/ react.createElement(react.Fragment, null, /*#__PURE__*/ react.createElement(Ui.TopBar.Element, {
+        name: "breakpointSelector",
+        group: "center",
+        element: /*#__PURE__*/ react.createElement(BreakpointSelector, null)
+    }), /*#__PURE__*/ react.createElement(Ui.TopBar.Element, {
+        name: "themeModeSwitcher",
+        group: "center",
+        after: "breakpointSelector",
+        element: /*#__PURE__*/ react.createElement(ThemeModeSwitcher, null)
+    }), /*#__PURE__*/ react.createElement(Ui.Content.Element, {
+        name: "addressBar",
+        element: /*#__PURE__*/ react.createElement(AddressBar, null)
+    }), /*#__PURE__*/ react.createElement(Ui.Content.Element, {
+        name: "iframe",
+        element: /*#__PURE__*/ react.createElement(DocumentPreview, null)
+    }), /*#__PURE__*/ react.createElement(Ui.Content.Element, {
+        name: "breadcrumbs",
+        element: /*#__PURE__*/ react.createElement(Ui.IsNotReadOnly, null, /*#__PURE__*/ react.createElement(Breadcrumbs, null))
+    }));
+};
+export { ContentPreviewConfig };
+
+//# sourceMappingURL=ContentPreviewConfig.js.map

package/BaseEditor/defaultConfig/Content/ContentPreviewConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseEditor/defaultConfig/Content/ContentPreviewConfig.js","sources":["../../../../src/BaseEditor/defaultConfig/Content/ContentPreviewConfig.tsx"],"sourcesContent":["import React from \"react\";\nimport { EditorConfig } from \"~/BaseEditor/index.js\";\nimport { Breadcrumbs } from \"./Breadcrumbs/index.js\";\nimport { DocumentPreview } from \"./Preview/DocumentPreview.js\";\nimport { AddressBar } from \"./AddressBar/AddressBar.js\";\nimport { BreakpointSelector } from \"./AddressBar/BreakpointSelector.js\";\nimport { ThemeModeSwitcher } from \"./AddressBar/ThemeModeSwitcher.js\";\n\nexport const ContentPreviewConfig = () => {\n    const { Ui } = EditorConfig;\n\n    return (\n        <>\n            <Ui.TopBar.Element\n                name={\"breakpointSelector\"}\n                group={\"center\"}\n                element={<BreakpointSelector />}\n            />\n            <Ui.TopBar.Element\n                name={\"themeModeSwitcher\"}\n                group={\"center\"}\n                after={\"breakpointSelector\"}\n                element={<ThemeModeSwitcher />}\n            />\n            <Ui.Content.Element name=\"addressBar\" element={<AddressBar />} />\n            <Ui.Content.Element name=\"iframe\" element={<DocumentPreview />} />\n            <Ui.Content.Element\n                name={\"breadcrumbs\"}\n                element={\n                    <Ui.IsNotReadOnly>\n                        <Breadcrumbs />\n                    </Ui.IsNotReadOnly>\n                }\n            />\n        </>\n    );\n};\n"],"names":["ContentPreviewConfig","Ui","EditorConfig","BreakpointSelector","ThemeModeSwitcher","AddressBar","DocumentPreview","Breadcrumbs"],"mappings":";;;;;;;AAQO,MAAMA,uBAAuB;IAChC,MAAM,EAAEC,EAAE,EAAE,GAAGC;IAEf,OAAO,WAAP,GACI,wDACI,oBAACD,GAAG,MAAM,CAAC,OAAO;QACd,MAAM;QACN,OAAO;QACP,uBAAS,oBAACE,oBAAkBA;sBAEhC,oBAACF,GAAG,MAAM,CAAC,OAAO;QACd,MAAM;QACN,OAAO;QACP,OAAO;QACP,uBAAS,oBAACG,mBAAiBA;sBAE/B,oBAACH,GAAG,OAAO,CAAC,OAAO;QAAC,MAAK;QAAa,uBAAS,oBAACI,YAAUA;sBAC1D,oBAACJ,GAAG,OAAO,CAAC,OAAO;QAAC,MAAK;QAAS,uBAAS,oBAACK,iBAAeA;sBAC3D,oBAACL,GAAG,OAAO,CAAC,OAAO;QACf,MAAM;QACN,uBACI,oBAACA,GAAG,aAAa,sBACb,oBAACM,aAAWA;;AAMpC"}

package/BaseEditor/defaultConfig/Content/Preview/ApplyTheme.js

@@ -1,51 +1,34 @@
 import { useEffect } from "react";
-import { useWebsiteBuilderTheme } from "../../../components";
-export const ApplyTheme = () => {
-  const {
-    theme
-  } = useWebsiteBuilderTheme();
-  useEffect(() => {
-    if (!theme) {
-      return;
-    }
-    if (theme.css) {
-      const existing = document.querySelector(`style[id="wb-editor-css"]`);
-      const style = document.createElement("style");
-      style.id = "wb-editor-css";
-      style.innerHTML = theme.css;
-      if (existing) {
-        existing.replaceWith(style);
-      } else {
-        document.head.appendChild(style);
-      }
-    }
-    if (theme.cssVariables) {
-      const existing = document.querySelector(`style[id="wb-editor-css-variables"]`);
-      const style = document.createElement("style");
-      style.id = "wb-editor-css-variables";
-      style.innerHTML = `:root {
-                ${Object.entries(theme.cssVariables).map(([key, value]) => `${key}: ${value}`).join("\n")}
-            `;
-      if (existing) {
-        existing.replaceWith(style);
-      } else {
-        document.head.appendChild(style);
-      }
-    }
-    if (theme.fonts) {
-      theme.fonts.forEach(font => {
-        const existing = document.querySelector(`link[href="${font}"]`);
-        if (existing) {
-          return;
+import { useWebsiteBuilderTheme } from "../../../components/index.js";
+const ApplyTheme = ()=>{
+    const { theme } = useWebsiteBuilderTheme();
+    useEffect(()=>{
+        if (!theme) return;
+        if (theme.css) {
+            const existing = document.querySelector('style[id="wb-editor-css"]');
+            const style = document.createElement("style");
+            style.id = "wb-editor-css";
+            style.innerHTML = theme.css;
+            if (existing) existing.replaceWith(style);
+            else document.head.appendChild(style);
         }
-        const link = document.createElement("link");
-        link.href = font;
-        link.rel = "stylesheet";
-        document.head.appendChild(link);
-      });
-    }
-  }, [theme]);
-  return null;
+        if (theme.fonts) theme.fonts.forEach((font)=>{
+            const existing = document.querySelector(`link[href="${font}"]`);
+            if (existing) return;
+            const link = document.createElement("link");
+            link.href = font;
+            link.rel = "stylesheet";
+            document.head.appendChild(link);
+        });
+        return ()=>{
+            const existing = document.querySelector('style[id="wb-editor-css"]');
+            if (existing) existing.remove();
+        };
+    }, [
+        theme
+    ]);
+    return null;
 };
+export { ApplyTheme };
 
 //# sourceMappingURL=ApplyTheme.js.map

package/BaseEditor/defaultConfig/Content/Preview/ApplyTheme.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useWebsiteBuilderTheme","ApplyTheme","theme","css","existing","document","querySelector","style","createElement","id","innerHTML","replaceWith","head","appendChild","cssVariables","Object","entries","map","key","value","join","fonts","forEach","font","link","href","rel"],"sources":["ApplyTheme.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport { useWebsiteBuilderTheme } from \"~/BaseEditor/components\";\n\nexport const ApplyTheme = () => {\n    const { theme } = useWebsiteBuilderTheme();\n\n    useEffect(() => {\n        if (!theme) {\n            return;\n        }\n\n        if (theme.css) {\n            const existing = document.querySelector(`style[id=\"wb-editor-css\"]`);\n\n            const style = document.createElement(\"style\");\n            style.id = \"wb-editor-css\";\n            style.innerHTML = theme.css;\n\n            if (existing) {\n                existing.replaceWith(style);\n            } else {\n                document.head.appendChild(style);\n            }\n        }\n\n        if (theme.cssVariables) {\n            const existing = document.querySelector(`style[id=\"wb-editor-css-variables\"]`);\n\n            const style = document.createElement(\"style\");\n            style.id = \"wb-editor-css-variables\";\n            style.innerHTML = `:root {\n                ${Object.entries(theme.cssVariables)\n                    .map(([key, value]) => `${key}: ${value}`)\n                    .join(\"\\n\")}\n            `;\n\n            if (existing) {\n                existing.replaceWith(style);\n            } else {\n                document.head.appendChild(style);\n            }\n        }\n\n        if (theme.fonts) {\n            theme.fonts.forEach(font => {\n                const existing = document.querySelector(`link[href=\"${font}\"]`);\n                if (existing) {\n                    return;\n                }\n\n                const link = document.createElement(\"link\");\n                link.href = font;\n                link.rel = \"stylesheet\";\n                document.head.appendChild(link);\n            });\n        }\n    }, [theme]);\n\n    return null;\n};\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SAASC,sBAAsB;AAE/B,OAAO,MAAMC,UAAU,GAAGA,CAAA,KAAM;EAC5B,MAAM;IAAEC;EAAM,CAAC,GAAGF,sBAAsB,CAAC,CAAC;EAE1CD,SAAS,CAAC,MAAM;IACZ,IAAI,CAACG,KAAK,EAAE;MACR;IACJ;IAEA,IAAIA,KAAK,CAACC,GAAG,EAAE;MACX,MAAMC,QAAQ,GAAGC,QAAQ,CAACC,aAAa,CAAC,2BAA2B,CAAC;MAEpE,MAAMC,KAAK,GAAGF,QAAQ,CAACG,aAAa,CAAC,OAAO,CAAC;MAC7CD,KAAK,CAACE,EAAE,GAAG,eAAe;MAC1BF,KAAK,CAACG,SAAS,GAAGR,KAAK,CAACC,GAAG;MAE3B,IAAIC,QAAQ,EAAE;QACVA,QAAQ,CAACO,WAAW,CAACJ,KAAK,CAAC;MAC/B,CAAC,MAAM;QACHF,QAAQ,CAACO,IAAI,CAACC,WAAW,CAACN,KAAK,CAAC;MACpC;IACJ;IAEA,IAAIL,KAAK,CAACY,YAAY,EAAE;MACpB,MAAMV,QAAQ,GAAGC,QAAQ,CAACC,aAAa,CAAC,qCAAqC,CAAC;MAE9E,MAAMC,KAAK,GAAGF,QAAQ,CAACG,aAAa,CAAC,OAAO,CAAC;MAC7CD,KAAK,CAACE,EAAE,GAAG,yBAAyB;MACpCF,KAAK,CAACG,SAAS,GAAG;AAC9B,kBAAkBK,MAAM,CAACC,OAAO,CAACd,KAAK,CAACY,YAAY,CAAC,CAC/BG,GAAG,CAAC,CAAC,CAACC,GAAG,EAAEC,KAAK,CAAC,KAAK,GAAGD,GAAG,KAAKC,KAAK,EAAE,CAAC,CACzCC,IAAI,CAAC,IAAI,CAAC;AAC/B,aAAa;MAED,IAAIhB,QAAQ,EAAE;QACVA,QAAQ,CAACO,WAAW,CAACJ,KAAK,CAAC;MAC/B,CAAC,MAAM;QACHF,QAAQ,CAACO,IAAI,CAACC,WAAW,CAACN,KAAK,CAAC;MACpC;IACJ;IAEA,IAAIL,KAAK,CAACmB,KAAK,EAAE;MACbnB,KAAK,CAACmB,KAAK,CAACC,OAAO,CAACC,IAAI,IAAI;QACxB,MAAMnB,QAAQ,GAAGC,QAAQ,CAACC,aAAa,CAAC,cAAciB,IAAI,IAAI,CAAC;QAC/D,IAAInB,QAAQ,EAAE;UACV;QACJ;QAEA,MAAMoB,IAAI,GAAGnB,QAAQ,CAACG,aAAa,CAAC,MAAM,CAAC;QAC3CgB,IAAI,CAACC,IAAI,GAAGF,IAAI;QAChBC,IAAI,CAACE,GAAG,GAAG,YAAY;QACvBrB,QAAQ,CAACO,IAAI,CAACC,WAAW,CAACW,IAAI,CAAC;MACnC,CAAC,CAAC;IACN;EACJ,CAAC,EAAE,CAACtB,KAAK,CAAC,CAAC;EAEX,OAAO,IAAI;AACf,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Content/Preview/ApplyTheme.js","sources":["../../../../../src/BaseEditor/defaultConfig/Content/Preview/ApplyTheme.tsx"],"sourcesContent":["import { useEffect } from \"react\";\nimport { useWebsiteBuilderTheme } from \"~/BaseEditor/components/index.js\";\n\nexport const ApplyTheme = () => {\n    const { theme } = useWebsiteBuilderTheme();\n\n    useEffect(() => {\n        if (!theme) {\n            return;\n        }\n\n        if (theme.css) {\n            const existing = document.querySelector(`style[id=\"wb-editor-css\"]`);\n\n            const style = document.createElement(\"style\");\n            style.id = \"wb-editor-css\";\n            style.innerHTML = theme.css;\n\n            if (existing) {\n                existing.replaceWith(style);\n            } else {\n                document.head.appendChild(style);\n            }\n        }\n\n        if (theme.fonts) {\n            theme.fonts.forEach(font => {\n                const existing = document.querySelector(`link[href=\"${font}\"]`);\n                if (existing) {\n                    return;\n                }\n\n                const link = document.createElement(\"link\");\n                link.href = font;\n                link.rel = \"stylesheet\";\n                document.head.appendChild(link);\n            });\n        }\n\n        return () => {\n            const existing = document.querySelector(`style[id=\"wb-editor-css\"]`);\n            if (existing) {\n                existing.remove();\n            }\n        };\n    }, [theme]);\n\n    return null;\n};\n"],"names":["ApplyTheme","theme","useWebsiteBuilderTheme","useEffect","existing","document","style","font","link"],"mappings":";;AAGO,MAAMA,aAAa;IACtB,MAAM,EAAEC,KAAK,EAAE,GAAGC;IAElBC,UAAU;QACN,IAAI,CAACF,OACD;QAGJ,IAAIA,MAAM,GAAG,EAAE;YACX,MAAMG,WAAWC,SAAS,aAAa,CAAC;YAExC,MAAMC,QAAQD,SAAS,aAAa,CAAC;YACrCC,MAAM,EAAE,GAAG;YACXA,MAAM,SAAS,GAAGL,MAAM,GAAG;YAE3B,IAAIG,UACAA,SAAS,WAAW,CAACE;iBAErBD,SAAS,IAAI,CAAC,WAAW,CAACC;QAElC;QAEA,IAAIL,MAAM,KAAK,EACXA,MAAM,KAAK,CAAC,OAAO,CAACM,CAAAA;YAChB,MAAMH,WAAWC,SAAS,aAAa,CAAC,CAAC,WAAW,EAAEE,KAAK,EAAE,CAAC;YAC9D,IAAIH,UACA;YAGJ,MAAMI,OAAOH,SAAS,aAAa,CAAC;YACpCG,KAAK,IAAI,GAAGD;YACZC,KAAK,GAAG,GAAG;YACXH,SAAS,IAAI,CAAC,WAAW,CAACG;QAC9B;QAGJ,OAAO;YACH,MAAMJ,WAAWC,SAAS,aAAa,CAAC;YACxC,IAAID,UACAA,SAAS,MAAM;QAEvB;IACJ,GAAG;QAACH;KAAM;IAEV,OAAO;AACX"}

package/BaseEditor/defaultConfig/Content/Preview/AwaitIframeUrl.js

@@ -1,12 +1,11 @@
-import React from "react";
-import { useIframeUrl } from "./useIframeUrl";
-export const AwaitIframeUrl = ({
-  children
-}) => {
-  const url = useIframeUrl();
-  return url ? /*#__PURE__*/React.createElement(React.Fragment, null, children({
-    url
-  })) : null;
+import react from "react";
+import { useIframeUrl } from "./useIframeUrl.js";
+const AwaitIframeUrl = ({ children })=>{
+    const url = useIframeUrl();
+    return url ? /*#__PURE__*/ react.createElement(react.Fragment, null, children({
+        url
+    })) : null;
 };
+export { AwaitIframeUrl };
 
 //# sourceMappingURL=AwaitIframeUrl.js.map

package/BaseEditor/defaultConfig/Content/Preview/AwaitIframeUrl.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useIframeUrl","AwaitIframeUrl","children","url","createElement","Fragment"],"sources":["AwaitIframeUrl.tsx"],"sourcesContent":["import React from \"react\";\nimport { useIframeUrl } from \"~/BaseEditor/defaultConfig/Content/Preview/useIframeUrl\";\n\ninterface AwaitIframeUrlProps {\n    children: (params: { url: string }) => React.ReactNode;\n}\n\nexport const AwaitIframeUrl = ({ children }: AwaitIframeUrlProps) => {\n    const url = useIframeUrl();\n\n    return url ? <>{children({ url })}</> : null;\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY;AAMrB,OAAO,MAAMC,cAAc,GAAGA,CAAC;EAAEC;AAA8B,CAAC,KAAK;EACjE,MAAMC,GAAG,GAAGH,YAAY,CAAC,CAAC;EAE1B,OAAOG,GAAG,gBAAGJ,KAAA,CAAAK,aAAA,CAAAL,KAAA,CAAAM,QAAA,QAAGH,QAAQ,CAAC;IAAEC;EAAI,CAAC,CAAI,CAAC,GAAG,IAAI;AAChD,CAAC","ignoreList":[]}
+{"version":3,"file":"BaseEditor/defaultConfig/Content/Preview/AwaitIframeUrl.js","sources":["../../../../../src/BaseEditor/defaultConfig/Content/Preview/AwaitIframeUrl.tsx"],"sourcesContent":["import React from \"react\";\nimport { useIframeUrl } from \"~/BaseEditor/defaultConfig/Content/Preview/useIframeUrl.js\";\n\ninterface AwaitIframeUrlProps {\n    children: (params: { url: string }) => React.ReactNode;\n}\n\nexport const AwaitIframeUrl = ({ children }: AwaitIframeUrlProps) => {\n    const url = useIframeUrl();\n\n    return url ? <>{children({ url })}</> : null;\n};\n"],"names":["AwaitIframeUrl","children","url","useIframeUrl"],"mappings":";;AAOO,MAAMA,iBAAiB,CAAC,EAAEC,QAAQ,EAAuB;IAC5D,MAAMC,MAAMC;IAEZ,OAAOD,MAAM,WAANA,GAAM,0CAAGD,SAAS;QAAEC;IAAI,MAAS;AAC5C"}