@webiny/app-headless-cms 5.34.8 → 5.35.0-beta.0

package/admin/components/Dialog.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -9,11 +8,8 @@ var _exportNames = {
   Dialog: true
 };
 exports.Dialog = void 0;
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _Dialog = require("@webiny/ui/Dialog");
-
 Object.keys(_Dialog).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
   if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
@@ -28,5 +24,5 @@ Object.keys(_Dialog).forEach(function (key) {
 var Dialog = /*#__PURE__*/(0, _styled.default)(_Dialog.Dialog, {
   label: "Dialog",
   target: "e1q5k1p00"
-})(".mdc-dialog__surface{width:600px;min-width:600px;overflow:initial;}.mdc-dialog__content{overflow:initial !important;.mdc-list:first-of-type{padding:0;}}");
+})(".mdc-dialog__surface{width:600px;min-width:600px;overflow:initial;}.mdc-dialog__content{overflow:auto;.mdc-list:first-of-type{padding:0;}}");
 exports.Dialog = Dialog;

package/admin/components/Dialog.js.map

@@ -1 +1 @@
-{"version":3,"names":["Dialog","styled","BaseDialog"],"sources":["Dialog.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { Dialog as BaseDialog } from \"@webiny/ui/Dialog\";\nexport * from \"@webiny/ui/Dialog\";\n\nexport const Dialog = styled(BaseDialog)`\n    .mdc-dialog__surface {\n        width: 600px;\n        min-width: 600px;\n        overflow: initial;\n    }\n\n    .mdc-dialog__content {\n        overflow: initial !important;\n        .mdc-list:first-of-type {\n            padding: 0;\n        }\n    }\n`;\n"],"mappings":";;;;;;;;;;;;AAAA;;AACA;;AACA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AAEO,IAAMA,MAAM,oBAAGC,eAAH,EAAUC,cAAV;EAAA;EAAA;AAAA,8JAAZ"}
+{"version":3,"names":["Dialog","styled","BaseDialog"],"sources":["Dialog.tsx"],"sourcesContent":["import styled from \"@emotion/styled\";\nimport { Dialog as BaseDialog } from \"@webiny/ui/Dialog\";\nexport * from \"@webiny/ui/Dialog\";\n\nexport const Dialog = styled(BaseDialog)`\n    .mdc-dialog__surface {\n        width: 600px;\n        min-width: 600px;\n        overflow: initial;\n    }\n\n    .mdc-dialog__content {\n        overflow: auto;\n        .mdc-list:first-of-type {\n            padding: 0;\n        }\n    }\n`;\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;AAEO,IAAMA,MAAM,oBAAGC,eAAM,EAACC,cAAU;EAAA;EAAA;AAAA,gJAatC;AAAC"}

package/admin/components/DragPreview.js

@@ -1,74 +1,60 @@
 "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.default = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _reactDnd = require("react-dnd");
-
 var subscribedToOffsetChange = false;
 var dragPreviewRef = null;
-
 var onOffsetChange = function onOffsetChange(monitor) {
   return function () {
     if (!dragPreviewRef) {
       return;
     }
-
     var offset = monitor.getClientOffset();
-
     if (!offset) {
       return;
     }
-
     var transform = "translate(".concat(offset.x - 15, "px, ").concat(offset.y - 15, "px)");
-    dragPreviewRef.style["transform"] = transform; // TODO @ts-refactor figure out better type
-
+    dragPreviewRef.style["transform"] = transform;
+    // TODO @ts-refactor figure out better type
     dragPreviewRef.style["-webkit-transform"] = transform;
   };
 };
-
 var DragPreview = function DragPreview() {
   var _useState = (0, _react.useState)(0),
-      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-      dragHelperOpacity = _useState2[0],
-      setDragHelperOpacity = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
+    dragHelperOpacity = _useState2[0],
+    setDragHelperOpacity = _useState2[1];
   var _useDragLayer = (0, _reactDnd.useDragLayer)(function (initialMonitor) {
-    /**
-     * We must cast because TS is complaining. We know that casting as DragSourceMonitorImpl is ok.
-     */
-    var monitor = initialMonitor;
-
-    if (!subscribedToOffsetChange) {
-      monitor.subscribeToOffsetChange(onOffsetChange(monitor));
-      subscribedToOffsetChange = true;
-    }
-
-    return {
-      isDragging: monitor.isDragging()
-    };
-  }),
-      isDragging = _useDragLayer.isDragging;
-
+      /**
+       * We must cast because TS is complaining. We know that casting as DragSourceMonitorImpl is ok.
+       */
+      var monitor = initialMonitor;
+      if (!subscribedToOffsetChange) {
+        monitor.subscribeToOffsetChange(onOffsetChange(monitor));
+        subscribedToOffsetChange = true;
+      }
+      return {
+        isDragging: monitor.isDragging()
+      };
+    }),
+    isDragging = _useDragLayer.isDragging;
   (0, _react.useEffect)(function () {
     return function () {
       subscribedToOffsetChange = false;
       dragPreviewRef = null;
     };
-  }, []); // We track the value of "isDragging" and apply opacity=1 (after 100ms), when it switches to true.
+  }, []);
+
+  // We track the value of "isDragging" and apply opacity=1 (after 100ms), when it switches to true.
   // Without this, the drag cursor would be shown in the top-left corner for a short amount of time, and then it
   // would be repositioned correctly. Definitely looks like a glitch. This also adds a nice little fade-in effect.
-
   (0, _react.useEffect)(function () {
     if (isDragging) {
       setTimeout(function () {
@@ -78,15 +64,12 @@ var DragPreview = function DragPreview() {
       setDragHelperOpacity(0);
     }
   }, [isDragging]);
-
   if (!isDragging) {
     return null;
   }
-
   if (!isDragging) {
     return null;
   }
-
   return /*#__PURE__*/_react.default.createElement("div", {
     style: {
       position: "fixed",
@@ -115,6 +98,5 @@ var DragPreview = function DragPreview() {
     }
   })));
 };
-
 var _default = DragPreview;
 exports.default = _default;

package/admin/components/DragPreview.js.map

@@ -1 +1 @@
-{"version":3,"names":["subscribedToOffsetChange","dragPreviewRef","onOffsetChange","monitor","offset","getClientOffset","transform","x","y","style","DragPreview","useState","dragHelperOpacity","setDragHelperOpacity","useDragLayer","initialMonitor","subscribeToOffsetChange","isDragging","useEffect","setTimeout","position","pointerEvents","zIndex","left","top","width","height","el","transition","display","opacity","backgroundColor","borderRadius"],"sources":["DragPreview.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { useDragLayer } from \"react-dnd\";\nimport { DragSourceMonitor } from \"react-dnd/lib/interfaces/monitors\";\nimport { DragSourceMonitorImpl } from \"react-dnd/lib/common/DragSourceMonitorImpl\";\n\nlet subscribedToOffsetChange = false;\n\nlet dragPreviewRef: HTMLDivElement | null = null;\n\nconst onOffsetChange = (monitor: DragSourceMonitor) => () => {\n    if (!dragPreviewRef) {\n        return;\n    }\n\n    const offset = monitor.getClientOffset();\n    if (!offset) {\n        return;\n    }\n\n    const transform = `translate(${offset.x - 15}px, ${offset.y - 15}px)`;\n    dragPreviewRef.style[\"transform\"] = transform;\n    // TODO @ts-refactor figure out better type\n    dragPreviewRef.style[\"-webkit-transform\" as any] = transform;\n};\n\nconst DragPreview: React.FC = () => {\n    const [dragHelperOpacity, setDragHelperOpacity] = useState(0);\n    const { isDragging } = useDragLayer(initialMonitor => {\n        /**\n         * We must cast because TS is complaining. We know that casting as DragSourceMonitorImpl is ok.\n         */\n        const monitor = initialMonitor as unknown as DragSourceMonitorImpl;\n        if (!subscribedToOffsetChange) {\n            monitor.subscribeToOffsetChange(onOffsetChange(monitor));\n            subscribedToOffsetChange = true;\n        }\n\n        return {\n            isDragging: monitor.isDragging()\n        };\n    });\n\n    useEffect(() => {\n        return () => {\n            subscribedToOffsetChange = false;\n            dragPreviewRef = null;\n        };\n    }, []);\n\n    // We track the value of \"isDragging\" and apply opacity=1 (after 100ms), when it switches to true.\n    // Without this, the drag cursor would be shown in the top-left corner for a short amount of time, and then it\n    // would be repositioned correctly. Definitely looks like a glitch. This also adds a nice little fade-in effect.\n    useEffect(() => {\n        if (isDragging) {\n            setTimeout(() => {\n                setDragHelperOpacity(isDragging ? 1 : 0);\n            }, 100);\n        } else {\n            setDragHelperOpacity(0);\n        }\n    }, [isDragging]);\n\n    if (!isDragging) {\n        return null;\n    }\n\n    if (!isDragging) {\n        return null;\n    }\n\n    return (\n        <div\n            style={{\n                position: \"fixed\",\n                pointerEvents: \"none\",\n                zIndex: 1001,\n                left: 0,\n                top: 0,\n                width: \"100%\",\n                height: \"100%\"\n            }}\n        >\n            <div\n                ref={el => (dragPreviewRef = el)}\n                style={{\n                    transition: \"opacity .25s ease-in-out\",\n                    display: \"block\",\n                    opacity: dragHelperOpacity\n                }}\n            >\n                <div\n                    style={{\n                        width: 30,\n                        height: 30,\n                        backgroundColor: \"var(--mdc-theme-primary)\",\n                        borderRadius: \"50%\"\n                    }}\n                />\n            </div>\n        </div>\n    );\n};\nexport default DragPreview;\n"],"mappings":";;;;;;;;;;;;;AAAA;;AACA;;AAIA,IAAIA,wBAAwB,GAAG,KAA/B;AAEA,IAAIC,cAAqC,GAAG,IAA5C;;AAEA,IAAMC,cAAc,GAAG,SAAjBA,cAAiB,CAACC,OAAD;EAAA,OAAgC,YAAM;IACzD,IAAI,CAACF,cAAL,EAAqB;MACjB;IACH;;IAED,IAAMG,MAAM,GAAGD,OAAO,CAACE,eAAR,EAAf;;IACA,IAAI,CAACD,MAAL,EAAa;MACT;IACH;;IAED,IAAME,SAAS,uBAAgBF,MAAM,CAACG,CAAP,GAAW,EAA3B,iBAAoCH,MAAM,CAACI,CAAP,GAAW,EAA/C,QAAf;IACAP,cAAc,CAACQ,KAAf,CAAqB,WAArB,IAAoCH,SAApC,CAXyD,CAYzD;;IACAL,cAAc,CAACQ,KAAf,CAAqB,mBAArB,IAAmDH,SAAnD;EACH,CAdsB;AAAA,CAAvB;;AAgBA,IAAMI,WAAqB,GAAG,SAAxBA,WAAwB,GAAM;EAChC,gBAAkD,IAAAC,eAAA,EAAS,CAAT,CAAlD;EAAA;EAAA,IAAOC,iBAAP;EAAA,IAA0BC,oBAA1B;;EACA,oBAAuB,IAAAC,sBAAA,EAAa,UAAAC,cAAc,EAAI;IAClD;AACR;AACA;IACQ,IAAMZ,OAAO,GAAGY,cAAhB;;IACA,IAAI,CAACf,wBAAL,EAA+B;MAC3BG,OAAO,CAACa,uBAAR,CAAgCd,cAAc,CAACC,OAAD,CAA9C;MACAH,wBAAwB,GAAG,IAA3B;IACH;;IAED,OAAO;MACHiB,UAAU,EAAEd,OAAO,CAACc,UAAR;IADT,CAAP;EAGH,CAbsB,CAAvB;EAAA,IAAQA,UAAR,iBAAQA,UAAR;;EAeA,IAAAC,gBAAA,EAAU,YAAM;IACZ,OAAO,YAAM;MACTlB,wBAAwB,GAAG,KAA3B;MACAC,cAAc,GAAG,IAAjB;IACH,CAHD;EAIH,CALD,EAKG,EALH,EAjBgC,CAwBhC;EACA;EACA;;EACA,IAAAiB,gBAAA,EAAU,YAAM;IACZ,IAAID,UAAJ,EAAgB;MACZE,UAAU,CAAC,YAAM;QACbN,oBAAoB,CAACI,UAAU,GAAG,CAAH,GAAO,CAAlB,CAApB;MACH,CAFS,EAEP,GAFO,CAAV;IAGH,CAJD,MAIO;MACHJ,oBAAoB,CAAC,CAAD,CAApB;IACH;EACJ,CARD,EAQG,CAACI,UAAD,CARH;;EAUA,IAAI,CAACA,UAAL,EAAiB;IACb,OAAO,IAAP;EACH;;EAED,IAAI,CAACA,UAAL,EAAiB;IACb,OAAO,IAAP;EACH;;EAED,oBACI;IACI,KAAK,EAAE;MACHG,QAAQ,EAAE,OADP;MAEHC,aAAa,EAAE,MAFZ;MAGHC,MAAM,EAAE,IAHL;MAIHC,IAAI,EAAE,CAJH;MAKHC,GAAG,EAAE,CALF;MAMHC,KAAK,EAAE,MANJ;MAOHC,MAAM,EAAE;IAPL;EADX,gBAWI;IACI,GAAG,EAAE,aAAAC,EAAE;MAAA,OAAK1B,cAAc,GAAG0B,EAAtB;IAAA,CADX;IAEI,KAAK,EAAE;MACHC,UAAU,EAAE,0BADT;MAEHC,OAAO,EAAE,OAFN;MAGHC,OAAO,EAAElB;IAHN;EAFX,gBAQI;IACI,KAAK,EAAE;MACHa,KAAK,EAAE,EADJ;MAEHC,MAAM,EAAE,EAFL;MAGHK,eAAe,EAAE,0BAHd;MAIHC,YAAY,EAAE;IAJX;EADX,EARJ,CAXJ,CADJ;AA+BH,CA5ED;;eA6EetB,W"}
+{"version":3,"names":["subscribedToOffsetChange","dragPreviewRef","onOffsetChange","monitor","offset","getClientOffset","transform","x","y","style","DragPreview","useState","dragHelperOpacity","setDragHelperOpacity","useDragLayer","initialMonitor","subscribeToOffsetChange","isDragging","useEffect","setTimeout","position","pointerEvents","zIndex","left","top","width","height","el","transition","display","opacity","backgroundColor","borderRadius"],"sources":["DragPreview.tsx"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\nimport { useDragLayer } from \"react-dnd\";\nimport { DragSourceMonitor } from \"react-dnd/lib/interfaces/monitors\";\nimport { DragSourceMonitorImpl } from \"react-dnd/lib/common/DragSourceMonitorImpl\";\n\nlet subscribedToOffsetChange = false;\n\nlet dragPreviewRef: HTMLDivElement | null = null;\n\nconst onOffsetChange = (monitor: DragSourceMonitor) => () => {\n    if (!dragPreviewRef) {\n        return;\n    }\n\n    const offset = monitor.getClientOffset();\n    if (!offset) {\n        return;\n    }\n\n    const transform = `translate(${offset.x - 15}px, ${offset.y - 15}px)`;\n    dragPreviewRef.style[\"transform\"] = transform;\n    // TODO @ts-refactor figure out better type\n    dragPreviewRef.style[\"-webkit-transform\" as any] = transform;\n};\n\nconst DragPreview: React.FC = () => {\n    const [dragHelperOpacity, setDragHelperOpacity] = useState(0);\n    const { isDragging } = useDragLayer(initialMonitor => {\n        /**\n         * We must cast because TS is complaining. We know that casting as DragSourceMonitorImpl is ok.\n         */\n        const monitor = initialMonitor as unknown as DragSourceMonitorImpl;\n        if (!subscribedToOffsetChange) {\n            monitor.subscribeToOffsetChange(onOffsetChange(monitor));\n            subscribedToOffsetChange = true;\n        }\n\n        return {\n            isDragging: monitor.isDragging()\n        };\n    });\n\n    useEffect(() => {\n        return () => {\n            subscribedToOffsetChange = false;\n            dragPreviewRef = null;\n        };\n    }, []);\n\n    // We track the value of \"isDragging\" and apply opacity=1 (after 100ms), when it switches to true.\n    // Without this, the drag cursor would be shown in the top-left corner for a short amount of time, and then it\n    // would be repositioned correctly. Definitely looks like a glitch. This also adds a nice little fade-in effect.\n    useEffect(() => {\n        if (isDragging) {\n            setTimeout(() => {\n                setDragHelperOpacity(isDragging ? 1 : 0);\n            }, 100);\n        } else {\n            setDragHelperOpacity(0);\n        }\n    }, [isDragging]);\n\n    if (!isDragging) {\n        return null;\n    }\n\n    if (!isDragging) {\n        return null;\n    }\n\n    return (\n        <div\n            style={{\n                position: \"fixed\",\n                pointerEvents: \"none\",\n                zIndex: 1001,\n                left: 0,\n                top: 0,\n                width: \"100%\",\n                height: \"100%\"\n            }}\n        >\n            <div\n                ref={el => (dragPreviewRef = el)}\n                style={{\n                    transition: \"opacity .25s ease-in-out\",\n                    display: \"block\",\n                    opacity: dragHelperOpacity\n                }}\n            >\n                <div\n                    style={{\n                        width: 30,\n                        height: 30,\n                        backgroundColor: \"var(--mdc-theme-primary)\",\n                        borderRadius: \"50%\"\n                    }}\n                />\n            </div>\n        </div>\n    );\n};\nexport default DragPreview;\n"],"mappings":";;;;;;;;;AAAA;AACA;AAIA,IAAIA,wBAAwB,GAAG,KAAK;AAEpC,IAAIC,cAAqC,GAAG,IAAI;AAEhD,IAAMC,cAAc,GAAG,SAAjBA,cAAc,CAAIC,OAA0B;EAAA,OAAK,YAAM;IACzD,IAAI,CAACF,cAAc,EAAE;MACjB;IACJ;IAEA,IAAMG,MAAM,GAAGD,OAAO,CAACE,eAAe,EAAE;IACxC,IAAI,CAACD,MAAM,EAAE;MACT;IACJ;IAEA,IAAME,SAAS,uBAAgBF,MAAM,CAACG,CAAC,GAAG,EAAE,iBAAOH,MAAM,CAACI,CAAC,GAAG,EAAE,QAAK;IACrEP,cAAc,CAACQ,KAAK,CAAC,WAAW,CAAC,GAAGH,SAAS;IAC7C;IACAL,cAAc,CAACQ,KAAK,CAAC,mBAAmB,CAAQ,GAAGH,SAAS;EAChE,CAAC;AAAA;AAED,IAAMI,WAAqB,GAAG,SAAxBA,WAAqB,GAAS;EAChC,gBAAkD,IAAAC,eAAQ,EAAC,CAAC,CAAC;IAAA;IAAtDC,iBAAiB;IAAEC,oBAAoB;EAC9C,oBAAuB,IAAAC,sBAAY,EAAC,UAAAC,cAAc,EAAI;MAClD;AACR;AACA;MACQ,IAAMZ,OAAO,GAAGY,cAAkD;MAClE,IAAI,CAACf,wBAAwB,EAAE;QAC3BG,OAAO,CAACa,uBAAuB,CAACd,cAAc,CAACC,OAAO,CAAC,CAAC;QACxDH,wBAAwB,GAAG,IAAI;MACnC;MAEA,OAAO;QACHiB,UAAU,EAAEd,OAAO,CAACc,UAAU;MAClC,CAAC;IACL,CAAC,CAAC;IAbMA,UAAU,iBAAVA,UAAU;EAelB,IAAAC,gBAAS,EAAC,YAAM;IACZ,OAAO,YAAM;MACTlB,wBAAwB,GAAG,KAAK;MAChCC,cAAc,GAAG,IAAI;IACzB,CAAC;EACL,CAAC,EAAE,EAAE,CAAC;;EAEN;EACA;EACA;EACA,IAAAiB,gBAAS,EAAC,YAAM;IACZ,IAAID,UAAU,EAAE;MACZE,UAAU,CAAC,YAAM;QACbN,oBAAoB,CAACI,UAAU,GAAG,CAAC,GAAG,CAAC,CAAC;MAC5C,CAAC,EAAE,GAAG,CAAC;IACX,CAAC,MAAM;MACHJ,oBAAoB,CAAC,CAAC,CAAC;IAC3B;EACJ,CAAC,EAAE,CAACI,UAAU,CAAC,CAAC;EAEhB,IAAI,CAACA,UAAU,EAAE;IACb,OAAO,IAAI;EACf;EAEA,IAAI,CAACA,UAAU,EAAE;IACb,OAAO,IAAI;EACf;EAEA,oBACI;IACI,KAAK,EAAE;MACHG,QAAQ,EAAE,OAAO;MACjBC,aAAa,EAAE,MAAM;MACrBC,MAAM,EAAE,IAAI;MACZC,IAAI,EAAE,CAAC;MACPC,GAAG,EAAE,CAAC;MACNC,KAAK,EAAE,MAAM;MACbC,MAAM,EAAE;IACZ;EAAE,gBAEF;IACI,GAAG,EAAE,aAAAC,EAAE;MAAA,OAAK1B,cAAc,GAAG0B,EAAE;IAAA,CAAE;IACjC,KAAK,EAAE;MACHC,UAAU,EAAE,0BAA0B;MACtCC,OAAO,EAAE,OAAO;MAChBC,OAAO,EAAElB;IACb;EAAE,gBAEF;IACI,KAAK,EAAE;MACHa,KAAK,EAAE,EAAE;MACTC,MAAM,EAAE,EAAE;MACVK,eAAe,EAAE,0BAA0B;MAC3CC,YAAY,EAAE;IAClB;EAAE,EACJ,CACA,CACJ;AAEd,CAAC;AAAC,eACatB,WAAW;AAAA"}

package/admin/components/Draggable.js

@@ -1,56 +1,46 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _reactDnd = require("react-dnd");
-
 var emptyImage = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";
-
 var Draggable = function Draggable(props) {
   var children = props.children,
-      beginDrag = props.beginDrag,
-      endDrag = props.endDrag,
-      target = props.target;
-
+    beginDrag = props.beginDrag,
+    endDrag = props.endDrag,
+    target = props.target;
   var _useDrag = (0, _reactDnd.useDrag)({
-    item: {
-      type: "element",
-      target: target
-    },
-    collect: function collect(monitor) {
-      return {
-        isDragging: monitor.isDragging()
-      };
-    },
-    begin: function begin(monitor) {
-      if (typeof beginDrag === "function") {
-        return beginDrag(props, monitor);
+      item: {
+        type: "element",
+        target: target
+      },
+      collect: function collect(monitor) {
+        return {
+          isDragging: monitor.isDragging()
+        };
+      },
+      begin: function begin(monitor) {
+        if (typeof beginDrag === "function") {
+          return beginDrag(props, monitor);
+        }
+        return beginDrag;
+      },
+      end: function end(item, monitor) {
+        if (typeof endDrag === "function") {
+          return endDrag(item, monitor);
+        }
+        return endDrag;
       }
-
-      return beginDrag;
-    },
-    end: function end(item, monitor) {
-      if (typeof endDrag === "function") {
-        return endDrag(item, monitor);
-      }
-
-      return endDrag;
-    }
-  }),
-      _useDrag2 = (0, _slicedToArray2.default)(_useDrag, 3),
-      isDragging = _useDrag2[0].isDragging,
-      drag = _useDrag2[1],
-      preview = _useDrag2[2];
-
+    }),
+    _useDrag2 = (0, _slicedToArray2.default)(_useDrag, 3),
+    isDragging = _useDrag2[0].isDragging,
+    drag = _useDrag2[1],
+    preview = _useDrag2[2];
   return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactDnd.DragPreviewImage, {
     connect: preview,
     src: emptyImage
@@ -59,8 +49,6 @@ var Draggable = function Draggable(props) {
     drag: drag
   }));
 };
-
 var MemoizedDraggable = /*#__PURE__*/_react.default.memo(Draggable);
-
 var _default = MemoizedDraggable;
 exports.default = _default;

package/admin/components/Draggable.js.map

@@ -1 +1 @@
-{"version":3,"names":["emptyImage","Draggable","props","children","beginDrag","endDrag","target","useDrag","item","type","collect","monitor","isDragging","begin","end","drag","preview","MemoizedDraggable","React","memo"],"sources":["Draggable.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { useDrag, DragPreviewImage, ConnectDragSource } from \"react-dnd\";\n\nconst emptyImage = \"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\";\n\ninterface DraggableChildrenFunctionParams {\n    isDragging: boolean;\n    drag: ConnectDragSource;\n}\nexport interface DraggableChildrenFunction {\n    (params: DraggableChildrenFunctionParams): ReactElement;\n}\n\nexport interface DraggableProps {\n    children: DraggableChildrenFunction;\n    beginDrag?: any;\n    endDrag?: any;\n    target?: string[];\n}\n\nconst Draggable: React.FC<DraggableProps> = props => {\n    const { children, beginDrag, endDrag, target } = props;\n\n    const [{ isDragging }, drag, preview] = useDrag({\n        item: { type: \"element\", target },\n        collect: monitor => ({\n            isDragging: monitor.isDragging()\n        }),\n        begin(monitor) {\n            if (typeof beginDrag === \"function\") {\n                return beginDrag(props, monitor);\n            }\n            return beginDrag;\n        },\n        end(item, monitor) {\n            if (typeof endDrag === \"function\") {\n                return endDrag(item, monitor);\n            }\n            return endDrag;\n        }\n    });\n\n    return (\n        <>\n            <DragPreviewImage connect={preview} src={emptyImage} />\n            {children({ isDragging, drag })}\n        </>\n    );\n};\n\nconst MemoizedDraggable: React.FC<DraggableProps> = React.memo(Draggable);\nexport default MemoizedDraggable;\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AAEA,IAAMA,UAAU,GAAG,4EAAnB;;AAiBA,IAAMC,SAAmC,GAAG,SAAtCA,SAAsC,CAAAC,KAAK,EAAI;EACjD,IAAQC,QAAR,GAAiDD,KAAjD,CAAQC,QAAR;EAAA,IAAkBC,SAAlB,GAAiDF,KAAjD,CAAkBE,SAAlB;EAAA,IAA6BC,OAA7B,GAAiDH,KAAjD,CAA6BG,OAA7B;EAAA,IAAsCC,MAAtC,GAAiDJ,KAAjD,CAAsCI,MAAtC;;EAEA,eAAwC,IAAAC,iBAAA,EAAQ;IAC5CC,IAAI,EAAE;MAAEC,IAAI,EAAE,SAAR;MAAmBH,MAAM,EAANA;IAAnB,CADsC;IAE5CI,OAAO,EAAE,iBAAAC,OAAO;MAAA,OAAK;QACjBC,UAAU,EAAED,OAAO,CAACC,UAAR;MADK,CAAL;IAAA,CAF4B;IAK5CC,KAL4C,iBAKtCF,OALsC,EAK7B;MACX,IAAI,OAAOP,SAAP,KAAqB,UAAzB,EAAqC;QACjC,OAAOA,SAAS,CAACF,KAAD,EAAQS,OAAR,CAAhB;MACH;;MACD,OAAOP,SAAP;IACH,CAV2C;IAW5CU,GAX4C,eAWxCN,IAXwC,EAWlCG,OAXkC,EAWzB;MACf,IAAI,OAAON,OAAP,KAAmB,UAAvB,EAAmC;QAC/B,OAAOA,OAAO,CAACG,IAAD,EAAOG,OAAP,CAAd;MACH;;MACD,OAAON,OAAP;IACH;EAhB2C,CAAR,CAAxC;EAAA;EAAA,IAASO,UAAT,gBAASA,UAAT;EAAA,IAAuBG,IAAvB;EAAA,IAA6BC,OAA7B;;EAmBA,oBACI,yEACI,6BAAC,0BAAD;IAAkB,OAAO,EAAEA,OAA3B;IAAoC,GAAG,EAAEhB;EAAzC,EADJ,EAEKG,QAAQ,CAAC;IAAES,UAAU,EAAVA,UAAF;IAAcG,IAAI,EAAJA;EAAd,CAAD,CAFb,CADJ;AAMH,CA5BD;;AA8BA,IAAME,iBAA2C,gBAAGC,cAAA,CAAMC,IAAN,CAAWlB,SAAX,CAApD;;eACegB,iB"}
+{"version":3,"names":["emptyImage","Draggable","props","children","beginDrag","endDrag","target","useDrag","item","type","collect","monitor","isDragging","begin","end","drag","preview","MemoizedDraggable","React","memo"],"sources":["Draggable.tsx"],"sourcesContent":["import React, { ReactElement } from \"react\";\nimport { useDrag, DragPreviewImage, ConnectDragSource } from \"react-dnd\";\n\nconst emptyImage = \"data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==\";\n\ninterface DraggableChildrenFunctionParams {\n    isDragging: boolean;\n    drag: ConnectDragSource;\n}\nexport interface DraggableChildrenFunction {\n    (params: DraggableChildrenFunctionParams): ReactElement;\n}\n\nexport interface DraggableProps {\n    children: DraggableChildrenFunction;\n    beginDrag?: any;\n    endDrag?: any;\n    target?: string[];\n}\n\nconst Draggable: React.FC<DraggableProps> = props => {\n    const { children, beginDrag, endDrag, target } = props;\n\n    const [{ isDragging }, drag, preview] = useDrag({\n        item: { type: \"element\", target },\n        collect: monitor => ({\n            isDragging: monitor.isDragging()\n        }),\n        begin(monitor) {\n            if (typeof beginDrag === \"function\") {\n                return beginDrag(props, monitor);\n            }\n            return beginDrag;\n        },\n        end(item, monitor) {\n            if (typeof endDrag === \"function\") {\n                return endDrag(item, monitor);\n            }\n            return endDrag;\n        }\n    });\n\n    return (\n        <>\n            <DragPreviewImage connect={preview} src={emptyImage} />\n            {children({ isDragging, drag })}\n        </>\n    );\n};\n\nconst MemoizedDraggable: React.FC<DraggableProps> = React.memo(Draggable);\nexport default MemoizedDraggable;\n"],"mappings":";;;;;;;;AAAA;AACA;AAEA,IAAMA,UAAU,GAAG,4EAA4E;AAiB/F,IAAMC,SAAmC,GAAG,SAAtCA,SAAmC,CAAGC,KAAK,EAAI;EACjD,IAAQC,QAAQ,GAAiCD,KAAK,CAA9CC,QAAQ;IAAEC,SAAS,GAAsBF,KAAK,CAApCE,SAAS;IAAEC,OAAO,GAAaH,KAAK,CAAzBG,OAAO;IAAEC,MAAM,GAAKJ,KAAK,CAAhBI,MAAM;EAE5C,eAAwC,IAAAC,iBAAO,EAAC;MAC5CC,IAAI,EAAE;QAAEC,IAAI,EAAE,SAAS;QAAEH,MAAM,EAANA;MAAO,CAAC;MACjCI,OAAO,EAAE,iBAAAC,OAAO;QAAA,OAAK;UACjBC,UAAU,EAAED,OAAO,CAACC,UAAU;QAClC,CAAC;MAAA,CAAC;MACFC,KAAK,iBAACF,OAAO,EAAE;QACX,IAAI,OAAOP,SAAS,KAAK,UAAU,EAAE;UACjC,OAAOA,SAAS,CAACF,KAAK,EAAES,OAAO,CAAC;QACpC;QACA,OAAOP,SAAS;MACpB,CAAC;MACDU,GAAG,eAACN,IAAI,EAAEG,OAAO,EAAE;QACf,IAAI,OAAON,OAAO,KAAK,UAAU,EAAE;UAC/B,OAAOA,OAAO,CAACG,IAAI,EAAEG,OAAO,CAAC;QACjC;QACA,OAAON,OAAO;MAClB;IACJ,CAAC,CAAC;IAAA;IAjBOO,UAAU,gBAAVA,UAAU;IAAIG,IAAI;IAAEC,OAAO;EAmBpC,oBACI,yEACI,6BAAC,0BAAgB;IAAC,OAAO,EAAEA,OAAQ;IAAC,GAAG,EAAEhB;EAAW,EAAG,EACtDG,QAAQ,CAAC;IAAES,UAAU,EAAVA,UAAU;IAAEG,IAAI,EAAJA;EAAK,CAAC,CAAC,CAChC;AAEX,CAAC;AAED,IAAME,iBAA2C,gBAAGC,cAAK,CAACC,IAAI,CAAClB,SAAS,CAAC;AAAC,eAC3DgB,iBAAiB;AAAA"}

package/admin/components/DropZone/Center.js

@@ -1,58 +1,46 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _Droppable = require("./../Droppable");
-
 var getColor = function getColor(_ref) {
   var isOver = _ref.isOver,
-      isDroppable = _ref.isDroppable;
-
+    isDroppable = _ref.isDroppable;
   if (isOver) {
     return "var(--mdc-theme-primary)";
   }
-
   if (!isDroppable) {
     return "var(--mdc-theme-background)";
   }
-
   return "var(--mdc-theme-secondary)";
 };
-
 var Container = /*#__PURE__*/(0, _styled.default)("div", {
   label: "Container",
   target: "e14zhyp10"
 })("background-color:transparent;box-sizing:border-box;height:100%;min-height:100px;position:relative;user-select:none;width:100%;border:2px dashed ", getColor, ";opacity:1;> div{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);margin:0;color:", getColor, ";}");
-
 var getInert = function getInert(isDroppable) {
   return isDroppable ? {} : {
     inert: ""
   };
 };
-
 var Center = function Center(_ref2) {
   var onDrop = _ref2.onDrop,
-      children = _ref2.children,
-      style = _ref2.style,
-      isDroppable = _ref2.isDroppable;
+    children = _ref2.children,
+    style = _ref2.style,
+    isDroppable = _ref2.isDroppable;
   return /*#__PURE__*/_react.default.createElement(_Droppable.Droppable, {
     onDrop: onDrop,
     isDroppable: isDroppable
   }, function (_ref3) {
     var isOver = _ref3.isOver,
-        drop = _ref3.drop,
-        isDroppable = _ref3.isDroppable;
+      drop = _ref3.drop,
+      isDroppable = _ref3.isDroppable;
     return /*#__PURE__*/_react.default.createElement("div", Object.assign({
       ref: drop,
       style: (0, _objectSpread2.default)({
@@ -66,6 +54,5 @@ var Center = function Center(_ref2) {
     }, /*#__PURE__*/_react.default.createElement("div", null, children)));
   });
 };
-
 var _default = Center;
 exports.default = _default;

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

@@ -1 +1 @@
-{"version":3,"names":["getColor","isOver","isDroppable","Container","styled","getInert","inert","Center","onDrop","children","style","drop","width","height"],"sources":["Center.tsx"],"sourcesContent":["import React, { CSSProperties } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, DroppableProps, OnDropCallable } from \"./../Droppable\";\n\ninterface DroppableFlags {\n    isOver: boolean;\n    isDroppable: boolean;\n}\n\nconst getColor = ({ isOver, isDroppable }: DroppableFlags) => {\n    if (isOver) {\n        return \"var(--mdc-theme-primary)\";\n    }\n\n    if (!isDroppable) {\n        return \"var(--mdc-theme-background)\";\n    }\n\n    return \"var(--mdc-theme-secondary)\";\n};\n\nconst Container = styled.div`\n    background-color: transparent;\n    box-sizing: border-box;\n    height: 100%;\n    min-height: 100px;\n    position: relative;\n    user-select: none;\n    width: 100%;\n    border: 2px dashed ${getColor};\n    opacity: 1;\n    > div {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        margin: 0;\n        color: ${getColor};\n    }\n`;\n\ninterface CenterProps {\n    type?: string;\n    onDrop: OnDropCallable;\n    children: React.ReactNode;\n    active?: boolean;\n    highlight?: boolean;\n    style?: CSSProperties;\n    isDroppable?: DroppableProps[\"isDroppable\"];\n}\n\nconst getInert = (isDroppable: boolean) => {\n    return isDroppable ? {} : { inert: \"\" };\n};\n\nconst Center: React.FC<CenterProps> = ({ onDrop, children, style, isDroppable }) => {\n    return (\n        <Droppable onDrop={onDrop} isDroppable={isDroppable}>\n            {({ isOver, drop, isDroppable }) => (\n                <div\n                    ref={drop}\n                    style={{ width: \"100%\", height: \"100%\", ...style }}\n                    data-testid={\"cms-editor-first-field-area\"}\n                    {...getInert(isDroppable)}\n                >\n                    <Container isOver={isOver} isDroppable={isDroppable}>\n                        <div>{children}</div>\n                    </Container>\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Center;\n"],"mappings":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAOA,IAAMA,QAAQ,GAAG,SAAXA,QAAW,OAA6C;EAAA,IAA1CC,MAA0C,QAA1CA,MAA0C;EAAA,IAAlCC,WAAkC,QAAlCA,WAAkC;;EAC1D,IAAID,MAAJ,EAAY;IACR,OAAO,0BAAP;EACH;;EAED,IAAI,CAACC,WAAL,EAAkB;IACd,OAAO,6BAAP;EACH;;EAED,OAAO,4BAAP;AACH,CAVD;;AAYA,IAAMC,SAAS,oBAAGC,eAAH;EAAA;EAAA;AAAA,uJAQUJ,QARV,wGAgBEA,QAhBF,OAAf;;AA8BA,IAAMK,QAAQ,GAAG,SAAXA,QAAW,CAACH,WAAD,EAA0B;EACvC,OAAOA,WAAW,GAAG,EAAH,GAAQ;IAAEI,KAAK,EAAE;EAAT,CAA1B;AACH,CAFD;;AAIA,IAAMC,MAA6B,GAAG,SAAhCA,MAAgC,QAA8C;EAAA,IAA3CC,MAA2C,SAA3CA,MAA2C;EAAA,IAAnCC,QAAmC,SAAnCA,QAAmC;EAAA,IAAzBC,KAAyB,SAAzBA,KAAyB;EAAA,IAAlBR,WAAkB,SAAlBA,WAAkB;EAChF,oBACI,6BAAC,oBAAD;IAAW,MAAM,EAAEM,MAAnB;IAA2B,WAAW,EAAEN;EAAxC,GACK;IAAA,IAAGD,MAAH,SAAGA,MAAH;IAAA,IAAWU,IAAX,SAAWA,IAAX;IAAA,IAAiBT,WAAjB,SAAiBA,WAAjB;IAAA,oBACG;MACI,GAAG,EAAES,IADT;MAEI,KAAK;QAAIC,KAAK,EAAE,MAAX;QAAmBC,MAAM,EAAE;MAA3B,GAAsCH,KAAtC,CAFT;MAGI,eAAa;IAHjB,GAIQL,QAAQ,CAACH,WAAD,CAJhB,gBAMI,6BAAC,SAAD;MAAW,MAAM,EAAED,MAAnB;MAA2B,WAAW,EAAEC;IAAxC,gBACI,0CAAMO,QAAN,CADJ,CANJ,CADH;EAAA,CADL,CADJ;AAgBH,CAjBD;;eAmBeF,M"}
+{"version":3,"names":["getColor","isOver","isDroppable","Container","styled","getInert","inert","Center","onDrop","children","style","drop","width","height"],"sources":["Center.tsx"],"sourcesContent":["import React, { CSSProperties } from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, DroppableProps, OnDropCallable } from \"./../Droppable\";\n\ninterface DroppableFlags {\n    isOver: boolean;\n    isDroppable: boolean;\n}\n\nconst getColor = ({ isOver, isDroppable }: DroppableFlags) => {\n    if (isOver) {\n        return \"var(--mdc-theme-primary)\";\n    }\n\n    if (!isDroppable) {\n        return \"var(--mdc-theme-background)\";\n    }\n\n    return \"var(--mdc-theme-secondary)\";\n};\n\nconst Container = styled.div`\n    background-color: transparent;\n    box-sizing: border-box;\n    height: 100%;\n    min-height: 100px;\n    position: relative;\n    user-select: none;\n    width: 100%;\n    border: 2px dashed ${getColor};\n    opacity: 1;\n    > div {\n        position: absolute;\n        top: 50%;\n        left: 50%;\n        transform: translate(-50%, -50%);\n        margin: 0;\n        color: ${getColor};\n    }\n`;\n\ninterface CenterProps {\n    type?: string;\n    onDrop: OnDropCallable;\n    children: React.ReactNode;\n    active?: boolean;\n    highlight?: boolean;\n    style?: CSSProperties;\n    isDroppable?: DroppableProps[\"isDroppable\"];\n}\n\nconst getInert = (isDroppable: boolean) => {\n    return isDroppable ? {} : { inert: \"\" };\n};\n\nconst Center: React.FC<CenterProps> = ({ onDrop, children, style, isDroppable }) => {\n    return (\n        <Droppable onDrop={onDrop} isDroppable={isDroppable}>\n            {({ isOver, drop, isDroppable }) => (\n                <div\n                    ref={drop}\n                    style={{ width: \"100%\", height: \"100%\", ...style }}\n                    data-testid={\"cms-editor-first-field-area\"}\n                    {...getInert(isDroppable)}\n                >\n                    <Container isOver={isOver} isDroppable={isDroppable}>\n                        <div>{children}</div>\n                    </Container>\n                </div>\n            )}\n        </Droppable>\n    );\n};\n\nexport default Center;\n"],"mappings":";;;;;;;;AAAA;AACA;AACA;AAOA,IAAMA,QAAQ,GAAG,SAAXA,QAAQ,OAAgD;EAAA,IAA1CC,MAAM,QAANA,MAAM;IAAEC,WAAW,QAAXA,WAAW;EACnC,IAAID,MAAM,EAAE;IACR,OAAO,0BAA0B;EACrC;EAEA,IAAI,CAACC,WAAW,EAAE;IACd,OAAO,6BAA6B;EACxC;EAEA,OAAO,4BAA4B;AACvC,CAAC;AAED,IAAMC,SAAS,oBAAGC,eAAM;EAAA;EAAA;AAAA,uJAQCJ,QAAQ,wGAQhBA,QAAQ,OAExB;AAYD,IAAMK,QAAQ,GAAG,SAAXA,QAAQ,CAAIH,WAAoB,EAAK;EACvC,OAAOA,WAAW,GAAG,CAAC,CAAC,GAAG;IAAEI,KAAK,EAAE;EAAG,CAAC;AAC3C,CAAC;AAED,IAAMC,MAA6B,GAAG,SAAhCA,MAA6B,QAAiD;EAAA,IAA3CC,MAAM,SAANA,MAAM;IAAEC,QAAQ,SAARA,QAAQ;IAAEC,KAAK,SAALA,KAAK;IAAER,WAAW,SAAXA,WAAW;EACzE,oBACI,6BAAC,oBAAS;IAAC,MAAM,EAAEM,MAAO;IAAC,WAAW,EAAEN;EAAY,GAC/C;IAAA,IAAGD,MAAM,SAANA,MAAM;MAAEU,IAAI,SAAJA,IAAI;MAAET,WAAW,SAAXA,WAAW;IAAA,oBACzB;MACI,GAAG,EAAES,IAAK;MACV,KAAK;QAAIC,KAAK,EAAE,MAAM;QAAEC,MAAM,EAAE;MAAM,GAAKH,KAAK,CAAG;MACnD,eAAa;IAA8B,GACvCL,QAAQ,CAACH,WAAW,CAAC,gBAEzB,6BAAC,SAAS;MAAC,MAAM,EAAED,MAAO;MAAC,WAAW,EAAEC;IAAY,gBAChD,0CAAMO,QAAQ,CAAO,CACb,CACV;EAAA,CACT,CACO;AAEpB,CAAC;AAAC,eAEaF,MAAM;AAAA"}

package/admin/components/DropZone/Horizontal.js

@@ -1,22 +1,15 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _Droppable = require("../Droppable");
-
 var _excluded = ["last", "onDrop", "isVisible"];
 var InnerDiv = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1uuull90",
@@ -52,7 +45,6 @@ var OuterDiv = /*#__PURE__*/(0, _styled.default)("div", {
   justifyContent: "center"
 }, function (props) {
   var _ref;
-
   return _ref = {}, (0, _defineProperty2.default)(_ref, props.last ? "bottom" : "top", -15), (0, _defineProperty2.default)(_ref, InnerDiv, (0, _defineProperty2.default)({
     borderColor: props.isOver ? "var(--mdc-theme-primary)" : "var(--mdc-theme-secondary)",
     display: props.isDragging ? "block" : "none"
@@ -61,21 +53,19 @@ var OuterDiv = /*#__PURE__*/(0, _styled.default)("div", {
     backgroundColor: props.isOver ? "var(--mdc-theme-primary)" : "var(--mdc-theme-secondary)"
   })), _ref;
 });
-
 var Horizontal = function Horizontal(_ref2) {
   var last = _ref2.last,
-      onDrop = _ref2.onDrop,
-      isVisible = _ref2.isVisible,
-      rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
+    onDrop = _ref2.onDrop,
+    isVisible = _ref2.isVisible,
+    rest = (0, _objectWithoutProperties2.default)(_ref2, _excluded);
   return /*#__PURE__*/_react.default.createElement(_Droppable.Droppable, {
     onDrop: onDrop,
     isVisible: isVisible
   }, function (_ref3) {
     var _ref4;
-
     var isOver = _ref3.isOver,
-        isDragging = _ref3.isDragging,
-        drop = _ref3.drop;
+      isDragging = _ref3.isDragging,
+      drop = _ref3.drop;
     return /*#__PURE__*/_react.default.createElement("div", {
       ref: drop,
       "data-testid": rest["data-testid"],
@@ -92,6 +82,5 @@ var Horizontal = function Horizontal(_ref2) {
     }, /*#__PURE__*/_react.default.createElement(InnerDiv, null, /*#__PURE__*/_react.default.createElement(BackgroundColorDiv, null))));
   });
 };
-
 var _default = Horizontal;
 exports.default = _default;

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

@@ -1 +1 @@
-{"version":3,"names":["InnerDiv","styled","height","width","zIndex","borderRadius","boxSizing","display","border","borderSpacing","BackgroundColorDiv","OuterDiv","margin","padding","backgroundColor","position","justifyContent","props","last","borderColor","isOver","isDragging","opacity","Horizontal","onDrop","isVisible","rest","drop"],"sources":["Horizontal.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\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-ignore\n        [InnerDiv]: {\n            borderColor: props.isOver ? \"var(--mdc-theme-primary)\" : \"var(--mdc-theme-secondary)\",\n            display: props.isDragging ? \"block\" : \"none\",\n            // @ts-ignore\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: React.FC<HorizontalProps> = ({ last, onDrop, isVisible, ...rest }) => {\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":";;;;;;;;;;;;;AAAA;;AACA;;AACA;;;AAGA,IAAMA,QAAQ,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EAC3BC,MAAM,EAAE,EADmB;EAE3BC,KAAK,EAAE,MAFoB;EAG3BC,MAAM,EAAE,CAHmB;EAI3BC,YAAY,EAAE,CAJa;EAK3BC,SAAS,EAAE,YALgB;EAM3BC,OAAO,EAAE,MANkB;EAO3BC,MAAM,EAAE,kBAPmB;EAQ3BC,aAAa,EAAE;AARY,CAAjB,CAAd;AAWA,IAAMC,kBAAkB,oBAAGT,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACrCE,KAAK,EAAE,MAD8B;EAErCD,MAAM,EAAE;AAF6B,CAAjB,CAAxB;AAWA,IAAMS,QAAQ,oBAAGV,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GACV;EACIW,MAAM,EAAE,CADZ;EAEIC,OAAO,EAAE,CAFb;EAGIV,KAAK,EAAE,kBAHX;EAIIC,MAAM,EAAE,EAJZ;EAKIU,eAAe,EAAE,aALrB;EAMIC,QAAQ,EAAE,UANd;EAOIR,OAAO,EAAE,MAPb;EAQIS,cAAc,EAAE;AARpB,CADU,EAWV,UAACC,KAAD;EAAA;;EAAA,sDACKA,KAAK,CAACC,IAAN,GAAa,QAAb,GAAwB,KAD7B,EACqC,CAAC,EADtC,uCAGKlB,QAHL;IAIQmB,WAAW,EAAEF,KAAK,CAACG,MAAN,GAAe,0BAAf,GAA4C,4BAJjE;IAKQb,OAAO,EAAEU,KAAK,CAACI,UAAN,GAAmB,OAAnB,GAA6B;EAL9C,GAOSX,kBAPT,EAO8B;IAClBY,OAAO,EAAE,GADS;IAElBR,eAAe,EAAEG,KAAK,CAACG,MAAN,GACX,0BADW,GAEX;EAJY,CAP9B;AAAA,CAXU,CAAd;;AAmCA,IAAMG,UAAqC,GAAG,SAAxCA,UAAwC,QAA0C;EAAA,IAAvCL,IAAuC,SAAvCA,IAAuC;EAAA,IAAjCM,MAAiC,SAAjCA,MAAiC;EAAA,IAAzBC,SAAyB,SAAzBA,SAAyB;EAAA,IAAXC,IAAW;EACpF,oBACI,6BAAC,oBAAD;IAAW,MAAM,EAAEF,MAAnB;IAA2B,SAAS,EAAEC;EAAtC,GACK;IAAA;;IAAA,IAAGL,MAAH,SAAGA,MAAH;IAAA,IAAWC,UAAX,SAAWA,UAAX;IAAA,IAAuBM,IAAvB,SAAuBA,IAAvB;IAAA,oBACG;MACI,GAAG,EAAEA,IADT;MAEI,eAAaD,IAAI,CAAC,aAAD,CAFrB;MAGI,KAAK;QACD;QACAxB,MAAM,EAAE,MAFP;QAGDC,KAAK,EAAE,MAHN;QAIDY,QAAQ,EAAE;MAJT,wCAKAG,IAAI,GAAG,QAAH,GAAc,KALlB,EAK0B,CAL1B,gDAMK,CANL,kDAOOG,UAAU,GAAG,IAAH,GAAU,CAAC,CAP5B;IAHT,gBAaI,6BAAC,QAAD;MAAU,MAAM,EAAED,MAAlB;MAA0B,UAAU,EAAEC,UAAtC;MAAkD,IAAI,EAAEH,IAAI,GAAG,IAAH,GAAU;IAAtE,gBACI,6BAAC,QAAD,qBACI,6BAAC,kBAAD,OADJ,CADJ,CAbJ,CADH;EAAA,CADL,CADJ;AAyBH,CA1BD;;eA4BeK,U"}
+{"version":3,"names":["InnerDiv","styled","height","width","zIndex","borderRadius","boxSizing","display","border","borderSpacing","BackgroundColorDiv","OuterDiv","margin","padding","backgroundColor","position","justifyContent","props","last","borderColor","isOver","isDragging","opacity","Horizontal","onDrop","isVisible","rest","drop"],"sources":["Horizontal.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\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-ignore\n        [InnerDiv]: {\n            borderColor: props.isOver ? \"var(--mdc-theme-primary)\" : \"var(--mdc-theme-secondary)\",\n            display: props.isDragging ? \"block\" : \"none\",\n            // @ts-ignore\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: React.FC<HorizontalProps> = ({ last, onDrop, isVisible, ...rest }) => {\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":";;;;;;;;;AAAA;AACA;AACA;AAA4D;AAG5D,IAAMA,QAAQ,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EAC3BC,MAAM,EAAE,EAAE;EACVC,KAAK,EAAE,MAAM;EACbC,MAAM,EAAE,CAAC;EACTC,YAAY,EAAE,CAAC;EACfC,SAAS,EAAE,YAAY;EACvBC,OAAO,EAAE,MAAM;EACfC,MAAM,EAAE,kBAAkB;EAC1BC,aAAa,EAAE;AACnB,CAAC,CAAC;AAEF,IAAMC,kBAAkB,oBAAGT,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EACrCE,KAAK,EAAE,MAAM;EACbD,MAAM,EAAE;AACZ,CAAC,CAAC;AAQF,IAAMS,QAAQ,oBAAGV,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GACzB;EACIW,MAAM,EAAE,CAAC;EACTC,OAAO,EAAE,CAAC;EACVV,KAAK,EAAE,kBAAkB;EACzBC,MAAM,EAAE,EAAE;EACVU,eAAe,EAAE,aAAa;EAC9BC,QAAQ,EAAE,UAAU;EACpBR,OAAO,EAAE,MAAM;EACfS,cAAc,EAAE;AACpB,CAAC,EACD,UAACC,KAAoB;EAAA;EAAA,sDAChBA,KAAK,CAACC,IAAI,GAAG,QAAQ,GAAG,KAAK,EAAG,CAAC,EAAE,uCAEnClB,QAAQ;IACLmB,WAAW,EAAEF,KAAK,CAACG,MAAM,GAAG,0BAA0B,GAAG,4BAA4B;IACrFb,OAAO,EAAEU,KAAK,CAACI,UAAU,GAAG,OAAO,GAAG;EAAM,GAE3CX,kBAAkB,EAAG;IAClBY,OAAO,EAAE,GAAG;IACZR,eAAe,EAAEG,KAAK,CAACG,MAAM,GACvB,0BAA0B,GAC1B;EACV,CAAC;AAAA,CAEP,CACL;AASD,IAAMG,UAAqC,GAAG,SAAxCA,UAAqC,QAA6C;EAAA,IAAvCL,IAAI,SAAJA,IAAI;IAAEM,MAAM,SAANA,MAAM;IAAEC,SAAS,SAATA,SAAS;IAAKC,IAAI;EAC7E,oBACI,6BAAC,oBAAS;IAAC,MAAM,EAAEF,MAAO;IAAC,SAAS,EAAEC;EAAU,GAC3C;IAAA;IAAA,IAAGL,MAAM,SAANA,MAAM;MAAEC,UAAU,SAAVA,UAAU;MAAEM,IAAI,SAAJA,IAAI;IAAA,oBACxB;MACI,GAAG,EAAEA,IAAK;MACV,eAAaD,IAAI,CAAC,aAAa,CAAE;MACjC,KAAK;QACD;QACAxB,MAAM,EAAE,MAAM;QACdC,KAAK,EAAE,MAAM;QACbY,QAAQ,EAAE;MAAU,wCACnBG,IAAI,GAAG,QAAQ,GAAG,KAAK,EAAG,CAAC,gDACtB,CAAC,kDACCG,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC;IAChC,gBAEF,6BAAC,QAAQ;MAAC,MAAM,EAAED,MAAO;MAAC,UAAU,EAAEC,UAAW;MAAC,IAAI,EAAEH,IAAI,GAAG,IAAI,GAAG;IAAM,gBACxE,6BAAC,QAAQ,qBACL,6BAAC,kBAAkB,OAAG,CACf,CACJ,CACT;EAAA,CACT,CACO;AAEpB,CAAC;AAAC,eAEaK,UAAU;AAAA"}

package/admin/components/DropZone/Vertical.js

@@ -1,20 +1,14 @@
 "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 _react = _interopRequireDefault(require("react"));
-
 var _styled = _interopRequireDefault(require("@emotion/styled"));
-
 var _Droppable = require("../Droppable");
-
 var InnerDivVertical = /*#__PURE__*/(0, _styled.default)("div", {
   target: "e1yx4w3z0",
   label: "InnerDivVertical"
@@ -48,7 +42,6 @@ var OuterDivVertical = /*#__PURE__*/(0, _styled.default)("div", {
   backgroundColor: "transparent"
 }, function (props) {
   var _InnerDivVertical, _ref;
-
   return _ref = {}, (0, _defineProperty2.default)(_ref, props.last ? "right" : "left", -9), (0, _defineProperty2.default)(_ref, "textAlign", props.last ? "right" : "left"), (0, _defineProperty2.default)(_ref, InnerDivVertical, (_InnerDivVertical = {
     borderColor: props.isOver ? "var(--mdc-theme-primary)" : "var(--mdc-theme-secondary)"
   }, (0, _defineProperty2.default)(_InnerDivVertical, props.last ? "right" : "left", -2), (0, _defineProperty2.default)(_InnerDivVertical, "display", props.isDragging ? "block" : "none"), (0, _defineProperty2.default)(_InnerDivVertical, BackgroundColorDiv, {
@@ -56,21 +49,19 @@ var OuterDivVertical = /*#__PURE__*/(0, _styled.default)("div", {
     backgroundColor: props.isOver ? "var(--mdc-theme-primary)" : "var(--mdc-theme-secondary)"
   }), _InnerDivVertical)), _ref;
 });
-
 var Vertical = function Vertical(_ref2) {
   var depth = _ref2.depth,
-      last = _ref2.last,
-      onDrop = _ref2.onDrop,
-      isVisible = _ref2.isVisible;
+    last = _ref2.last,
+    onDrop = _ref2.onDrop,
+    isVisible = _ref2.isVisible;
   return /*#__PURE__*/_react.default.createElement(_Droppable.Droppable, {
     onDrop: onDrop,
     isVisible: isVisible
   }, function (_ref3) {
     var _ref4;
-
     var isOver = _ref3.isOver,
-        isDragging = _ref3.isDragging,
-        drop = _ref3.drop;
+      isDragging = _ref3.isDragging,
+      drop = _ref3.drop;
     return /*#__PURE__*/_react.default.createElement("div", {
       ref: drop,
       style: (_ref4 = {
@@ -88,6 +79,5 @@ var Vertical = function Vertical(_ref2) {
     }, /*#__PURE__*/_react.default.createElement(InnerDivVertical, null, /*#__PURE__*/_react.default.createElement(BackgroundColorDiv, null))));
   });
 };
-
 var _default = Vertical;
 exports.default = _default;

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

@@ -1 +1 @@
-{"version":3,"names":["InnerDivVertical","styled","position","width","height","zIndex","borderRadius","display","boxSizing","border","borderSpacing","BackgroundColorDiv","OuterDivVertical","top","backgroundColor","props","last","borderColor","isOver","isDragging","opacity","Vertical","depth","onDrop","isVisible","drop","maxWidth"],"sources":["Vertical.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\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-ignore\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-ignore\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: React.FC<VerticalProps> = ({ depth, last, onDrop, isVisible }) => {\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":";;;;;;;;;;;AAAA;;AACA;;AACA;;AAGA,IAAMA,gBAAgB,oBAAGC,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACnCC,QAAQ,EAAE,UADyB;EAEnCC,KAAK,EAAE,EAF4B;EAGnCC,MAAM,EAAE,MAH2B;EAInCC,MAAM,EAAE,CAJ2B;EAKnCC,YAAY,EAAE,CALqB;EAMnCC,OAAO,EAAE,MAN0B;EAOnCC,SAAS,EAAE,YAPwB;EAQnCC,MAAM,EAAE,kBAR2B;EASnCC,aAAa,EAAE;AAToB,CAAjB,CAAtB;AAYA,IAAMC,kBAAkB,oBAAGV,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAAiB;EACrCE,KAAK,EAAE,MAD8B;EAErCC,MAAM,EAAE;AAF6B,CAAjB,CAAxB;AAYA,IAAMQ,gBAAgB,oBAAGX,eAAH,EAAU,KAAV;EAAA;EAAA;AAAA,GAClB;EACIC,QAAQ,EAAE,UADd;EAEIC,KAAK,EAAE,KAFX;EAGIU,GAAG,EAAE,CAHT;EAIIT,MAAM,EAAE,MAJZ;EAKIC,MAAM,EAAE,EALZ;EAMIS,eAAe,EAAE;AANrB,CADkB,EASlB,UAACC,KAAD;EAAA;;EAAA,sDACKA,KAAK,CAACC,IAAN,GAAa,OAAb,GAAuB,MAD5B,EACqC,CAAC,CADtC,oDAEeD,KAAK,CAACC,IAAN,GAAa,OAAb,GAAuB,MAFtC,uCAIKhB,gBAJL;IAKQiB,WAAW,EAAEF,KAAK,CAACG,MAAN,GAAe,0BAAf,GAA4C;EALjE,oDAMSH,KAAK,CAACC,IAAN,GAAa,OAAb,GAAuB,MANhC,EAMyC,CAAC,CAN1C,+DAOiBD,KAAK,CAACI,UAAN,GAAmB,OAAnB,GAA6B,MAP9C,oDASSR,kBATT,EAS8B;IAClBS,OAAO,EAAE,GADS;IAElBN,eAAe,EAAEC,KAAK,CAACG,MAAN,GACX,0BADW,GAEX;EAJY,CAT9B;AAAA,CATkB,CAAtB;;AAmCA,IAAMG,QAAiC,GAAG,SAApCA,QAAoC,QAAwC;EAAA,IAArCC,KAAqC,SAArCA,KAAqC;EAAA,IAA9BN,IAA8B,SAA9BA,IAA8B;EAAA,IAAxBO,MAAwB,SAAxBA,MAAwB;EAAA,IAAhBC,SAAgB,SAAhBA,SAAgB;EAC9E,oBACI,6BAAC,oBAAD;IAAW,MAAM,EAAED,MAAnB;IAA2B,SAAS,EAAEC;EAAtC,GACK;IAAA;;IAAA,IAAGN,MAAH,SAAGA,MAAH;IAAA,IAAWC,UAAX,SAAWA,UAAX;IAAA,IAAuBM,IAAvB,SAAuBA,IAAvB;IAAA,oBACG;MACI,GAAG,EAAEA,IADT;MAEI,KAAK;QACD;QACAtB,KAAK,EAAE,KAFN;QAGDuB,QAAQ,EAAE,OAHT;QAIDtB,MAAM,EAAE,MAJP;QAKDF,QAAQ,EAAE,UALT;QAMDW,GAAG,EAAE;MANJ,wCAOAG,IAAI,GAAG,OAAH,GAAa,MAPjB,EAO0B,CAP1B,kDAQOG,UAAU,GAAG,QAAQG,KAAK,IAAI,CAAjB,CAAH,GAAyB,CAAC,CAR3C;IAFT,gBAaI,6BAAC,gBAAD;MAAkB,MAAM,EAAEJ,MAA1B;MAAkC,UAAU,EAAEC,UAA9C;MAA0D,IAAI,EAAEH;IAAhE,gBACI,6BAAC,gBAAD,qBACI,6BAAC,kBAAD,OADJ,CADJ,CAbJ,CADH;EAAA,CADL,CADJ;AAyBH,CA1BD;;eA4BeK,Q"}
+{"version":3,"names":["InnerDivVertical","styled","position","width","height","zIndex","borderRadius","display","boxSizing","border","borderSpacing","BackgroundColorDiv","OuterDivVertical","top","backgroundColor","props","last","borderColor","isOver","isDragging","opacity","Vertical","depth","onDrop","isVisible","drop","maxWidth"],"sources":["Vertical.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"@emotion/styled\";\nimport { Droppable, IsVisibleCallable } from \"../Droppable\";\nimport { DragSource } from \"~/admin/components/FieldEditor/FieldEditorContext\";\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-ignore\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-ignore\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: React.FC<VerticalProps> = ({ depth, last, onDrop, isVisible }) => {\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":";;;;;;;;AAAA;AACA;AACA;AAGA,IAAMA,gBAAgB,oBAAGC,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EACnCC,QAAQ,EAAE,UAAU;EACpBC,KAAK,EAAE,EAAE;EACTC,MAAM,EAAE,MAAM;EACdC,MAAM,EAAE,CAAC;EACTC,YAAY,EAAE,CAAC;EACfC,OAAO,EAAE,MAAM;EACfC,SAAS,EAAE,YAAY;EACvBC,MAAM,EAAE,kBAAkB;EAC1BC,aAAa,EAAE;AACnB,CAAC,CAAC;AAEF,IAAMC,kBAAkB,oBAAGV,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GAAE;EACrCE,KAAK,EAAE,MAAM;EACbC,MAAM,EAAE;AACZ,CAAC,CAAC;AASF,IAAMQ,gBAAgB,oBAAGX,eAAM,EAAC,KAAK;EAAA;EAAA;AAAA,GACjC;EACIC,QAAQ,EAAE,UAAU;EACpBC,KAAK,EAAE,KAAK;EACZU,GAAG,EAAE,CAAC;EACNT,MAAM,EAAE,MAAM;EACdC,MAAM,EAAE,EAAE;EACVS,eAAe,EAAE;AACrB,CAAC,EACD,UAACC,KAA4B;EAAA;EAAA,sDACxBA,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,MAAM,EAAG,CAAC,CAAC,oDACxBD,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,MAAM,uCAEvChB,gBAAgB;IACbiB,WAAW,EAAEF,KAAK,CAACG,MAAM,GAAG,0BAA0B,GAAG;EAA4B,oDACpFH,KAAK,CAACC,IAAI,GAAG,OAAO,GAAG,MAAM,EAAG,CAAC,CAAC,+DAC1BD,KAAK,CAACI,UAAU,GAAG,OAAO,GAAG,MAAM,oDAE3CR,kBAAkB,EAAG;IAClBS,OAAO,EAAE,GAAG;IACZN,eAAe,EAAEC,KAAK,CAACG,MAAM,GACvB,0BAA0B,GAC1B;EACV,CAAC;AAAA,CAEP,CACL;AASD,IAAMG,QAAiC,GAAG,SAApCA,QAAiC,QAA2C;EAAA,IAArCC,KAAK,SAALA,KAAK;IAAEN,IAAI,SAAJA,IAAI;IAAEO,MAAM,SAANA,MAAM;IAAEC,SAAS,SAATA,SAAS;EACvE,oBACI,6BAAC,oBAAS;IAAC,MAAM,EAAED,MAAO;IAAC,SAAS,EAAEC;EAAU,GAC3C;IAAA;IAAA,IAAGN,MAAM,SAANA,MAAM;MAAEC,UAAU,SAAVA,UAAU;MAAEM,IAAI,SAAJA,IAAI;IAAA,oBACxB;MACI,GAAG,EAAEA,IAAK;MACV,KAAK;QACD;QACAtB,KAAK,EAAE,KAAK;QACZuB,QAAQ,EAAE,OAAO;QACjBtB,MAAM,EAAE,MAAM;QACdF,QAAQ,EAAE,UAAU;QACpBW,GAAG,EAAE;MAAC,wCACLG,IAAI,GAAG,OAAO,GAAG,MAAM,EAAG,CAAC,kDACpBG,UAAU,GAAG,IAAI,IAAIG,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC;IAC/C,gBAEF,6BAAC,gBAAgB;MAAC,MAAM,EAAEJ,MAAO;MAAC,UAAU,EAAEC,UAAW;MAAC,IAAI,EAAEH;IAAK,gBACjE,6BAAC,gBAAgB,qBACb,6BAAC,kBAAkB,OAAG,CACP,CACJ,CACjB;EAAA,CACT,CACO;AAEpB,CAAC;AAAC,eAEaK,QAAQ;AAAA"}

package/admin/components/DropZone/index.js

@@ -1,7 +1,6 @@
 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
@@ -23,9 +22,6 @@ Object.defineProperty(exports, "Vertical", {
     return _Vertical.default;
   }
 });
-
 var _Center = _interopRequireDefault(require("./Center"));
-
 var _Horizontal = _interopRequireDefault(require("./Horizontal"));
-
 var _Vertical = _interopRequireDefault(require("./Vertical"));

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["import Center from \"./Center\";\nimport Horizontal from \"./Horizontal\";\nimport Vertical from \"./Vertical\";\n\nexport { Center, Horizontal, Vertical };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA"}
+{"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["import Center from \"./Center\";\nimport Horizontal from \"./Horizontal\";\nimport Vertical from \"./Vertical\";\n\nexport { Center, Horizontal, Vertical };\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA"}