@webiny/app-headless-cms 5.43.3 → 6.0.0-alpha.1

package/admin/components/DropZone/Horizontal.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Droppable","_excluded","_EMOTION_STRINGIFIED_CSS_ERROR__","InnerDiv","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","BackgroundColorDiv","OuterDiv","props","_defineProperty2","last","borderColor","isOver","display","isDragging","opacity","backgroundColor","Horizontal","_ref2","onDrop","isVisible","rest","_objectWithoutProperties2","createElement","Droppable","_ref3","drop","ref","style","height","width","position","_default","exports"],"sources":["Horizontal.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/types\";\n\nconst InnerDiv = styled(\"div\")({\n    height: 15,\n    width: \"100%\",\n    zIndex: 3,\n    borderRadius: 0,\n    boxSizing: \"border-box\",\n    display: \"none\",\n    border: \"1px dashed black\",\n    borderSpacing: 5\n});\n\nconst BackgroundColorDiv = styled(\"div\")({\n    width: \"100%\",\n    height: \"100%\"\n});\n\ninterface OuterDivProps {\n    isOver: boolean;\n    isDragging: boolean;\n    last: boolean;\n}\n\nconst OuterDiv = styled(\"div\")(\n    {\n        margin: 0,\n        padding: 0,\n        width: \"calc(100% + 2px)\",\n        zIndex: 10,\n        backgroundColor: \"transparent\",\n        position: \"absolute\",\n        display: \"flex\",\n        justifyContent: \"center\"\n    },\n    (props: OuterDivProps) => ({\n        [props.last ? \"bottom\" : \"top\"]: -15,\n        // @ts-expect-error\n        [InnerDiv]: {\n            borderColor: props.isOver ? \"var(--mdc-theme-primary)\" : \"var(--mdc-theme-secondary)\",\n            display: props.isDragging ? \"block\" : \"none\",\n            // @ts-expect-error\n            [BackgroundColorDiv]: {\n                opacity: 0.5,\n                backgroundColor: props.isOver\n                    ? \"var(--mdc-theme-primary)\"\n                    : \"var(--mdc-theme-secondary)\"\n            }\n        }\n    })\n);\n\ninterface HorizontalProps {\n    onDrop(item: DragSource): void;\n    last?: boolean;\n    isVisible?: IsVisibleCallable;\n    [\"data-testid\"]?: string;\n}\n\nconst Horizontal = ({ last, onDrop, isVisible, ...rest }: HorizontalProps) => {\n    return (\n        <Droppable onDrop={onDrop} isVisible={isVisible}>\n            {({ isOver, isDragging, drop }) => (\n                <div\n                    ref={drop}\n                    data-testid={rest[\"data-testid\"]}\n                    style={{\n                        /* For dropzone debugging: border: \"1px solid blue\",*/\n                        height: \"15px\",\n                        width: \"100%\",\n                        position: \"absolute\",\n                        [last ? \"bottom\" : \"top\"]: 0,\n                        left: 0,\n                        zIndex: isDragging ? 1000 : -1\n                    }}\n                >\n                    <OuterDiv isOver={isOver} isDragging={isDragging} last={last ? true : false}>\n                        <InnerDiv>\n                            <BackgroundColorDiv />\n                        </InnerDiv>\n                    </OuterDiv>\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Horizontal;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Droppable","cn","OuterDiv","isOver","isDragging","last","createElement","className","Horizontal","onDrop","isVisible","rest","drop","ref","style","height","width","position","left","zIndex"],"sources":["Horizontal.tsx"],"sourcesContent":["import React from \"react\";\nimport type { IsVisibleCallable } from \"../Droppable\";\nimport { Droppable } from \"../Droppable\";\nimport type { DragSource } from \"~/types\";\nimport { cn } from \"@webiny/admin-ui\";\n\ninterface OuterDivProps {\n    isOver: boolean;\n    isDragging: boolean;\n    last: boolean;\n}\n\nconst OuterDiv = ({ isOver, isDragging, last }: OuterDivProps) => (\n    <div\n        className={cn(\n            \"wby-absolute wby-w-full wby-z-10 wby-bg-transparent wby-flex wby-justify-center\",\n            last ? \"-wby-bottom-md\" : \"-wby-top-md\"\n        )}\n    >\n        <div\n            className={cn(\n                \"wby-h-md wby-w-full wby-z-3 wby-border-dashed wby-border-sm wby-hidden\",\n                isOver ? \"wby-border-accent-default\" : \"wby-border-success-default\",\n                isDragging && \"wby-block\"\n            )}\n        >\n            <div\n                className={cn(\n                    \"wby-w-full wby-h-full wby-opacity-50\",\n                    isOver ? \"wby-bg-primary-muted\" : \"wby-bg-success-muted\"\n                )}\n            />\n        </div>\n    </div>\n);\n\ninterface HorizontalProps {\n    onDrop(item: DragSource): void;\n    last?: boolean;\n    isVisible?: IsVisibleCallable;\n    [\"data-testid\"]?: string;\n}\n\nconst Horizontal = ({ last, onDrop, isVisible, ...rest }: HorizontalProps) => {\n    return (\n        <Droppable onDrop={onDrop} isVisible={isVisible}>\n            {({ isOver, isDragging, drop }) => (\n                <div\n                    ref={drop}\n                    data-testid={rest[\"data-testid\"]}\n                    style={{\n                        /* For dropzone debugging: border: \"1px solid blue\",*/\n                        height: \"16px\",\n                        width: \"100%\",\n                        position: \"absolute\",\n                        [last ? \"bottom\" : \"top\"]: 0,\n                        left: 0,\n                        zIndex: isDragging ? 1000 : -1\n                    }}\n                >\n                    <OuterDiv isOver={isOver} isDragging={isDragging} last={last ?? false} />\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Horizontal;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,SAAS;AAElB,SAASC,EAAE,QAAQ,kBAAkB;AAQrC,MAAMC,QAAQ,GAAGA,CAAC;EAAEC,MAAM;EAAEC,UAAU;EAAEC;AAAoB,CAAC,kBACzDN,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,iFAAiF,EACjFI,IAAI,GAAG,gBAAgB,GAAG,aAC9B;AAAE,gBAEFN,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,wEAAwE,EACxEE,MAAM,GAAG,2BAA2B,GAAG,4BAA4B,EACnEC,UAAU,IAAI,WAClB;AAAE,gBAEFL,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,sCAAsC,EACtCE,MAAM,GAAG,sBAAsB,GAAG,sBACtC;AAAE,CACL,CACA,CACJ,CACR;AASD,MAAMK,UAAU,GAAGA,CAAC;EAAEH,IAAI;EAAEI,MAAM;EAAEC,SAAS;EAAE,GAAGC;AAAsB,CAAC,KAAK;EAC1E,oBACIZ,KAAA,CAAAO,aAAA,CAACN,SAAS;IAACS,MAAM,EAAEA,MAAO;IAACC,SAAS,EAAEA;EAAU,GAC3C,CAAC;IAAEP,MAAM;IAAEC,UAAU;IAAEQ;EAAK,CAAC,kBAC1Bb,KAAA,CAAAO,aAAA;IACIO,GAAG,EAAED,IAAK;IACV,eAAaD,IAAI,CAAC,aAAa,CAAE;IACjCG,KAAK,EAAE;MACH;MACAC,MAAM,EAAE,MAAM;MACdC,KAAK,EAAE,MAAM;MACbC,QAAQ,EAAE,UAAU;MACpB,CAACZ,IAAI,GAAG,QAAQ,GAAG,KAAK,GAAG,CAAC;MAC5Ba,IAAI,EAAE,CAAC;MACPC,MAAM,EAAEf,UAAU,GAAG,IAAI,GAAG,CAAC;IACjC;EAAE,gBAEFL,KAAA,CAAAO,aAAA,CAACJ,QAAQ;IAACC,MAAM,EAAEA,MAAO;IAACC,UAAU,EAAEA,UAAW;IAACC,IAAI,EAAEA,IAAI,IAAI;EAAM,CAAE,CACvE,CAEF,CAAC;AAEpB,CAAC;AAED,eAAeG,UAAU","ignoreList":[]}

package/admin/components/DropZone/Vertical.d.ts

@@ -1,10 +1,11 @@
 import React from "react";
-import { DragSource } from "../../../types";
+import type { IsVisibleCallable } from "../Droppable";
+import type { DragSource } from "../../../types";
 interface VerticalProps {
     depth?: number;
     onDrop(item: DragSource): void;
     last?: boolean;
-    isVisible?: any;
+    isVisible?: IsVisibleCallable;
 }
 declare const Vertical: ({ depth, last, onDrop, isVisible }: VerticalProps) => React.JSX.Element;
 export default Vertical;

package/admin/components/DropZone/Vertical.js

@@ -1,85 +1,48 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-var _base = _interopRequireDefault(require("@emotion/styled/base"));
-var _react = _interopRequireDefault(require("react"));
-var _Droppable = require("../Droppable");
-function _EMOTION_STRINGIFIED_CSS_ERROR__() { return "You have tried to stringify object returned from `css` function. It isn't supposed to be used directly (e.g. as value of the `className` prop), but rather handed to emotion so it can handle it (e.g. as value of `css` prop)."; }
-var InnerDivVertical = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1yx4w3z2"
-} : {
-  target: "e1yx4w3z2",
-  label: "InnerDivVertical"
-})(process.env.NODE_ENV === "production" ? {
-  name: "1oslt3m",
-  styles: "position:absolute;width:10px;height:100%;z-index:3;border-radius:0;display:none;box-sizing:border-box;border:1px dashed black;border-spacing:5px"
-} : {
-  name: "1oslt3m",
-  styles: "position:absolute;width:10px;height:100%;z-index:3;border-radius:0;display:none;box-sizing:border-box;border:1px dashed black;border-spacing:5px",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlZlcnRpY2FsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFLeUIiLCJmaWxlIjoiVmVydGljYWwudHN4Iiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IFJlYWN0IGZyb20gXCJyZWFjdFwiO1xuaW1wb3J0IHN0eWxlZCBmcm9tIFwiQGVtb3Rpb24vc3R5bGVkXCI7XG5pbXBvcnQgeyBEcm9wcGFibGUsIElzVmlzaWJsZUNhbGxhYmxlIH0gZnJvbSBcIi4uL0Ryb3BwYWJsZVwiO1xuaW1wb3J0IHsgRHJhZ1NvdXJjZSB9IGZyb20gXCJ+L3R5cGVzXCI7XG5cbmNvbnN0IElubmVyRGl2VmVydGljYWwgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gICAgd2lkdGg6IDEwLFxuICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgekluZGV4OiAzLFxuICAgIGJvcmRlclJhZGl1czogMCxcbiAgICBkaXNwbGF5OiBcIm5vbmVcIixcbiAgICBib3hTaXppbmc6IFwiYm9yZGVyLWJveFwiLFxuICAgIGJvcmRlcjogXCIxcHggZGFzaGVkIGJsYWNrXCIsXG4gICAgYm9yZGVyU3BhY2luZzogNVxufSk7XG5cbmNvbnN0IEJhY2tncm91bmRDb2xvckRpdiA9IHN0eWxlZChcImRpdlwiKSh7XG4gICAgd2lkdGg6IFwiMTAwJVwiLFxuICAgIGhlaWdodDogXCIxMDAlXCJcbn0pO1xuXG5pbnRlcmZhY2UgT3V0ZXJEaXZWZXJ0aWNhbFByb3BzIHtcbiAgICBpc092ZXI6IGJvb2xlYW47XG4gICAgbGFzdD86IGJvb2xlYW47XG4gICAgaXNWaXNpYmxlPzogSXNWaXNpYmxlQ2FsbGFibGU7XG4gICAgaXNEcmFnZ2luZz86IGJvb2xlYW47XG59XG5cbmNvbnN0IE91dGVyRGl2VmVydGljYWwgPSBzdHlsZWQoXCJkaXZcIikoXG4gICAge1xuICAgICAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgICAgICB3aWR0aDogXCIzMCVcIixcbiAgICAgICAgdG9wOiAwLFxuICAgICAgICBoZWlnaHQ6IFwiMTAwJVwiLFxuICAgICAgICB6SW5kZXg6IDEwLFxuICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IFwidHJhbnNwYXJlbnRcIlxuICAgIH0sXG4gICAgKHByb3BzOiBPdXRlckRpdlZlcnRpY2FsUHJvcHMpID0+ICh7XG4gICAgICAgIFtwcm9wcy5sYXN0ID8gXCJyaWdodFwiIDogXCJsZWZ0XCJdOiAtOSxcbiAgICAgICAgdGV4dEFsaWduOiBwcm9wcy5sYXN0ID8gXCJyaWdodFwiIDogXCJsZWZ0XCIsXG4gICAgICAgIC8vIEB0cy1leHBlY3QtZXJyb3JcbiAgICAgICAgW0lubmVyRGl2VmVydGljYWxdOiB7XG4gICAgICAgICAgICBib3JkZXJDb2xvcjogcHJvcHMuaXNPdmVyID8gXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIiA6IFwidmFyKC0tbWRjLXRoZW1lLXNlY29uZGFyeSlcIixcbiAgICAgICAgICAgIFtwcm9wcy5sYXN0ID8gXCJyaWdodFwiIDogXCJsZWZ0XCJdOiAtMixcbiAgICAgICAgICAgIGRpc3BsYXk6IHByb3BzLmlzRHJhZ2dpbmcgPyBcImJsb2NrXCIgOiBcIm5vbmVcIixcbiAgICAgICAgICAgIC8vIEB0cy1leHBlY3QtZXJyb3JcbiAgICAgICAgICAgIFtCYWNrZ3JvdW5kQ29sb3JEaXZdOiB7XG4gICAgICAgICAgICAgICAgb3BhY2l0eTogMC41LFxuICAgICAgICAgICAgICAgIGJhY2tncm91bmRDb2xvcjogcHJvcHMuaXNPdmVyXG4gICAgICAgICAgICAgICAgICAgID8gXCJ2YXIoLS1tZGMtdGhlbWUtcHJpbWFyeSlcIlxuICAgICAgICAgICAgICAgICAgICA6IFwidmFyKC0tbWRjLXRoZW1lLXNlY29uZGFyeSlcIlxuICAgICAgICAgICAgfVxuICAgICAgICB9XG4gICAgfSlcbik7XG5cbmludGVyZmFjZSBWZXJ0aWNhbFByb3BzIHtcbiAgICBkZXB0aD86IG51bWJlcjtcbiAgICBvbkRyb3AoaXRlbTogRHJhZ1NvdXJjZSk6IHZvaWQ7XG4gICAgbGFzdD86IGJvb2xlYW47XG4gICAgaXNWaXNpYmxlPzogYW55O1xufVxuXG5jb25zdCBWZXJ0aWNhbCA9ICh7IGRlcHRoLCBsYXN0LCBvbkRyb3AsIGlzVmlzaWJsZSB9OiBWZXJ0aWNhbFByb3BzKSA9PiB7XG4gICAgcmV0dXJuIChcbiAgICAgICAgPERyb3BwYWJsZSBvbkRyb3A9e29uRHJvcH0gaXNWaXNpYmxlPXtpc1Zpc2libGV9PlxuICAgICAgICAgICAgeyh7IGlzT3ZlciwgaXNEcmFnZ2luZywgZHJvcCB9KSA9PiAoXG4gICAgICAgICAgICAgICAgPGRpdlxuICAgICAgICAgICAgICAgICAgICByZWY9e2Ryb3B9XG4gICAgICAgICAgICAgICAgICAgIHN0eWxlPXt7XG4gICAgICAgICAgICAgICAgICAgICAgICAvKiBGb3IgZHJvcHpvbmUgZGVidWdnaW5nOiBib3JkZXI6IFwiMXB4IHNvbGlkIGJsdWVcIiwqL1xuICAgICAgICAgICAgICAgICAgICAgICAgd2lkdGg6IFwiMzAlXCIsXG4gICAgICAgICAgICAgICAgICAgICAgICBtYXhXaWR0aDogXCIxMDBweFwiLFxuICAgICAgICAgICAgICAgICAgICAgICAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgICAgICAgICAgICAgICAgICAgICAgIHBvc2l0aW9uOiBcImFic29sdXRlXCIsXG4gICAgICAgICAgICAgICAgICAgICAgICB0b3A6IDAsXG4gICAgICAgICAgICAgICAgICAgICAgICBbbGFzdCA/IFwicmlnaHRcIiA6IFwibGVmdFwiXTogMCxcbiAgICAgICAgICAgICAgICAgICAgICAgIHpJbmRleDogaXNEcmFnZ2luZyA/IDEwMDAgKyAoZGVwdGggfHwgMCkgOiAtMVxuICAgICAgICAgICAgICAgICAgICB9fVxuICAgICAgICAgICAgICAgID5cbiAgICAgICAgICAgICAgICAgICAgPE91dGVyRGl2VmVydGljYWwgaXNPdmVyPXtpc092ZXJ9IGlzRHJhZ2dpbmc9e2lzRHJhZ2dpbmd9IGxhc3Q9e2xhc3R9PlxuICAgICAgICAgICAgICAgICAgICAgICAgPElubmVyRGl2VmVydGljYWw+XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgPEJhY2tncm91bmRDb2xvckRpdiAvPlxuICAgICAgICAgICAgICAgICAgICAgICAgPC9Jbm5lckRpdlZlcnRpY2FsPlxuICAgICAgICAgICAgICAgICAgICA8L091dGVyRGl2VmVydGljYWw+XG4gICAgICAgICAgICAgICAgPC9kaXY+XG4gICAgICAgICAgICApfVxuICAgICAgICA8L0Ryb3BwYWJsZT5cbiAgICApO1xufTtcblxuZXhwb3J0IGRlZmF1bHQgVmVydGljYWw7XG4iXX0= */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var BackgroundColorDiv = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1yx4w3z1"
-} : {
-  target: "e1yx4w3z1",
-  label: "BackgroundColorDiv"
-})(process.env.NODE_ENV === "production" ? {
-  name: "w1atjl",
-  styles: "width:100%;height:100%"
-} : {
-  name: "w1atjl",
-  styles: "width:100%;height:100%",
-  map: "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlZlcnRpY2FsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFpQjJCIiwiZmlsZSI6IlZlcnRpY2FsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgRHJvcHBhYmxlLCBJc1Zpc2libGVDYWxsYWJsZSB9IGZyb20gXCIuLi9Ecm9wcGFibGVcIjtcbmltcG9ydCB7IERyYWdTb3VyY2UgfSBmcm9tIFwifi90eXBlc1wiO1xuXG5jb25zdCBJbm5lckRpdlZlcnRpY2FsID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgIHdpZHRoOiAxMCxcbiAgICBoZWlnaHQ6IFwiMTAwJVwiLFxuICAgIHpJbmRleDogMyxcbiAgICBib3JkZXJSYWRpdXM6IDAsXG4gICAgZGlzcGxheTogXCJub25lXCIsXG4gICAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgICBib3JkZXI6IFwiMXB4IGRhc2hlZCBibGFja1wiLFxuICAgIGJvcmRlclNwYWNpbmc6IDVcbn0pO1xuXG5jb25zdCBCYWNrZ3JvdW5kQ29sb3JEaXYgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBoZWlnaHQ6IFwiMTAwJVwiXG59KTtcblxuaW50ZXJmYWNlIE91dGVyRGl2VmVydGljYWxQcm9wcyB7XG4gICAgaXNPdmVyOiBib29sZWFuO1xuICAgIGxhc3Q/OiBib29sZWFuO1xuICAgIGlzVmlzaWJsZT86IElzVmlzaWJsZUNhbGxhYmxlO1xuICAgIGlzRHJhZ2dpbmc/OiBib29sZWFuO1xufVxuXG5jb25zdCBPdXRlckRpdlZlcnRpY2FsID0gc3R5bGVkKFwiZGl2XCIpKFxuICAgIHtcbiAgICAgICAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgICAgICAgd2lkdGg6IFwiMzAlXCIsXG4gICAgICAgIHRvcDogMCxcbiAgICAgICAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgICAgICAgekluZGV4OiAxMCxcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCJcbiAgICB9LFxuICAgIChwcm9wczogT3V0ZXJEaXZWZXJ0aWNhbFByb3BzKSA9PiAoe1xuICAgICAgICBbcHJvcHMubGFzdCA/IFwicmlnaHRcIiA6IFwibGVmdFwiXTogLTksXG4gICAgICAgIHRleHRBbGlnbjogcHJvcHMubGFzdCA/IFwicmlnaHRcIiA6IFwibGVmdFwiLFxuICAgICAgICAvLyBAdHMtZXhwZWN0LWVycm9yXG4gICAgICAgIFtJbm5lckRpdlZlcnRpY2FsXToge1xuICAgICAgICAgICAgYm9yZGVyQ29sb3I6IHByb3BzLmlzT3ZlciA/IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCIgOiBcInZhcigtLW1kYy10aGVtZS1zZWNvbmRhcnkpXCIsXG4gICAgICAgICAgICBbcHJvcHMubGFzdCA/IFwicmlnaHRcIiA6IFwibGVmdFwiXTogLTIsXG4gICAgICAgICAgICBkaXNwbGF5OiBwcm9wcy5pc0RyYWdnaW5nID8gXCJibG9ja1wiIDogXCJub25lXCIsXG4gICAgICAgICAgICAvLyBAdHMtZXhwZWN0LWVycm9yXG4gICAgICAgICAgICBbQmFja2dyb3VuZENvbG9yRGl2XToge1xuICAgICAgICAgICAgICAgIG9wYWNpdHk6IDAuNSxcbiAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHByb3BzLmlzT3ZlclxuICAgICAgICAgICAgICAgICAgICA/IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCJcbiAgICAgICAgICAgICAgICAgICAgOiBcInZhcigtLW1kYy10aGVtZS1zZWNvbmRhcnkpXCJcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH0pXG4pO1xuXG5pbnRlcmZhY2UgVmVydGljYWxQcm9wcyB7XG4gICAgZGVwdGg/OiBudW1iZXI7XG4gICAgb25Ecm9wKGl0ZW06IERyYWdTb3VyY2UpOiB2b2lkO1xuICAgIGxhc3Q/OiBib29sZWFuO1xuICAgIGlzVmlzaWJsZT86IGFueTtcbn1cblxuY29uc3QgVmVydGljYWwgPSAoeyBkZXB0aCwgbGFzdCwgb25Ecm9wLCBpc1Zpc2libGUgfTogVmVydGljYWxQcm9wcykgPT4ge1xuICAgIHJldHVybiAoXG4gICAgICAgIDxEcm9wcGFibGUgb25Ecm9wPXtvbkRyb3B9IGlzVmlzaWJsZT17aXNWaXNpYmxlfT5cbiAgICAgICAgICAgIHsoeyBpc092ZXIsIGlzRHJhZ2dpbmcsIGRyb3AgfSkgPT4gKFxuICAgICAgICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgICAgICAgICAgcmVmPXtkcm9wfVxuICAgICAgICAgICAgICAgICAgICBzdHlsZT17e1xuICAgICAgICAgICAgICAgICAgICAgICAgLyogRm9yIGRyb3B6b25lIGRlYnVnZ2luZzogYm9yZGVyOiBcIjFweCBzb2xpZCBibHVlXCIsKi9cbiAgICAgICAgICAgICAgICAgICAgICAgIHdpZHRoOiBcIjMwJVwiLFxuICAgICAgICAgICAgICAgICAgICAgICAgbWF4V2lkdGg6IFwiMTAwcHhcIixcbiAgICAgICAgICAgICAgICAgICAgICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgICAgICAgICAgICAgICAgICAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgICAgICAgICAgICAgICAgICAgICAgdG9wOiAwLFxuICAgICAgICAgICAgICAgICAgICAgICAgW2xhc3QgPyBcInJpZ2h0XCIgOiBcImxlZnRcIl06IDAsXG4gICAgICAgICAgICAgICAgICAgICAgICB6SW5kZXg6IGlzRHJhZ2dpbmcgPyAxMDAwICsgKGRlcHRoIHx8IDApIDogLTFcbiAgICAgICAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgIDxPdXRlckRpdlZlcnRpY2FsIGlzT3Zlcj17aXNPdmVyfSBpc0RyYWdnaW5nPXtpc0RyYWdnaW5nfSBsYXN0PXtsYXN0fT5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxJbm5lckRpdlZlcnRpY2FsPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxCYWNrZ3JvdW5kQ29sb3JEaXYgLz5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvSW5uZXJEaXZWZXJ0aWNhbD5cbiAgICAgICAgICAgICAgICAgICAgPC9PdXRlckRpdlZlcnRpY2FsPlxuICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgKX1cbiAgICAgICAgPC9Ecm9wcGFibGU+XG4gICAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFZlcnRpY2FsO1xuIl19 */",
-  toString: _EMOTION_STRINGIFIED_CSS_ERROR__
-});
-var OuterDivVertical = /*#__PURE__*/(0, _base.default)("div", process.env.NODE_ENV === "production" ? {
-  target: "e1yx4w3z0"
-} : {
-  target: "e1yx4w3z0",
-  label: "OuterDivVertical"
-})("position:absolute;width:30%;top:0;height:100%;z-index:10;background-color:transparent;", function (props) {
-  return (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({}, props.last ? "right" : "left", -9), "textAlign", props.last ? "right" : "left"), InnerDivVertical, (0, _defineProperty2.default)((0, _defineProperty2.default)((0, _defineProperty2.default)({
-    borderColor: props.isOver ? "var(--mdc-theme-primary)" : "var(--mdc-theme-secondary)"
-  }, props.last ? "right" : "left", -2), "display", props.isDragging ? "block" : "none"), BackgroundColorDiv, {
-    opacity: 0.5,
-    backgroundColor: props.isOver ? "var(--mdc-theme-primary)" : "var(--mdc-theme-secondary)"
-  }));
-}, process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIlZlcnRpY2FsLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUE2QnlCIiwiZmlsZSI6IlZlcnRpY2FsLnRzeCIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCBSZWFjdCBmcm9tIFwicmVhY3RcIjtcbmltcG9ydCBzdHlsZWQgZnJvbSBcIkBlbW90aW9uL3N0eWxlZFwiO1xuaW1wb3J0IHsgRHJvcHBhYmxlLCBJc1Zpc2libGVDYWxsYWJsZSB9IGZyb20gXCIuLi9Ecm9wcGFibGVcIjtcbmltcG9ydCB7IERyYWdTb3VyY2UgfSBmcm9tIFwifi90eXBlc1wiO1xuXG5jb25zdCBJbm5lckRpdlZlcnRpY2FsID0gc3R5bGVkKFwiZGl2XCIpKHtcbiAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgIHdpZHRoOiAxMCxcbiAgICBoZWlnaHQ6IFwiMTAwJVwiLFxuICAgIHpJbmRleDogMyxcbiAgICBib3JkZXJSYWRpdXM6IDAsXG4gICAgZGlzcGxheTogXCJub25lXCIsXG4gICAgYm94U2l6aW5nOiBcImJvcmRlci1ib3hcIixcbiAgICBib3JkZXI6IFwiMXB4IGRhc2hlZCBibGFja1wiLFxuICAgIGJvcmRlclNwYWNpbmc6IDVcbn0pO1xuXG5jb25zdCBCYWNrZ3JvdW5kQ29sb3JEaXYgPSBzdHlsZWQoXCJkaXZcIikoe1xuICAgIHdpZHRoOiBcIjEwMCVcIixcbiAgICBoZWlnaHQ6IFwiMTAwJVwiXG59KTtcblxuaW50ZXJmYWNlIE91dGVyRGl2VmVydGljYWxQcm9wcyB7XG4gICAgaXNPdmVyOiBib29sZWFuO1xuICAgIGxhc3Q/OiBib29sZWFuO1xuICAgIGlzVmlzaWJsZT86IElzVmlzaWJsZUNhbGxhYmxlO1xuICAgIGlzRHJhZ2dpbmc/OiBib29sZWFuO1xufVxuXG5jb25zdCBPdXRlckRpdlZlcnRpY2FsID0gc3R5bGVkKFwiZGl2XCIpKFxuICAgIHtcbiAgICAgICAgcG9zaXRpb246IFwiYWJzb2x1dGVcIixcbiAgICAgICAgd2lkdGg6IFwiMzAlXCIsXG4gICAgICAgIHRvcDogMCxcbiAgICAgICAgaGVpZ2h0OiBcIjEwMCVcIixcbiAgICAgICAgekluZGV4OiAxMCxcbiAgICAgICAgYmFja2dyb3VuZENvbG9yOiBcInRyYW5zcGFyZW50XCJcbiAgICB9LFxuICAgIChwcm9wczogT3V0ZXJEaXZWZXJ0aWNhbFByb3BzKSA9PiAoe1xuICAgICAgICBbcHJvcHMubGFzdCA/IFwicmlnaHRcIiA6IFwibGVmdFwiXTogLTksXG4gICAgICAgIHRleHRBbGlnbjogcHJvcHMubGFzdCA/IFwicmlnaHRcIiA6IFwibGVmdFwiLFxuICAgICAgICAvLyBAdHMtZXhwZWN0LWVycm9yXG4gICAgICAgIFtJbm5lckRpdlZlcnRpY2FsXToge1xuICAgICAgICAgICAgYm9yZGVyQ29sb3I6IHByb3BzLmlzT3ZlciA/IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCIgOiBcInZhcigtLW1kYy10aGVtZS1zZWNvbmRhcnkpXCIsXG4gICAgICAgICAgICBbcHJvcHMubGFzdCA/IFwicmlnaHRcIiA6IFwibGVmdFwiXTogLTIsXG4gICAgICAgICAgICBkaXNwbGF5OiBwcm9wcy5pc0RyYWdnaW5nID8gXCJibG9ja1wiIDogXCJub25lXCIsXG4gICAgICAgICAgICAvLyBAdHMtZXhwZWN0LWVycm9yXG4gICAgICAgICAgICBbQmFja2dyb3VuZENvbG9yRGl2XToge1xuICAgICAgICAgICAgICAgIG9wYWNpdHk6IDAuNSxcbiAgICAgICAgICAgICAgICBiYWNrZ3JvdW5kQ29sb3I6IHByb3BzLmlzT3ZlclxuICAgICAgICAgICAgICAgICAgICA/IFwidmFyKC0tbWRjLXRoZW1lLXByaW1hcnkpXCJcbiAgICAgICAgICAgICAgICAgICAgOiBcInZhcigtLW1kYy10aGVtZS1zZWNvbmRhcnkpXCJcbiAgICAgICAgICAgIH1cbiAgICAgICAgfVxuICAgIH0pXG4pO1xuXG5pbnRlcmZhY2UgVmVydGljYWxQcm9wcyB7XG4gICAgZGVwdGg/OiBudW1iZXI7XG4gICAgb25Ecm9wKGl0ZW06IERyYWdTb3VyY2UpOiB2b2lkO1xuICAgIGxhc3Q/OiBib29sZWFuO1xuICAgIGlzVmlzaWJsZT86IGFueTtcbn1cblxuY29uc3QgVmVydGljYWwgPSAoeyBkZXB0aCwgbGFzdCwgb25Ecm9wLCBpc1Zpc2libGUgfTogVmVydGljYWxQcm9wcykgPT4ge1xuICAgIHJldHVybiAoXG4gICAgICAgIDxEcm9wcGFibGUgb25Ecm9wPXtvbkRyb3B9IGlzVmlzaWJsZT17aXNWaXNpYmxlfT5cbiAgICAgICAgICAgIHsoeyBpc092ZXIsIGlzRHJhZ2dpbmcsIGRyb3AgfSkgPT4gKFxuICAgICAgICAgICAgICAgIDxkaXZcbiAgICAgICAgICAgICAgICAgICAgcmVmPXtkcm9wfVxuICAgICAgICAgICAgICAgICAgICBzdHlsZT17e1xuICAgICAgICAgICAgICAgICAgICAgICAgLyogRm9yIGRyb3B6b25lIGRlYnVnZ2luZzogYm9yZGVyOiBcIjFweCBzb2xpZCBibHVlXCIsKi9cbiAgICAgICAgICAgICAgICAgICAgICAgIHdpZHRoOiBcIjMwJVwiLFxuICAgICAgICAgICAgICAgICAgICAgICAgbWF4V2lkdGg6IFwiMTAwcHhcIixcbiAgICAgICAgICAgICAgICAgICAgICAgIGhlaWdodDogXCIxMDAlXCIsXG4gICAgICAgICAgICAgICAgICAgICAgICBwb3NpdGlvbjogXCJhYnNvbHV0ZVwiLFxuICAgICAgICAgICAgICAgICAgICAgICAgdG9wOiAwLFxuICAgICAgICAgICAgICAgICAgICAgICAgW2xhc3QgPyBcInJpZ2h0XCIgOiBcImxlZnRcIl06IDAsXG4gICAgICAgICAgICAgICAgICAgICAgICB6SW5kZXg6IGlzRHJhZ2dpbmcgPyAxMDAwICsgKGRlcHRoIHx8IDApIDogLTFcbiAgICAgICAgICAgICAgICAgICAgfX1cbiAgICAgICAgICAgICAgICA+XG4gICAgICAgICAgICAgICAgICAgIDxPdXRlckRpdlZlcnRpY2FsIGlzT3Zlcj17aXNPdmVyfSBpc0RyYWdnaW5nPXtpc0RyYWdnaW5nfSBsYXN0PXtsYXN0fT5cbiAgICAgICAgICAgICAgICAgICAgICAgIDxJbm5lckRpdlZlcnRpY2FsPlxuICAgICAgICAgICAgICAgICAgICAgICAgICAgIDxCYWNrZ3JvdW5kQ29sb3JEaXYgLz5cbiAgICAgICAgICAgICAgICAgICAgICAgIDwvSW5uZXJEaXZWZXJ0aWNhbD5cbiAgICAgICAgICAgICAgICAgICAgPC9PdXRlckRpdlZlcnRpY2FsPlxuICAgICAgICAgICAgICAgIDwvZGl2PlxuICAgICAgICAgICAgKX1cbiAgICAgICAgPC9Ecm9wcGFibGU+XG4gICAgKTtcbn07XG5cbmV4cG9ydCBkZWZhdWx0IFZlcnRpY2FsO1xuIl19 */");
-var Vertical = function Vertical(_ref2) {
-  var depth = _ref2.depth,
-    last = _ref2.last,
-    onDrop = _ref2.onDrop,
-    isVisible = _ref2.isVisible;
-  return /*#__PURE__*/_react.default.createElement(_Droppable.Droppable, {
+import React from "react";
+import { Droppable } from "../Droppable";
+import { cn } from "@webiny/admin-ui";
+const OuterDivVertical = ({
+  isOver,
+  last,
+  isDragging
+}) => /*#__PURE__*/React.createElement("div", {
+  className: cn("wby-absolute wby-top-0 wby-h-full wby-w-[30%] wby-z-10 wby-bg-transparent", last ? "wby-text-right -wby-right-sm" : "wby-text-left -wby-left-sm")
+}, /*#__PURE__*/React.createElement("div", {
+  className: cn("wby-absolute wby-w-md wby-h-full wby-z-3 wby-border-dashed wby-border-sm wby-hidden", isOver ? "wby-border-accent-default" : "wby-border-success-default", last ? "-wby-right-sm" : "-wby-left-sm", isDragging && "wby-block")
+}, /*#__PURE__*/React.createElement("div", {
+  className: cn("wby-w-full wby-h-full wby-opacity-50", isOver ? "wby-bg-primary-muted" : "wby-bg-success-muted")
+})));
+const Vertical = ({
+  depth,
+  last,
+  onDrop,
+  isVisible
+}) => {
+  return /*#__PURE__*/React.createElement(Droppable, {
     onDrop: onDrop,
     isVisible: isVisible
-  }, function (_ref3) {
-    var isOver = _ref3.isOver,
-      isDragging = _ref3.isDragging,
-      drop = _ref3.drop;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      ref: drop,
-      style: (0, _defineProperty2.default)((0, _defineProperty2.default)({
-        /* For dropzone debugging: border: "1px solid blue",*/
-        width: "30%",
-        maxWidth: "100px",
-        height: "100%",
-        position: "absolute",
-        top: 0
-      }, last ? "right" : "left", 0), "zIndex", isDragging ? 1000 + (depth || 0) : -1)
-    }, /*#__PURE__*/_react.default.createElement(OuterDivVertical, {
-      isOver: isOver,
-      isDragging: isDragging,
-      last: last
-    }, /*#__PURE__*/_react.default.createElement(InnerDivVertical, null, /*#__PURE__*/_react.default.createElement(BackgroundColorDiv, null))));
-  });
+  }, ({
+    isOver,
+    isDragging,
+    drop
+  }) => /*#__PURE__*/React.createElement("div", {
+    ref: drop,
+    style: {
+      /* For dropzone debugging: border: "1px solid blue",*/
+      width: "30%",
+      maxWidth: "100px",
+      height: "100%",
+      position: "absolute",
+      top: 0,
+      [last ? "right" : "left"]: 0,
+      zIndex: isDragging ? 1000 + (depth || 0) : -1
+    }
+  }, /*#__PURE__*/React.createElement(OuterDivVertical, {
+    isOver: isOver,
+    isDragging: isDragging,
+    last: last
+  })));
 };
-var _default = exports.default = Vertical;
+export default Vertical;
 
 //# sourceMappingURL=Vertical.js.map

package/admin/components/DropZone/Vertical.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Droppable","_EMOTION_STRINGIFIED_CSS_ERROR__","InnerDivVertical","_base","default","process","env","NODE_ENV","target","label","name","styles","map","toString","BackgroundColorDiv","OuterDivVertical","props","_defineProperty2","last","borderColor","isOver","isDragging","opacity","backgroundColor","Vertical","_ref2","depth","onDrop","isVisible","createElement","Droppable","_ref3","drop","ref","style","width","maxWidth","height","position","top","_default","exports"],"sources":["Vertical.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/types\";\n\nconst InnerDivVertical = styled(\"div\")({\n    position: \"absolute\",\n    width: 10,\n    height: \"100%\",\n    zIndex: 3,\n    borderRadius: 0,\n    display: \"none\",\n    boxSizing: \"border-box\",\n    border: \"1px dashed black\",\n    borderSpacing: 5\n});\n\nconst BackgroundColorDiv = styled(\"div\")({\n    width: \"100%\",\n    height: \"100%\"\n});\n\ninterface OuterDivVerticalProps {\n    isOver: boolean;\n    last?: boolean;\n    isVisible?: IsVisibleCallable;\n    isDragging?: boolean;\n}\n\nconst OuterDivVertical = styled(\"div\")(\n    {\n        position: \"absolute\",\n        width: \"30%\",\n        top: 0,\n        height: \"100%\",\n        zIndex: 10,\n        backgroundColor: \"transparent\"\n    },\n    (props: OuterDivVerticalProps) => ({\n        [props.last ? \"right\" : \"left\"]: -9,\n        textAlign: props.last ? \"right\" : \"left\",\n        // @ts-expect-error\n        [InnerDivVertical]: {\n            borderColor: props.isOver ? \"var(--mdc-theme-primary)\" : \"var(--mdc-theme-secondary)\",\n            [props.last ? \"right\" : \"left\"]: -2,\n            display: props.isDragging ? \"block\" : \"none\",\n            // @ts-expect-error\n            [BackgroundColorDiv]: {\n                opacity: 0.5,\n                backgroundColor: props.isOver\n                    ? \"var(--mdc-theme-primary)\"\n                    : \"var(--mdc-theme-secondary)\"\n            }\n        }\n    })\n);\n\ninterface VerticalProps {\n    depth?: number;\n    onDrop(item: DragSource): void;\n    last?: boolean;\n    isVisible?: any;\n}\n\nconst Vertical = ({ depth, last, onDrop, isVisible }: VerticalProps) => {\n    return (\n        <Droppable onDrop={onDrop} isVisible={isVisible}>\n            {({ isOver, isDragging, drop }) => (\n                <div\n                    ref={drop}\n                    style={{\n                        /* For dropzone debugging: border: \"1px solid blue\",*/\n                        width: \"30%\",\n                        maxWidth: \"100px\",\n                        height: \"100%\",\n                        position: \"absolute\",\n                        top: 0,\n                        [last ? \"right\" : \"left\"]: 0,\n                        zIndex: isDragging ? 1000 + (depth || 0) : -1\n                    }}\n                >\n                    <OuterDivVertical isOver={isOver} isDragging={isDragging} last={last}>\n                        <InnerDivVertical>\n                            <BackgroundColorDiv />\n                        </InnerDivVertical>\n                    </OuterDivVertical>\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Vertical;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","Droppable","cn","OuterDivVertical","isOver","last","isDragging","createElement","className","Vertical","depth","onDrop","isVisible","drop","ref","style","width","maxWidth","height","position","top","zIndex"],"sources":["Vertical.tsx"],"sourcesContent":["import React from \"react\";\nimport type { IsVisibleCallable } from \"../Droppable\";\nimport { Droppable } from \"../Droppable\";\nimport type { DragSource } from \"~/types\";\nimport { cn } from \"@webiny/admin-ui\";\n\ninterface OuterDivVerticalProps {\n    isOver: boolean;\n    last?: boolean;\n    isDragging?: boolean;\n}\n\nconst OuterDivVertical = ({ isOver, last, isDragging }: OuterDivVerticalProps) => (\n    <div\n        className={cn(\n            \"wby-absolute wby-top-0 wby-h-full wby-w-[30%] wby-z-10 wby-bg-transparent\",\n            last ? \"wby-text-right -wby-right-sm\" : \"wby-text-left -wby-left-sm\"\n        )}\n    >\n        <div\n            className={cn(\n                \"wby-absolute wby-w-md wby-h-full wby-z-3 wby-border-dashed wby-border-sm wby-hidden\",\n                isOver ? \"wby-border-accent-default\" : \"wby-border-success-default\",\n                last ? \"-wby-right-sm\" : \"-wby-left-sm\",\n                isDragging && \"wby-block\"\n            )}\n        >\n            <div\n                className={cn(\n                    \"wby-w-full wby-h-full wby-opacity-50\",\n                    isOver ? \"wby-bg-primary-muted\" : \"wby-bg-success-muted\"\n                )}\n            />\n        </div>\n    </div>\n);\n\ninterface VerticalProps {\n    depth?: number;\n    onDrop(item: DragSource): void;\n    last?: boolean;\n    isVisible?: IsVisibleCallable;\n}\n\nconst Vertical = ({ depth, last, onDrop, isVisible }: VerticalProps) => {\n    return (\n        <Droppable onDrop={onDrop} isVisible={isVisible}>\n            {({ isOver, isDragging, drop }) => (\n                <div\n                    ref={drop}\n                    style={{\n                        /* For dropzone debugging: border: \"1px solid blue\",*/\n                        width: \"30%\",\n                        maxWidth: \"100px\",\n                        height: \"100%\",\n                        position: \"absolute\",\n                        top: 0,\n                        [last ? \"right\" : \"left\"]: 0,\n                        zIndex: isDragging ? 1000 + (depth || 0) : -1\n                    }}\n                >\n                    <OuterDivVertical isOver={isOver} isDragging={isDragging} last={last} />\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Vertical;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,SAAS;AAElB,SAASC,EAAE,QAAQ,kBAAkB;AAQrC,MAAMC,gBAAgB,GAAGA,CAAC;EAAEC,MAAM;EAAEC,IAAI;EAAEC;AAAkC,CAAC,kBACzEN,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,2EAA2E,EAC3EG,IAAI,GAAG,8BAA8B,GAAG,4BAC5C;AAAE,gBAEFL,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,qFAAqF,EACrFE,MAAM,GAAG,2BAA2B,GAAG,4BAA4B,EACnEC,IAAI,GAAG,eAAe,GAAG,cAAc,EACvCC,UAAU,IAAI,WAClB;AAAE,gBAEFN,KAAA,CAAAO,aAAA;EACIC,SAAS,EAAEN,EAAE,CACT,sCAAsC,EACtCE,MAAM,GAAG,sBAAsB,GAAG,sBACtC;AAAE,CACL,CACA,CACJ,CACR;AASD,MAAMK,QAAQ,GAAGA,CAAC;EAAEC,KAAK;EAAEL,IAAI;EAAEM,MAAM;EAAEC;AAAyB,CAAC,KAAK;EACpE,oBACIZ,KAAA,CAAAO,aAAA,CAACN,SAAS;IAACU,MAAM,EAAEA,MAAO;IAACC,SAAS,EAAEA;EAAU,GAC3C,CAAC;IAAER,MAAM;IAAEE,UAAU;IAAEO;EAAK,CAAC,kBAC1Bb,KAAA,CAAAO,aAAA;IACIO,GAAG,EAAED,IAAK;IACVE,KAAK,EAAE;MACH;MACAC,KAAK,EAAE,KAAK;MACZC,QAAQ,EAAE,OAAO;MACjBC,MAAM,EAAE,MAAM;MACdC,QAAQ,EAAE,UAAU;MACpBC,GAAG,EAAE,CAAC;MACN,CAACf,IAAI,GAAG,OAAO,GAAG,MAAM,GAAG,CAAC;MAC5BgB,MAAM,EAAEf,UAAU,GAAG,IAAI,IAAII,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC;IAChD;EAAE,gBAEFV,KAAA,CAAAO,aAAA,CAACJ,gBAAgB;IAACC,MAAM,EAAEA,MAAO;IAACE,UAAU,EAAEA,UAAW;IAACD,IAAI,EAAEA;EAAK,CAAE,CACtE,CAEF,CAAC;AAEpB,CAAC;AAED,eAAeI,QAAQ","ignoreList":[]}

package/admin/components/DropZone/index.js

@@ -1,29 +1,6 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Center", {
-  enumerable: true,
-  get: function get() {
-    return _Center.default;
-  }
-});
-Object.defineProperty(exports, "Horizontal", {
-  enumerable: true,
-  get: function get() {
-    return _Horizontal.default;
-  }
-});
-Object.defineProperty(exports, "Vertical", {
-  enumerable: true,
-  get: function get() {
-    return _Vertical.default;
-  }
-});
-var _Center = _interopRequireDefault(require("./Center"));
-var _Horizontal = _interopRequireDefault(require("./Horizontal"));
-var _Vertical = _interopRequireDefault(require("./Vertical"));
+import Center from "./Center";
+import Horizontal from "./Horizontal";
+import Vertical from "./Vertical";
+export { Center, Horizontal, Vertical };
 
 //# sourceMappingURL=index.js.map

package/admin/components/DropZone/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["_Center","_interopRequireDefault","require","_Horizontal","_Vertical"],"sources":["index.ts"],"sourcesContent":["import Center from \"./Center\";\nimport Horizontal from \"./Horizontal\";\nimport Vertical from \"./Vertical\";\n\nexport { Center, Horizontal, Vertical };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,OAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,SAAA,GAAAH,sBAAA,CAAAC,OAAA","ignoreList":[]}
+{"version":3,"names":["Center","Horizontal","Vertical"],"sources":["index.ts"],"sourcesContent":["import Center from \"./Center\";\nimport Horizontal from \"./Horizontal\";\nimport Vertical from \"./Vertical\";\n\nexport { Center, Horizontal, Vertical };\n"],"mappings":"AAAA,OAAOA,MAAM;AACb,OAAOC,UAAU;AACjB,OAAOC,QAAQ;AAEf,SAASF,MAAM,EAAEC,UAAU,EAAEC,QAAQ","ignoreList":[]}

package/admin/components/Droppable.d.ts

@@ -1,6 +1,6 @@
 import * as React from "react";
-import { ConnectDropTarget } from "react-dnd";
-import { DragSource } from "../../types";
+import type { ConnectDropTarget } from "react-dnd";
+import type { DragSource } from "../../types";
 export interface DroppableChildrenFunctionParams {
     isDragging: boolean;
     isDroppable: boolean;

package/admin/components/Droppable.js

@@ -1,60 +1,46 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.Droppable = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-var React = _interopRequireWildcard(require("react"));
-var _reactDnd = require("react-dnd");
-var DroppableComponent = function DroppableComponent(props) {
-  var children = props.children,
-    onDrop = props.onDrop,
-    _props$isVisible = props.isVisible,
-    isVisible = _props$isVisible === void 0 ? function () {
-      return true;
-    } : _props$isVisible;
-  var _useDrop = (0, _reactDnd.useDrop)({
-      accept: "element",
-      collect: function collect(monitor) {
-        return {
-          isOver: monitor.isOver() && monitor.isOver({
-            shallow: true
-          }),
-          item: monitor.getItem()
-        };
-      },
-      drop: function drop(item, monitor) {
-        if (typeof props.isDroppable === "function" && !props.isDroppable(item)) {
-          return;
-        }
-        if (typeof onDrop === "function") {
-          return onDrop(monitor.getItem());
-        }
-      }
+import * as React from "react";
+import { useDrop } from "react-dnd";
+const DroppableComponent = props => {
+  const {
+    children,
+    onDrop,
+    isVisible = () => true
+  } = props;
+  const [{
+    item,
+    isOver
+  }, drop] = useDrop({
+    accept: "element",
+    collect: monitor => ({
+      isOver: monitor.isOver() && monitor.isOver({
+        shallow: true
+      }),
+      item: monitor.getItem()
     }),
-    _useDrop2 = (0, _slicedToArray2.default)(_useDrop, 2),
-    _useDrop2$ = _useDrop2[0],
-    item = _useDrop2$.item,
-    isOver = _useDrop2$.isOver,
-    drop = _useDrop2[1];
+    drop(item, monitor) {
+      if (typeof props.isDroppable === "function" && !props.isDroppable(item)) {
+        return;
+      }
+      if (typeof onDrop === "function") {
+        return onDrop(monitor.getItem());
+      }
+    }
+  });
   if (item && !isVisible(item)) {
     return null;
   }
-  var isDroppable = true;
+  let isDroppable = true;
   if (item) {
     isDroppable = props.isDroppable ? props.isDroppable(item) : isOver;
   }
   return children({
     isDragging: Boolean(item),
-    isOver: isOver,
-    isDroppable: isDroppable,
-    item: item,
-    drop: drop
+    isOver,
+    isDroppable,
+    item,
+    drop
   });
 };
-var Droppable = exports.Droppable = /*#__PURE__*/React.memo(DroppableComponent);
+export const Droppable = /*#__PURE__*/React.memo(DroppableComponent);
 
 //# sourceMappingURL=Droppable.js.map

package/admin/components/Droppable.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","_interopRequireWildcard","require","_reactDnd","DroppableComponent","props","children","onDrop","_props$isVisible","isVisible","_useDrop","useDrop","accept","collect","monitor","isOver","shallow","item","getItem","drop","isDroppable","_useDrop2","_slicedToArray2","default","_useDrop2$","isDragging","Boolean","Droppable","exports","memo"],"sources":["Droppable.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ConnectDropTarget, useDrop } from \"react-dnd\";\nimport { DragSource } from \"~/types\";\n\nexport interface DroppableChildrenFunctionParams {\n    isDragging: boolean;\n    isDroppable: boolean;\n    isOver: boolean;\n    item: any;\n    drop: ConnectDropTarget;\n}\nexport interface DroppableChildrenFunction {\n    (params: DroppableChildrenFunctionParams): React.ReactElement;\n}\n\ninterface IsVisibleParams {\n    type: \"row\" | \"field\" | \"newField\";\n    item: DragSource;\n    isDragging: boolean;\n}\nexport interface IsVisibleCallable {\n    (params: IsVisibleParams): boolean;\n}\nexport interface OnDropCallable {\n    (item: DragSource): void;\n}\nexport interface DroppableProps {\n    type?: string;\n    children: DroppableChildrenFunction;\n    isDragging?: boolean;\n    isDroppable?: (item: DragSource) => boolean;\n    isVisible?: IsVisibleCallable;\n    onDrop?: OnDropCallable;\n}\n\nexport type DragObject = {\n    item: IsVisibleParams;\n    isOver: boolean;\n};\n\nconst DroppableComponent = (props: DroppableProps) => {\n    const { children, onDrop, isVisible = () => true } = props;\n\n    const [{ item, isOver }, drop] = useDrop<DragSource, void, DragObject>({\n        accept: \"element\",\n        collect: monitor => ({\n            isOver: monitor.isOver() && monitor.isOver({ shallow: true }),\n            item: monitor.getItem()\n        }),\n        drop(item, monitor) {\n            if (typeof props.isDroppable === \"function\" && !props.isDroppable(item)) {\n                return;\n            }\n\n            if (typeof onDrop === \"function\") {\n                return onDrop(monitor.getItem());\n            }\n        }\n    });\n\n    if (item && !isVisible(item)) {\n        return null;\n    }\n\n    let isDroppable = true;\n    if (item) {\n        isDroppable = props.isDroppable ? props.isDroppable(item) : isOver;\n    }\n\n    return children({ isDragging: Boolean(item), isOver, isDroppable, item, drop });\n};\n\nexport const Droppable: React.ComponentType<DroppableProps> = React.memo(DroppableComponent);\n"],"mappings":";;;;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,SAAA,GAAAD,OAAA;AAuCA,IAAME,kBAAkB,GAAG,SAArBA,kBAAkBA,CAAIC,KAAqB,EAAK;EAClD,IAAQC,QAAQ,GAAqCD,KAAK,CAAlDC,QAAQ;IAAEC,MAAM,GAA6BF,KAAK,CAAxCE,MAAM;IAAAC,gBAAA,GAA6BH,KAAK,CAAhCI,SAAS;IAATA,SAAS,GAAAD,gBAAA,cAAG;MAAA,OAAM,IAAI;IAAA,IAAAA,gBAAA;EAEhD,IAAAE,QAAA,GAAiC,IAAAC,iBAAO,EAA+B;MACnEC,MAAM,EAAE,SAAS;MACjBC,OAAO,EAAE,SAATA,OAAOA,CAAEC,OAAO;QAAA,OAAK;UACjBC,MAAM,EAAED,OAAO,CAACC,MAAM,CAAC,CAAC,IAAID,OAAO,CAACC,MAAM,CAAC;YAAEC,OAAO,EAAE;UAAK,CAAC,CAAC;UAC7DC,IAAI,EAAEH,OAAO,CAACI,OAAO,CAAC;QAC1B,CAAC;MAAA,CAAC;MACFC,IAAI,WAAJA,IAAIA,CAACF,IAAI,EAAEH,OAAO,EAAE;QAChB,IAAI,OAAOT,KAAK,CAACe,WAAW,KAAK,UAAU,IAAI,CAACf,KAAK,CAACe,WAAW,CAACH,IAAI,CAAC,EAAE;UACrE;QACJ;QAEA,IAAI,OAAOV,MAAM,KAAK,UAAU,EAAE;UAC9B,OAAOA,MAAM,CAACO,OAAO,CAACI,OAAO,CAAC,CAAC,CAAC;QACpC;MACJ;IACJ,CAAC,CAAC;IAAAG,SAAA,OAAAC,eAAA,CAAAC,OAAA,EAAAb,QAAA;IAAAc,UAAA,GAAAH,SAAA;IAfOJ,IAAI,GAAAO,UAAA,CAAJP,IAAI;IAAEF,MAAM,GAAAS,UAAA,CAANT,MAAM;IAAII,IAAI,GAAAE,SAAA;EAiB7B,IAAIJ,IAAI,IAAI,CAACR,SAAS,CAACQ,IAAI,CAAC,EAAE;IAC1B,OAAO,IAAI;EACf;EAEA,IAAIG,WAAW,GAAG,IAAI;EACtB,IAAIH,IAAI,EAAE;IACNG,WAAW,GAAGf,KAAK,CAACe,WAAW,GAAGf,KAAK,CAACe,WAAW,CAACH,IAAI,CAAC,GAAGF,MAAM;EACtE;EAEA,OAAOT,QAAQ,CAAC;IAAEmB,UAAU,EAAEC,OAAO,CAACT,IAAI,CAAC;IAAEF,MAAM,EAANA,MAAM;IAAEK,WAAW,EAAXA,WAAW;IAAEH,IAAI,EAAJA,IAAI;IAAEE,IAAI,EAAJA;EAAK,CAAC,CAAC;AACnF,CAAC;AAEM,IAAMQ,SAA8C,GAAAC,OAAA,CAAAD,SAAA,gBAAG3B,KAAK,CAAC6B,IAAI,CAACzB,kBAAkB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useDrop","DroppableComponent","props","children","onDrop","isVisible","item","isOver","drop","accept","collect","monitor","shallow","getItem","isDroppable","isDragging","Boolean","Droppable","memo"],"sources":["Droppable.tsx"],"sourcesContent":["import * as React from \"react\";\nimport type { ConnectDropTarget } from \"react-dnd\";\nimport { useDrop } from \"react-dnd\";\nimport type { DragSource } from \"~/types\";\n\nexport interface DroppableChildrenFunctionParams {\n    isDragging: boolean;\n    isDroppable: boolean;\n    isOver: boolean;\n    item: any;\n    drop: ConnectDropTarget;\n}\nexport interface DroppableChildrenFunction {\n    (params: DroppableChildrenFunctionParams): React.ReactElement;\n}\n\ninterface IsVisibleParams {\n    type: \"row\" | \"field\" | \"newField\";\n    item: DragSource;\n    isDragging: boolean;\n}\nexport interface IsVisibleCallable {\n    (params: IsVisibleParams): boolean;\n}\nexport interface OnDropCallable {\n    (item: DragSource): void;\n}\nexport interface DroppableProps {\n    type?: string;\n    children: DroppableChildrenFunction;\n    isDragging?: boolean;\n    isDroppable?: (item: DragSource) => boolean;\n    isVisible?: IsVisibleCallable;\n    onDrop?: OnDropCallable;\n}\n\nexport type DragObject = {\n    item: IsVisibleParams;\n    isOver: boolean;\n};\n\nconst DroppableComponent = (props: DroppableProps) => {\n    const { children, onDrop, isVisible = () => true } = props;\n\n    const [{ item, isOver }, drop] = useDrop<DragSource, void, DragObject>({\n        accept: \"element\",\n        collect: monitor => ({\n            isOver: monitor.isOver() && monitor.isOver({ shallow: true }),\n            item: monitor.getItem()\n        }),\n        drop(item, monitor) {\n            if (typeof props.isDroppable === \"function\" && !props.isDroppable(item)) {\n                return;\n            }\n\n            if (typeof onDrop === \"function\") {\n                return onDrop(monitor.getItem());\n            }\n        }\n    });\n\n    if (item && !isVisible(item)) {\n        return null;\n    }\n\n    let isDroppable = true;\n    if (item) {\n        isDroppable = props.isDroppable ? props.isDroppable(item) : isOver;\n    }\n\n    return children({ isDragging: Boolean(item), isOver, isDroppable, item, drop });\n};\n\nexport const Droppable: React.ComponentType<DroppableProps> = React.memo(DroppableComponent);\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,SAASC,OAAO,QAAQ,WAAW;AAuCnC,MAAMC,kBAAkB,GAAIC,KAAqB,IAAK;EAClD,MAAM;IAAEC,QAAQ;IAAEC,MAAM;IAAEC,SAAS,GAAGA,CAAA,KAAM;EAAK,CAAC,GAAGH,KAAK;EAE1D,MAAM,CAAC;IAAEI,IAAI;IAAEC;EAAO,CAAC,EAAEC,IAAI,CAAC,GAAGR,OAAO,CAA+B;IACnES,MAAM,EAAE,SAAS;IACjBC,OAAO,EAAEC,OAAO,KAAK;MACjBJ,MAAM,EAAEI,OAAO,CAACJ,MAAM,CAAC,CAAC,IAAII,OAAO,CAACJ,MAAM,CAAC;QAAEK,OAAO,EAAE;MAAK,CAAC,CAAC;MAC7DN,IAAI,EAAEK,OAAO,CAACE,OAAO,CAAC;IAC1B,CAAC,CAAC;IACFL,IAAIA,CAACF,IAAI,EAAEK,OAAO,EAAE;MAChB,IAAI,OAAOT,KAAK,CAACY,WAAW,KAAK,UAAU,IAAI,CAACZ,KAAK,CAACY,WAAW,CAACR,IAAI,CAAC,EAAE;QACrE;MACJ;MAEA,IAAI,OAAOF,MAAM,KAAK,UAAU,EAAE;QAC9B,OAAOA,MAAM,CAACO,OAAO,CAACE,OAAO,CAAC,CAAC,CAAC;MACpC;IACJ;EACJ,CAAC,CAAC;EAEF,IAAIP,IAAI,IAAI,CAACD,SAAS,CAACC,IAAI,CAAC,EAAE;IAC1B,OAAO,IAAI;EACf;EAEA,IAAIQ,WAAW,GAAG,IAAI;EACtB,IAAIR,IAAI,EAAE;IACNQ,WAAW,GAAGZ,KAAK,CAACY,WAAW,GAAGZ,KAAK,CAACY,WAAW,CAACR,IAAI,CAAC,GAAGC,MAAM;EACtE;EAEA,OAAOJ,QAAQ,CAAC;IAAEY,UAAU,EAAEC,OAAO,CAACV,IAAI,CAAC;IAAEC,MAAM;IAAEO,WAAW;IAAER,IAAI;IAAEE;EAAK,CAAC,CAAC;AACnF,CAAC;AAED,OAAO,MAAMS,SAA8C,gBAAGlB,KAAK,CAACmB,IAAI,CAACjB,kBAAkB,CAAC","ignoreList":[]}

package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab/LegacyRichTextInput.js

@@ -1,17 +1,10 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.LegacyRichTextInput = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _Alert = require("@webiny/ui/Alert");
-var LegacyRichTextInput = exports.LegacyRichTextInput = function LegacyRichTextInput() {
-  return /*#__PURE__*/_react.default.createElement(_Alert.Alert, {
+import React from "react";
+import { Alert } from "@webiny/ui/Alert";
+export const LegacyRichTextInput = () => {
+  return /*#__PURE__*/React.createElement(Alert, {
     title: "You have legacy editor enabled",
     type: "info"
-  }, "Your project has been upgraded from an older Webiny version, with EditorJS as the default rich text editor. We recommend switching to the new Lexical rich text editor, where possible.", /*#__PURE__*/_react.default.createElement("br", null), /*#__PURE__*/_react.default.createElement("br", null), "Read more about this in our", " ", /*#__PURE__*/_react.default.createElement("a", {
+  }, "Your project has been upgraded from an older Webiny version, with EditorJS as the default rich text editor. We recommend switching to the new Lexical rich text editor, where possible.", /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), "Read more about this in our", " ", /*#__PURE__*/React.createElement("a", {
     href: "https://webiny.link/hcms-legacy-rte-support",
     rel: "noreferrer",
     target: "_blank"

package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab/LegacyRichTextInput.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_Alert","LegacyRichTextInput","exports","default","createElement","Alert","title","type","href","rel","target"],"sources":["LegacyRichTextInput.tsx"],"sourcesContent":["import React from \"react\";\nimport { Alert } from \"@webiny/ui/Alert\";\n\nexport const LegacyRichTextInput = () => {\n    return (\n        <Alert title={\"You have legacy editor enabled\"} type={\"info\"}>\n            Your project has been upgraded from an older Webiny version, with EditorJS as the\n            default rich text editor. We recommend switching to the new Lexical rich text editor,\n            where possible.\n            <br />\n            <br />\n            Read more about this in our{\" \"}\n            <a\n                href={\"https://webiny.link/hcms-legacy-rte-support\"}\n                rel=\"noreferrer\"\n                target={\"_blank\"}\n            >\n                upgrade guide\n            </a>\n            .\n        </Alert>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAEO,IAAME,mBAAmB,GAAAC,OAAA,CAAAD,mBAAA,GAAG,SAAtBA,mBAAmBA,CAAA,EAAS;EACrC,oBACIJ,MAAA,CAAAM,OAAA,CAAAC,aAAA,CAACJ,MAAA,CAAAK,KAAK;IAACC,KAAK,EAAE,gCAAiC;IAACC,IAAI,EAAE;EAAO,GAAC,yLAI1D,eAAAV,MAAA,CAAAM,OAAA,CAAAC,aAAA,WAAK,CAAC,eACNP,MAAA,CAAAM,OAAA,CAAAC,aAAA,WAAK,CAAC,+BACqB,EAAC,GAAG,eAC/BP,MAAA,CAAAM,OAAA,CAAAC,aAAA;IACII,IAAI,EAAE,6CAA8C;IACpDC,GAAG,EAAC,YAAY;IAChBC,MAAM,EAAE;EAAS,GACpB,eAEE,CAAC,KAED,CAAC;AAEhB,CAAC","ignoreList":[]}
+{"version":3,"names":["React","Alert","LegacyRichTextInput","createElement","title","type","href","rel","target"],"sources":["LegacyRichTextInput.tsx"],"sourcesContent":["import React from \"react\";\nimport { Alert } from \"@webiny/ui/Alert\";\n\nexport const LegacyRichTextInput = () => {\n    return (\n        <Alert title={\"You have legacy editor enabled\"} type={\"info\"}>\n            Your project has been upgraded from an older Webiny version, with EditorJS as the\n            default rich text editor. We recommend switching to the new Lexical rich text editor,\n            where possible.\n            <br />\n            <br />\n            Read more about this in our{\" \"}\n            <a\n                href={\"https://webiny.link/hcms-legacy-rte-support\"}\n                rel=\"noreferrer\"\n                target={\"_blank\"}\n            >\n                upgrade guide\n            </a>\n            .\n        </Alert>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,KAAK,QAAQ,kBAAkB;AAExC,OAAO,MAAMC,mBAAmB,GAAGA,CAAA,KAAM;EACrC,oBACIF,KAAA,CAAAG,aAAA,CAACF,KAAK;IAACG,KAAK,EAAE,gCAAiC;IAACC,IAAI,EAAE;EAAO,GAAC,yLAI1D,eAAAL,KAAA,CAAAG,aAAA,WAAK,CAAC,eACNH,KAAA,CAAAG,aAAA,WAAK,CAAC,+BACqB,EAAC,GAAG,eAC/BH,KAAA,CAAAG,aAAA;IACIG,IAAI,EAAE,6CAA8C;IACpDC,GAAG,EAAC,YAAY;IAChBC,MAAM,EAAE;EAAS,GACpB,eAEE,CAAC,KAED,CAAC;AAEhB,CAAC","ignoreList":[]}

package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab/RendererOptions.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
-import { CmsModelFieldRendererPlugin } from "@webiny/app-headless-cms-common/types";
+import type { CmsModelFieldRendererPlugin } from "@webiny/app-headless-cms-common/types";
 interface RendererOptionsProps {
     plugin: CmsModelFieldRendererPlugin | undefined;
 }

package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab/RendererOptions.js

@@ -1,29 +1,28 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.RendererOptions = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _ModelFieldProvider = require("../../../ModelFieldProvider");
-var _Grid = require("@webiny/ui/Grid");
-var RendererOptions = exports.RendererOptions = function RendererOptions(_ref) {
-  var plugin = _ref.plugin;
-  var _useModelField = (0, _ModelFieldProvider.useModelField)(),
-    field = _useModelField.field;
+import React from "react";
+import { useModelField } from "../../../ModelFieldProvider";
+import { Grid, Heading, Text } from "@webiny/admin-ui";
+export const RendererOptions = ({
+  plugin
+}) => {
+  const {
+    field
+  } = useModelField();
   if (!plugin || !plugin.renderer.renderSettings) {
     return null;
   }
-  var settings = plugin.renderer.renderSettings({
-    field: field
+  const settings = plugin.renderer.renderSettings({
+    field
   });
   if (!settings) {
     return null;
   }
-  return /*#__PURE__*/_react.default.createElement(_Grid.Grid, null, /*#__PURE__*/_react.default.createElement(_Grid.Cell, {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Grid.Column, {
     span: 12
-  }, "Renderer Settings:"), settings);
+  }, /*#__PURE__*/React.createElement(Heading, {
+    level: 5
+  }, "Renderer settings"), /*#__PURE__*/React.createElement(Text, {
+    size: "sm"
+  }, "Configure additional settings for the selected field renderer.")), settings);
 };
 
 //# sourceMappingURL=RendererOptions.js.map

package/admin/components/FieldEditor/EditFieldDialog/AppearanceTab/RendererOptions.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_ModelFieldProvider","_Grid","RendererOptions","exports","_ref","plugin","_useModelField","useModelField","field","renderer","renderSettings","settings","default","createElement","Grid","Cell","span"],"sources":["RendererOptions.tsx"],"sourcesContent":["import React from \"react\";\nimport { CmsModelFieldRendererPlugin } from \"@webiny/app-headless-cms-common/types\";\nimport { useModelField } from \"~/admin/components/ModelFieldProvider\";\nimport { Cell, Grid } from \"@webiny/ui/Grid\";\n\ninterface RendererOptionsProps {\n    plugin: CmsModelFieldRendererPlugin | undefined;\n}\n\nexport const RendererOptions = ({ plugin }: RendererOptionsProps) => {\n    const { field } = useModelField();\n    if (!plugin || !plugin.renderer.renderSettings) {\n        return null;\n    }\n\n    const settings = plugin.renderer.renderSettings({ field });\n\n    if (!settings) {\n        return null;\n    }\n\n    return (\n        <Grid>\n            <Cell span={12}>Renderer Settings:</Cell>\n            {settings}\n        </Grid>\n    );\n};\n"],"mappings":";;;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,mBAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAF,OAAA;AAMO,IAAMG,eAAe,GAAAC,OAAA,CAAAD,eAAA,GAAG,SAAlBA,eAAeA,CAAAE,IAAA,EAAyC;EAAA,IAAnCC,MAAM,GAAAD,IAAA,CAANC,MAAM;EACpC,IAAAC,cAAA,GAAkB,IAAAC,iCAAa,EAAC,CAAC;IAAzBC,KAAK,GAAAF,cAAA,CAALE,KAAK;EACb,IAAI,CAACH,MAAM,IAAI,CAACA,MAAM,CAACI,QAAQ,CAACC,cAAc,EAAE;IAC5C,OAAO,IAAI;EACf;EAEA,IAAMC,QAAQ,GAAGN,MAAM,CAACI,QAAQ,CAACC,cAAc,CAAC;IAAEF,KAAK,EAALA;EAAM,CAAC,CAAC;EAE1D,IAAI,CAACG,QAAQ,EAAE;IACX,OAAO,IAAI;EACf;EAEA,oBACId,MAAA,CAAAe,OAAA,CAAAC,aAAA,CAACZ,KAAA,CAAAa,IAAI,qBACDjB,MAAA,CAAAe,OAAA,CAAAC,aAAA,CAACZ,KAAA,CAAAc,IAAI;IAACC,IAAI,EAAE;EAAG,GAAC,oBAAwB,CAAC,EACxCL,QACC,CAAC;AAEf,CAAC","ignoreList":[]}
+{"version":3,"names":["React","useModelField","Grid","Heading","Text","RendererOptions","plugin","field","renderer","renderSettings","settings","createElement","Fragment","Column","span","level","size"],"sources":["RendererOptions.tsx"],"sourcesContent":["import React from \"react\";\nimport type { CmsModelFieldRendererPlugin } from \"@webiny/app-headless-cms-common/types\";\nimport { useModelField } from \"~/admin/components/ModelFieldProvider\";\nimport { Grid, Heading, Text } from \"@webiny/admin-ui\";\n\ninterface RendererOptionsProps {\n    plugin: CmsModelFieldRendererPlugin | undefined;\n}\n\nexport const RendererOptions = ({ plugin }: RendererOptionsProps) => {\n    const { field } = useModelField();\n    if (!plugin || !plugin.renderer.renderSettings) {\n        return null;\n    }\n\n    const settings = plugin.renderer.renderSettings({ field });\n\n    if (!settings) {\n        return null;\n    }\n\n    return (\n        <>\n            <Grid.Column span={12}>\n                <Heading level={5}>Renderer settings</Heading>\n                <Text size={\"sm\"}>\n                    Configure additional settings for the selected field renderer.\n                </Text>\n            </Grid.Column>\n            {settings}\n        </>\n    );\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,aAAa;AACtB,SAASC,IAAI,EAAEC,OAAO,EAAEC,IAAI,QAAQ,kBAAkB;AAMtD,OAAO,MAAMC,eAAe,GAAGA,CAAC;EAAEC;AAA6B,CAAC,KAAK;EACjE,MAAM;IAAEC;EAAM,CAAC,GAAGN,aAAa,CAAC,CAAC;EACjC,IAAI,CAACK,MAAM,IAAI,CAACA,MAAM,CAACE,QAAQ,CAACC,cAAc,EAAE;IAC5C,OAAO,IAAI;EACf;EAEA,MAAMC,QAAQ,GAAGJ,MAAM,CAACE,QAAQ,CAACC,cAAc,CAAC;IAAEF;EAAM,CAAC,CAAC;EAE1D,IAAI,CAACG,QAAQ,EAAE;IACX,OAAO,IAAI;EACf;EAEA,oBACIV,KAAA,CAAAW,aAAA,CAAAX,KAAA,CAAAY,QAAA,qBACIZ,KAAA,CAAAW,aAAA,CAACT,IAAI,CAACW,MAAM;IAACC,IAAI,EAAE;EAAG,gBAClBd,KAAA,CAAAW,aAAA,CAACR,OAAO;IAACY,KAAK,EAAE;EAAE,GAAC,mBAA0B,CAAC,eAC9Cf,KAAA,CAAAW,aAAA,CAACP,IAAI;IAACY,IAAI,EAAE;EAAK,GAAC,gEAEZ,CACG,CAAC,EACbN,QACH,CAAC;AAEX,CAAC","ignoreList":[]}