@jotforminc/dnd-builder 3.0.0 → 3.1.1

package/lib/cjs/assets/svg/toolbox/text.svg.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.svg.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"text.svg.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/lib/cjs/assets/svg/toolbox/text_element.svg.js

@@ -9,9 +9,12 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 function SvgTextElement(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 25 18"
+    fill: "currentColor",
+    viewBox: "0 0 24 24"
   }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
-    d: "M14.49.75l.2 4.252h-.93l-.029-.217c-.083-.634-.194-1.081-.326-1.33-.221-.415-.51-.715-.87-.907-.366-.195-.86-.295-1.482-.295H9.05v11.974c0 .923.1 1.495.254 1.673.247.272.64.413 1.196.413h.804v.937H4.018v-.937h.817c.6 0 1.002-.17 1.233-.505.135-.195.216-.734.216-1.58V2.252H4.61c-.722 0-1.23.053-1.508.15-.357.13-.666.384-.93.768-.263.385-.423.917-.475 1.6l-.018.231H.737L.951.75H14.49zm10.315 5.068l.15 3.047h-.798l-.03-.217c-.057-.42-.134-.715-.22-.873a1.392 1.392 0 00-.585-.584C23.074 7.065 22.735 7 22.304 7H20.96v8.047c0 .605.068.978.158 1.077.159.169.418.258.795.258h.642v.797h-5.301v-.797h.65c.406 0 .669-.107.816-.312.082-.113.137-.466.137-1.023V6.999h-1.11c-.505 0-.858.035-1.045.098-.24.083-.446.246-.623.494-.177.247-.286.594-.321 1.043l-.019.23h-.811l.16-3.046h9.718z"
+    fillRule: "evenodd",
+    d: "M8 5.5A1.5 1.5 0 019.5 4h11a1.5 1.5 0 010 3h-4v11.5a1.5 1.5 0 01-3 0V7h-4A1.5 1.5 0 018 5.5zM3.5 9a1.5 1.5 0 100 3h2v6.5a1.5 1.5 0 003 0V12h2a1.5 1.5 0 000-3h-7z",
+    clipRule: "evenodd"
   })));
 }
 

package/lib/cjs/assets/svg/toolbox/text_element.svg.js.map

@@ -1 +1 @@
-{"version":3,"file":"text_element.svg.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"text_element.svg.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/lib/cjs/assets/svg/trash.svg.js

@@ -9,9 +9,12 @@ function _extends() { _extends = Object.assign || function (target) { for (var i
 function SvgTrash(props) {
   return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 13 17"
+    fill: "currentColor",
+    viewBox: "0 0 24 24"
   }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
-    d: "M11.534 4v11.207c0 1.039-.722 1.793-1.706 1.793H3.29c-.984 0-1.706-.765-1.706-1.793V4h9.95zM9.03 6.591H7.62c-.23 0-.23 0-.23.252v7.544h1.64V6.59zm-3.55 0H4.07v7.796h1.64v-7.62c-.002-.132-.015-.165-.108-.173l-.053-.002zM8.16 0c.076 0 .175.044.241.11.22.244.417.51.648.742a.424.424 0 00.296.144h3.239V3h-12V1.007l3.25-.01A.47.47 0 004.13.851c.22-.232.417-.498.637-.73A.345.345 0 015.019 0h3.14z"
+    fillRule: "evenodd",
+    d: "M4 5h16a1 1 0 001-1V3a1 1 0 00-1-1h-2.764c-.55-.614-1.348-1-2.236-1H9a2.99 2.99 0 00-2.236 1H4a1 1 0 00-1 1v1a1 1 0 001 1zm.036 1.534A.5.5 0 014.535 6h14.93a.5.5 0 01.5.534l-.92 13.667A3 3 0 0116.052 23H7.948a3 3 0 01-2.993-2.799l-.92-13.667zM10 11a1 1 0 00-1 1v5a1 1 0 102 0v-5a1 1 0 00-1-1zm4 0a1 1 0 00-1 1v5a1 1 0 102 0v-5a1 1 0 00-1-1z",
+    clipRule: "evenodd"
   })));
 }
 

package/lib/cjs/assets/svg/trash.svg.js.map

@@ -1 +1 @@
-{"version":3,"file":"trash.svg.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"trash.svg.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}

package/lib/cjs/components/Builder/DraggableLayer.js

@@ -0,0 +1,44 @@
+'use strict';
+
+var PropTypes = require('prop-types');
+var reactDnd = require('react-dnd');
+var DraggableItemLayer = require('../DraggableItem/DraggableItemLayer.js');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var PropTypes__default = /*#__PURE__*/_interopDefaultLegacy(PropTypes);
+
+var DraggableLayer = function DraggableLayer(_ref) {
+  var _ref$guides = _ref.guides,
+      guides = _ref$guides === void 0 ? {} : _ref$guides,
+      _ref$pageRefs = _ref.pageRefs,
+      pageRefs = _ref$pageRefs === void 0 ? {} : _ref$pageRefs;
+  var collectedProps = reactDnd.useDragLayer(function (monitor) {
+    return {
+      currentOffset: monitor.getSourceClientOffset(),
+      initialOffset: monitor.getInitialSourceClientOffset(),
+      isDragging: monitor.isDragging(),
+      item: monitor.getItem(),
+      itemType: monitor.getItemType()
+    };
+  });
+
+  if (!collectedProps.currentOffset || !collectedProps.isDragging) {
+    return null;
+  }
+
+  return /*#__PURE__*/jsxRuntime.jsx(DraggableItemLayer, {
+    collectedProps: collectedProps,
+    guides: guides,
+    pageRefs: pageRefs
+  });
+};
+
+DraggableLayer.propTypes = {
+  guides: PropTypes__default['default'].shape({}),
+  pageRefs: PropTypes__default['default'].shape({})
+};
+
+module.exports = DraggableLayer;
+//# sourceMappingURL=DraggableLayer.js.map

package/lib/cjs/components/Builder/DraggableLayer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DraggableLayer.js","sources":["../../../../src/components/Builder/DraggableLayer.js"],"sourcesContent":["import PropTypes from 'prop-types';\nimport { useDragLayer } from 'react-dnd';\nimport DraggableItemLayer from '../DraggableItem/DraggableItemLayer';\n\nconst DraggableLayer = ({\n  guides = {},\n  pageRefs = {},\n}) => {\n  const collectedProps = useDragLayer(monitor => ({\n    currentOffset: monitor.getSourceClientOffset(),\n    initialOffset: monitor.getInitialSourceClientOffset(),\n    isDragging: monitor.isDragging(),\n    item: monitor.getItem(),\n    itemType: monitor.getItemType(),\n  }));\n\n  if (!collectedProps.currentOffset || !collectedProps.isDragging) {\n    return null;\n  }\n\n  return (\n    <DraggableItemLayer\n      collectedProps={collectedProps}\n      guides={guides}\n      pageRefs={pageRefs}\n    />\n  );\n};\n\nDraggableLayer.propTypes = {\n  guides: PropTypes.shape({}),\n  pageRefs: PropTypes.shape({}),\n};\n\nexport default DraggableLayer;\n"],"names":["DraggableLayer","guides","pageRefs","collectedProps","useDragLayer","monitor","currentOffset","getSourceClientOffset","initialOffset","getInitialSourceClientOffset","isDragging","item","getItem","itemType","getItemType","_jsx","propTypes","PropTypes","shape"],"mappings":";;;;;;;;;;;IAIMA,cAAc,GAAG,SAAjBA,cAAiB,OAGjB;AAAA,yBAFJC,MAEI;AAAA,MAFJA,MAEI,4BAFK,EAEL;AAAA,2BADJC,QACI;AAAA,MADJA,QACI,8BADO,EACP;AACJ,MAAMC,cAAc,GAAGC,qBAAY,CAAC,UAAAC,OAAO;AAAA,WAAK;AAC9CC,MAAAA,aAAa,EAAED,OAAO,CAACE,qBAAR,EAD+B;AAE9CC,MAAAA,aAAa,EAAEH,OAAO,CAACI,4BAAR,EAF+B;AAG9CC,MAAAA,UAAU,EAAEL,OAAO,CAACK,UAAR,EAHkC;AAI9CC,MAAAA,IAAI,EAAEN,OAAO,CAACO,OAAR,EAJwC;AAK9CC,MAAAA,QAAQ,EAAER,OAAO,CAACS,WAAR;AALoC,KAAL;AAAA,GAAR,CAAnC;;AAQA,MAAI,CAACX,cAAc,CAACG,aAAhB,IAAiC,CAACH,cAAc,CAACO,UAArD,EAAiE;AAC/D,WAAO,IAAP;AACD;;AAED,sBACEK,eAAC,kBAAD;AACE,IAAA,cAAc,EAAEZ,cADlB;AAEE,IAAA,MAAM,EAAEF,MAFV;AAGE,IAAA,QAAQ,EAAEC;AAHZ,IADF;AAOD;;AAEDF,cAAc,CAACgB,SAAf,GAA2B;AACzBf,EAAAA,MAAM,EAAEgB,6BAAS,CAACC,KAAV,CAAgB,EAAhB,CADiB;AAEzBhB,EAAAA,QAAQ,EAAEe,6BAAS,CAACC,KAAV,CAAgB,EAAhB;AAFe,CAA3B;;;;"}

package/lib/cjs/components/Builder/Element.js

@@ -79,6 +79,7 @@ var Element = function Element(_ref) {
         };
       },
       item: function item() {
+        setActiveElement(null);
         return _objectSpread({
           itemType: itemType,
           type: itemTypes.DROPPABLE_ITEM_TYPE

package/lib/cjs/components/Builder/Element.js.map

@@ -1 +1 @@
-{"version":3,"file":"Element.js","sources":["../../../../src/components/Builder/Element.js"],"sourcesContent":["import { useEffect, memo } from 'react';\nimport PropTypes from 'prop-types';\nimport { useDrag } from 'react-dnd';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { DROPPABLE_ITEM_TYPE } from '../../constants/itemTypes';\nimport {\n  getMostVisiblePage, getExactIconType, getAvailableCoordinate,\n} from '../../utils/functions';\nimport generateId from '../../utils/generateId';\nimport * as icons from '../../utils/icons';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\n\nconst Element = ({\n  icon = null,\n  iconType = '',\n  itemType = '',\n  title = '',\n  ...additionalData\n}) => {\n  const acceptedItems = usePropStore(state => state.acceptedItems);\n  const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n  const onItemAdd = usePropStore(state => state.onItemAdd);\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n  const zoom = useBuilderStore(state => state.zoom);\n\n  const [{ isDragging }, drag, preview] = useDrag(() => ({\n    collect: monitor => ({\n      isDragging: monitor.isDragging(),\n    }),\n\n    item: () => ({\n      itemType,\n      type: DROPPABLE_ITEM_TYPE,\n      ...additionalData,\n    }),\n\n    type: DROPPABLE_ITEM_TYPE,\n  }), [itemType, additionalData]);\n\n  useEffect(() => {\n    preview(getEmptyImage(), { captureDraggingState: true });\n  }, [preview]);\n\n  const onElementClick = () => {\n    const itemID = generateId();\n    const page = getMostVisiblePage();\n    let left = 0;\n    let top = 0;\n    if (page) { // for test\n      [left, top] = getAvailableCoordinate(page, zoom);\n    }\n    onItemAdd({\n      ...acceptedItems[itemType].details,\n      ...additionalData,\n      id: itemID,\n      left,\n      pageID: page.id,\n      top,\n    });\n    onAnEventTrigger('reportItemAdd', itemType);\n    setActiveElement(itemID);\n    setIsRightPanelOpen(true);\n  };\n\n  const onElementOtherActions = () => {};\n\n  const exactIconType = getExactIconType(iconType);\n  const Icon = icons[exactIconType] ? icons[exactIconType] : icons.label;\n  return (\n    <>\n      <div\n        ref={drag}\n        className=\"toolItem d-flex a-center js-toolItem\"\n        onClick={onElementClick}\n        onKeyDown={onElementOtherActions}\n        style={{ cursor: isDragging ? 'grabbing' : 'pointer', opacity: isDragging ? 0.5 : 1 }}\n        title={title}\n      >\n        <span className=\"toolItem-icon d-flex j-center a-center\">\n          {icon ? icon : (\n            <Icon className={`jfReportSVG icon-question icon-${iconType}`} />\n          )}\n        </span>\n        <span className=\"js-toolItemName toolItem-name d-flex a-center\">\n          { title }\n        </span>\n      </div>\n    </>\n  );\n};\n\nElement.propTypes = {\n  icon: PropTypes.oneOfType([PropTypes.element, PropTypes.func]),\n  iconType: PropTypes.string,\n  itemType: PropTypes.string,\n  title: PropTypes.string,\n};\n\nexport default memo(Element);\n"],"names":["Element","icon","iconType","itemType","title","additionalData","acceptedItems","usePropStore","state","onAnEventTrigger","onItemAdd","setActiveElement","useBuilderStore","setIsRightPanelOpen","zoom","useDrag","collect","monitor","isDragging","item","type","DROPPABLE_ITEM_TYPE","drag","preview","useEffect","getEmptyImage","captureDraggingState","onElementClick","itemID","generateId","page","getMostVisiblePage","left","top","getAvailableCoordinate","details","id","pageID","onElementOtherActions","exactIconType","getExactIconType","Icon","icons","_jsx","_jsxs","cursor","opacity","propTypes","PropTypes","oneOfType","element","func","string","memo"],"mappings":"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"}
+{"version":3,"file":"Element.js","sources":["../../../../src/components/Builder/Element.js"],"sourcesContent":["import { useEffect, memo } from 'react';\nimport PropTypes from 'prop-types';\nimport { useDrag } from 'react-dnd';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { DROPPABLE_ITEM_TYPE } from '../../constants/itemTypes';\nimport {\n  getMostVisiblePage, getExactIconType, getAvailableCoordinate,\n} from '../../utils/functions';\nimport generateId from '../../utils/generateId';\nimport * as icons from '../../utils/icons';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\n\nconst Element = ({\n  icon = null,\n  iconType = '',\n  itemType = '',\n  title = '',\n  ...additionalData\n}) => {\n  const acceptedItems = usePropStore(state => state.acceptedItems);\n  const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n  const onItemAdd = usePropStore(state => state.onItemAdd);\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n  const zoom = useBuilderStore(state => state.zoom);\n\n  const [{ isDragging }, drag, preview] = useDrag(() => ({\n    collect: monitor => ({\n      isDragging: monitor.isDragging(),\n    }),\n\n    item: () => {\n      setActiveElement(null);\n      return {\n        itemType,\n        type: DROPPABLE_ITEM_TYPE,\n        ...additionalData,\n      };\n    },\n\n    type: DROPPABLE_ITEM_TYPE,\n  }), [itemType, additionalData]);\n\n  useEffect(() => {\n    preview(getEmptyImage(), { captureDraggingState: true });\n  }, [preview]);\n\n  const onElementClick = () => {\n    const itemID = generateId();\n    const page = getMostVisiblePage();\n    let left = 0;\n    let top = 0;\n    if (page) { // for test\n      [left, top] = getAvailableCoordinate(page, zoom);\n    }\n    onItemAdd({\n      ...acceptedItems[itemType].details,\n      ...additionalData,\n      id: itemID,\n      left,\n      pageID: page.id,\n      top,\n    });\n    onAnEventTrigger('reportItemAdd', itemType);\n    setActiveElement(itemID);\n    setIsRightPanelOpen(true);\n  };\n\n  const onElementOtherActions = () => {};\n\n  const exactIconType = getExactIconType(iconType);\n  const Icon = icons[exactIconType] ? icons[exactIconType] : icons.label;\n  return (\n    <>\n      <div\n        ref={drag}\n        className=\"toolItem d-flex a-center js-toolItem\"\n        onClick={onElementClick}\n        onKeyDown={onElementOtherActions}\n        style={{ cursor: isDragging ? 'grabbing' : 'pointer', opacity: isDragging ? 0.5 : 1 }}\n        title={title}\n      >\n        <span className=\"toolItem-icon d-flex j-center a-center\">\n          {icon ? icon : (\n            <Icon className={`jfReportSVG icon-question icon-${iconType}`} />\n          )}\n        </span>\n        <span className=\"js-toolItemName toolItem-name d-flex a-center\">\n          { title }\n        </span>\n      </div>\n    </>\n  );\n};\n\nElement.propTypes = {\n  icon: PropTypes.oneOfType([PropTypes.element, PropTypes.func]),\n  iconType: PropTypes.string,\n  itemType: PropTypes.string,\n  title: PropTypes.string,\n};\n\nexport default memo(Element);\n"],"names":["Element","icon","iconType","itemType","title","additionalData","acceptedItems","usePropStore","state","onAnEventTrigger","onItemAdd","setActiveElement","useBuilderStore","setIsRightPanelOpen","zoom","useDrag","collect","monitor","isDragging","item","type","DROPPABLE_ITEM_TYPE","drag","preview","useEffect","getEmptyImage","captureDraggingState","onElementClick","itemID","generateId","page","getMostVisiblePage","left","top","getAvailableCoordinate","details","id","pageID","onElementOtherActions","exactIconType","getExactIconType","Icon","icons","_jsx","_jsxs","cursor","opacity","propTypes","PropTypes","oneOfType","element","func","string","memo"],"mappings":"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"}

package/lib/cjs/components/Builder/Page.js

@@ -40,7 +40,6 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-var emptyObject = {};
 
 var Page = function Page(_ref) {
   var _ref$guides = _ref.guides,
@@ -49,8 +48,6 @@ var Page = function Page(_ref) {
       items = _ref$items === void 0 ? [] : _ref$items,
       _ref$page = _ref.page,
       page = _ref$page === void 0 ? {} : _ref$page,
-      _ref$pageRef = _ref.pageRef,
-      pageRef = _ref$pageRef === void 0 ? {} : _ref$pageRef,
       _ref$style = _ref.style,
       style = _ref$style === void 0 ? {} : _ref$style;
   var activeElement = BuilderContext.useBuilderStore(function (state) {
@@ -65,6 +62,9 @@ var Page = function Page(_ref) {
   var zoom = BuilderContext.useBuilderStore(function (state) {
     return state.zoom;
   });
+  var isResize = BuilderContext.useBuilderStore(function (state) {
+    return state.isResize;
+  });
   var onItemAdd = PropContext.usePropStore(function (state) {
     return state.onItemAdd;
   });
@@ -95,12 +95,13 @@ var Page = function Page(_ref) {
       matches = _useState2[0],
       setMatches = _useState2[1];
 
-  var _useState3 = React.useState(false),
-      _useState4 = _slicedToArray(_useState3, 2),
-      isResize = _useState4[0],
-      setIsResize = _useState4[1];
-
   var requestRef = React.useRef();
+  var dropRef = React.useRef(null); // for getting the bounding client rect
+
+  var handleMatches = React.useCallback(function (item) {
+    var newMatches = functions.getMatchesForItem(item, guides, zoom);
+    setMatches(newMatches);
+  }, [guides, zoom]);
 
   var drawAlignmentGuides = function drawAlignmentGuides(item, monitor) {
     return function () {
@@ -110,17 +111,14 @@ var Page = function Page(_ref) {
           return;
         }
 
-        var coords = functions.getCorrectDroppedOffsetValue(monitor, pageRef.current.getBoundingClientRect(), zoom);
+        var coords = functions.getCorrectDroppedOffsetValue(monitor.getSourceClientOffset(), monitor.getInitialSourceClientOffset(), dropRef.current.getBoundingClientRect(), zoom);
 
         var activeItem = _objectSpread(_objectSpread({}, item), coords);
 
-        var _guides = _objectSpread(_objectSpread({}, guides[item.pageID]), {}, _defineProperty({}, item.id, _objectSpread(_objectSpread({}, guides[item.pageID][item.id]), {}, {
-          x: functions.calculateGuidePositions(activeItem, 'x', zoom),
-          y: functions.calculateGuidePositions(activeItem, 'y', zoom)
-        })));
+        if (activeItem.id && activeItem.pageID) {
+          handleMatches(activeItem);
+        }
 
-        var match = functions.proximityListener(item.id, _guides);
-        setMatches(match);
         requestRef.current = undefined;
       } catch (error) {
         setMatches({});
@@ -144,10 +142,9 @@ var Page = function Page(_ref) {
       };
     },
     drop: function drop(item, monitor) {
-      var _pageRef$current;
+      var _dropRef$current;
 
-      var pageClient = (_pageRef$current = pageRef.current) === null || _pageRef$current === void 0 ? void 0 : _pageRef$current.getBoundingClientRect();
-      var coords = functions.getCorrectDroppedOffsetValue(monitor, pageClient, zoom);
+      var coords = functions.getCorrectDroppedOffsetValue(monitor.getSourceClientOffset(), monitor.getInitialSourceClientOffset(), (_dropRef$current = dropRef.current) === null || _dropRef$current === void 0 ? void 0 : _dropRef$current.getBoundingClientRect(), zoom);
       var type = monitor.getItemType();
 
       var id = item.id,
@@ -168,7 +165,9 @@ var Page = function Page(_ref) {
         setIsRightPanelOpen(true);
         newCoords[itemID] = coords;
       } else if (type === itemTypes.DRAGGABLE_ITEM_TYPE) {
-        var dragCoords = functions.getCorrectDroppedOffsetValueBySnap(coords, guides, id, pages, zoom);
+        var newItem = _objectSpread(_objectSpread({}, item), coords);
+
+        var dragCoords = functions.getCorrectDroppedOffsetValueBySnap(newItem, guides, zoom);
 
         if (isMultipleItemSelected) {
           var leftDifference = additionalData.left - dragCoords.left;
@@ -209,12 +208,26 @@ var Page = function Page(_ref) {
       isOver = _useDrop2[0].isOver,
       drop = _useDrop2[1];
 
+  var getIntersectionsFromMatches = React.useCallback(function (item) {
+    var _getCoordinatesFromMa = functions.getCoordinatesFromMatches(item, matches),
+        newActiveBoxLeft = _getCoordinatesFromMa.left,
+        newActiveBoxTop = _getCoordinatesFromMa.top;
+
+    return {
+      newActiveBoxLeft: newActiveBoxLeft,
+      newActiveBoxTop: newActiveBoxTop
+    };
+  }, [matches]);
+  var combinedRef = React.useCallback(function (node) {
+    dropRef.current = node;
+    drop(node);
+  }, [drop]);
   var reportBackgroundColor = settings.reportBackgroundColor;
   var backgroundColor = page.backgroundColor;
   var bgColor = backgroundColor ? backgroundColor : reportBackgroundColor || '#fff';
   return /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
     children: /*#__PURE__*/jsxRuntime.jsx("div", {
-      ref: drop,
+      ref: combinedRef,
       className: classNames.pageContainer,
       style: _objectSpread({
         backgroundColor: bgColor
@@ -222,13 +235,9 @@ var Page = function Page(_ref) {
       children: /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: "jfReport-hider o-hidden f-all p-relative",
         children: [/*#__PURE__*/jsxRuntime.jsx(ReportItemsWrapper, {
-          guides: guides[page.id],
-          isResize: isResize // if we send matches all the time, DraggableItems are also rendered on dragging
-          ,
-          items: items,
-          matches: isResize ? matches : emptyObject,
-          setIsResize: setIsResize,
-          setMatches: setMatches
+          getIntersectionsFromMatches: getIntersectionsFromMatches,
+          handleMatches: handleMatches,
+          items: items
         }), additionalPageItems, /*#__PURE__*/jsxRuntime.jsx(AlignmentGuides, {
           axis: "x",
           guides: guides[page.id],
@@ -251,9 +260,6 @@ Page.propTypes = {
   page: PropTypes__default['default'].shape({
     backgroundColor: PropTypes__default['default'].string
   }),
-  pageRef: PropTypes__default['default'].shape({
-    current: PropTypes__default['default'].any
-  }),
   style: PropTypes__default['default'].shape({})
 };
 var Page$1 = /*#__PURE__*/React.memo(Page);

package/lib/cjs/components/Builder/Page.js.map

@@ -1 +1 @@
-{"version":3,"file":"Page.js","sources":["../../../../src/components/Builder/Page.js"],"sourcesContent":["import {\n  useState,\n  useRef,\n  memo,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport { useDrop } from 'react-dnd';\nimport {\n  ACCEPTED_TYPES,\n  DRAGGABLE_ITEM_TYPE,\n  DROPPABLE_ITEM_TYPE,\n} from '../../constants/itemTypes';\nimport AlignmentGuides from '../AlignmentGuides';\nimport ReportItemsWrapper from '../ReportItemsWrapper';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\nimport {\n  proximityListener,\n  calculateGuidePositions,\n  getCorrectDroppedOffsetValue,\n  getCorrectDroppedOffsetValueBySnap,\n  findItemById,\n} from '../../utils/functions';\nimport * as classNames from '../../constants/classNames';\nimport generateId from '../../utils/generateId';\n\nconst emptyObject = {};\n\nconst Page = ({\n  guides = {},\n  items = [],\n  page = {},\n  pageRef = {},\n  style = {},\n}) => {\n  const activeElement = useBuilderStore(state => state.activeElement);\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n  const zoom = useBuilderStore(state => state.zoom);\n\n  const onItemAdd = usePropStore(state => state.onItemAdd);\n  const onItemMove = usePropStore(state => state.onItemMove);\n  const onItemsMove = usePropStore(state => state.onItemsMove);\n  const additionalPageItems = usePropStore(state => state.additionalPageItems);\n  const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n  const settings = usePropStore(state => state.settings);\n  const acceptedItems = usePropStore(state => state.acceptedItems);\n  const pages = usePropStore(state => state.pages);\n\n  const [matches, setMatches] = useState({});\n  const [isResize, setIsResize] = useState(false);\n  const requestRef = useRef();\n\n  const drawAlignmentGuides = (item, monitor) => {\n    return () => {\n      try {\n        if (!monitor || monitor.getSourceClientOffset() === null) {\n          requestRef.current = undefined;\n          return;\n        }\n        const coords = getCorrectDroppedOffsetValue(\n          monitor,\n          pageRef.current.getBoundingClientRect(),\n          zoom,\n        );\n        const activeItem = {\n          ...item, ...coords,\n        };\n        const _guides = {\n          ...guides[item.pageID],\n          [item.id]: {\n            ...guides[item.pageID][item.id],\n            x: calculateGuidePositions(activeItem, 'x', zoom),\n            y: calculateGuidePositions(activeItem, 'y', zoom),\n          },\n        };\n        const match = proximityListener(item.id, _guides);\n        setMatches(match);\n        requestRef.current = undefined;\n      } catch (error) {\n        setMatches({});\n      }\n    };\n  };\n\n  const isMultipleItemSelected = activeElement !== null && activeElement.length > 1;\n\n  const onHover = (item, monitor) => {\n    if (!requestRef.current) {\n      requestRef.current = global.requestAnimationFrame(drawAlignmentGuides(item, monitor));\n    }\n  };\n\n  const [{ isOver }, drop] = useDrop({\n    accept: ACCEPTED_TYPES,\n    collect: monitor => {\n      return {\n        isOver: monitor.isOver(),\n      };\n    },\n    drop: (item, monitor) => {\n      const pageClient = pageRef.current?.getBoundingClientRect();\n      const coords = getCorrectDroppedOffsetValue(\n        monitor,\n        pageClient,\n        zoom,\n      );\n      const type = monitor.getItemType();\n      const {\n        id, itemType, pageID, ...additionalData\n      } = item;\n      const newCoords = {};\n      if (type === DROPPABLE_ITEM_TYPE) {\n        const itemID = generateId();\n        onItemAdd({\n          ...acceptedItems[itemType].details,\n          id: itemID,\n          pageID: page.id,\n          ...coords,\n          ...additionalData,\n        });\n        onAnEventTrigger('reportItemAdd', itemType);\n        setActiveElement(itemID);\n        setIsRightPanelOpen(true);\n        newCoords[itemID] = coords;\n      } else if (type === DRAGGABLE_ITEM_TYPE) {\n        const dragCoords = getCorrectDroppedOffsetValueBySnap(coords, guides, id, pages, zoom);\n        if (isMultipleItemSelected) {\n          const leftDifference = additionalData.left - dragCoords.left;\n          const topDifference = additionalData.top - dragCoords.top;\n          const _items = activeElement.reduce((acc, curr) => {\n            const tempItem = findItemById(curr, pages);\n            acc[curr] = {\n              id: curr,\n              left: tempItem.left - leftDifference,\n              pageID: page.id,\n              top: tempItem.top - topDifference,\n            };\n            newCoords[curr] = {\n              left: tempItem.left - leftDifference,\n              top: tempItem.top - topDifference,\n            };\n            return acc;\n          }, {});\n          onItemsMove({ items: _items });\n        } else {\n          onItemMove({\n            id,\n            pageID: page.id,\n            ...dragCoords,\n          });\n          newCoords[id] = dragCoords;\n        }\n      }\n\n      return newCoords;\n    },\n    hover: onHover,\n  });\n\n  const { reportBackgroundColor } = settings;\n  const { backgroundColor } = page;\n  const bgColor = backgroundColor ? backgroundColor : reportBackgroundColor || '#fff';\n\n  return (\n    <>\n      <div\n        ref={drop}\n        className={classNames.pageContainer}\n        style={{\n          backgroundColor: bgColor,\n          ...style,\n        }}\n      >\n        <div className=\"jfReport-hider o-hidden f-all p-relative\">\n          <ReportItemsWrapper\n            guides={guides[page.id]}\n            isResize={isResize}\n            // if we send matches all the time, DraggableItems are also rendered on dragging\n            items={items}\n            matches={isResize ? matches : emptyObject}\n            setIsResize={setIsResize}\n            setMatches={setMatches}\n          />\n          {additionalPageItems}\n          <AlignmentGuides\n            axis=\"x\"\n            guides={guides[page.id]}\n            matches={matches}\n            show={(isOver || isResize)}\n          />\n          <AlignmentGuides\n            axis=\"y\"\n            guides={guides[page.id]}\n            matches={matches}\n            show={(isOver || isResize)}\n          />\n        </div>\n      </div>\n    </>\n  );\n};\n\nPage.propTypes = {\n  guides: PropTypes.shape({}),\n  items: PropTypes.arrayOf(\n    PropTypes.shape({}),\n  ),\n  page: PropTypes.shape({\n    backgroundColor: PropTypes.string,\n  }),\n  pageRef: PropTypes.shape({\n    current: PropTypes.any,\n  }),\n  style: PropTypes.shape({}),\n};\n\nexport default memo(Page);\n"],"names":["emptyObject","Page","guides","items","page","pageRef","style","activeElement","useBuilderStore","state","setActiveElement","setIsRightPanelOpen","zoom","onItemAdd","usePropStore","onItemMove","onItemsMove","additionalPageItems","onAnEventTrigger","settings","acceptedItems","pages","useState","matches","setMatches","isResize","setIsResize","requestRef","useRef","drawAlignmentGuides","item","monitor","getSourceClientOffset","current","undefined","coords","getCorrectDroppedOffsetValue","getBoundingClientRect","activeItem","_guides","pageID","id","x","calculateGuidePositions","y","match","proximityListener","error","isMultipleItemSelected","length","onHover","global","requestAnimationFrame","useDrop","accept","ACCEPTED_TYPES","collect","isOver","drop","pageClient","type","getItemType","itemType","additionalData","newCoords","DROPPABLE_ITEM_TYPE","itemID","generateId","details","DRAGGABLE_ITEM_TYPE","dragCoords","getCorrectDroppedOffsetValueBySnap","leftDifference","left","topDifference","top","_items","reduce","acc","curr","tempItem","findItemById","hover","reportBackgroundColor","backgroundColor","bgColor","_jsx","classNames","_jsxs","propTypes","PropTypes","shape","arrayOf","string","any","memo"],"mappings":"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"}
+{"version":3,"file":"Page.js","sources":["../../../../src/components/Builder/Page.js"],"sourcesContent":["import {\n  useState,\n  useRef,\n  memo,\n  useCallback,\n} from 'react';\nimport PropTypes from 'prop-types';\nimport { useDrop } from 'react-dnd';\nimport {\n  ACCEPTED_TYPES,\n  DRAGGABLE_ITEM_TYPE,\n  DROPPABLE_ITEM_TYPE,\n} from '../../constants/itemTypes';\nimport AlignmentGuides from '../AlignmentGuides';\nimport ReportItemsWrapper from '../ReportItemsWrapper';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\nimport {\n  getCorrectDroppedOffsetValue,\n  getCorrectDroppedOffsetValueBySnap,\n  findItemById,\n  getMatchesForItem,\n  getCoordinatesFromMatches,\n} from '../../utils/functions';\nimport * as classNames from '../../constants/classNames';\nimport generateId from '../../utils/generateId';\n\nconst Page = ({\n  guides = {},\n  items = [],\n  page = {},\n  style = {},\n}) => {\n  const activeElement = useBuilderStore(state => state.activeElement);\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n  const zoom = useBuilderStore(state => state.zoom);\n  const isResize = useBuilderStore(state => state.isResize);\n\n  const onItemAdd = usePropStore(state => state.onItemAdd);\n  const onItemMove = usePropStore(state => state.onItemMove);\n  const onItemsMove = usePropStore(state => state.onItemsMove);\n  const additionalPageItems = usePropStore(state => state.additionalPageItems);\n  const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n  const settings = usePropStore(state => state.settings);\n  const acceptedItems = usePropStore(state => state.acceptedItems);\n  const pages = usePropStore(state => state.pages);\n\n  const [matches, setMatches] = useState({});\n  const requestRef = useRef();\n  const dropRef = useRef(null); // for getting the bounding client rect\n\n  const handleMatches = useCallback(item => {\n    const newMatches = getMatchesForItem(item, guides, zoom);\n    setMatches(newMatches);\n  }, [guides, zoom]);\n\n  const drawAlignmentGuides = (item, monitor) => {\n    return () => {\n      try {\n        if (!monitor || monitor.getSourceClientOffset() === null) {\n          requestRef.current = undefined;\n          return;\n        }\n        const coords = getCorrectDroppedOffsetValue(\n          monitor.getSourceClientOffset(),\n          monitor.getInitialSourceClientOffset(),\n          dropRef.current.getBoundingClientRect(),\n          zoom,\n        );\n        const activeItem = {\n          ...item, ...coords,\n        };\n        if (activeItem.id && activeItem.pageID) {\n          handleMatches(activeItem);\n        }\n        requestRef.current = undefined;\n      } catch (error) {\n        setMatches({});\n      }\n    };\n  };\n\n  const isMultipleItemSelected = activeElement !== null && activeElement.length > 1;\n\n  const onHover = (item, monitor) => {\n    if (!requestRef.current) {\n      requestRef.current = global.requestAnimationFrame(drawAlignmentGuides(item, monitor));\n    }\n  };\n\n  const [{ isOver }, drop] = useDrop({\n    accept: ACCEPTED_TYPES,\n    collect: monitor => {\n      return {\n        isOver: monitor.isOver(),\n      };\n    },\n    drop: (item, monitor) => {\n      const coords = getCorrectDroppedOffsetValue(\n        monitor.getSourceClientOffset(),\n        monitor.getInitialSourceClientOffset(),\n        dropRef.current?.getBoundingClientRect(),\n        zoom,\n      );\n      const type = monitor.getItemType();\n      const {\n        id, itemType, pageID, ...additionalData\n      } = item;\n      const newCoords = {};\n      if (type === DROPPABLE_ITEM_TYPE) {\n        const itemID = generateId();\n        onItemAdd({\n          ...acceptedItems[itemType].details,\n          id: itemID,\n          pageID: page.id,\n          ...coords,\n          ...additionalData,\n        });\n        onAnEventTrigger('reportItemAdd', itemType);\n        setActiveElement(itemID);\n        setIsRightPanelOpen(true);\n        newCoords[itemID] = coords;\n      } else if (type === DRAGGABLE_ITEM_TYPE) {\n        const newItem = { ...item, ...coords };\n        const dragCoords = getCorrectDroppedOffsetValueBySnap(newItem, guides, zoom);\n        if (isMultipleItemSelected) {\n          const leftDifference = additionalData.left - dragCoords.left;\n          const topDifference = additionalData.top - dragCoords.top;\n          const _items = activeElement.reduce((acc, curr) => {\n            const tempItem = findItemById(curr, pages);\n            acc[curr] = {\n              id: curr,\n              left: tempItem.left - leftDifference,\n              pageID: page.id,\n              top: tempItem.top - topDifference,\n            };\n            newCoords[curr] = {\n              left: tempItem.left - leftDifference,\n              top: tempItem.top - topDifference,\n            };\n            return acc;\n          }, {});\n          onItemsMove({ items: _items });\n        } else {\n          onItemMove({\n            id,\n            pageID: page.id,\n            ...dragCoords,\n          });\n          newCoords[id] = dragCoords;\n        }\n      }\n\n      return newCoords;\n    },\n    hover: onHover,\n  });\n\n  const getIntersectionsFromMatches = useCallback(item => {\n    const {\n      left: newActiveBoxLeft,\n      top: newActiveBoxTop,\n    } = getCoordinatesFromMatches(item, matches);\n\n    return { newActiveBoxLeft, newActiveBoxTop };\n  }, [matches]);\n\n  const combinedRef = useCallback(node => {\n    dropRef.current = node;\n    drop(node);\n  }, [drop]);\n\n  const { reportBackgroundColor } = settings;\n  const { backgroundColor } = page;\n  const bgColor = backgroundColor ? backgroundColor : reportBackgroundColor || '#fff';\n\n  return (\n    <>\n      <div\n        ref={combinedRef}\n        className={classNames.pageContainer}\n        style={{\n          backgroundColor: bgColor,\n          ...style,\n        }}\n      >\n        <div className=\"jfReport-hider o-hidden f-all p-relative\">\n          <ReportItemsWrapper\n            getIntersectionsFromMatches={getIntersectionsFromMatches}\n            handleMatches={handleMatches}\n            items={items}\n          />\n          {additionalPageItems}\n          <AlignmentGuides\n            axis=\"x\"\n            guides={guides[page.id]}\n            matches={matches}\n            show={(isOver || isResize)}\n          />\n          <AlignmentGuides\n            axis=\"y\"\n            guides={guides[page.id]}\n            matches={matches}\n            show={(isOver || isResize)}\n          />\n        </div>\n      </div>\n    </>\n  );\n};\n\nPage.propTypes = {\n  guides: PropTypes.shape({}),\n  items: PropTypes.arrayOf(\n    PropTypes.shape({}),\n  ),\n  page: PropTypes.shape({\n    backgroundColor: PropTypes.string,\n  }),\n  style: PropTypes.shape({}),\n};\n\nexport default memo(Page);\n"],"names":["Page","guides","items","page","style","activeElement","useBuilderStore","state","setActiveElement","setIsRightPanelOpen","zoom","isResize","onItemAdd","usePropStore","onItemMove","onItemsMove","additionalPageItems","onAnEventTrigger","settings","acceptedItems","pages","useState","matches","setMatches","requestRef","useRef","dropRef","handleMatches","useCallback","item","newMatches","getMatchesForItem","drawAlignmentGuides","monitor","getSourceClientOffset","current","undefined","coords","getCorrectDroppedOffsetValue","getInitialSourceClientOffset","getBoundingClientRect","activeItem","id","pageID","error","isMultipleItemSelected","length","onHover","global","requestAnimationFrame","useDrop","accept","ACCEPTED_TYPES","collect","isOver","drop","type","getItemType","itemType","additionalData","newCoords","DROPPABLE_ITEM_TYPE","itemID","generateId","details","DRAGGABLE_ITEM_TYPE","newItem","dragCoords","getCorrectDroppedOffsetValueBySnap","leftDifference","left","topDifference","top","_items","reduce","acc","curr","tempItem","findItemById","hover","getIntersectionsFromMatches","getCoordinatesFromMatches","newActiveBoxLeft","newActiveBoxTop","combinedRef","node","reportBackgroundColor","backgroundColor","bgColor","_jsx","classNames","_jsxs","propTypes","PropTypes","shape","arrayOf","string","memo"],"mappings":"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"}

package/lib/cjs/components/Builder/Scene.js

@@ -21,9 +21,9 @@ var PropContext = require('../../contexts/PropContext.js');
 var Page = require('./Page.js');
 var functions = require('../../utils/functions.js');
 var hooks = require('../../utils/hooks.js');
-var DraggableItemLayer = require('../DraggableItem/DraggableItemLayer.js');
 var generateId = require('../../utils/generateId.js');
 var eventIgnoredRoles = require('../../constants/eventIgnoredRoles.js');
+var DraggableLayer = require('./DraggableLayer.js');
 var jsxRuntime = require('react/jsx-runtime');
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
@@ -93,7 +93,6 @@ var Scene = function Scene() {
   var lastScrollPosition = BuilderContext.useBuilderStore(function (state) {
     return state.lastScrollPosition;
   });
-  var isHeaderHidden = React.useRef(false);
   var pageStyles = React.useRef({});
   var pageContainerStyles = React.useRef({});
   var viewPortRef = React.useRef({});
@@ -102,7 +101,15 @@ var Scene = function Scene() {
   var refs = React.useRef(pages.reduce(function (acc, curr) {
     acc[curr.id] = /*#__PURE__*/React.createRef(null);
     return acc;
-  }, {}));
+  }, {})); // Update refs when new pages are added
+
+  React.useEffect(function () {
+    pages.forEach(function (page) {
+      if (!refs.current[page.id]) {
+        refs.current[page.id] = /*#__PURE__*/React.createRef(null);
+      }
+    });
+  }, [pages]);
   var isMultipleItemSelected = activeElement !== null && activeElement.length > 1;
   /* Calculate snap guides */
 
@@ -151,14 +158,8 @@ var Scene = function Scene() {
     }
   }, [lastScrollPosition]); // set last scroll position after changing mode
 
-  React.useEffect(function () {
-    if (document.body.classList.contains('hideHeader') && isHeaderHidden) {
-      document.body.classList.remove('hideHeader');
-    }
-  }, []); // reset hideHeader
-
   var foundItem = functions.findItemById(activeElement === null ? null : activeElement[0], pages);
-  var selectedItems = functions.getSelectedItems(activeElement, pages);
+  var selectedItems = hooks.useActiveElement();
 
   var moveItemWithKeyboard = function moveItemWithKeyboard(event, direction, value) {
     event.preventDefault();
@@ -318,20 +319,6 @@ var Scene = function Scene() {
     }
   };
 
-  var onScroll = function onScroll(e) {
-    var scrollTop = e.currentTarget.scrollTop;
-    var hiddenHeaderHeight = 70;
-    var headerHidingLimit = isHeaderHidden ? 230 : 300;
-
-    if (scrollTop > headerHidingLimit + hiddenHeaderHeight && !isHeaderHidden.current) {
-      isHeaderHidden.current = true;
-      document.body.classList.add('hideHeader');
-    } else if (scrollTop < headerHidingLimit && isHeaderHidden.current) {
-      isHeaderHidden.current = false;
-      document.body.classList.remove('hideHeader');
-    }
-  };
-
   var shouldSuppressKeyboardEvent = function shouldSuppressKeyboardEvent(e) {
     return eventIgnoredRoles.EVENT_IGNORED_ROLES.some(function (role) {
       return e.target.closest("[role=".concat(role, "]"));
@@ -381,15 +368,13 @@ var Scene = function Scene() {
   return /*#__PURE__*/jsxRuntime.jsxs("main", {
     // Builder.js
     className: classNames.mainWrapper,
-    children: [/*#__PURE__*/jsxRuntime.jsx(DraggableItemLayer, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(DraggableLayer, {
       guides: guides,
-      pageRefs: refs.current,
-      pages: pages
+      pageRefs: refs.current
     }), /*#__PURE__*/jsxRuntime.jsx("div", {
       ref: viewPortRef,
       className: classNames.viewport,
       "data-zoom": zoom,
-      onScroll: onScroll,
       children: /*#__PURE__*/jsxRuntime.jsxs("div", {
         className: classNames.canvas,
         children: [pages.map(function (page, index) {
@@ -412,7 +397,6 @@ var Scene = function Scene() {
                   items: page.items,
                   page: page,
                   pageIndex: index,
-                  pageRef: refs.current[page.id],
                   style: pageContainerStyles.current
                 })
               }, "page_".concat(page.id))]

package/lib/cjs/components/Builder/Scene.js.map

@@ -1 +1 @@
-{"version":3,"file":"Scene.js","sources":["../../../../src/components/Builder/Scene.js"],"sourcesContent":["/* eslint-disable complexity */\nimport {\n  createRef,\n  Fragment,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport * as classNames from '../../constants/classNames';\nimport ContextMenu from './ContextMenu';\nimport PageActions from './PageActions';\nimport PageAdder from './PageAdder';\nimport ZoomControls from './ZoomControls';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\nimport Page from './Page';\nimport {\n  calculateGuidePositions,\n  findItemById,\n  findItemsOnPage,\n  getMostVisiblePage,\n  getSelectedItems,\n} from '../../utils/functions';\nimport { useEventListener } from '../../utils/hooks';\nimport DraggableItemLayer from '../DraggableItem/DraggableItemLayer';\nimport generateId from '../../utils/generateId';\nimport { EVENT_IGNORED_ROLES } from '../../constants/eventIgnoredRoles';\n\nconst Scene = () => {\n  const pages = usePropStore(state => state.pages);\n  const onItemAdd = usePropStore(state => state.onItemAdd);\n  const onItemRemove = usePropStore(state => state.onItemRemove);\n  const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n  const settings = usePropStore(state => state.settings);\n  const onItemChange = usePropStore(state => state.onItemChange);\n\n  const activeElement = useBuilderStore(state => state.activeElement);\n  const contextMenuProps = useBuilderStore(state => state.contextMenuProps);\n  const isRightPanelOpen = useBuilderStore(state => state.isRightPanelOpen);\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setContextMenuProps = useBuilderStore(state => state.setContextMenuProps);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n  const zoom = useBuilderStore(state => state.zoom);\n\n  const [itemToPaste, setItemToPaste] = useState(null);\n  const lastScrollPosition = useBuilderStore(state => state.lastScrollPosition);\n  const isHeaderHidden = useRef(false);\n\n  const pageStyles = useRef({});\n  const pageContainerStyles = useRef({});\n  const viewPortRef = useRef({});\n\n  /* Page Refs */\n  const refs = useRef(pages.reduce((acc, curr) => {\n    acc[curr.id] = createRef(null);\n    return acc;\n  }, {}));\n\n  const isMultipleItemSelected = activeElement !== null && activeElement.length > 1;\n\n  /* Calculate snap guides */\n  const keyDownCount = useRef(null);\n\n  const guides = useMemo(() => {\n    return pages.reduce((acc, page) => {\n      const _pageGuides = {};\n      const pageRef = refs.current[page.id];\n      if (pageRef && pageRef.current) {\n        const {\n          height, left, top, width,\n        } = pageRef.current.getBoundingClientRect();\n        const boundingBox = {\n          height, left, top, width,\n        };\n        _pageGuides.boundingBox = {\n          x: calculateGuidePositions(boundingBox, 'x').map(value => value - boundingBox.left),\n          y: calculateGuidePositions(boundingBox, 'y').map(value => value - boundingBox.top),\n        };\n        page.items.forEach(item => {\n          _pageGuides[item.id] = {\n            x: calculateGuidePositions(item, 'x', zoom),\n            y: calculateGuidePositions(item, 'y', zoom),\n          };\n        });\n      }\n      acc[page.id] = _pageGuides;\n      return acc;\n    }, {});\n  }, [pages, zoom]);\n\n  useEffect(() => {\n    if (viewPortRef.current) {\n      viewPortRef.current.scrollTop = lastScrollPosition;\n    }\n  }, [lastScrollPosition]); // set last scroll position after changing mode\n\n  useEffect(() => {\n    if (document.body.classList.contains('hideHeader') && isHeaderHidden) {\n      document.body.classList.remove('hideHeader');\n    }\n  }, []); // reset hideHeader\n\n  const foundItem = findItemById(activeElement === null ? null : activeElement[0], pages);\n\n  const selectedItems = getSelectedItems(activeElement, pages);\n  const moveItemWithKeyboard = (event, direction, value) => {\n    event.preventDefault();\n    selectedItems.forEach(item => {\n      if (item.isLocked) {\n        return false;\n      }\n      onItemChange(\n        { id: item.id },\n        {\n          ...item,\n          [direction]: item[direction] + value,\n        },\n      );\n    });\n  };\n\n  const selectNextOrPrevElement = (event, deletedItem) => {\n    if (event.preventDefault) event.preventDefault();\n    const referenceItem = deletedItem ? deletedItem : foundItem;\n\n    const page = pages.find(_page => _page.id === referenceItem.pageID);\n    if (!page || (page && !page.items.length)) return setActiveElement(null);\n    const { items } = page;\n\n    const currentIndex = items.findIndex(item => item.id === referenceItem.id);\n\n    // Pages are not updated in time so here is an unnecessary check\n    if (items.length === 1 && deletedItem) {\n      return setActiveElement(null);\n    }\n\n    if (event.shiftKey) {\n      if (items[currentIndex - 1]) setActiveElement(items[currentIndex - 1].id);\n      else setActiveElement(items[items.length - 1].id);\n    } else if (items[currentIndex + 1]) {\n      setActiveElement(items[currentIndex + 1].id);\n    } else setActiveElement(items[0].id);\n  };\n\n  const onItemRemoveFromPage = e => {\n    // Firefox updates browser history on backspace\n    e.preventDefault();\n    if (isMultipleItemSelected) return;\n    if (foundItem.isLocked) {\n      return false;\n    }\n    setActiveElement(null);\n    onItemRemove(foundItem);\n    selectNextOrPrevElement({ shiftKey: false }, foundItem);\n    onAnEventTrigger('removeItem', foundItem.itemType);\n  };\n\n  const handlePaste = () => {\n    if (isMultipleItemSelected) return;\n    const itemID = generateId();\n    const pageID = getMostVisiblePage(true);\n    const offset = itemToPaste.pageID === pageID ? 50 : 0;\n\n    const item = {\n      ...itemToPaste,\n      id: itemID,\n      left: itemToPaste.left + offset,\n      pageID,\n      top: itemToPaste.top + offset,\n    };\n\n    onItemAdd(item);\n\n    onAnEventTrigger('pasteItem', itemToPaste.itemType);\n    setActiveElement(itemID);\n    // set as last reference to paste\n    setItemToPaste(item);\n  };\n\n  const keyboardActions = event => {\n    const {\n      key,\n      metaKey,\n      shiftKey,\n    } = event;\n\n    if (metaKey) {\n      if (key === 'l') {\n        // Lock\n        if (isMultipleItemSelected) return;\n        event.preventDefault(); // Dont focus to URL bar\n        onAnEventTrigger(\n          foundItem.isLocked ? 'unlockReportItem' : 'lockReportItem',\n          foundItem.itemType,\n        );\n        onItemChange(\n          { id: foundItem.id },\n          { isLocked: foundItem.isLocked ? false : true },\n        );\n        return;\n      }\n\n      if (key === 'c' || key === 'x') {\n        if (isMultipleItemSelected) return;\n        // Copy or Cut\n        if (key === 'x') {\n          onItemRemoveFromPage(event);\n          onAnEventTrigger('cutItem', foundItem.itemType);\n        } else {\n          onAnEventTrigger('copyItem', foundItem.itemType);\n        }\n\n        setItemToPaste(foundItem);\n        return;\n      }\n\n      if (foundItem && key === 'd') {\n        if (isMultipleItemSelected) return;\n        // Duplicate\n        event.preventDefault();\n        const itemID = generateId();\n        onItemAdd({\n          ...foundItem,\n          id: itemID,\n          left: foundItem.left + 50,\n          top: foundItem.top + 50,\n        });\n        onAnEventTrigger('duplicateItem', foundItem.itemType);\n        setActiveElement(itemID);\n        if (!isRightPanelOpen) {\n          setIsRightPanelOpen(true);\n        }\n        return;\n      }\n    }\n\n    keyDownCount.current++;\n    const movementValue = shiftKey ? 10 : 1 + keyDownCount.current;\n\n    // Others\n    switch (key) {\n    case 'Backspace': return onItemRemoveFromPage(event);\n    case 'Delete': return onItemRemoveFromPage(event);\n    case 'Escape': return setActiveElement(null);\n    case 'ArrowLeft': return moveItemWithKeyboard(event, 'left', -movementValue);\n    case 'ArrowUp': return moveItemWithKeyboard(event, 'top', -movementValue);\n    case 'ArrowRight': return moveItemWithKeyboard(event, 'left', movementValue);\n    case 'ArrowDown': return moveItemWithKeyboard(event, 'top', movementValue);\n    case 'Tab': return selectNextOrPrevElement(event);\n    default:\n    }\n  };\n\n  const onScroll = e => {\n    const { scrollTop } = e.currentTarget;\n    const hiddenHeaderHeight = 70;\n    const headerHidingLimit = isHeaderHidden ? 230 : 300;\n    if (scrollTop > headerHidingLimit + hiddenHeaderHeight && !isHeaderHidden.current) {\n      isHeaderHidden.current = true;\n      document.body.classList.add('hideHeader');\n    } else if (scrollTop < headerHidingLimit && isHeaderHidden.current) {\n      isHeaderHidden.current = false;\n      document.body.classList.remove('hideHeader');\n    }\n  };\n\n  const shouldSuppressKeyboardEvent = e => (\n    EVENT_IGNORED_ROLES.some(role => e.target.closest(`[role=${role}]`))\n  );\n\n  const handleKeyboardEvent = e => {\n    const shouldPaste = itemToPaste && e.key === 'v' && e.metaKey;\n\n    if (shouldSuppressKeyboardEvent(e)) {\n      return;\n    }\n\n    if (activeElement && !shouldPaste) {\n      const arrowKeyCodes = ['ArrowLeft', 'ArrowUp', 'ArrowDown', 'ArrowBottom'];\n      if (arrowKeyCodes.includes(e.key)) e.preventDefault();\n      keyboardActions(e);\n    } else if (shouldPaste) {\n      handlePaste();\n    }\n  };\n\n  useEventListener('keydown', handleKeyboardEvent);\n  useEventListener('keyup', () => { keyDownCount.current = 0; });\n\n  const { reportLayoutHeight = 794, reportLayoutWidth = 1123 } = settings;\n\n  // TODO: Some strange shit is going on here on first render\n  let width = parseInt(reportLayoutWidth, 10);\n  let height = parseInt(reportLayoutHeight, 10);\n  width = Number.isNaN(width) ? 1 : width;\n  height = Number.isNaN(height) ? 1 : height;\n  const zoomToUse = Number.isNaN(zoom) ? 1 : zoom;\n\n  pageStyles.current = {\n    height: parseFloat((height * zoomToUse).toFixed(1)),\n    width: parseFloat((width * zoomToUse).toFixed(1)),\n  };\n  pageContainerStyles.current = {\n    height,\n    transform: `scale(${zoomToUse})`,\n    transformOrigin: '0 0',\n    width,\n  };\n\n  return (\n    <main // Builder.js\n      className={classNames.mainWrapper}\n    >\n      <DraggableItemLayer\n        guides={guides}\n        pageRefs={refs.current}\n        pages={pages}\n      />\n\n      <div\n        ref={viewPortRef}\n        className={classNames.viewport}\n        data-zoom={zoom}\n        onScroll={onScroll}\n      >\n        <div\n          className={classNames.canvas}\n        >\n          {pages.map((page, index) => (\n            // TODO: This part can be moved into a different component\n            <Fragment key={page.id}>\n              <PageActions\n                order={page.order}\n                pageID={page.id}\n              />\n              <div\n                key={`page_${page.id}`}\n                ref={refs.current[page.id]}\n                className={classNames.page}\n                data-id={page.id}\n                data-order={page.order}\n                id={`presentation-page-${page.id.toString()}`}\n                style={pageStyles.current}\n              >\n                <Page\n                  guides={guides}\n                  items={page.items}\n                  page={page}\n                  pageIndex={index}\n                  pageRef={refs.current[page.id]}\n                  style={pageContainerStyles.current}\n                />\n              </div>\n            </Fragment>\n          ))}\n          <PageAdder />\n        </div>\n      </div>\n      <ZoomControls />\n      {contextMenuProps\n        && (\n          <ContextMenu\n            exceptionalClasses={['contextMenu-button']}\n            height={height}\n            item={findItemById(contextMenuProps.id, pages)}\n            items={findItemsOnPage(contextMenuProps.pageID, pages)}\n            onClickOutside={() => setContextMenuProps(null)}\n            position={contextMenuProps.position}\n            width={width}\n          />\n        )}\n    </main>\n  );\n};\n\nexport default Scene;\n"],"names":["Scene","pages","usePropStore","state","onItemAdd","onItemRemove","onAnEventTrigger","settings","onItemChange","activeElement","useBuilderStore","contextMenuProps","isRightPanelOpen","setActiveElement","setContextMenuProps","setIsRightPanelOpen","zoom","useState","itemToPaste","setItemToPaste","lastScrollPosition","isHeaderHidden","useRef","pageStyles","pageContainerStyles","viewPortRef","refs","reduce","acc","curr","id","createRef","isMultipleItemSelected","length","keyDownCount","guides","useMemo","page","_pageGuides","pageRef","current","getBoundingClientRect","height","left","top","width","boundingBox","x","calculateGuidePositions","map","value","y","items","forEach","item","useEffect","scrollTop","document","body","classList","contains","remove","foundItem","findItemById","selectedItems","getSelectedItems","moveItemWithKeyboard","event","direction","preventDefault","isLocked","selectNextOrPrevElement","deletedItem","referenceItem","find","_page","pageID","currentIndex","findIndex","shiftKey","onItemRemoveFromPage","e","itemType","handlePaste","itemID","generateId","getMostVisiblePage","offset","keyboardActions","key","metaKey","movementValue","onScroll","currentTarget","hiddenHeaderHeight","headerHidingLimit","add","shouldSuppressKeyboardEvent","EVENT_IGNORED_ROLES","some","role","target","closest","handleKeyboardEvent","shouldPaste","arrowKeyCodes","includes","useEventListener","reportLayoutHeight","reportLayoutWidth","parseInt","Number","isNaN","zoomToUse","parseFloat","toFixed","transform","transformOrigin","_jsxs","classNames","_jsx","index","Fragment","order","toString","findItemsOnPage","position"],"mappings":"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"}
+{"version":3,"file":"Scene.js","sources":["../../../../src/components/Builder/Scene.js"],"sourcesContent":["/* eslint-disable complexity */\nimport {\n  createRef,\n  Fragment,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport * as classNames from '../../constants/classNames';\nimport ContextMenu from './ContextMenu';\nimport PageActions from './PageActions';\nimport PageAdder from './PageAdder';\nimport ZoomControls from './ZoomControls';\nimport { useBuilderStore } from '../../contexts/BuilderContext';\nimport { usePropStore } from '../../contexts/PropContext';\nimport Page from './Page';\nimport {\n  calculateGuidePositions,\n  findItemById,\n  findItemsOnPage,\n  getMostVisiblePage,\n} from '../../utils/functions';\nimport { useActiveElement, useEventListener } from '../../utils/hooks';\nimport generateId from '../../utils/generateId';\nimport { EVENT_IGNORED_ROLES } from '../../constants/eventIgnoredRoles';\nimport DraggableLayer from './DraggableLayer';\n\nconst Scene = () => {\n  const pages = usePropStore(state => state.pages);\n  const onItemAdd = usePropStore(state => state.onItemAdd);\n  const onItemRemove = usePropStore(state => state.onItemRemove);\n  const onAnEventTrigger = usePropStore(state => state.onAnEventTrigger);\n  const settings = usePropStore(state => state.settings);\n  const onItemChange = usePropStore(state => state.onItemChange);\n\n  const activeElement = useBuilderStore(state => state.activeElement);\n  const contextMenuProps = useBuilderStore(state => state.contextMenuProps);\n  const isRightPanelOpen = useBuilderStore(state => state.isRightPanelOpen);\n  const setActiveElement = useBuilderStore(state => state.setActiveElement);\n  const setContextMenuProps = useBuilderStore(state => state.setContextMenuProps);\n  const setIsRightPanelOpen = useBuilderStore(state => state.setIsRightPanelOpen);\n  const zoom = useBuilderStore(state => state.zoom);\n\n  const [itemToPaste, setItemToPaste] = useState(null);\n  const lastScrollPosition = useBuilderStore(state => state.lastScrollPosition);\n\n  const pageStyles = useRef({});\n  const pageContainerStyles = useRef({});\n  const viewPortRef = useRef({});\n\n  /* Page Refs */\n  const refs = useRef(pages.reduce((acc, curr) => {\n    acc[curr.id] = createRef(null);\n    return acc;\n  }, {}));\n\n  // Update refs when new pages are added\n  useEffect(() => {\n    pages.forEach(page => {\n      if (!refs.current[page.id]) {\n        refs.current[page.id] = createRef(null);\n      }\n    });\n  }, [pages]);\n\n  const isMultipleItemSelected = activeElement !== null && activeElement.length > 1;\n\n  /* Calculate snap guides */\n  const keyDownCount = useRef(null);\n\n  const guides = useMemo(() => {\n    return pages.reduce((acc, page) => {\n      const _pageGuides = {};\n      const pageRef = refs.current[page.id];\n      if (pageRef && pageRef.current) {\n        const {\n          height, left, top, width,\n        } = pageRef.current.getBoundingClientRect();\n        const boundingBox = {\n          height, left, top, width,\n        };\n        _pageGuides.boundingBox = {\n          x: calculateGuidePositions(boundingBox, 'x').map(value => value - boundingBox.left),\n          y: calculateGuidePositions(boundingBox, 'y').map(value => value - boundingBox.top),\n        };\n        page.items.forEach(item => {\n          _pageGuides[item.id] = {\n            x: calculateGuidePositions(item, 'x', zoom),\n            y: calculateGuidePositions(item, 'y', zoom),\n          };\n        });\n      }\n      acc[page.id] = _pageGuides;\n      return acc;\n    }, {});\n  }, [pages, zoom]);\n\n  useEffect(() => {\n    if (viewPortRef.current) {\n      viewPortRef.current.scrollTop = lastScrollPosition;\n    }\n  }, [lastScrollPosition]); // set last scroll position after changing mode\n\n  const foundItem = findItemById(activeElement === null ? null : activeElement[0], pages);\n\n  const selectedItems = useActiveElement();\n  const moveItemWithKeyboard = (event, direction, value) => {\n    event.preventDefault();\n    selectedItems.forEach(item => {\n      if (item.isLocked) {\n        return false;\n      }\n      onItemChange(\n        { id: item.id },\n        {\n          ...item,\n          [direction]: item[direction] + value,\n        },\n      );\n    });\n  };\n\n  const selectNextOrPrevElement = (event, deletedItem) => {\n    if (event.preventDefault) event.preventDefault();\n    const referenceItem = deletedItem ? deletedItem : foundItem;\n\n    const page = pages.find(_page => _page.id === referenceItem.pageID);\n    if (!page || (page && !page.items.length)) return setActiveElement(null);\n    const { items } = page;\n\n    const currentIndex = items.findIndex(item => item.id === referenceItem.id);\n\n    // Pages are not updated in time so here is an unnecessary check\n    if (items.length === 1 && deletedItem) {\n      return setActiveElement(null);\n    }\n\n    if (event.shiftKey) {\n      if (items[currentIndex - 1]) setActiveElement(items[currentIndex - 1].id);\n      else setActiveElement(items[items.length - 1].id);\n    } else if (items[currentIndex + 1]) {\n      setActiveElement(items[currentIndex + 1].id);\n    } else setActiveElement(items[0].id);\n  };\n\n  const onItemRemoveFromPage = e => {\n    // Firefox updates browser history on backspace\n    e.preventDefault();\n    if (isMultipleItemSelected) return;\n    if (foundItem.isLocked) {\n      return false;\n    }\n    setActiveElement(null);\n    onItemRemove(foundItem);\n    selectNextOrPrevElement({ shiftKey: false }, foundItem);\n    onAnEventTrigger('removeItem', foundItem.itemType);\n  };\n\n  const handlePaste = () => {\n    if (isMultipleItemSelected) return;\n    const itemID = generateId();\n    const pageID = getMostVisiblePage(true);\n    const offset = itemToPaste.pageID === pageID ? 50 : 0;\n\n    const item = {\n      ...itemToPaste,\n      id: itemID,\n      left: itemToPaste.left + offset,\n      pageID,\n      top: itemToPaste.top + offset,\n    };\n\n    onItemAdd(item);\n\n    onAnEventTrigger('pasteItem', itemToPaste.itemType);\n    setActiveElement(itemID);\n    // set as last reference to paste\n    setItemToPaste(item);\n  };\n\n  const keyboardActions = event => {\n    const {\n      key,\n      metaKey,\n      shiftKey,\n    } = event;\n\n    if (metaKey) {\n      if (key === 'l') {\n        // Lock\n        if (isMultipleItemSelected) return;\n        event.preventDefault(); // Dont focus to URL bar\n        onAnEventTrigger(\n          foundItem.isLocked ? 'unlockReportItem' : 'lockReportItem',\n          foundItem.itemType,\n        );\n        onItemChange(\n          { id: foundItem.id },\n          { isLocked: foundItem.isLocked ? false : true },\n        );\n        return;\n      }\n\n      if (key === 'c' || key === 'x') {\n        if (isMultipleItemSelected) return;\n        // Copy or Cut\n        if (key === 'x') {\n          onItemRemoveFromPage(event);\n          onAnEventTrigger('cutItem', foundItem.itemType);\n        } else {\n          onAnEventTrigger('copyItem', foundItem.itemType);\n        }\n\n        setItemToPaste(foundItem);\n        return;\n      }\n\n      if (foundItem && key === 'd') {\n        if (isMultipleItemSelected) return;\n        // Duplicate\n        event.preventDefault();\n        const itemID = generateId();\n        onItemAdd({\n          ...foundItem,\n          id: itemID,\n          left: foundItem.left + 50,\n          top: foundItem.top + 50,\n        });\n        onAnEventTrigger('duplicateItem', foundItem.itemType);\n        setActiveElement(itemID);\n        if (!isRightPanelOpen) {\n          setIsRightPanelOpen(true);\n        }\n        return;\n      }\n    }\n\n    keyDownCount.current++;\n    const movementValue = shiftKey ? 10 : 1 + keyDownCount.current;\n\n    // Others\n    switch (key) {\n    case 'Backspace': return onItemRemoveFromPage(event);\n    case 'Delete': return onItemRemoveFromPage(event);\n    case 'Escape': return setActiveElement(null);\n    case 'ArrowLeft': return moveItemWithKeyboard(event, 'left', -movementValue);\n    case 'ArrowUp': return moveItemWithKeyboard(event, 'top', -movementValue);\n    case 'ArrowRight': return moveItemWithKeyboard(event, 'left', movementValue);\n    case 'ArrowDown': return moveItemWithKeyboard(event, 'top', movementValue);\n    case 'Tab': return selectNextOrPrevElement(event);\n    default:\n    }\n  };\n\n  const shouldSuppressKeyboardEvent = e => (\n    EVENT_IGNORED_ROLES.some(role => e.target.closest(`[role=${role}]`))\n  );\n\n  const handleKeyboardEvent = e => {\n    const shouldPaste = itemToPaste && e.key === 'v' && e.metaKey;\n\n    if (shouldSuppressKeyboardEvent(e)) {\n      return;\n    }\n\n    if (activeElement && !shouldPaste) {\n      const arrowKeyCodes = ['ArrowLeft', 'ArrowUp', 'ArrowDown', 'ArrowBottom'];\n      if (arrowKeyCodes.includes(e.key)) e.preventDefault();\n      keyboardActions(e);\n    } else if (shouldPaste) {\n      handlePaste();\n    }\n  };\n\n  useEventListener('keydown', handleKeyboardEvent);\n  useEventListener('keyup', () => { keyDownCount.current = 0; });\n\n  const { reportLayoutHeight = 794, reportLayoutWidth = 1123 } = settings;\n\n  // TODO: Some strange shit is going on here on first render\n  let width = parseInt(reportLayoutWidth, 10);\n  let height = parseInt(reportLayoutHeight, 10);\n  width = Number.isNaN(width) ? 1 : width;\n  height = Number.isNaN(height) ? 1 : height;\n  const zoomToUse = Number.isNaN(zoom) ? 1 : zoom;\n\n  pageStyles.current = {\n    height: parseFloat((height * zoomToUse).toFixed(1)),\n    width: parseFloat((width * zoomToUse).toFixed(1)),\n  };\n  pageContainerStyles.current = {\n    height,\n    transform: `scale(${zoomToUse})`,\n    transformOrigin: '0 0',\n    width,\n  };\n\n  return (\n    <main // Builder.js\n      className={classNames.mainWrapper}\n    >\n      <DraggableLayer\n        guides={guides}\n        pageRefs={refs.current}\n      />\n      <div\n        ref={viewPortRef}\n        className={classNames.viewport}\n        data-zoom={zoom}\n      >\n        <div\n          className={classNames.canvas}\n        >\n          {pages.map((page, index) => (\n            // TODO: This part can be moved into a different component\n            <Fragment key={page.id}>\n              <PageActions\n                order={page.order}\n                pageID={page.id}\n              />\n              <div\n                key={`page_${page.id}`}\n                ref={refs.current[page.id]}\n                className={classNames.page}\n                data-id={page.id}\n                data-order={page.order}\n                id={`presentation-page-${page.id.toString()}`}\n                style={pageStyles.current}\n              >\n                <Page\n                  guides={guides}\n                  items={page.items}\n                  page={page}\n                  pageIndex={index}\n                  style={pageContainerStyles.current}\n                />\n              </div>\n            </Fragment>\n          ))}\n          <PageAdder />\n        </div>\n      </div>\n      <ZoomControls />\n      {contextMenuProps\n        && (\n          <ContextMenu\n            exceptionalClasses={['contextMenu-button']}\n            height={height}\n            item={findItemById(contextMenuProps.id, pages)}\n            items={findItemsOnPage(contextMenuProps.pageID, pages)}\n            onClickOutside={() => setContextMenuProps(null)}\n            position={contextMenuProps.position}\n            width={width}\n          />\n        )}\n    </main>\n  );\n};\n\nexport default Scene;\n"],"names":["Scene","pages","usePropStore","state","onItemAdd","onItemRemove","onAnEventTrigger","settings","onItemChange","activeElement","useBuilderStore","contextMenuProps","isRightPanelOpen","setActiveElement","setContextMenuProps","setIsRightPanelOpen","zoom","useState","itemToPaste","setItemToPaste","lastScrollPosition","pageStyles","useRef","pageContainerStyles","viewPortRef","refs","reduce","acc","curr","id","createRef","useEffect","forEach","page","current","isMultipleItemSelected","length","keyDownCount","guides","useMemo","_pageGuides","pageRef","getBoundingClientRect","height","left","top","width","boundingBox","x","calculateGuidePositions","map","value","y","items","item","scrollTop","foundItem","findItemById","selectedItems","useActiveElement","moveItemWithKeyboard","event","direction","preventDefault","isLocked","selectNextOrPrevElement","deletedItem","referenceItem","find","_page","pageID","currentIndex","findIndex","shiftKey","onItemRemoveFromPage","e","itemType","handlePaste","itemID","generateId","getMostVisiblePage","offset","keyboardActions","key","metaKey","movementValue","shouldSuppressKeyboardEvent","EVENT_IGNORED_ROLES","some","role","target","closest","handleKeyboardEvent","shouldPaste","arrowKeyCodes","includes","useEventListener","reportLayoutHeight","reportLayoutWidth","parseInt","Number","isNaN","zoomToUse","parseFloat","toFixed","transform","transformOrigin","_jsxs","classNames","_jsx","index","Fragment","order","toString","findItemsOnPage","position"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IA4BMA,KAAK,GAAG,SAARA,KAAQ,GAAM;AAClB,MAAMC,KAAK,GAAGC,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACF,KAAV;AAAA,GAAN,CAA1B;AACA,MAAMG,SAAS,GAAGF,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACC,SAAV;AAAA,GAAN,CAA9B;AACA,MAAMC,YAAY,GAAGH,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACE,YAAV;AAAA,GAAN,CAAjC;AACA,MAAMC,gBAAgB,GAAGJ,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACG,gBAAV;AAAA,GAAN,CAArC;AACA,MAAMC,QAAQ,GAAGL,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACI,QAAV;AAAA,GAAN,CAA7B;AACA,MAAMC,YAAY,GAAGN,wBAAY,CAAC,UAAAC,KAAK;AAAA,WAAIA,KAAK,CAACK,YAAV;AAAA,GAAN,CAAjC;AAEA,MAAMC,aAAa,GAAGC,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACM,aAAV;AAAA,GAAN,CAArC;AACA,MAAME,gBAAgB,GAAGD,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACQ,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMC,gBAAgB,GAAGF,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACS,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMC,gBAAgB,GAAGH,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACU,gBAAV;AAAA,GAAN,CAAxC;AACA,MAAMC,mBAAmB,GAAGJ,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACW,mBAAV;AAAA,GAAN,CAA3C;AACA,MAAMC,mBAAmB,GAAGL,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACY,mBAAV;AAAA,GAAN,CAA3C;AACA,MAAMC,IAAI,GAAGN,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACa,IAAV;AAAA,GAAN,CAA5B;;AAEA,kBAAsCC,cAAQ,CAAC,IAAD,CAA9C;AAAA;AAAA,MAAOC,WAAP;AAAA,MAAoBC,cAApB;;AACA,MAAMC,kBAAkB,GAAGV,8BAAe,CAAC,UAAAP,KAAK;AAAA,WAAIA,KAAK,CAACiB,kBAAV;AAAA,GAAN,CAA1C;AAEA,MAAMC,UAAU,GAAGC,YAAM,CAAC,EAAD,CAAzB;AACA,MAAMC,mBAAmB,GAAGD,YAAM,CAAC,EAAD,CAAlC;AACA,MAAME,WAAW,GAAGF,YAAM,CAAC,EAAD,CAA1B;AAEA;;AACA,MAAMG,IAAI,GAAGH,YAAM,CAACrB,KAAK,CAACyB,MAAN,CAAa,UAACC,GAAD,EAAMC,IAAN,EAAe;AAC9CD,IAAAA,GAAG,CAACC,IAAI,CAACC,EAAN,CAAH,gBAAeC,eAAS,CAAC,IAAD,CAAxB;AACA,WAAOH,GAAP;AACD,GAHmB,EAGjB,EAHiB,CAAD,CAAnB,CAxBkB;;AA8BlBI,EAAAA,eAAS,CAAC,YAAM;AACd9B,IAAAA,KAAK,CAAC+B,OAAN,CAAc,UAAAC,IAAI,EAAI;AACpB,UAAI,CAACR,IAAI,CAACS,OAAL,CAAaD,IAAI,CAACJ,EAAlB,CAAL,EAA4B;AAC1BJ,QAAAA,IAAI,CAACS,OAAL,CAAaD,IAAI,CAACJ,EAAlB,iBAAwBC,eAAS,CAAC,IAAD,CAAjC;AACD;AACF,KAJD;AAKD,GANQ,EAMN,CAAC7B,KAAD,CANM,CAAT;AAQA,MAAMkC,sBAAsB,GAAG1B,aAAa,KAAK,IAAlB,IAA0BA,aAAa,CAAC2B,MAAd,GAAuB,CAAhF;AAEA;;AACA,MAAMC,YAAY,GAAGf,YAAM,CAAC,IAAD,CAA3B;AAEA,MAAMgB,MAAM,GAAGC,aAAO,CAAC,YAAM;AAC3B,WAAOtC,KAAK,CAACyB,MAAN,CAAa,UAACC,GAAD,EAAMM,IAAN,EAAe;AACjC,UAAMO,WAAW,GAAG,EAApB;AACA,UAAMC,OAAO,GAAGhB,IAAI,CAACS,OAAL,CAAaD,IAAI,CAACJ,EAAlB,CAAhB;;AACA,UAAIY,OAAO,IAAIA,OAAO,CAACP,OAAvB,EAAgC;AAC9B,oCAEIO,OAAO,CAACP,OAAR,CAAgBQ,qBAAhB,EAFJ;AAAA,YACEC,OADF,yBACEA,MADF;AAAA,YACUC,IADV,yBACUA,IADV;AAAA,YACgBC,GADhB,yBACgBA,GADhB;AAAA,YACqBC,MADrB,yBACqBA,KADrB;;AAGA,YAAMC,WAAW,GAAG;AAClBJ,UAAAA,MAAM,EAANA,OADkB;AACVC,UAAAA,IAAI,EAAJA,IADU;AACJC,UAAAA,GAAG,EAAHA,GADI;AACCC,UAAAA,KAAK,EAALA;AADD,SAApB;AAGAN,QAAAA,WAAW,CAACO,WAAZ,GAA0B;AACxBC,UAAAA,CAAC,EAAEC,iCAAuB,CAACF,WAAD,EAAc,GAAd,CAAvB,CAA0CG,GAA1C,CAA8C,UAAAC,KAAK;AAAA,mBAAIA,KAAK,GAAGJ,WAAW,CAACH,IAAxB;AAAA,WAAnD,CADqB;AAExBQ,UAAAA,CAAC,EAAEH,iCAAuB,CAACF,WAAD,EAAc,GAAd,CAAvB,CAA0CG,GAA1C,CAA8C,UAAAC,KAAK;AAAA,mBAAIA,KAAK,GAAGJ,WAAW,CAACF,GAAxB;AAAA,WAAnD;AAFqB,SAA1B;AAIAZ,QAAAA,IAAI,CAACoB,KAAL,CAAWrB,OAAX,CAAmB,UAAAsB,IAAI,EAAI;AACzBd,UAAAA,WAAW,CAACc,IAAI,CAACzB,EAAN,CAAX,GAAuB;AACrBmB,YAAAA,CAAC,EAAEC,iCAAuB,CAACK,IAAD,EAAO,GAAP,EAAYtC,IAAZ,CADL;AAErBoC,YAAAA,CAAC,EAAEH,iCAAuB,CAACK,IAAD,EAAO,GAAP,EAAYtC,IAAZ;AAFL,WAAvB;AAID,SALD;AAMD;;AACDW,MAAAA,GAAG,CAACM,IAAI,CAACJ,EAAN,CAAH,GAAeW,WAAf;AACA,aAAOb,GAAP;AACD,KAvBM,EAuBJ,EAvBI,CAAP;AAwBD,GAzBqB,EAyBnB,CAAC1B,KAAD,EAAQe,IAAR,CAzBmB,CAAtB;AA2BAe,EAAAA,eAAS,CAAC,YAAM;AACd,QAAIP,WAAW,CAACU,OAAhB,EAAyB;AACvBV,MAAAA,WAAW,CAACU,OAAZ,CAAoBqB,SAApB,GAAgCnC,kBAAhC;AACD;AACF,GAJQ,EAIN,CAACA,kBAAD,CAJM,CAAT,CAtEkB;;AA4ElB,MAAMoC,SAAS,GAAGC,sBAAY,CAAChD,aAAa,KAAK,IAAlB,GAAyB,IAAzB,GAAgCA,aAAa,CAAC,CAAD,CAA9C,EAAmDR,KAAnD,CAA9B;AAEA,MAAMyD,aAAa,GAAGC,sBAAgB,EAAtC;;AACA,MAAMC,oBAAoB,GAAG,SAAvBA,oBAAuB,CAACC,KAAD,EAAQC,SAAR,EAAmBX,KAAnB,EAA6B;AACxDU,IAAAA,KAAK,CAACE,cAAN;AACAL,IAAAA,aAAa,CAAC1B,OAAd,CAAsB,UAAAsB,IAAI,EAAI;AAC5B,UAAIA,IAAI,CAACU,QAAT,EAAmB;AACjB,eAAO,KAAP;AACD;;AACDxD,MAAAA,YAAY,CACV;AAAEqB,QAAAA,EAAE,EAAEyB,IAAI,CAACzB;AAAX,OADU,kCAGLyB,IAHK,2BAIPQ,SAJO,EAIKR,IAAI,CAACQ,SAAD,CAAJ,GAAkBX,KAJvB,GAAZ;AAOD,KAXD;AAYD,GAdD;;AAgBA,MAAMc,uBAAuB,GAAG,SAA1BA,uBAA0B,CAACJ,KAAD,EAAQK,WAAR,EAAwB;AACtD,QAAIL,KAAK,CAACE,cAAV,EAA0BF,KAAK,CAACE,cAAN;AAC1B,QAAMI,aAAa,GAAGD,WAAW,GAAGA,WAAH,GAAiBV,SAAlD;AAEA,QAAMvB,IAAI,GAAGhC,KAAK,CAACmE,IAAN,CAAW,UAAAC,KAAK;AAAA,aAAIA,KAAK,CAACxC,EAAN,KAAasC,aAAa,CAACG,MAA/B;AAAA,KAAhB,CAAb;AACA,QAAI,CAACrC,IAAD,IAAUA,IAAI,IAAI,CAACA,IAAI,CAACoB,KAAL,CAAWjB,MAAlC,EAA2C,OAAOvB,gBAAgB,CAAC,IAAD,CAAvB;AAC3C,QAAQwC,KAAR,GAAkBpB,IAAlB,CAAQoB,KAAR;AAEA,QAAMkB,YAAY,GAAGlB,KAAK,CAACmB,SAAN,CAAgB,UAAAlB,IAAI;AAAA,aAAIA,IAAI,CAACzB,EAAL,KAAYsC,aAAa,CAACtC,EAA9B;AAAA,KAApB,CAArB,CARsD;;AAWtD,QAAIwB,KAAK,CAACjB,MAAN,KAAiB,CAAjB,IAAsB8B,WAA1B,EAAuC;AACrC,aAAOrD,gBAAgB,CAAC,IAAD,CAAvB;AACD;;AAED,QAAIgD,KAAK,CAACY,QAAV,EAAoB;AAClB,UAAIpB,KAAK,CAACkB,YAAY,GAAG,CAAhB,CAAT,EAA6B1D,gBAAgB,CAACwC,KAAK,CAACkB,YAAY,GAAG,CAAhB,CAAL,CAAwB1C,EAAzB,CAAhB,CAA7B,KACKhB,gBAAgB,CAACwC,KAAK,CAACA,KAAK,CAACjB,MAAN,GAAe,CAAhB,CAAL,CAAwBP,EAAzB,CAAhB;AACN,KAHD,MAGO,IAAIwB,KAAK,CAACkB,YAAY,GAAG,CAAhB,CAAT,EAA6B;AAClC1D,MAAAA,gBAAgB,CAACwC,KAAK,CAACkB,YAAY,GAAG,CAAhB,CAAL,CAAwB1C,EAAzB,CAAhB;AACD,KAFM,MAEAhB,gBAAgB,CAACwC,KAAK,CAAC,CAAD,CAAL,CAASxB,EAAV,CAAhB;AACR,GArBD;;AAuBA,MAAM6C,oBAAoB,GAAG,SAAvBA,oBAAuB,CAAAC,CAAC,EAAI;AAChC;AACAA,IAAAA,CAAC,CAACZ,cAAF;AACA,QAAI5B,sBAAJ,EAA4B;;AAC5B,QAAIqB,SAAS,CAACQ,QAAd,EAAwB;AACtB,aAAO,KAAP;AACD;;AACDnD,IAAAA,gBAAgB,CAAC,IAAD,CAAhB;AACAR,IAAAA,YAAY,CAACmD,SAAD,CAAZ;AACAS,IAAAA,uBAAuB,CAAC;AAAEQ,MAAAA,QAAQ,EAAE;AAAZ,KAAD,EAAsBjB,SAAtB,CAAvB;AACAlD,IAAAA,gBAAgB,CAAC,YAAD,EAAekD,SAAS,CAACoB,QAAzB,CAAhB;AACD,GAXD;;AAaA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,QAAI1C,sBAAJ,EAA4B;AAC5B,QAAM2C,MAAM,GAAGC,UAAU,EAAzB;AACA,QAAMT,MAAM,GAAGU,4BAAkB,CAAC,IAAD,CAAjC;AACA,QAAMC,MAAM,GAAG/D,WAAW,CAACoD,MAAZ,KAAuBA,MAAvB,GAAgC,EAAhC,GAAqC,CAApD;;AAEA,QAAMhB,IAAI,mCACLpC,WADK;AAERW,MAAAA,EAAE,EAAEiD,MAFI;AAGRlC,MAAAA,IAAI,EAAE1B,WAAW,CAAC0B,IAAZ,GAAmBqC,MAHjB;AAIRX,MAAAA,MAAM,EAANA,MAJQ;AAKRzB,MAAAA,GAAG,EAAE3B,WAAW,CAAC2B,GAAZ,GAAkBoC;AALf,MAAV;;AAQA7E,IAAAA,SAAS,CAACkD,IAAD,CAAT;AAEAhD,IAAAA,gBAAgB,CAAC,WAAD,EAAcY,WAAW,CAAC0D,QAA1B,CAAhB;AACA/D,IAAAA,gBAAgB,CAACiE,MAAD,CAAhB,CAjBwB;;AAmBxB3D,IAAAA,cAAc,CAACmC,IAAD,CAAd;AACD,GApBD;;AAsBA,MAAM4B,eAAe,GAAG,SAAlBA,eAAkB,CAAArB,KAAK,EAAI;AAC/B,QACEsB,GADF,GAIItB,KAJJ,CACEsB,GADF;AAAA,QAEEC,OAFF,GAIIvB,KAJJ,CAEEuB,OAFF;AAAA,QAGEX,QAHF,GAIIZ,KAJJ,CAGEY,QAHF;;AAMA,QAAIW,OAAJ,EAAa;AACX,UAAID,GAAG,KAAK,GAAZ,EAAiB;AACf;AACA,YAAIhD,sBAAJ,EAA4B;AAC5B0B,QAAAA,KAAK,CAACE,cAAN,GAHe;;AAIfzD,QAAAA,gBAAgB,CACdkD,SAAS,CAACQ,QAAV,GAAqB,kBAArB,GAA0C,gBAD5B,EAEdR,SAAS,CAACoB,QAFI,CAAhB;AAIApE,QAAAA,YAAY,CACV;AAAEqB,UAAAA,EAAE,EAAE2B,SAAS,CAAC3B;AAAhB,SADU,EAEV;AAAEmC,UAAAA,QAAQ,EAAER,SAAS,CAACQ,QAAV,GAAqB,KAArB,GAA6B;AAAzC,SAFU,CAAZ;AAIA;AACD;;AAED,UAAImB,GAAG,KAAK,GAAR,IAAeA,GAAG,KAAK,GAA3B,EAAgC;AAC9B,YAAIhD,sBAAJ,EAA4B,OADE;;AAG9B,YAAIgD,GAAG,KAAK,GAAZ,EAAiB;AACfT,UAAAA,oBAAoB,CAACb,KAAD,CAApB;AACAvD,UAAAA,gBAAgB,CAAC,SAAD,EAAYkD,SAAS,CAACoB,QAAtB,CAAhB;AACD,SAHD,MAGO;AACLtE,UAAAA,gBAAgB,CAAC,UAAD,EAAakD,SAAS,CAACoB,QAAvB,CAAhB;AACD;;AAEDzD,QAAAA,cAAc,CAACqC,SAAD,CAAd;AACA;AACD;;AAED,UAAIA,SAAS,IAAI2B,GAAG,KAAK,GAAzB,EAA8B;AAC5B,YAAIhD,sBAAJ,EAA4B,OADA;;AAG5B0B,QAAAA,KAAK,CAACE,cAAN;AACA,YAAMe,MAAM,GAAGC,UAAU,EAAzB;AACA3E,QAAAA,SAAS,iCACJoD,SADI;AAEP3B,UAAAA,EAAE,EAAEiD,MAFG;AAGPlC,UAAAA,IAAI,EAAEY,SAAS,CAACZ,IAAV,GAAiB,EAHhB;AAIPC,UAAAA,GAAG,EAAEW,SAAS,CAACX,GAAV,GAAgB;AAJd,WAAT;AAMAvC,QAAAA,gBAAgB,CAAC,eAAD,EAAkBkD,SAAS,CAACoB,QAA5B,CAAhB;AACA/D,QAAAA,gBAAgB,CAACiE,MAAD,CAAhB;;AACA,YAAI,CAAClE,gBAAL,EAAuB;AACrBG,UAAAA,mBAAmB,CAAC,IAAD,CAAnB;AACD;;AACD;AACD;AACF;;AAEDsB,IAAAA,YAAY,CAACH,OAAb;AACA,QAAMmD,aAAa,GAAGZ,QAAQ,GAAG,EAAH,GAAQ,IAAIpC,YAAY,CAACH,OAAvD,CA1D+B;;AA6D/B,YAAQiD,GAAR;AACA,WAAK,WAAL;AAAkB,eAAOT,oBAAoB,CAACb,KAAD,CAA3B;;AAClB,WAAK,QAAL;AAAe,eAAOa,oBAAoB,CAACb,KAAD,CAA3B;;AACf,WAAK,QAAL;AAAe,eAAOhD,gBAAgB,CAAC,IAAD,CAAvB;;AACf,WAAK,WAAL;AAAkB,eAAO+C,oBAAoB,CAACC,KAAD,EAAQ,MAAR,EAAgB,CAACwB,aAAjB,CAA3B;;AAClB,WAAK,SAAL;AAAgB,eAAOzB,oBAAoB,CAACC,KAAD,EAAQ,KAAR,EAAe,CAACwB,aAAhB,CAA3B;;AAChB,WAAK,YAAL;AAAmB,eAAOzB,oBAAoB,CAACC,KAAD,EAAQ,MAAR,EAAgBwB,aAAhB,CAA3B;;AACnB,WAAK,WAAL;AAAkB,eAAOzB,oBAAoB,CAACC,KAAD,EAAQ,KAAR,EAAewB,aAAf,CAA3B;;AAClB,WAAK,KAAL;AAAY,eAAOpB,uBAAuB,CAACJ,KAAD,CAA9B;AARZ;AAWD,GAxED;;AA0EA,MAAMyB,2BAA2B,GAAG,SAA9BA,2BAA8B,CAAAX,CAAC;AAAA,WACnCY,qCAAmB,CAACC,IAApB,CAAyB,UAAAC,IAAI;AAAA,aAAId,CAAC,CAACe,MAAF,CAASC,OAAT,iBAA0BF,IAA1B,OAAJ;AAAA,KAA7B,CADmC;AAAA,GAArC;;AAIA,MAAMG,mBAAmB,GAAG,SAAtBA,mBAAsB,CAAAjB,CAAC,EAAI;AAC/B,QAAMkB,WAAW,GAAG3E,WAAW,IAAIyD,CAAC,CAACQ,GAAF,KAAU,GAAzB,IAAgCR,CAAC,CAACS,OAAtD;;AAEA,QAAIE,2BAA2B,CAACX,CAAD,CAA/B,EAAoC;AAClC;AACD;;AAED,QAAIlE,aAAa,IAAI,CAACoF,WAAtB,EAAmC;AACjC,UAAMC,aAAa,GAAG,CAAC,WAAD,EAAc,SAAd,EAAyB,WAAzB,EAAsC,aAAtC,CAAtB;AACA,UAAIA,aAAa,CAACC,QAAd,CAAuBpB,CAAC,CAACQ,GAAzB,CAAJ,EAAmCR,CAAC,CAACZ,cAAF;AACnCmB,MAAAA,eAAe,CAACP,CAAD,CAAf;AACD,KAJD,MAIO,IAAIkB,WAAJ,EAAiB;AACtBhB,MAAAA,WAAW;AACZ;AACF,GAdD;;AAgBAmB,EAAAA,sBAAgB,CAAC,SAAD,EAAYJ,mBAAZ,CAAhB;AACAI,EAAAA,sBAAgB,CAAC,OAAD,EAAU,YAAM;AAAE3D,IAAAA,YAAY,CAACH,OAAb,GAAuB,CAAvB;AAA2B,GAA7C,CAAhB;AAEA,8BAA+D3B,QAA/D,CAAQ0F,kBAAR;AAAA,MAAQA,kBAAR,sCAA6B,GAA7B;AAAA,+BAA+D1F,QAA/D,CAAkC2F,iBAAlC;AAAA,MAAkCA,iBAAlC,uCAAsD,IAAtD,0BA1PkB;;AA6PlB,MAAIpD,KAAK,GAAGqD,QAAQ,CAACD,iBAAD,EAAoB,EAApB,CAApB;AACA,MAAIvD,MAAM,GAAGwD,QAAQ,CAACF,kBAAD,EAAqB,EAArB,CAArB;AACAnD,EAAAA,KAAK,GAAGsD,MAAM,CAACC,KAAP,CAAavD,KAAb,IAAsB,CAAtB,GAA0BA,KAAlC;AACAH,EAAAA,MAAM,GAAGyD,MAAM,CAACC,KAAP,CAAa1D,MAAb,IAAuB,CAAvB,GAA2BA,MAApC;AACA,MAAM2D,SAAS,GAAGF,MAAM,CAACC,KAAP,CAAarF,IAAb,IAAqB,CAArB,GAAyBA,IAA3C;AAEAK,EAAAA,UAAU,CAACa,OAAX,GAAqB;AACnBS,IAAAA,MAAM,EAAE4D,UAAU,CAAC,CAAC5D,MAAM,GAAG2D,SAAV,EAAqBE,OAArB,CAA6B,CAA7B,CAAD,CADC;AAEnB1D,IAAAA,KAAK,EAAEyD,UAAU,CAAC,CAACzD,KAAK,GAAGwD,SAAT,EAAoBE,OAApB,CAA4B,CAA5B,CAAD;AAFE,GAArB;AAIAjF,EAAAA,mBAAmB,CAACW,OAApB,GAA8B;AAC5BS,IAAAA,MAAM,EAANA,MAD4B;AAE5B8D,IAAAA,SAAS,kBAAWH,SAAX,MAFmB;AAG5BI,IAAAA,eAAe,EAAE,KAHW;AAI5B5D,IAAAA,KAAK,EAALA;AAJ4B,GAA9B;AAOA,sBACE6D;AAAM;AACJ,IAAA,SAAS,EAAEC,sBADb;AAAA,4BAGEC,eAAC,cAAD;AACE,MAAA,MAAM,EAAEvE,MADV;AAEE,MAAA,QAAQ,EAAEb,IAAI,CAACS;AAFjB,MAHF,eAOE2E;AACE,MAAA,GAAG,EAAErF,WADP;AAEE,MAAA,SAAS,EAAEoF,mBAFb;AAGE,mBAAW5F,IAHb;AAAA,6BAKE2F;AACE,QAAA,SAAS,EAAEC,iBADb;AAAA,mBAGG3G,KAAK,CAACiD,GAAN,CAAU,UAACjB,IAAD,EAAO6E,KAAP;AAAA;AAAA;AACT;AACA,4BAACC,cAAD;AAAA,sCACEF,eAAC,WAAD;AACE,gBAAA,KAAK,EAAE5E,IAAI,CAAC+E,KADd;AAEE,gBAAA,MAAM,EAAE/E,IAAI,CAACJ;AAFf,gBADF,eAKEgF;AAEE,gBAAA,GAAG,EAAEpF,IAAI,CAACS,OAAL,CAAaD,IAAI,CAACJ,EAAlB,CAFP;AAGE,gBAAA,SAAS,EAAE+E,eAHb;AAIE,2BAAS3E,IAAI,CAACJ,EAJhB;AAKE,8BAAYI,IAAI,CAAC+E,KALnB;AAME,gBAAA,EAAE,8BAAuB/E,IAAI,CAACJ,EAAL,CAAQoF,QAAR,EAAvB,CANJ;AAOE,gBAAA,KAAK,EAAE5F,UAAU,CAACa,OAPpB;AAAA,uCASE2E,eAAC,IAAD;AACE,kBAAA,MAAM,EAAEvE,MADV;AAEE,kBAAA,KAAK,EAAEL,IAAI,CAACoB,KAFd;AAGE,kBAAA,IAAI,EAAEpB,IAHR;AAIE,kBAAA,SAAS,EAAE6E,KAJb;AAKE,kBAAA,KAAK,EAAEvF,mBAAmB,CAACW;AAL7B;AATF,gCACeD,IAAI,CAACJ,EADpB,EALF;AAAA,eAAeI,IAAI,CAACJ,EAApB;AAFS;AAAA,SAAV,CAHH,eA6BEgF,eAAC,SAAD,KA7BF;AAAA;AALF,MAPF,eA4CEA,eAAC,YAAD,KA5CF,EA6CGlG,gBAAgB,iBAEbkG,eAAC,WAAD;AACE,MAAA,kBAAkB,EAAE,CAAC,oBAAD,CADtB;AAEE,MAAA,MAAM,EAAElE,MAFV;AAGE,MAAA,IAAI,EAAEc,sBAAY,CAAC9C,gBAAgB,CAACkB,EAAlB,EAAsB5B,KAAtB,CAHpB;AAIE,MAAA,KAAK,EAAEiH,yBAAe,CAACvG,gBAAgB,CAAC2D,MAAlB,EAA0BrE,KAA1B,CAJxB;AAKE,MAAA,cAAc,EAAE;AAAA,eAAMa,mBAAmB,CAAC,IAAD,CAAzB;AAAA,OALlB;AAME,MAAA,QAAQ,EAAEH,gBAAgB,CAACwG,QAN7B;AAOE,MAAA,KAAK,EAAErE;AAPT,MA/CN;AAAA,IADF;AA4DD;;;;"}

package/lib/cjs/components/Builder/SearchInput.js

@@ -75,7 +75,9 @@ var SearchInput = function SearchInput(_ref) {
         className: "search-icon",
         style: {
           left: '8px',
-          position: 'absolute'
+          position: 'absolute',
+          top: '50%',
+          transform: 'translateY(-40%)'
         },
         children: /*#__PURE__*/jsxRuntime.jsx(search, {
           className: "section-search-icon"