@webiny/app-website-builder 6.0.0-alpha.4 → 6.0.0-rc.0

package/BaseEditor/config/Toolbar/Toolbar.d.ts

@@ -1,9 +1,27 @@
 import React from "react";
-import type { ElementProps as BaseElementProps } from "../Element";
-import type { ElementsProps as BaseElementsProps } from "../Elements";
+import type { ElementProps as BaseElementProps } from "../Element.js";
+import type { ElementsProps as BaseElementsProps } from "../Elements.js";
 export type ElementProps = Omit<BaseElementProps, "scope" | "id">;
 export type ElementsProps = Omit<BaseElementsProps, "scope">;
 export declare const Toolbar: (() => React.JSX.Element) & {
+    original: () => React.JSX.Element;
+    originalName: string;
+    displayName: string;
+} & {
+    original: (() => React.JSX.Element) & {
+        original: () => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    };
+    originalName: string;
+    displayName: string;
+} & {
+    createDecorator: (decorator: import("@webiny/app-admin").ComponentDecorator<(() => React.JSX.Element) & {
+        original: () => React.JSX.Element;
+        originalName: string;
+        displayName: string;
+    }>) => (props: unknown) => React.JSX.Element;
+} & {
     Layout: () => React.JSX.Element;
     Element: ((props: ElementProps) => React.JSX.Element) & {
         original: (props: ElementProps) => React.JSX.Element;

package/BaseEditor/config/Toolbar/Toolbar.js

@@ -1,13 +1,15 @@
 import React from "react";
 import { makeDecoratable } from "@webiny/app-admin";
-import { Element as BaseElement } from "../Element";
-import { Layout } from "./Layout";
-import { Elements as BaseElements } from "../Elements";
-import { createGetId } from "../createGetId";
+import { Element as BaseElement } from "../Element.js";
+import { Layout } from "./Layout.js";
+import { Elements as BaseElements } from "../Elements.js";
+import { createGetId } from "../createGetId.js";
 const SCOPE = "toolbar";
-const BaseToolbar = () => {
-  return /*#__PURE__*/React.createElement(Layout, null);
-};
+const BaseToolbar = makeDecoratable("ToolbarLayout", () => {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "w-[300px] flex-none"
+  }, /*#__PURE__*/React.createElement(Layout, null));
+});
 const getElementId = createGetId(SCOPE)();
 const BaseToolbarElement = makeDecoratable("ToolbarElement", props => {
   return /*#__PURE__*/React.createElement(BaseElement, Object.assign({}, props, {

package/BaseEditor/config/Toolbar/Toolbar.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","Element","BaseElement","Layout","Elements","BaseElements","createGetId","SCOPE","BaseToolbar","createElement","getElementId","BaseToolbarElement","props","Object","assign","scope","id","name","before","undefined","after","Toolbar"],"sources":["Toolbar.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { ElementProps as BaseElementProps } from \"../Element\";\nimport { Element as BaseElement } from \"../Element\";\nimport { Layout } from \"./Layout\";\nimport type { ElementsProps as BaseElementsProps } from \"../Elements\";\nimport { Elements as BaseElements } from \"../Elements\";\nimport { createGetId } from \"../createGetId\";\n\nconst SCOPE = \"toolbar\";\n\nconst BaseToolbar = () => {\n    return <Layout />;\n};\n\nconst getElementId = createGetId(SCOPE)();\n\nexport type ElementProps = Omit<BaseElementProps, \"scope\" | \"id\">;\n\nconst BaseToolbarElement = makeDecoratable(\"ToolbarElement\", (props: ElementProps) => {\n    return (\n        <BaseElement\n            {...props}\n            scope={SCOPE}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nexport type ElementsProps = Omit<BaseElementsProps, \"scope\">;\n\nconst Elements = makeDecoratable(\"ToolbarElements\", (props: ElementsProps) => {\n    return <BaseElements {...props} scope={SCOPE} />;\n});\n\nexport const Toolbar = Object.assign(BaseToolbar, {\n    Layout,\n    Element: BaseToolbarElement,\n    Elements\n});\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,OAAO,IAAIC,WAAW;AAC/B,SAASC,MAAM;AAEf,SAASC,QAAQ,IAAIC,YAAY;AACjC,SAASC,WAAW;AAEpB,MAAMC,KAAK,GAAG,SAAS;AAEvB,MAAMC,WAAW,GAAGA,CAAA,KAAM;EACtB,oBAAOT,KAAA,CAAAU,aAAA,CAACN,MAAM,MAAE,CAAC;AACrB,CAAC;AAED,MAAMO,YAAY,GAAGJ,WAAW,CAACC,KAAK,CAAC,CAAC,CAAC;AAIzC,MAAMI,kBAAkB,GAAGX,eAAe,CAAC,gBAAgB,EAAGY,KAAmB,IAAK;EAClF,oBACIb,KAAA,CAAAU,aAAA,CAACP,WAAW,EAAAW,MAAA,CAAAC,MAAA,KACJF,KAAK;IACTG,KAAK,EAAER,KAAM;IACbS,EAAE,EAAEN,YAAY,CAACE,KAAK,CAACK,IAAI,CAAE;IAC7BC,MAAM,EAAEN,KAAK,CAACM,MAAM,GAAGR,YAAY,CAACE,KAAK,CAACM,MAAM,CAAC,GAAGC,SAAU;IAC9DC,KAAK,EAAER,KAAK,CAACQ,KAAK,GAAGV,YAAY,CAACE,KAAK,CAACQ,KAAK,CAAC,GAAGD;EAAU,EAC9D,CAAC;AAEV,CAAC,CAAC;AAIF,MAAMf,QAAQ,GAAGJ,eAAe,CAAC,iBAAiB,EAAGY,KAAoB,IAAK;EAC1E,oBAAOb,KAAA,CAAAU,aAAA,CAACJ,YAAY,EAAAQ,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEG,KAAK,EAAER;EAAM,EAAE,CAAC;AACpD,CAAC,CAAC;AAEF,OAAO,MAAMc,OAAO,GAAGR,MAAM,CAACC,MAAM,CAACN,WAAW,EAAE;EAC9CL,MAAM;EACNF,OAAO,EAAEU,kBAAkB;EAC3BP;AACJ,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","makeDecoratable","Element","BaseElement","Layout","Elements","BaseElements","createGetId","SCOPE","BaseToolbar","createElement","className","getElementId","BaseToolbarElement","props","Object","assign","scope","id","name","before","undefined","after","Toolbar"],"sources":["Toolbar.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { ElementProps as BaseElementProps } from \"../Element.js\";\nimport { Element as BaseElement } from \"../Element.js\";\nimport { Layout } from \"./Layout.js\";\nimport type { ElementsProps as BaseElementsProps } from \"../Elements.js\";\nimport { Elements as BaseElements } from \"../Elements.js\";\nimport { createGetId } from \"../createGetId.js\";\n\nconst SCOPE = \"toolbar\";\n\nconst BaseToolbar = makeDecoratable(\"ToolbarLayout\", () => {\n    return (\n        <div className={\"w-[300px] flex-none\"}>\n            <Layout />\n        </div>\n    );\n});\n\nconst getElementId = createGetId(SCOPE)();\n\nexport type ElementProps = Omit<BaseElementProps, \"scope\" | \"id\">;\n\nconst BaseToolbarElement = makeDecoratable(\"ToolbarElement\", (props: ElementProps) => {\n    return (\n        <BaseElement\n            {...props}\n            scope={SCOPE}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nexport type ElementsProps = Omit<BaseElementsProps, \"scope\">;\n\nconst Elements = makeDecoratable(\"ToolbarElements\", (props: ElementsProps) => {\n    return <BaseElements {...props} scope={SCOPE} />;\n});\n\nexport const Toolbar = Object.assign(BaseToolbar, {\n    Layout,\n    Element: BaseToolbarElement,\n    Elements\n});\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,OAAO,IAAIC,WAAW;AAC/B,SAASC,MAAM;AAEf,SAASC,QAAQ,IAAIC,YAAY;AACjC,SAASC,WAAW;AAEpB,MAAMC,KAAK,GAAG,SAAS;AAEvB,MAAMC,WAAW,GAAGR,eAAe,CAAC,eAAe,EAAE,MAAM;EACvD,oBACID,KAAA,CAAAU,aAAA;IAAKC,SAAS,EAAE;EAAsB,gBAClCX,KAAA,CAAAU,aAAA,CAACN,MAAM,MAAE,CACR,CAAC;AAEd,CAAC,CAAC;AAEF,MAAMQ,YAAY,GAAGL,WAAW,CAACC,KAAK,CAAC,CAAC,CAAC;AAIzC,MAAMK,kBAAkB,GAAGZ,eAAe,CAAC,gBAAgB,EAAGa,KAAmB,IAAK;EAClF,oBACId,KAAA,CAAAU,aAAA,CAACP,WAAW,EAAAY,MAAA,CAAAC,MAAA,KACJF,KAAK;IACTG,KAAK,EAAET,KAAM;IACbU,EAAE,EAAEN,YAAY,CAACE,KAAK,CAACK,IAAI,CAAE;IAC7BC,MAAM,EAAEN,KAAK,CAACM,MAAM,GAAGR,YAAY,CAACE,KAAK,CAACM,MAAM,CAAC,GAAGC,SAAU;IAC9DC,KAAK,EAAER,KAAK,CAACQ,KAAK,GAAGV,YAAY,CAACE,KAAK,CAACQ,KAAK,CAAC,GAAGD;EAAU,EAC9D,CAAC;AAEV,CAAC,CAAC;AAIF,MAAMhB,QAAQ,GAAGJ,eAAe,CAAC,iBAAiB,EAAGa,KAAoB,IAAK;EAC1E,oBAAOd,KAAA,CAAAU,aAAA,CAACJ,YAAY,EAAAS,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEG,KAAK,EAAET;EAAM,EAAE,CAAC;AACpD,CAAC,CAAC;AAEF,OAAO,MAAMe,OAAO,GAAGR,MAAM,CAACC,MAAM,CAACP,WAAW,EAAE;EAC9CL,MAAM;EACNF,OAAO,EAAEW,kBAAkB;EAC3BR;AACJ,CAAC,CAAC","ignoreList":[]}

package/BaseEditor/config/TopBar/Divider.js

@@ -12,8 +12,7 @@ const StyledDivider = /*#__PURE__*/_styled("div", process.env.NODE_ENV === "prod
   styles: "width:1px;margin:0 5px;height:100%;flex:none;background-color:var(--mdc-theme-on-background)"
 } : {
   name: "wvw4q6",
-  styles: "width:1px;margin:0 5px;height:100%;flex:none;background-color:var(--mdc-theme-on-background)",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRpdmlkZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlnQyIsImZpbGUiOiJEaXZpZGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgbWFrZURlY29yYXRhYmxlIH0gZnJvbSBcIkB3ZWJpbnkvYXBwLWFkbWluXCI7XG5cbmNvbnN0IFN0eWxlZERpdmlkZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAxcHg7XG4gICAgbWFyZ2luOiAwIDVweDtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgZmxleDogbm9uZTtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZCk7XG5gO1xuXG5leHBvcnQgY29uc3QgRGl2aWRlciA9IG1ha2VEZWNvcmF0YWJsZShcIlRvcEJhckRpdmlkZXJcIiwgKCkgPT4ge1xuICAgIHJldHVybiA8U3R5bGVkRGl2aWRlciAvPjtcbn0pO1xuIl19 */",
+  styles: "width:1px;margin:0 5px;height:100%;flex:none;background-color:var(--mdc-theme-on-background)/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkRpdmlkZXIudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUlnQyIsImZpbGUiOiJEaXZpZGVyLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgbWFrZURlY29yYXRhYmxlIH0gZnJvbSBcIkB3ZWJpbnkvYXBwLWFkbWluXCI7XG5cbmNvbnN0IFN0eWxlZERpdmlkZXIgPSBzdHlsZWQuZGl2YFxuICAgIHdpZHRoOiAxcHg7XG4gICAgbWFyZ2luOiAwIDVweDtcbiAgICBoZWlnaHQ6IDEwMCU7XG4gICAgZmxleDogbm9uZTtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1tZGMtdGhlbWUtb24tYmFja2dyb3VuZCk7XG5gO1xuXG5leHBvcnQgY29uc3QgRGl2aWRlciA9IG1ha2VEZWNvcmF0YWJsZShcIlRvcEJhckRpdmlkZXJcIiwgKCkgPT4ge1xuICAgIHJldHVybiA8U3R5bGVkRGl2aWRlciAvPjtcbn0pO1xuIl19 */",
   toString: _EMOTION_STRINGIFIED_CSS_ERROR__
 });
 export const Divider = makeDecoratable("TopBarDivider", () => {

package/BaseEditor/config/TopBar/Divider.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","StyledDivider","_styled","process","env","NODE_ENV","target","label","name","styles","map","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Divider","createElement"],"sources":["Divider.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\n\nconst StyledDivider = styled.div`\n    width: 1px;\n    margin: 0 5px;\n    height: 100%;\n    flex: none;\n    background-color: var(--mdc-theme-on-background);\n`;\n\nexport const Divider = makeDecoratable(\"TopBarDivider\", () => {\n    return <StyledDivider />;\n});\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,MAAMC,aAAa,gBAAAC,OAAA,QAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,GAAA;EAAAC,QAAA,EAAAC;AAAA,EAMlB;AAED,OAAO,MAAMC,OAAO,GAAGb,eAAe,CAAC,eAAe,EAAE,MAAM;EAC1D,oBAAOD,KAAA,CAAAe,aAAA,CAACb,aAAa,MAAE,CAAC;AAC5B,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","makeDecoratable","StyledDivider","_styled","process","env","NODE_ENV","target","label","name","styles","toString","_EMOTION_STRINGIFIED_CSS_ERROR__","Divider","createElement"],"sources":["Divider.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\n\nconst StyledDivider = styled.div`\n    width: 1px;\n    margin: 0 5px;\n    height: 100%;\n    flex: none;\n    background-color: var(--mdc-theme-on-background);\n`;\n\nexport const Divider = makeDecoratable(\"TopBarDivider\", () => {\n    return <StyledDivider />;\n});\n"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,MAAMC,aAAa,gBAAAC,OAAA,QAAAC,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAC,MAAA;AAAA;EAAAA,MAAA;EAAAC,KAAA;AAAA,GAAAJ,OAAA,CAAAC,GAAA,CAAAC,QAAA;EAAAG,IAAA;EAAAC,MAAA;AAAA;EAAAD,IAAA;EAAAC,MAAA;EAAAC,QAAA,EAAAC;AAAA,EAMlB;AAED,OAAO,MAAMC,OAAO,GAAGZ,eAAe,CAAC,eAAe,EAAE,MAAM;EAC1D,oBAAOD,KAAA,CAAAc,aAAA,CAACZ,aAAa,MAAE,CAAC;AAC5B,CAAC,CAAC","ignoreList":[]}

package/BaseEditor/config/TopBar/Layout.js

@@ -1,7 +1,7 @@
 import React from "react";
 import { makeDecoratable } from "@webiny/app-admin";
 import { HeaderBar } from "@webiny/admin-ui";
-import { TopBar } from "./TopBar";
+import { TopBar } from "./TopBar.js";
 export const Layout = makeDecoratable("TopBarLayout", () => {
   return /*#__PURE__*/React.createElement(HeaderBar, {
     "data-role": "top-bar-layout",
@@ -12,7 +12,7 @@ export const Layout = makeDecoratable("TopBarLayout", () => {
       group: "center"
     }),
     end: /*#__PURE__*/React.createElement("div", {
-      className: "wby-flex wby-gap-x-sm"
+      className: "flex gap-x-sm"
     }, /*#__PURE__*/React.createElement(TopBar.Elements, {
       group: "actions"
     }))

package/BaseEditor/config/TopBar/Layout.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","HeaderBar","TopBar","Layout","createElement","start","Elements","group","middle","end","className"],"sources":["Layout.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { HeaderBar } from \"@webiny/admin-ui\";\nimport { TopBar } from \"./TopBar\";\n\nexport const Layout = makeDecoratable(\"TopBarLayout\", () => {\n    return (\n        <HeaderBar\n            data-role={\"top-bar-layout\"}\n            start={<TopBar.Elements group={\"left\"} />}\n            middle={<TopBar.Elements group={\"center\"} />}\n            end={\n                <div className={\"wby-flex wby-gap-x-sm\"}>\n                    <TopBar.Elements group={\"actions\"} />\n                </div>\n            }\n        />\n    );\n});\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,mBAAmB;AACnD,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,MAAM;AAEf,OAAO,MAAMC,MAAM,GAAGH,eAAe,CAAC,cAAc,EAAE,MAAM;EACxD,oBACID,KAAA,CAAAK,aAAA,CAACH,SAAS;IACN,aAAW,gBAAiB;IAC5BI,KAAK,eAAEN,KAAA,CAAAK,aAAA,CAACF,MAAM,CAACI,QAAQ;MAACC,KAAK,EAAE;IAAO,CAAE,CAAE;IAC1CC,MAAM,eAAET,KAAA,CAAAK,aAAA,CAACF,MAAM,CAACI,QAAQ;MAACC,KAAK,EAAE;IAAS,CAAE,CAAE;IAC7CE,GAAG,eACCV,KAAA,CAAAK,aAAA;MAAKM,SAAS,EAAE;IAAwB,gBACpCX,KAAA,CAAAK,aAAA,CAACF,MAAM,CAACI,QAAQ;MAACC,KAAK,EAAE;IAAU,CAAE,CACnC;EACR,CACJ,CAAC;AAEV,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","makeDecoratable","HeaderBar","TopBar","Layout","createElement","start","Elements","group","middle","end","className"],"sources":["Layout.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport { HeaderBar } from \"@webiny/admin-ui\";\nimport { TopBar } from \"./TopBar.js\";\n\nexport const Layout = makeDecoratable(\"TopBarLayout\", () => {\n    return (\n        <HeaderBar\n            data-role={\"top-bar-layout\"}\n            start={<TopBar.Elements group={\"left\"} />}\n            middle={<TopBar.Elements group={\"center\"} />}\n            end={\n                <div className={\"flex gap-x-sm\"}>\n                    <TopBar.Elements group={\"actions\"} />\n                </div>\n            }\n        />\n    );\n});\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,mBAAmB;AACnD,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,MAAM;AAEf,OAAO,MAAMC,MAAM,GAAGH,eAAe,CAAC,cAAc,EAAE,MAAM;EACxD,oBACID,KAAA,CAAAK,aAAA,CAACH,SAAS;IACN,aAAW,gBAAiB;IAC5BI,KAAK,eAAEN,KAAA,CAAAK,aAAA,CAACF,MAAM,CAACI,QAAQ;MAACC,KAAK,EAAE;IAAO,CAAE,CAAE;IAC1CC,MAAM,eAAET,KAAA,CAAAK,aAAA,CAACF,MAAM,CAACI,QAAQ;MAACC,KAAK,EAAE;IAAS,CAAE,CAAE;IAC7CE,GAAG,eACCV,KAAA,CAAAK,aAAA;MAAKM,SAAS,EAAE;IAAgB,gBAC5BX,KAAA,CAAAK,aAAA,CAACF,MAAM,CAACI,QAAQ;MAACC,KAAK,EAAE;IAAU,CAAE,CACnC;EACR,CACJ,CAAC;AAEV,CAAC,CAAC","ignoreList":[]}

package/BaseEditor/config/TopBar/MenuItem.js

@@ -1,7 +1,7 @@
 import React from "react";
-import { ListItemGraphic } from "@webiny/ui/List";
-import { Icon } from "@webiny/ui/Icon";
-import { MenuItem as UiMenuItem } from "@webiny/ui/Menu";
+import { ListItemGraphic } from "@webiny/ui/List/index.js";
+import { Icon } from "@webiny/ui/Icon/index.js";
+import { MenuItem as UiMenuItem } from "@webiny/ui/Menu/index.js";
 export const MenuItem = props => {
   return /*#__PURE__*/React.createElement(UiMenuItem, {
     onClick: props.onClick,

package/BaseEditor/config/TopBar/MenuItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ListItemGraphic","Icon","MenuItem","UiMenuItem","props","createElement","onClick","disabled","Boolean","icon","label"],"sources":["MenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { ListItemGraphic } from \"@webiny/ui/List\";\nimport { Icon } from \"@webiny/ui/Icon\";\nimport { MenuItem as UiMenuItem } from \"@webiny/ui/Menu\";\n\nexport interface MenuItemProps {\n    label: string;\n    onClick: () => void;\n    icon: JSX.Element;\n    \"data-testid\"?: string;\n    disabled?: boolean;\n}\n\nexport const MenuItem = (props: MenuItemProps) => {\n    return (\n        <UiMenuItem\n            onClick={props.onClick}\n            disabled={Boolean(props.disabled)}\n            data-testid={props[\"data-testid\"]}\n        >\n            <ListItemGraphic>\n                <Icon icon={props.icon} />\n            </ListItemGraphic>\n            {props.label}\n        </UiMenuItem>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,iBAAiB;AACjD,SAASC,IAAI,QAAQ,iBAAiB;AACtC,SAASC,QAAQ,IAAIC,UAAU,QAAQ,iBAAiB;AAUxD,OAAO,MAAMD,QAAQ,GAAIE,KAAoB,IAAK;EAC9C,oBACIL,KAAA,CAAAM,aAAA,CAACF,UAAU;IACPG,OAAO,EAAEF,KAAK,CAACE,OAAQ;IACvBC,QAAQ,EAAEC,OAAO,CAACJ,KAAK,CAACG,QAAQ,CAAE;IAClC,eAAaH,KAAK,CAAC,aAAa;EAAE,gBAElCL,KAAA,CAAAM,aAAA,CAACL,eAAe,qBACZD,KAAA,CAAAM,aAAA,CAACJ,IAAI;IAACQ,IAAI,EAAEL,KAAK,CAACK;EAAK,CAAE,CACZ,CAAC,EACjBL,KAAK,CAACM,KACC,CAAC;AAErB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","ListItemGraphic","Icon","MenuItem","UiMenuItem","props","createElement","onClick","disabled","Boolean","icon","label"],"sources":["MenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { ListItemGraphic } from \"@webiny/ui/List/index.js\";\nimport { Icon } from \"@webiny/ui/Icon/index.js\";\nimport { MenuItem as UiMenuItem } from \"@webiny/ui/Menu/index.js\";\n\nexport interface MenuItemProps {\n    label: string;\n    onClick: () => void;\n    icon: JSX.Element;\n    \"data-testid\"?: string;\n    disabled?: boolean;\n}\n\nexport const MenuItem = (props: MenuItemProps) => {\n    return (\n        <UiMenuItem\n            onClick={props.onClick}\n            disabled={Boolean(props.disabled)}\n            data-testid={props[\"data-testid\"]}\n        >\n            <ListItemGraphic>\n                <Icon icon={props.icon} />\n            </ListItemGraphic>\n            {props.label}\n        </UiMenuItem>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,0BAA0B;AAC1D,SAASC,IAAI,QAAQ,0BAA0B;AAC/C,SAASC,QAAQ,IAAIC,UAAU,QAAQ,0BAA0B;AAUjE,OAAO,MAAMD,QAAQ,GAAIE,KAAoB,IAAK;EAC9C,oBACIL,KAAA,CAAAM,aAAA,CAACF,UAAU;IACPG,OAAO,EAAEF,KAAK,CAACE,OAAQ;IACvBC,QAAQ,EAAEC,OAAO,CAACJ,KAAK,CAACG,QAAQ,CAAE;IAClC,eAAaH,KAAK,CAAC,aAAa;EAAE,gBAElCL,KAAA,CAAAM,aAAA,CAACL,eAAe,qBACZD,KAAA,CAAAM,aAAA,CAACJ,IAAI;IAACQ,IAAI,EAAEL,KAAK,CAACK;EAAK,CAAE,CACZ,CAAC,EACjBL,KAAK,CAACM,KACC,CAAC;AAErB,CAAC","ignoreList":[]}

package/BaseEditor/config/TopBar/TopBar.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import type { ElementProps as BaseElementProps } from "../Element";
-import type { ElementsProps as BaseElementsProps } from "../Elements";
+import type { ElementProps as BaseElementProps } from "../Element.js";
+import type { ElementsProps as BaseElementsProps } from "../Elements.js";
 export type ElementProps = Omit<BaseElementProps, "scope" | "id">;
 export type ActionProps = Omit<ElementProps, "group">;
 export type DropdownActionProps = Omit<ElementProps, "group">;
@@ -120,6 +120,6 @@ export declare const TopBar: (() => React.JSX.Element) & {
             displayName: string;
         }>) => (props: unknown) => React.JSX.Element;
     } & {
-        MenuItem: (props: import("./MenuItem").MenuItemProps) => React.JSX.Element;
+        MenuItem: (props: import("./MenuItem.js").MenuItemProps) => React.JSX.Element;
     };
 };

package/BaseEditor/config/TopBar/TopBar.js

@@ -1,11 +1,11 @@
 import React from "react";
 import { makeDecoratable } from "@webiny/app-admin";
-import { Element as BaseElement } from "../Element";
-import { Elements as BaseElements } from "../Elements";
-import { Divider } from "./Divider";
-import { Layout } from "./Layout";
-import { createGetId } from "../createGetId";
-import { MenuItem } from "./MenuItem";
+import { Element as BaseElement } from "../Element.js";
+import { Elements as BaseElements } from "../Elements.js";
+import { Divider } from "./Divider.js";
+import { Layout } from "./Layout.js";
+import { createGetId } from "../createGetId.js";
+import { MenuItem } from "./MenuItem.js";
 const SCOPE = "topBar";
 const BaseTopBar = () => {
   return /*#__PURE__*/React.createElement(Layout, null);

package/BaseEditor/config/TopBar/TopBar.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","Element","BaseElement","Elements","BaseElements","Divider","Layout","createGetId","MenuItem","SCOPE","BaseTopBar","createElement","getElementId","props","Object","assign","scope","id","name","before","undefined","after","Action","group","BaseDropdownAction","TopBar","DropdownAction"],"sources":["TopBar.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { ElementProps as BaseElementProps } from \"../Element\";\nimport { Element as BaseElement } from \"../Element\";\nimport type { ElementsProps as BaseElementsProps } from \"../Elements\";\nimport { Elements as BaseElements } from \"../Elements\";\nimport { Divider } from \"./Divider\";\nimport { Layout } from \"./Layout\";\nimport { createGetId } from \"../createGetId\";\nimport { MenuItem } from \"./MenuItem\";\n\nconst SCOPE = \"topBar\";\n\nconst BaseTopBar = () => {\n    return <Layout />;\n};\n\nconst getElementId = createGetId(SCOPE)();\n\nexport type ElementProps = Omit<BaseElementProps, \"scope\" | \"id\">;\n\nconst Element = makeDecoratable(\"TopBarElement\", (props: ElementProps) => {\n    return (\n        <BaseElement\n            {...props}\n            scope={SCOPE}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nexport type ActionProps = Omit<ElementProps, \"group\">;\n\nconst Action = makeDecoratable(\"TopBarAction\", (props: ActionProps) => {\n    return <Element {...props} group={\"actions\"} />;\n});\n\nexport type DropdownActionProps = Omit<ElementProps, \"group\">;\n\nconst BaseDropdownAction = makeDecoratable(\"TopBarDropdownAction\", (props: DropdownActionProps) => {\n    return <Element {...props} group={\"dropdownActions\"} />;\n});\n\nexport type ElementsProps = Omit<BaseElementsProps, \"scope\">;\n\nconst Elements = makeDecoratable(\"TopBarElements\", (props: ElementsProps) => {\n    return <BaseElements {...props} scope={SCOPE} />;\n});\n\nexport const TopBar = Object.assign(BaseTopBar, {\n    Element,\n    Elements,\n    Layout,\n    Divider,\n    Action,\n    DropdownAction: Object.assign(BaseDropdownAction, { MenuItem })\n});\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,OAAO,IAAIC,WAAW;AAE/B,SAASC,QAAQ,IAAIC,YAAY;AACjC,SAASC,OAAO;AAChB,SAASC,MAAM;AACf,SAASC,WAAW;AACpB,SAASC,QAAQ;AAEjB,MAAMC,KAAK,GAAG,QAAQ;AAEtB,MAAMC,UAAU,GAAGA,CAAA,KAAM;EACrB,oBAAOX,KAAA,CAAAY,aAAA,CAACL,MAAM,MAAE,CAAC;AACrB,CAAC;AAED,MAAMM,YAAY,GAAGL,WAAW,CAACE,KAAK,CAAC,CAAC,CAAC;AAIzC,MAAMR,OAAO,GAAGD,eAAe,CAAC,eAAe,EAAGa,KAAmB,IAAK;EACtE,oBACId,KAAA,CAAAY,aAAA,CAACT,WAAW,EAAAY,MAAA,CAAAC,MAAA,KACJF,KAAK;IACTG,KAAK,EAAEP,KAAM;IACbQ,EAAE,EAAEL,YAAY,CAACC,KAAK,CAACK,IAAI,CAAE;IAC7BC,MAAM,EAAEN,KAAK,CAACM,MAAM,GAAGP,YAAY,CAACC,KAAK,CAACM,MAAM,CAAC,GAAGC,SAAU;IAC9DC,KAAK,EAAER,KAAK,CAACQ,KAAK,GAAGT,YAAY,CAACC,KAAK,CAACQ,KAAK,CAAC,GAAGD;EAAU,EAC9D,CAAC;AAEV,CAAC,CAAC;AAIF,MAAME,MAAM,GAAGtB,eAAe,CAAC,cAAc,EAAGa,KAAkB,IAAK;EACnE,oBAAOd,KAAA,CAAAY,aAAA,CAACV,OAAO,EAAAa,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEU,KAAK,EAAE;EAAU,EAAE,CAAC;AACnD,CAAC,CAAC;AAIF,MAAMC,kBAAkB,GAAGxB,eAAe,CAAC,sBAAsB,EAAGa,KAA0B,IAAK;EAC/F,oBAAOd,KAAA,CAAAY,aAAA,CAACV,OAAO,EAAAa,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEU,KAAK,EAAE;EAAkB,EAAE,CAAC;AAC3D,CAAC,CAAC;AAIF,MAAMpB,QAAQ,GAAGH,eAAe,CAAC,gBAAgB,EAAGa,KAAoB,IAAK;EACzE,oBAAOd,KAAA,CAAAY,aAAA,CAACP,YAAY,EAAAU,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEG,KAAK,EAAEP;EAAM,EAAE,CAAC;AACpD,CAAC,CAAC;AAEF,OAAO,MAAMgB,MAAM,GAAGX,MAAM,CAACC,MAAM,CAACL,UAAU,EAAE;EAC5CT,OAAO;EACPE,QAAQ;EACRG,MAAM;EACND,OAAO;EACPiB,MAAM;EACNI,cAAc,EAAEZ,MAAM,CAACC,MAAM,CAACS,kBAAkB,EAAE;IAAEhB;EAAS,CAAC;AAClE,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","makeDecoratable","Element","BaseElement","Elements","BaseElements","Divider","Layout","createGetId","MenuItem","SCOPE","BaseTopBar","createElement","getElementId","props","Object","assign","scope","id","name","before","undefined","after","Action","group","BaseDropdownAction","TopBar","DropdownAction"],"sources":["TopBar.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable } from \"@webiny/app-admin\";\nimport type { ElementProps as BaseElementProps } from \"../Element.js\";\nimport { Element as BaseElement } from \"../Element.js\";\nimport type { ElementsProps as BaseElementsProps } from \"../Elements.js\";\nimport { Elements as BaseElements } from \"../Elements.js\";\nimport { Divider } from \"./Divider.js\";\nimport { Layout } from \"./Layout.js\";\nimport { createGetId } from \"../createGetId.js\";\nimport { MenuItem } from \"./MenuItem.js\";\n\nconst SCOPE = \"topBar\";\n\nconst BaseTopBar = () => {\n    return <Layout />;\n};\n\nconst getElementId = createGetId(SCOPE)();\n\nexport type ElementProps = Omit<BaseElementProps, \"scope\" | \"id\">;\n\nconst Element = makeDecoratable(\"TopBarElement\", (props: ElementProps) => {\n    return (\n        <BaseElement\n            {...props}\n            scope={SCOPE}\n            id={getElementId(props.name)}\n            before={props.before ? getElementId(props.before) : undefined}\n            after={props.after ? getElementId(props.after) : undefined}\n        />\n    );\n});\n\nexport type ActionProps = Omit<ElementProps, \"group\">;\n\nconst Action = makeDecoratable(\"TopBarAction\", (props: ActionProps) => {\n    return <Element {...props} group={\"actions\"} />;\n});\n\nexport type DropdownActionProps = Omit<ElementProps, \"group\">;\n\nconst BaseDropdownAction = makeDecoratable(\"TopBarDropdownAction\", (props: DropdownActionProps) => {\n    return <Element {...props} group={\"dropdownActions\"} />;\n});\n\nexport type ElementsProps = Omit<BaseElementsProps, \"scope\">;\n\nconst Elements = makeDecoratable(\"TopBarElements\", (props: ElementsProps) => {\n    return <BaseElements {...props} scope={SCOPE} />;\n});\n\nexport const TopBar = Object.assign(BaseTopBar, {\n    Element,\n    Elements,\n    Layout,\n    Divider,\n    Action,\n    DropdownAction: Object.assign(BaseDropdownAction, { MenuItem })\n});\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,QAAQ,mBAAmB;AAEnD,SAASC,OAAO,IAAIC,WAAW;AAE/B,SAASC,QAAQ,IAAIC,YAAY;AACjC,SAASC,OAAO;AAChB,SAASC,MAAM;AACf,SAASC,WAAW;AACpB,SAASC,QAAQ;AAEjB,MAAMC,KAAK,GAAG,QAAQ;AAEtB,MAAMC,UAAU,GAAGA,CAAA,KAAM;EACrB,oBAAOX,KAAA,CAAAY,aAAA,CAACL,MAAM,MAAE,CAAC;AACrB,CAAC;AAED,MAAMM,YAAY,GAAGL,WAAW,CAACE,KAAK,CAAC,CAAC,CAAC;AAIzC,MAAMR,OAAO,GAAGD,eAAe,CAAC,eAAe,EAAGa,KAAmB,IAAK;EACtE,oBACId,KAAA,CAAAY,aAAA,CAACT,WAAW,EAAAY,MAAA,CAAAC,MAAA,KACJF,KAAK;IACTG,KAAK,EAAEP,KAAM;IACbQ,EAAE,EAAEL,YAAY,CAACC,KAAK,CAACK,IAAI,CAAE;IAC7BC,MAAM,EAAEN,KAAK,CAACM,MAAM,GAAGP,YAAY,CAACC,KAAK,CAACM,MAAM,CAAC,GAAGC,SAAU;IAC9DC,KAAK,EAAER,KAAK,CAACQ,KAAK,GAAGT,YAAY,CAACC,KAAK,CAACQ,KAAK,CAAC,GAAGD;EAAU,EAC9D,CAAC;AAEV,CAAC,CAAC;AAIF,MAAME,MAAM,GAAGtB,eAAe,CAAC,cAAc,EAAGa,KAAkB,IAAK;EACnE,oBAAOd,KAAA,CAAAY,aAAA,CAACV,OAAO,EAAAa,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEU,KAAK,EAAE;EAAU,EAAE,CAAC;AACnD,CAAC,CAAC;AAIF,MAAMC,kBAAkB,GAAGxB,eAAe,CAAC,sBAAsB,EAAGa,KAA0B,IAAK;EAC/F,oBAAOd,KAAA,CAAAY,aAAA,CAACV,OAAO,EAAAa,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEU,KAAK,EAAE;EAAkB,EAAE,CAAC;AAC3D,CAAC,CAAC;AAIF,MAAMpB,QAAQ,GAAGH,eAAe,CAAC,gBAAgB,EAAGa,KAAoB,IAAK;EACzE,oBAAOd,KAAA,CAAAY,aAAA,CAACP,YAAY,EAAAU,MAAA,CAAAC,MAAA,KAAKF,KAAK;IAAEG,KAAK,EAAEP;EAAM,EAAE,CAAC;AACpD,CAAC,CAAC;AAEF,OAAO,MAAMgB,MAAM,GAAGX,MAAM,CAACC,MAAM,CAACL,UAAU,EAAE;EAC5CT,OAAO;EACPE,QAAQ;EACRG,MAAM;EACND,OAAO;EACPiB,MAAM;EACNI,cAAc,EAAEZ,MAAM,CAACC,MAAM,CAACS,kBAAkB,EAAE;IAAEhB;EAAS,CAAC;AAClE,CAAC,CAAC","ignoreList":[]}

package/BaseEditor/config/index.d.ts

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

package/BaseEditor/config/index.js

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

package/BaseEditor/config/index.js.map

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

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

@@ -1,10 +1,10 @@
 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 "../../..";
+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";
 export const Breadcrumbs = () => {
   const [activeElement] = useActiveElement();
   const editor = useDocumentEditor();

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,"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.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 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":[]}

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,3 @@
-export * from "./Breadcrumbs";
+export * from "./Breadcrumbs.js";
 
 //# sourceMappingURL=index.js.map

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

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

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

@@ -9,8 +9,8 @@ export const breadcrumbs = css({
   bottom: 0,
   width: "calc(100% - 600px)",
   height: "31px",
-  backgroundColor: "var(--mdc-theme-surface)",
-  borderTop: "1px solid var(--mdc-theme-background)",
+  backgroundColor: "var(--color-neutral-dimmed)",
+  borderTop: "1px solid var( --color-neutral-dimmed)",
   fontSize: "12px",
   overflow: "hidden",
   "> li": {
@@ -60,12 +60,10 @@ export const breadcrumbs = css({
   },
   // Handle active state
   "& li .element:hover": {
-    color: "var(--mdc-theme-surface)",
-    background: "var(--mdc-theme-secondary)"
+    background: "var(--color-neutral-muted)"
   },
   "& li .element:hover:after": {
-    color: "var(--mdc-theme-surface)",
-    borderLeftColor: "var(--mdc-theme-secondary) !important"
+    borderLeftColor: "var(--color-neutral-muted) !important"
   }
 });
 

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,"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(--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"],"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,6BAA6B;EAC9CC,SAAS,EAAE,wCAAwC;EACnDC,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;IACnBP,UAAU,EAAE;EAChB,CAAC;EACD,2BAA2B,EAAE;IACzBQ,eAAe,EAAE;EACrB;AACJ,CAAC,CAAC","ignoreList":[]}

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/OpenInNewTab.js

@@ -1,7 +1,7 @@
 import React from "react";
 import { IconButton, Text, Tooltip } from "@webiny/admin-ui";
 import { ReactComponent as NewTabIcon } from "@webiny/icons/open_in_new.svg";
-import { usePreviewLink } from "./usePreviewLink";
+import { usePreviewLink } from "./usePreviewLink.js";
 export const OpenInNewTab = () => {
   const link = usePreviewLink();
   return /*#__PURE__*/React.createElement(Tooltip, {

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/OpenInNewTab.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","IconButton","Text","Tooltip","ReactComponent","NewTabIcon","usePreviewLink","OpenInNewTab","link","createElement","content","size","side","trigger","icon","onClick","window","open","variant"],"sources":["OpenInNewTab.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconButton, Text, Tooltip } from \"@webiny/admin-ui\";\nimport { ReactComponent as NewTabIcon } from \"@webiny/icons/open_in_new.svg\";\nimport { usePreviewLink } from \"./usePreviewLink\";\n\nexport const OpenInNewTab = () => {\n    const link = usePreviewLink();\n\n    return (\n        <Tooltip\n            content={<Text size=\"md\">Preview page in a new tab</Text>}\n            side=\"bottom\"\n            trigger={\n                <IconButton\n                    icon={<NewTabIcon />}\n                    size=\"md\"\n                    onClick={() => {\n                        window.open(link, \"_blank\");\n                    }}\n                    variant={\"ghost\"}\n                />\n            }\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAC5D,SAASC,cAAc,IAAIC,UAAU,QAAQ,+BAA+B;AAC5E,SAASC,cAAc;AAEvB,OAAO,MAAMC,YAAY,GAAGA,CAAA,KAAM;EAC9B,MAAMC,IAAI,GAAGF,cAAc,CAAC,CAAC;EAE7B,oBACIN,KAAA,CAAAS,aAAA,CAACN,OAAO;IACJO,OAAO,eAAEV,KAAA,CAAAS,aAAA,CAACP,IAAI;MAACS,IAAI,EAAC;IAAI,GAAC,2BAA+B,CAAE;IAC1DC,IAAI,EAAC,QAAQ;IACbC,OAAO,eACHb,KAAA,CAAAS,aAAA,CAACR,UAAU;MACPa,IAAI,eAAEd,KAAA,CAAAS,aAAA,CAACJ,UAAU,MAAE,CAAE;MACrBM,IAAI,EAAC,IAAI;MACTI,OAAO,EAAEA,CAAA,KAAM;QACXC,MAAM,CAACC,IAAI,CAACT,IAAI,EAAE,QAAQ,CAAC;MAC/B,CAAE;MACFU,OAAO,EAAE;IAAQ,CACpB;EACJ,CACJ,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"names":["React","IconButton","Text","Tooltip","ReactComponent","NewTabIcon","usePreviewLink","OpenInNewTab","link","createElement","content","size","side","trigger","icon","onClick","window","open","variant"],"sources":["OpenInNewTab.tsx"],"sourcesContent":["import React from \"react\";\nimport { IconButton, Text, Tooltip } from \"@webiny/admin-ui\";\nimport { ReactComponent as NewTabIcon } from \"@webiny/icons/open_in_new.svg\";\nimport { usePreviewLink } from \"./usePreviewLink.js\";\n\nexport const OpenInNewTab = () => {\n    const link = usePreviewLink();\n\n    return (\n        <Tooltip\n            content={<Text size=\"md\">Preview page in a new tab</Text>}\n            side=\"bottom\"\n            trigger={\n                <IconButton\n                    icon={<NewTabIcon />}\n                    size=\"md\"\n                    onClick={() => {\n                        window.open(link, \"_blank\");\n                    }}\n                    variant={\"ghost\"}\n                />\n            }\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAC5D,SAASC,cAAc,IAAIC,UAAU,QAAQ,+BAA+B;AAC5E,SAASC,cAAc;AAEvB,OAAO,MAAMC,YAAY,GAAGA,CAAA,KAAM;EAC9B,MAAMC,IAAI,GAAGF,cAAc,CAAC,CAAC;EAE7B,oBACIN,KAAA,CAAAS,aAAA,CAACN,OAAO;IACJO,OAAO,eAAEV,KAAA,CAAAS,aAAA,CAACP,IAAI;MAACS,IAAI,EAAC;IAAI,GAAC,2BAA+B,CAAE;IAC1DC,IAAI,EAAC,QAAQ;IACbC,OAAO,eACHb,KAAA,CAAAS,aAAA,CAACR,UAAU;MACPa,IAAI,eAAEd,KAAA,CAAAS,aAAA,CAACJ,UAAU,MAAE,CAAE;MACrBM,IAAI,EAAC,IAAI;MACTI,OAAO,EAAEA,CAAA,KAAM;QACXC,MAAM,CAACC,IAAI,CAACT,IAAI,EAAE,QAAQ,CAAC;MAC/B,CAAE;MACFU,OAAO,EAAE;IAAQ,CACpB;EACJ,CACJ,CAAC;AAEV,CAAC","ignoreList":[]}

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/PreviewDomain.js

@@ -1,11 +1,11 @@
 import React, { useCallback, useEffect, useState } from "react";
 import { ReactComponent as GlobeIcon } from "@webiny/icons/language.svg";
 import { Button, DropdownMenu, IconButton, Separator, Input, cn } from "@webiny/admin-ui";
-import { usePreviewDomain } from "../usePreviewDomain";
+import { usePreviewDomain } from "../usePreviewDomain.js";
 import { Bind, Form } from "@webiny/form";
 import { validation } from "@webiny/validation";
-import { useDocumentEditor } from "../../../../../DocumentEditor";
-import { Commands } from "../../../..";
+import { useDocumentEditor } from "../../../../../DocumentEditor/index.js";
+import { Commands } from "../../../../index.js";
 export const PreviewDomain = () => {
   const editor = useDocumentEditor();
   const [isOpen, setIsOpen] = useState(false);
@@ -34,12 +34,12 @@ export const PreviewDomain = () => {
     }
     editor.executeCommand(Commands.RefreshPreview);
   }, [previewDomain]);
-  const classNames = cn("wby-absolute wby-left-0 wby-top-0", isOverridden ? "wby-fill-accent-default" : "wby-fill-neutral-disabled");
+  const classNames = cn("absolute left-0 top-0", isOverridden ? "fill-accent-default" : "fill-neutral-disabled");
   return /*#__PURE__*/React.createElement(DropdownMenu, {
     open: isOpen,
     align: "center",
     side: "bottom",
-    className: "wby-shadow-lg",
+    className: "shadow-lg",
     onOpenChange: setIsOpen,
     trigger: /*#__PURE__*/React.createElement(IconButton, {
       icon: /*#__PURE__*/React.createElement(GlobeIcon, null),
@@ -49,7 +49,7 @@ export const PreviewDomain = () => {
       className: classNames
     })
   }, /*#__PURE__*/React.createElement("div", {
-    className: "wby-p-sm wby-text-sm",
+    className: "p-sm text-sm",
     style: {
       width: 300
     }

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/PreviewDomain.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useState","ReactComponent","GlobeIcon","Button","DropdownMenu","IconButton","Separator","Input","cn","usePreviewDomain","Bind","Form","validation","useDocumentEditor","Commands","PreviewDomain","editor","isOpen","setIsOpen","previewDomain","isOverridden","unsetPreviewDomain","setPreviewDomain","commitValue","data","value","length","resetDomain","executeCommand","RefreshPreview","classNames","createElement","open","align","side","className","onOpenChange","trigger","icon","size","onClick","variant","style","width","onSubmit","form","name","validators","create","autoFocus","label","description","Fragment","onBlur","submit","onEnter","note","margin","text"],"sources":["PreviewDomain.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { ReactComponent as GlobeIcon } from \"@webiny/icons/language.svg\";\nimport { Button, DropdownMenu, IconButton, Separator, Input, cn } from \"@webiny/admin-ui\";\nimport { usePreviewDomain } from \"../usePreviewDomain\";\nimport type { GenericFormData } from \"@webiny/form\";\nimport { Bind, Form } from \"@webiny/form\";\nimport { validation } from \"@webiny/validation\";\nimport { useDocumentEditor } from \"~/DocumentEditor\";\nimport { Commands } from \"~/BaseEditor\";\n\nexport const PreviewDomain = () => {\n    const editor = useDocumentEditor();\n    const [isOpen, setIsOpen] = useState(false);\n\n    const { previewDomain, isOverridden, unsetPreviewDomain, setPreviewDomain } =\n        usePreviewDomain();\n\n    const commitValue = useCallback((data: GenericFormData) => {\n        const value = data.previewDomain;\n        if (value.length > 0) {\n            setPreviewDomain(value);\n        } else {\n            unsetPreviewDomain();\n        }\n        setIsOpen(false);\n    }, []);\n\n    const resetDomain = useCallback(() => {\n        unsetPreviewDomain();\n        setIsOpen(false);\n    }, []);\n\n    useEffect(() => {\n        if (!previewDomain) {\n            return;\n        }\n\n        editor.executeCommand(Commands.RefreshPreview);\n    }, [previewDomain]);\n\n    const classNames = cn(\n        \"wby-absolute wby-left-0 wby-top-0\",\n        isOverridden ? \"wby-fill-accent-default\" : \"wby-fill-neutral-disabled\"\n    );\n\n    return (\n        <DropdownMenu\n            open={isOpen}\n            align=\"center\"\n            side=\"bottom\"\n            className={\"wby-shadow-lg\"}\n            onOpenChange={setIsOpen}\n            trigger={\n                <IconButton\n                    icon={<GlobeIcon />}\n                    size=\"md\"\n                    onClick={() => {}}\n                    variant={\"ghost\"}\n                    className={classNames}\n                />\n            }\n        >\n            <div className={\"wby-p-sm wby-text-sm\"} style={{ width: 300 }}>\n                <Form data={{ previewDomain }} onSubmit={commitValue}>\n                    {form => (\n                        <Bind name={\"previewDomain\"} validators={[validation.create(\"url\")]}>\n                            <Input\n                                autoFocus={true}\n                                label={\"Preview Domain\"}\n                                description={\n                                    <>\n                                        Set a custom preview domain for your session.\n                                        <br />\n                                        This doesn&apos;t affect other users.\n                                    </>\n                                }\n                                size={\"md\"}\n                                onBlur={() => form.submit()}\n                                onEnter={() => form.submit()}\n                                note={`Hit \"Enter\" or click outside the menu to apply.`}\n                            />\n                        </Bind>\n                    )}\n                </Form>\n                {isOverridden ? (\n                    <>\n                        <Separator variant={\"dimmed\"} margin={\"lg\"} />\n                        <Button\n                            variant={\"primary\"}\n                            onClick={resetDomain}\n                            text={\"Reset Domain\"}\n                            size={\"sm\"}\n                        />\n                        <Separator variant={\"dimmed\"} margin={\"lg\"} />\n                        Resetting will revert to using the default preview domain.\n                    </>\n                ) : null}\n            </div>\n        </DropdownMenu>\n    );\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useState","ReactComponent","GlobeIcon","Button","DropdownMenu","IconButton","Separator","Input","cn","usePreviewDomain","Bind","Form","validation","useDocumentEditor","Commands","PreviewDomain","editor","isOpen","setIsOpen","previewDomain","isOverridden","unsetPreviewDomain","setPreviewDomain","commitValue","data","value","length","resetDomain","executeCommand","RefreshPreview","classNames","createElement","open","align","side","className","onOpenChange","trigger","icon","size","onClick","variant","style","width","onSubmit","form","name","validators","create","autoFocus","label","description","Fragment","onBlur","submit","onEnter","note","margin","text"],"sources":["PreviewDomain.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from \"react\";\nimport { ReactComponent as GlobeIcon } from \"@webiny/icons/language.svg\";\nimport { Button, DropdownMenu, IconButton, Separator, Input, cn } from \"@webiny/admin-ui\";\nimport { usePreviewDomain } from \"../usePreviewDomain.js\";\nimport type { GenericFormData } from \"@webiny/form\";\nimport { Bind, Form } from \"@webiny/form\";\nimport { validation } from \"@webiny/validation\";\nimport { useDocumentEditor } from \"~/DocumentEditor/index.js\";\nimport { Commands } from \"~/BaseEditor/index.js\";\n\nexport const PreviewDomain = () => {\n    const editor = useDocumentEditor();\n    const [isOpen, setIsOpen] = useState(false);\n\n    const { previewDomain, isOverridden, unsetPreviewDomain, setPreviewDomain } =\n        usePreviewDomain();\n\n    const commitValue = useCallback((data: GenericFormData) => {\n        const value = data.previewDomain;\n        if (value.length > 0) {\n            setPreviewDomain(value);\n        } else {\n            unsetPreviewDomain();\n        }\n        setIsOpen(false);\n    }, []);\n\n    const resetDomain = useCallback(() => {\n        unsetPreviewDomain();\n        setIsOpen(false);\n    }, []);\n\n    useEffect(() => {\n        if (!previewDomain) {\n            return;\n        }\n\n        editor.executeCommand(Commands.RefreshPreview);\n    }, [previewDomain]);\n\n    const classNames = cn(\n        \"absolute left-0 top-0\",\n        isOverridden ? \"fill-accent-default\" : \"fill-neutral-disabled\"\n    );\n\n    return (\n        <DropdownMenu\n            open={isOpen}\n            align=\"center\"\n            side=\"bottom\"\n            className={\"shadow-lg\"}\n            onOpenChange={setIsOpen}\n            trigger={\n                <IconButton\n                    icon={<GlobeIcon />}\n                    size=\"md\"\n                    onClick={() => {}}\n                    variant={\"ghost\"}\n                    className={classNames}\n                />\n            }\n        >\n            <div className={\"p-sm text-sm\"} style={{ width: 300 }}>\n                <Form data={{ previewDomain }} onSubmit={commitValue}>\n                    {form => (\n                        <Bind name={\"previewDomain\"} validators={[validation.create(\"url\")]}>\n                            <Input\n                                autoFocus={true}\n                                label={\"Preview Domain\"}\n                                description={\n                                    <>\n                                        Set a custom preview domain for your session.\n                                        <br />\n                                        This doesn&apos;t affect other users.\n                                    </>\n                                }\n                                size={\"md\"}\n                                onBlur={() => form.submit()}\n                                onEnter={() => form.submit()}\n                                note={`Hit \"Enter\" or click outside the menu to apply.`}\n                            />\n                        </Bind>\n                    )}\n                </Form>\n                {isOverridden ? (\n                    <>\n                        <Separator variant={\"dimmed\"} margin={\"lg\"} />\n                        <Button\n                            variant={\"primary\"}\n                            onClick={resetDomain}\n                            text={\"Reset Domain\"}\n                            size={\"sm\"}\n                        />\n                        <Separator variant={\"dimmed\"} margin={\"lg\"} />\n                        Resetting will revert to using the default preview domain.\n                    </>\n                ) : null}\n            </div>\n        </DropdownMenu>\n    );\n};\n"],"mappings":"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","ignoreList":[]}

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/PreviewInNewTab.js

@@ -1,6 +1,6 @@
 import React from "react";
 import { CopyButton, Text, Tooltip, useToast } from "@webiny/admin-ui";
-import { usePreviewLink } from "./usePreviewLink";
+import { usePreviewLink } from "./usePreviewLink.js";
 export const PreviewInNewTab = () => {
   const link = usePreviewLink();
   const {

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/PreviewInNewTab.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","CopyButton","Text","Tooltip","useToast","usePreviewLink","PreviewInNewTab","link","showToast","confirmClipboard","title","createElement","content","size","side","trigger","value","onCopy","variant"],"sources":["PreviewInNewTab.tsx"],"sourcesContent":["import React from \"react\";\nimport { CopyButton, Text, Tooltip, useToast } from \"@webiny/admin-ui\";\nimport { usePreviewLink } from \"./usePreviewLink\";\n\nexport const PreviewInNewTab = () => {\n    const link = usePreviewLink();\n    const { showToast } = useToast();\n\n    const confirmClipboard = () => {\n        showToast({\n            title: \"Preview link copied to clipboard!\"\n        });\n    };\n\n    return (\n        <Tooltip\n            content={<Text size=\"md\">Copy preview link</Text>}\n            side=\"bottom\"\n            trigger={\n                <CopyButton size=\"md\" value={link} onCopy={confirmClipboard} variant={\"ghost\"} />\n            }\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,kBAAkB;AACtE,SAASC,cAAc;AAEvB,OAAO,MAAMC,eAAe,GAAGA,CAAA,KAAM;EACjC,MAAMC,IAAI,GAAGF,cAAc,CAAC,CAAC;EAC7B,MAAM;IAAEG;EAAU,CAAC,GAAGJ,QAAQ,CAAC,CAAC;EAEhC,MAAMK,gBAAgB,GAAGA,CAAA,KAAM;IAC3BD,SAAS,CAAC;MACNE,KAAK,EAAE;IACX,CAAC,CAAC;EACN,CAAC;EAED,oBACIV,KAAA,CAAAW,aAAA,CAACR,OAAO;IACJS,OAAO,eAAEZ,KAAA,CAAAW,aAAA,CAACT,IAAI;MAACW,IAAI,EAAC;IAAI,GAAC,mBAAuB,CAAE;IAClDC,IAAI,EAAC,QAAQ;IACbC,OAAO,eACHf,KAAA,CAAAW,aAAA,CAACV,UAAU;MAACY,IAAI,EAAC,IAAI;MAACG,KAAK,EAAET,IAAK;MAACU,MAAM,EAAER,gBAAiB;MAACS,OAAO,EAAE;IAAQ,CAAE;EACnF,CACJ,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"names":["React","CopyButton","Text","Tooltip","useToast","usePreviewLink","PreviewInNewTab","link","showToast","confirmClipboard","title","createElement","content","size","side","trigger","value","onCopy","variant"],"sources":["PreviewInNewTab.tsx"],"sourcesContent":["import React from \"react\";\nimport { CopyButton, Text, Tooltip, useToast } from \"@webiny/admin-ui\";\nimport { usePreviewLink } from \"./usePreviewLink.js\";\n\nexport const PreviewInNewTab = () => {\n    const link = usePreviewLink();\n    const { showToast } = useToast();\n\n    const confirmClipboard = () => {\n        showToast({\n            title: \"Preview link copied to clipboard!\"\n        });\n    };\n\n    return (\n        <Tooltip\n            content={<Text size=\"md\">Copy preview link</Text>}\n            side=\"bottom\"\n            trigger={\n                <CopyButton size=\"md\" value={link} onCopy={confirmClipboard} variant={\"ghost\"} />\n            }\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,kBAAkB;AACtE,SAASC,cAAc;AAEvB,OAAO,MAAMC,eAAe,GAAGA,CAAA,KAAM;EACjC,MAAMC,IAAI,GAAGF,cAAc,CAAC,CAAC;EAC7B,MAAM;IAAEG;EAAU,CAAC,GAAGJ,QAAQ,CAAC,CAAC;EAEhC,MAAMK,gBAAgB,GAAGA,CAAA,KAAM;IAC3BD,SAAS,CAAC;MACNE,KAAK,EAAE;IACX,CAAC,CAAC;EACN,CAAC;EAED,oBACIV,KAAA,CAAAW,aAAA,CAACR,OAAO;IACJS,OAAO,eAAEZ,KAAA,CAAAW,aAAA,CAACT,IAAI;MAACW,IAAI,EAAC;IAAI,GAAC,mBAAuB,CAAE;IAClDC,IAAI,EAAC,QAAQ;IACbC,OAAO,eACHf,KAAA,CAAAW,aAAA,CAACV,UAAU;MAACY,IAAI,EAAC,IAAI;MAACG,KAAK,EAAET,IAAK;MAACU,MAAM,EAAER,gBAAiB;MAACS,OAAO,EAAE;IAAQ,CAAE;EACnF,CACJ,CAAC;AAEV,CAAC","ignoreList":[]}

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/RefreshPreview.js

@@ -1,8 +1,8 @@
 import React, { useCallback } from "react";
 import { IconButton, Text, Tooltip } from "@webiny/admin-ui";
 import { ReactComponent as RefreshIcon } from "@webiny/icons/refresh.svg";
-import { useDocumentEditor } from "../../../../../DocumentEditor";
-import { Commands } from "../../../..";
+import { useDocumentEditor } from "../../../../../DocumentEditor/index.js";
+import { Commands } from "../../../../index.js";
 export const RefreshPreview = () => {
   const editor = useDocumentEditor();
   const refresh = useCallback(() => {

package/BaseEditor/defaultConfig/Content/Preview/AddressBar/RefreshPreview.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","IconButton","Text","Tooltip","ReactComponent","RefreshIcon","useDocumentEditor","Commands","RefreshPreview","editor","refresh","executeCommand","createElement","content","size","side","trigger","icon","onClick","variant"],"sources":["RefreshPreview.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { IconButton, Text, Tooltip } from \"@webiny/admin-ui\";\nimport { ReactComponent as RefreshIcon } from \"@webiny/icons/refresh.svg\";\nimport { useDocumentEditor } from \"~/DocumentEditor\";\nimport { Commands } from \"~/BaseEditor\";\n\nexport const RefreshPreview = () => {\n    const editor = useDocumentEditor();\n\n    const refresh = useCallback(() => {\n        editor.executeCommand(Commands.RefreshPreview);\n    }, []);\n\n    return (\n        <Tooltip\n            content={<Text size=\"md\">Refresh preview</Text>}\n            side=\"bottom\"\n            trigger={\n                <IconButton icon={<RefreshIcon />} size=\"md\" onClick={refresh} variant={\"ghost\"} />\n            }\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,SAASC,UAAU,EAAEC,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAC5D,SAASC,cAAc,IAAIC,WAAW,QAAQ,2BAA2B;AACzE,SAASC,iBAAiB;AAC1B,SAASC,QAAQ;AAEjB,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAChC,MAAMC,MAAM,GAAGH,iBAAiB,CAAC,CAAC;EAElC,MAAMI,OAAO,GAAGV,WAAW,CAAC,MAAM;IAC9BS,MAAM,CAACE,cAAc,CAACJ,QAAQ,CAACC,cAAc,CAAC;EAClD,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIT,KAAA,CAAAa,aAAA,CAACT,OAAO;IACJU,OAAO,eAAEd,KAAA,CAAAa,aAAA,CAACV,IAAI;MAACY,IAAI,EAAC;IAAI,GAAC,iBAAqB,CAAE;IAChDC,IAAI,EAAC,QAAQ;IACbC,OAAO,eACHjB,KAAA,CAAAa,aAAA,CAACX,UAAU;MAACgB,IAAI,eAAElB,KAAA,CAAAa,aAAA,CAACP,WAAW,MAAE,CAAE;MAACS,IAAI,EAAC,IAAI;MAACI,OAAO,EAAER,OAAQ;MAACS,OAAO,EAAE;IAAQ,CAAE;EACrF,CACJ,CAAC;AAEV,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useCallback","IconButton","Text","Tooltip","ReactComponent","RefreshIcon","useDocumentEditor","Commands","RefreshPreview","editor","refresh","executeCommand","createElement","content","size","side","trigger","icon","onClick","variant"],"sources":["RefreshPreview.tsx"],"sourcesContent":["import React, { useCallback } from \"react\";\nimport { IconButton, Text, Tooltip } from \"@webiny/admin-ui\";\nimport { ReactComponent as RefreshIcon } from \"@webiny/icons/refresh.svg\";\nimport { useDocumentEditor } from \"~/DocumentEditor/index.js\";\nimport { Commands } from \"~/BaseEditor/index.js\";\n\nexport const RefreshPreview = () => {\n    const editor = useDocumentEditor();\n\n    const refresh = useCallback(() => {\n        editor.executeCommand(Commands.RefreshPreview);\n    }, []);\n\n    return (\n        <Tooltip\n            content={<Text size=\"md\">Refresh preview</Text>}\n            side=\"bottom\"\n            trigger={\n                <IconButton icon={<RefreshIcon />} size=\"md\" onClick={refresh} variant={\"ghost\"} />\n            }\n        />\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,QAAQ,OAAO;AAC1C,SAASC,UAAU,EAAEC,IAAI,EAAEC,OAAO,QAAQ,kBAAkB;AAC5D,SAASC,cAAc,IAAIC,WAAW,QAAQ,2BAA2B;AACzE,SAASC,iBAAiB;AAC1B,SAASC,QAAQ;AAEjB,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAChC,MAAMC,MAAM,GAAGH,iBAAiB,CAAC,CAAC;EAElC,MAAMI,OAAO,GAAGV,WAAW,CAAC,MAAM;IAC9BS,MAAM,CAACE,cAAc,CAACJ,QAAQ,CAACC,cAAc,CAAC;EAClD,CAAC,EAAE,EAAE,CAAC;EAEN,oBACIT,KAAA,CAAAa,aAAA,CAACT,OAAO;IACJU,OAAO,eAAEd,KAAA,CAAAa,aAAA,CAACV,IAAI;MAACY,IAAI,EAAC;IAAI,GAAC,iBAAqB,CAAE;IAChDC,IAAI,EAAC,QAAQ;IACbC,OAAO,eACHjB,KAAA,CAAAa,aAAA,CAACX,UAAU;MAACgB,IAAI,eAAElB,KAAA,CAAAa,aAAA,CAACP,WAAW,MAAE,CAAE;MAACS,IAAI,EAAC,IAAI;MAACI,OAAO,EAAER,OAAQ;MAACS,OAAO,EAAE;IAAQ,CAAE;EACrF,CACJ,CAAC;AAEV,CAAC","ignoreList":[]}

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

@@ -1,6 +1,6 @@
 import { useMemo } from "react";
-import { useIframeUrl } from "../useIframeUrl";
-import { useSelectFromDocument } from "../../../../hooks/useSelectFromDocument";
+import { useIframeUrl } from "../useIframeUrl.js";
+import { useSelectFromDocument } from "../../../../hooks/useSelectFromDocument.js";
 export const usePreviewLink = () => {
   const iframeUrl = useIframeUrl();
   const id = useSelectFromDocument(document => document.id);

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

@@ -1 +1 @@
-{"version":3,"names":["useMemo","useIframeUrl","useSelectFromDocument","usePreviewLink","iframeUrl","id","document","path","properties","documentType","metadata","url","URL","searchParams","forEach","_","key","startsWith","delete","set","String","toString"],"sources":["usePreviewLink.ts"],"sourcesContent":["import { useMemo } from \"react\";\nimport { useIframeUrl } from \"~/BaseEditor/defaultConfig/Content/Preview/useIframeUrl\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument\";\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\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        // 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]);\n};\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,YAAY;AACrB,SAASC,qBAAqB;AAE9B,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAChC,MAAMC,SAAS,GAAGH,YAAY,CAAC,CAAC;EAChC,MAAMI,EAAE,GAAGH,qBAAqB,CAACI,QAAQ,IAAIA,QAAQ,CAACD,EAAE,CAAC;EACzD,MAAME,IAAI,GAAGL,qBAAqB,CAACI,QAAQ,IAAIA,QAAQ,CAACE,UAAU,CAACD,IAAI,CAAC;EACxE,MAAME,YAAY,GAAGP,qBAAqB,CAACI,QAAQ,IAAIA,QAAQ,CAACI,QAAQ,CAACD,YAAY,CAAC;EAEtF,OAAOT,OAAO,CAAC,MAAM;IACjB,IAAI,CAACI,SAAS,EAAE;MACZ,OAAO,EAAE;IACb;IACA,MAAMO,GAAG,GAAG,IAAIC,GAAG,CAACR,SAAS,CAAC;;IAE9B;IACAO,GAAG,CAACE,YAAY,CAACC,OAAO,CAAC,CAACC,CAAC,EAAEC,GAAG,KAAK;MACjC,IAAIA,GAAG,CAACC,UAAU,CAAC,KAAK,CAAC,EAAE;QACvBN,GAAG,CAACE,YAAY,CAACK,MAAM,CAACF,GAAG,CAAC;MAChC;IACJ,CAAC,CAAC;;IAEF;IACAL,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC;IAC1CR,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,SAAS,EAAEV,YAAY,CAAC;IAC7CE,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,OAAO,EAAEC,MAAM,CAACf,EAAE,CAAC,CAAC;IACzCM,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,SAAS,EAAEZ,IAAI,CAAC;IACrC,OAAOI,GAAG,CAACU,QAAQ,CAAC,CAAC;EACzB,CAAC,EAAE,CAACjB,SAAS,CAAC,CAAC;AACnB,CAAC","ignoreList":[]}
+{"version":3,"names":["useMemo","useIframeUrl","useSelectFromDocument","usePreviewLink","iframeUrl","id","document","path","properties","documentType","metadata","url","URL","searchParams","forEach","_","key","startsWith","delete","set","String","toString"],"sources":["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\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        // 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]);\n};\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,YAAY;AACrB,SAASC,qBAAqB;AAE9B,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAChC,MAAMC,SAAS,GAAGH,YAAY,CAAC,CAAC;EAChC,MAAMI,EAAE,GAAGH,qBAAqB,CAACI,QAAQ,IAAIA,QAAQ,CAACD,EAAE,CAAC;EACzD,MAAME,IAAI,GAAGL,qBAAqB,CAACI,QAAQ,IAAIA,QAAQ,CAACE,UAAU,CAACD,IAAI,CAAC;EACxE,MAAME,YAAY,GAAGP,qBAAqB,CAACI,QAAQ,IAAIA,QAAQ,CAACI,QAAQ,CAACD,YAAY,CAAC;EAEtF,OAAOT,OAAO,CAAC,MAAM;IACjB,IAAI,CAACI,SAAS,EAAE;MACZ,OAAO,EAAE;IACb;IACA,MAAMO,GAAG,GAAG,IAAIC,GAAG,CAACR,SAAS,CAAC;;IAE9B;IACAO,GAAG,CAACE,YAAY,CAACC,OAAO,CAAC,CAACC,CAAC,EAAEC,GAAG,KAAK;MACjC,IAAIA,GAAG,CAACC,UAAU,CAAC,KAAK,CAAC,EAAE;QACvBN,GAAG,CAACE,YAAY,CAACK,MAAM,CAACF,GAAG,CAAC;MAChC;IACJ,CAAC,CAAC;;IAEF;IACAL,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,YAAY,EAAE,MAAM,CAAC;IAC1CR,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,SAAS,EAAEV,YAAY,CAAC;IAC7CE,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,OAAO,EAAEC,MAAM,CAACf,EAAE,CAAC,CAAC;IACzCM,GAAG,CAACE,YAAY,CAACM,GAAG,CAAC,SAAS,EAAEZ,IAAI,CAAC;IACrC,OAAOI,GAAG,CAACU,QAAQ,CAAC,CAAC;EACzB,CAAC,EAAE,CAACjB,SAAS,CAAC,CAAC;AACnB,CAAC","ignoreList":[]}

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

@@ -1,11 +1,11 @@
 import React, { useEffect, useState } from "react";
-import { BreakpointSelector } from "./BreakpointSelector";
-import { PreviewInNewTab } from "./AddressBar/PreviewInNewTab";
-import { OpenInNewTab } from "./AddressBar/OpenInNewTab";
-import { RefreshPreview } from "./AddressBar/RefreshPreview";
-import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument";
-import { PreviewDomain } from "./AddressBar/PreviewDomain";
-import { usePreviewDomain } from "./usePreviewDomain";
+import { BreakpointSelector } from "./BreakpointSelector.js";
+import { PreviewInNewTab } from "./AddressBar/PreviewInNewTab.js";
+import { OpenInNewTab } from "./AddressBar/OpenInNewTab.js";
+import { RefreshPreview } from "./AddressBar/RefreshPreview.js";
+import { useSelectFromDocument } from "../../../hooks/useSelectFromDocument.js";
+import { PreviewDomain } from "./AddressBar/PreviewDomain.js";
+import { usePreviewDomain } from "./usePreviewDomain.js";
 export const AddressBar = () => {
   const path = useSelectFromDocument(document => document.properties.path);
   const {
@@ -19,15 +19,15 @@ export const AddressBar = () => {
     setAddressBarUrl(`${previewDomain}${path}`);
   }, [path, previewDomain]);
   return /*#__PURE__*/React.createElement("div", {
-    className: "wby-w-full wby-h-[49px] wby-flex wby-flex-row wby-p-sm wby-bg-neutral-base wby-border-solid wby-border-b-sm wby-border-neutral-dimmed"
+    className: "w-full h-[49px] flex flex-row p-sm bg-neutral-base border-solid border-b-sm border-neutral-dimmed gap-sm"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "wby-relative wby-flex-auto wby-mr-sm"
+    className: "relative flex-auto"
   }, /*#__PURE__*/React.createElement("div", {
-    className: "wby-w-full wby-absolute wby-top-[-1px] wby-py-[6px] wby-pl-xl wby-border-sm wby-text-md wby-peer wby-cursor-not-allowed wby-rounded-md wby-border-neutral-subtle wby-text-neutral-muted wby-bg-neutral-disabled wby-text-neutral-disabled"
+    className: "w-full absolute -top-px py-xs-plus pl-xl border-sm text-md peer cursor-not-allowed rounded-md border-neutral-subtle text-neutral-muted bg-neutral-disabled text-neutral-disabled"
   }, /*#__PURE__*/React.createElement(PreviewDomain, null), addressBarUrl), /*#__PURE__*/React.createElement("div", {
-    className: "wby-absolute wby-right-0 wby-top-0"
+    className: "absolute right-0 top-0"
   }, /*#__PURE__*/React.createElement(RefreshPreview, null), /*#__PURE__*/React.createElement(PreviewInNewTab, null), /*#__PURE__*/React.createElement(OpenInNewTab, null))), /*#__PURE__*/React.createElement("div", {
-    className: "wby-flex-none"
+    className: "flex-none"
   }, /*#__PURE__*/React.createElement(BreakpointSelector, null)));
 };
 

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

@@ -1 +1 @@
-{"version":3,"names":["React","useEffect","useState","BreakpointSelector","PreviewInNewTab","OpenInNewTab","RefreshPreview","useSelectFromDocument","PreviewDomain","usePreviewDomain","AddressBar","path","document","properties","previewDomain","addressBarUrl","setAddressBarUrl","createElement","className"],"sources":["AddressBar.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { BreakpointSelector } from \"./BreakpointSelector\";\nimport { PreviewInNewTab } from \"./AddressBar/PreviewInNewTab\";\nimport { OpenInNewTab } from \"./AddressBar/OpenInNewTab\";\nimport { RefreshPreview } from \"./AddressBar/RefreshPreview\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument\";\nimport { PreviewDomain } from \"./AddressBar/PreviewDomain\";\nimport { usePreviewDomain } from \"./usePreviewDomain\";\n\nexport const AddressBar = () => {\n    const path = useSelectFromDocument(document => document.properties.path);\n\n    const { previewDomain } = usePreviewDomain();\n    const [addressBarUrl, setAddressBarUrl] = useState<string>(\"\");\n\n    useEffect(() => {\n        if (!previewDomain) {\n            return;\n        }\n\n        setAddressBarUrl(`${previewDomain}${path}`);\n    }, [path, previewDomain]);\n\n    return (\n        <div className=\"wby-w-full wby-h-[49px] wby-flex wby-flex-row wby-p-sm wby-bg-neutral-base wby-border-solid wby-border-b-sm wby-border-neutral-dimmed\">\n            <div className={\"wby-relative wby-flex-auto wby-mr-sm\"}>\n                <div\n                    className={\n                        \"wby-w-full wby-absolute wby-top-[-1px] wby-py-[6px] wby-pl-xl wby-border-sm wby-text-md wby-peer wby-cursor-not-allowed wby-rounded-md wby-border-neutral-subtle wby-text-neutral-muted wby-bg-neutral-disabled wby-text-neutral-disabled\"\n                    }\n                >\n                    <PreviewDomain />\n                    {addressBarUrl}\n                </div>\n                <div className={\"wby-absolute wby-right-0 wby-top-0\"}>\n                    <RefreshPreview />\n                    <PreviewInNewTab />\n                    <OpenInNewTab />\n                </div>\n            </div>\n            <div className={\"wby-flex-none\"}>\n                <BreakpointSelector />\n            </div>\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAClD,SAASC,kBAAkB;AAC3B,SAASC,eAAe;AACxB,SAASC,YAAY;AACrB,SAASC,cAAc;AACvB,SAASC,qBAAqB;AAC9B,SAASC,aAAa;AACtB,SAASC,gBAAgB;AAEzB,OAAO,MAAMC,UAAU,GAAGA,CAAA,KAAM;EAC5B,MAAMC,IAAI,GAAGJ,qBAAqB,CAACK,QAAQ,IAAIA,QAAQ,CAACC,UAAU,CAACF,IAAI,CAAC;EAExE,MAAM;IAAEG;EAAc,CAAC,GAAGL,gBAAgB,CAAC,CAAC;EAC5C,MAAM,CAACM,aAAa,EAAEC,gBAAgB,CAAC,GAAGd,QAAQ,CAAS,EAAE,CAAC;EAE9DD,SAAS,CAAC,MAAM;IACZ,IAAI,CAACa,aAAa,EAAE;MAChB;IACJ;IAEAE,gBAAgB,CAAC,GAAGF,aAAa,GAAGH,IAAI,EAAE,CAAC;EAC/C,CAAC,EAAE,CAACA,IAAI,EAAEG,aAAa,CAAC,CAAC;EAEzB,oBACId,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAC;EAAuI,gBAClJlB,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAuC,gBACnDlB,KAAA,CAAAiB,aAAA;IACIC,SAAS,EACL;EACH,gBAEDlB,KAAA,CAAAiB,aAAA,CAACT,aAAa,MAAE,CAAC,EAChBO,aACA,CAAC,eACNf,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAqC,gBACjDlB,KAAA,CAAAiB,aAAA,CAACX,cAAc,MAAE,CAAC,eAClBN,KAAA,CAAAiB,aAAA,CAACb,eAAe,MAAE,CAAC,eACnBJ,KAAA,CAAAiB,aAAA,CAACZ,YAAY,MAAE,CACd,CACJ,CAAC,eACNL,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAgB,gBAC5BlB,KAAA,CAAAiB,aAAA,CAACd,kBAAkB,MAAE,CACpB,CACJ,CAAC;AAEd,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useEffect","useState","BreakpointSelector","PreviewInNewTab","OpenInNewTab","RefreshPreview","useSelectFromDocument","PreviewDomain","usePreviewDomain","AddressBar","path","document","properties","previewDomain","addressBarUrl","setAddressBarUrl","createElement","className"],"sources":["AddressBar.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { BreakpointSelector } from \"./BreakpointSelector.js\";\nimport { PreviewInNewTab } from \"./AddressBar/PreviewInNewTab.js\";\nimport { OpenInNewTab } from \"./AddressBar/OpenInNewTab.js\";\nimport { RefreshPreview } from \"./AddressBar/RefreshPreview.js\";\nimport { useSelectFromDocument } from \"~/BaseEditor/hooks/useSelectFromDocument.js\";\nimport { PreviewDomain } from \"./AddressBar/PreviewDomain.js\";\nimport { usePreviewDomain } from \"./usePreviewDomain.js\";\n\nexport const AddressBar = () => {\n    const path = useSelectFromDocument(document => document.properties.path);\n\n    const { previewDomain } = usePreviewDomain();\n    const [addressBarUrl, setAddressBarUrl] = useState<string>(\"\");\n\n    useEffect(() => {\n        if (!previewDomain) {\n            return;\n        }\n\n        setAddressBarUrl(`${previewDomain}${path}`);\n    }, [path, previewDomain]);\n\n    return (\n        <div className=\"w-full h-[49px] flex flex-row p-sm bg-neutral-base border-solid border-b-sm border-neutral-dimmed gap-sm\">\n            <div className={\"relative flex-auto\"}>\n                <div\n                    className={\n                        \"w-full absolute -top-px py-xs-plus pl-xl border-sm text-md peer cursor-not-allowed rounded-md border-neutral-subtle text-neutral-muted bg-neutral-disabled text-neutral-disabled\"\n                    }\n                >\n                    <PreviewDomain />\n                    {addressBarUrl}\n                </div>\n                <div className={\"absolute right-0 top-0\"}>\n                    <RefreshPreview />\n                    <PreviewInNewTab />\n                    <OpenInNewTab />\n                </div>\n            </div>\n            <div className={\"flex-none\"}>\n                <BreakpointSelector />\n            </div>\n        </div>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAClD,SAASC,kBAAkB;AAC3B,SAASC,eAAe;AACxB,SAASC,YAAY;AACrB,SAASC,cAAc;AACvB,SAASC,qBAAqB;AAC9B,SAASC,aAAa;AACtB,SAASC,gBAAgB;AAEzB,OAAO,MAAMC,UAAU,GAAGA,CAAA,KAAM;EAC5B,MAAMC,IAAI,GAAGJ,qBAAqB,CAACK,QAAQ,IAAIA,QAAQ,CAACC,UAAU,CAACF,IAAI,CAAC;EAExE,MAAM;IAAEG;EAAc,CAAC,GAAGL,gBAAgB,CAAC,CAAC;EAC5C,MAAM,CAACM,aAAa,EAAEC,gBAAgB,CAAC,GAAGd,QAAQ,CAAS,EAAE,CAAC;EAE9DD,SAAS,CAAC,MAAM;IACZ,IAAI,CAACa,aAAa,EAAE;MAChB;IACJ;IAEAE,gBAAgB,CAAC,GAAGF,aAAa,GAAGH,IAAI,EAAE,CAAC;EAC/C,CAAC,EAAE,CAACA,IAAI,EAAEG,aAAa,CAAC,CAAC;EAEzB,oBACId,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAC;EAA0G,gBACrHlB,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAqB,gBACjClB,KAAA,CAAAiB,aAAA;IACIC,SAAS,EACL;EACH,gBAEDlB,KAAA,CAAAiB,aAAA,CAACT,aAAa,MAAE,CAAC,EAChBO,aACA,CAAC,eACNf,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAyB,gBACrClB,KAAA,CAAAiB,aAAA,CAACX,cAAc,MAAE,CAAC,eAClBN,KAAA,CAAAiB,aAAA,CAACb,eAAe,MAAE,CAAC,eACnBJ,KAAA,CAAAiB,aAAA,CAACZ,YAAY,MAAE,CACd,CACJ,CAAC,eACNL,KAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAE;EAAY,gBACxBlB,KAAA,CAAAiB,aAAA,CAACd,kBAAkB,MAAE,CACpB,CACJ,CAAC;AAEd,CAAC","ignoreList":[]}