svelte-dnd-action 0.9.20 → 0.9.21

package/dist/index.js

@@ -6,17 +6,14 @@
 
   function ownKeys(object, enumerableOnly) {
     var keys = Object.keys(object);
-
     if (Object.getOwnPropertySymbols) {
       var symbols = Object.getOwnPropertySymbols(object);
       enumerableOnly && (symbols = symbols.filter(function (sym) {
         return Object.getOwnPropertyDescriptor(object, sym).enumerable;
       })), keys.push.apply(keys, symbols);
     }
-
     return keys;
   }
-
   function _objectSpread2(target) {
     for (var i = 1; i < arguments.length; i++) {
       var source = null != arguments[i] ? arguments[i] : {};
@@ -26,10 +23,8 @@
         Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
       });
     }
-
     return target;
   }
-
   function _typeof(obj) {
     "@babel/helpers - typeof";
 
@@ -39,7 +34,6 @@
       return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj;
     }, _typeof(obj);
   }
-
   function _defineProperty(obj, key, value) {
     if (key in obj) {
       Object.defineProperty(obj, key, {
@@ -51,35 +45,26 @@
     } else {
       obj[key] = value;
     }
-
     return obj;
   }
-
   function _objectWithoutPropertiesLoose(source, excluded) {
     if (source == null) return {};
     var target = {};
     var sourceKeys = Object.keys(source);
     var key, i;
-
     for (i = 0; i < sourceKeys.length; i++) {
       key = sourceKeys[i];
       if (excluded.indexOf(key) >= 0) continue;
       target[key] = source[key];
     }
-
     return target;
   }
-
   function _objectWithoutProperties(source, excluded) {
     if (source == null) return {};
-
     var target = _objectWithoutPropertiesLoose(source, excluded);
-
     var key, i;
-
     if (Object.getOwnPropertySymbols) {
       var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
-
       for (i = 0; i < sourceSymbolKeys.length; i++) {
         key = sourceSymbolKeys[i];
         if (excluded.indexOf(key) >= 0) continue;
@@ -87,44 +72,33 @@
         target[key] = source[key];
       }
     }
-
     return target;
   }
-
   function _slicedToArray(arr, i) {
     return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest();
   }
-
   function _toConsumableArray(arr) {
     return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
   }
-
   function _arrayWithoutHoles(arr) {
     if (Array.isArray(arr)) return _arrayLikeToArray(arr);
   }
-
   function _arrayWithHoles(arr) {
     if (Array.isArray(arr)) return arr;
   }
-
   function _iterableToArray(iter) {
     if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
   }
-
   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) {
@@ -137,10 +111,8 @@
         if (_d) throw _e;
       }
     }
-
     return _arr;
   }
-
   function _unsupportedIterableToArray(o, minLen) {
     if (!o) return;
     if (typeof o === "string") return _arrayLikeToArray(o, minLen);
@@ -149,33 +121,24 @@
     if (n === "Map" || n === "Set") return Array.from(o);
     if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
   }
-
   function _arrayLikeToArray(arr, len) {
     if (len == null || len > arr.length) len = arr.length;
-
     for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
-
     return arr2;
   }
-
   function _nonIterableSpread() {
     throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
-
   function _nonIterableRest() {
     throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
   }
-
   function _createForOfIteratorHelper(o, allowArrayLike) {
     var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
-
     if (!it) {
       if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
         if (it) o = it;
         var i = 0;
-
         var F = function () {};
-
         return {
           s: F,
           n: function () {
@@ -193,13 +156,11 @@
           f: F
         };
       }
-
       throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
     }
-
     var normalCompletion = true,
-        didErr = false,
-        err;
+      didErr = false,
+      err;
     return {
       s: function () {
         it = it.call(o);
@@ -226,6 +187,7 @@
   // external events
   var FINALIZE_EVENT_NAME = "finalize";
   var CONSIDER_EVENT_NAME = "consider";
+
   /**
    * @typedef {Object} Info
    * @property {string} trigger
@@ -235,7 +197,6 @@
    * @param {Array} items
    * @param {Info} info
    */
-
   function dispatchFinalizeEvent(el, items, info) {
     el.dispatchEvent(new CustomEvent(FINALIZE_EVENT_NAME, {
       detail: {
@@ -244,13 +205,13 @@
       }
     }));
   }
+
   /**
    * Dispatches a consider event
    * @param {Node} el
    * @param {Array} items
    * @param {Info} info
    */
-
   function dispatchConsiderEvent(el, items, info) {
     el.dispatchEvent(new CustomEvent(CONSIDER_EVENT_NAME, {
       detail: {
@@ -258,8 +219,9 @@
         info: info
       }
     }));
-  } // internal events
+  }
 
+  // internal events
   var DRAGGED_ENTERED_EVENT_NAME = "draggedEntered";
   var DRAGGED_LEFT_EVENT_NAME = "draggedLeft";
   var DRAGGED_OVER_INDEX_EVENT_NAME = "draggedOverIndex";
@@ -276,12 +238,12 @@
       }
     }));
   }
+
   /**
    * @param containerEl - the dropzone the element left
    * @param draggedEl - the dragged element
    * @param theOtherDz - the new dropzone the element entered
    */
-
   function dispatchDraggedElementLeftContainerForAnother(containerEl, draggedEl, theOtherDz) {
     containerEl.dispatchEvent(new CustomEvent(DRAGGED_LEFT_EVENT_NAME, {
       detail: {
@@ -344,25 +306,22 @@
     if (activeDndZoneCount === 0) {
       throw new Error("Bug! trying to decrement when there are no dropzones");
     }
-
     activeDndZoneCount--;
   }
+
   /**
    * Allows using another key instead of "id" in the items data. This is global and applies to all dndzones.
    * Has to be called when there are no rendered dndzones whatsoever.
    * @param {String} newKeyName
    * @throws {Error} if it was called when there are rendered dndzones or if it is given the wrong type (not a string)
    */
-
   function overrideItemIdKeyNameBeforeInitialisingDndZones(newKeyName) {
     if (activeDndZoneCount > 0) {
       throw new Error("can only override the id key before initialising any dndzone");
     }
-
     if (typeof newKeyName !== "string") {
       throw new Error("item id key has to be a string");
     }
-
     printDebug(function () {
       return ["overriding item id key name", newKeyName];
     });
@@ -370,17 +329,16 @@
   }
   var isOnServer = typeof window === "undefined";
   var printDebug = function printDebug() {};
+
   /**
    * Allows the user to show/hide console debug output
    * * @param {Boolean} isDebug
    */
-
   function setDebugMode(isDebug) {
     if (isDebug) {
       printDebug = function printDebug(generateMessage) {
         var logFunction = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : console.debug;
         var message = generateMessage();
-
         if (Array.isArray(message)) {
           logFunction.apply(void 0, _toConsumableArray(message));
         } else {
@@ -394,7 +352,6 @@
 
   // This is based off https://stackoverflow.com/questions/27745438/how-to-compute-getboundingclientrect-without-considering-transforms/57876601#57876601
   // It removes the transforms that are potentially applied by the flip animations
-
   /**
    * Gets the bounding rect but removes transforms (ex: flip animation)
    * @param {HTMLElement} el
@@ -405,10 +362,8 @@
     var rect = el.getBoundingClientRect();
     var style = getComputedStyle(el);
     var tx = style.transform;
-
     if (tx) {
       var sx, sy, dx, dy;
-
       if (tx.startsWith("matrix3d(")) {
         ta = tx.slice(9, -1).split(/, /);
         sx = +ta[0];
@@ -424,7 +379,6 @@
       } else {
         return rect;
       }
-
       var to = style.transformOrigin;
       var x = rect.x - dx - (1 - sx) * parseFloat(to);
       var y = rect.y - dy - (1 - sy) * parseFloat(to.slice(to.indexOf(" ") + 1));
@@ -444,12 +398,12 @@
       return rect;
     }
   }
+
   /**
    * Gets the absolute bounding rect (accounts for the window's scroll position and removes transforms)
    * @param {HTMLElement} el
    * @return {{top: number, left: number, bottom: number, right: number}}
    */
-
   function getAbsoluteRectNoTransforms(el) {
     var rect = getBoundingRectNoTransforms(el);
     return {
@@ -459,12 +413,12 @@
       right: rect.right + window.scrollX
     };
   }
+
   /**
    * Gets the absolute bounding rect (accounts for the window's scroll position)
    * @param {HTMLElement} el
    * @return {{top: number, left: number, bottom: number, right: number}}
    */
-
   function getAbsoluteRect(el) {
     var rect = el.getBoundingClientRect();
     return {
@@ -474,6 +428,7 @@
       right: rect.right + window.scrollX
     };
   }
+
   /**
    * finds the center :)
    * @typedef {Object} Rect
@@ -484,13 +439,13 @@
    * @param {Rect} rect
    * @return {{x: number, y: number}}
    */
-
   function findCenter(rect) {
     return {
       x: (rect.left + rect.right) / 2,
       y: (rect.top + rect.bottom) / 2
     };
   }
+
   /**
    * @typedef {Object} Point
    * @property {number} x
@@ -499,74 +454,70 @@
    * @param {Point} pointB
    * @return {number}
    */
-
   function calcDistance(pointA, pointB) {
     return Math.sqrt(Math.pow(pointA.x - pointB.x, 2) + Math.pow(pointA.y - pointB.y, 2));
   }
+
   /**
    * @param {Point} point
    * @param {Rect} rect
    * @return {boolean|boolean}
    */
-
-
   function isPointInsideRect(point, rect) {
     return point.y <= rect.bottom && point.y >= rect.top && point.x >= rect.left && point.x <= rect.right;
   }
+
   /**
    * find the absolute coordinates of the center of a dom element
    * @param el {HTMLElement}
    * @returns {{x: number, y: number}}
    */
-
   function findCenterOfElement(el) {
     return findCenter(getAbsoluteRect(el));
   }
+
   /**
    * @param {HTMLElement} elA
    * @param {HTMLElement} elB
    * @return {boolean}
    */
-
   function isCenterOfAInsideB(elA, elB) {
     var centerOfA = findCenterOfElement(elA);
     var rectOfB = getAbsoluteRectNoTransforms(elB);
     return isPointInsideRect(centerOfA, rectOfB);
   }
+
   /**
    * @param {HTMLElement|ChildNode} elA
    * @param {HTMLElement|ChildNode} elB
    * @return {number}
    */
-
   function calcDistanceBetweenCenters(elA, elB) {
     var centerOfA = findCenterOfElement(elA);
     var centerOfB = findCenterOfElement(elB);
     return calcDistance(centerOfA, centerOfB);
   }
+
   /**
    * @param {HTMLElement} el - the element to check
    * @returns {boolean} - true if the element in its entirety is off screen including the scrollable area (the normal dom events look at the mouse rather than the element)
    */
-
   function isElementOffDocument(el) {
     var rect = getAbsoluteRect(el);
     return rect.right < 0 || rect.left > document.documentElement.scrollWidth || rect.bottom < 0 || rect.top > document.documentElement.scrollHeight;
   }
+
   /**
    * If the point is inside the element returns its distances from the sides, otherwise returns null
    * @param {Point} point
    * @param {HTMLElement} el
    * @return {null|{top: number, left: number, bottom: number, right: number}}
    */
-
   function calcInnerDistancesBetweenPointAndSidesOfElement(point, el) {
     var rect = getAbsoluteRect(el);
-
     if (!isPointInsideRect(point, rect)) {
       return null;
     }
-
     return {
       top: point.y - rect.top,
       bottom: rect.bottom - point.y,
@@ -577,10 +528,10 @@
   }
 
   var dzToShadowIndexToRect;
+
   /**
    * Resets the cache that allows for smarter "would be index" resolution. Should be called after every drag operation
    */
-
   function resetIndexesCache() {
     printDebug(function () {
       return "resetting indexes cache";
@@ -588,75 +539,68 @@
     dzToShadowIndexToRect = new Map();
   }
   resetIndexesCache();
+
   /**
    * Resets the cache that allows for smarter "would be index" resolution for a specific dropzone, should be called after the zone was scrolled
    * @param {HTMLElement} dz
    */
-
   function resetIndexesCacheForDz(dz) {
     printDebug(function () {
       return "resetting indexes cache for dz";
     });
     dzToShadowIndexToRect["delete"](dz);
   }
+
   /**
    * Caches the coordinates of the shadow element when it's in a certain index in a certain dropzone.
    * Helpful in order to determine "would be index" more effectively
    * @param {HTMLElement} dz
    * @return {number} - the shadow element index
    */
-
   function cacheShadowRect(dz) {
     var shadowElIndex = Array.from(dz.children).findIndex(function (child) {
       return child.getAttribute(SHADOW_ELEMENT_ATTRIBUTE_NAME);
     });
-
     if (shadowElIndex >= 0) {
       if (!dzToShadowIndexToRect.has(dz)) {
         dzToShadowIndexToRect.set(dz, new Map());
       }
-
       dzToShadowIndexToRect.get(dz).set(shadowElIndex, getAbsoluteRectNoTransforms(dz.children[shadowElIndex]));
       return shadowElIndex;
     }
-
     return undefined;
   }
+
   /**
    * @typedef {Object} Index
    * @property {number} index - the would be index
    * @property {boolean} isProximityBased - false if the element is actually over the index, true if it is not over it but this index is the closest
    */
-
   /**
    * Find the index for the dragged element in the list it is dragged over
    * @param {HTMLElement} floatingAboveEl
    * @param {HTMLElement} collectionBelowEl
    * @returns {Index|null} -  if the element is over the container the Index object otherwise null
    */
-
-
   function findWouldBeIndex(floatingAboveEl, collectionBelowEl) {
     if (!isCenterOfAInsideB(floatingAboveEl, collectionBelowEl)) {
       return null;
     }
-
-    var children = collectionBelowEl.children; // the container is empty, floating element should be the first
-
+    var children = collectionBelowEl.children;
+    // the container is empty, floating element should be the first
     if (children.length === 0) {
       return {
         index: 0,
         isProximityBased: true
       };
     }
+    var shadowElIndex = cacheShadowRect(collectionBelowEl);
 
-    var shadowElIndex = cacheShadowRect(collectionBelowEl); // the search could be more efficient but keeping it simple for now
+    // the search could be more efficient but keeping it simple for now
     // a possible improvement: pass in the lastIndex it was found in and check there first, then expand from there
-
     for (var i = 0; i < children.length; i++) {
       if (isCenterOfAInsideB(floatingAboveEl, children[i])) {
         var cachedShadowRect = dzToShadowIndexToRect.has(collectionBelowEl) && dzToShadowIndexToRect.get(collectionBelowEl).get(i);
-
         if (cachedShadowRect) {
           if (!isPointInsideRect(findCenterOfElement(floatingAboveEl), cachedShadowRect)) {
             return {
@@ -665,28 +609,24 @@
             };
           }
         }
-
         return {
           index: i,
           isProximityBased: false
         };
       }
-    } // this can happen if there is space around the children so the floating element has
+    }
+    // this can happen if there is space around the children so the floating element has
     //entered the container but not any of the children, in this case we will find the nearest child
-
-
     var minDistanceSoFar = Number.MAX_VALUE;
-    var indexOfMin = undefined; // we are checking all of them because we don't know whether we are dealing with a horizontal or vertical container and where the floating element entered from
-
+    var indexOfMin = undefined;
+    // we are checking all of them because we don't know whether we are dealing with a horizontal or vertical container and where the floating element entered from
     for (var _i = 0; _i < children.length; _i++) {
       var distance = calcDistanceBetweenCenters(floatingAboveEl, children[_i]);
-
       if (distance < minDistanceSoFar) {
         minDistanceSoFar = distance;
         indexOfMin = _i;
       }
     }
-
     return {
       index: indexOfMin,
       isProximityBased: true
@@ -696,21 +636,18 @@
   var SCROLL_ZONE_PX = 25;
   function makeScroller() {
     var scrollingInfo;
-
     function resetScrolling() {
       scrollingInfo = {
         directionObj: undefined,
         stepPx: 0
       };
     }
-
-    resetScrolling(); // directionObj {x: 0|1|-1, y:0|1|-1} - 1 means down in y and right in x
-
+    resetScrolling();
+    // directionObj {x: 0|1|-1, y:0|1|-1} - 1 means down in y and right in x
     function scrollContainer(containerEl) {
       var _scrollingInfo = scrollingInfo,
-          directionObj = _scrollingInfo.directionObj,
-          stepPx = _scrollingInfo.stepPx;
-
+        directionObj = _scrollingInfo.directionObj,
+        stepPx = _scrollingInfo.stepPx;
       if (directionObj) {
         containerEl.scrollBy(directionObj.x * stepPx, directionObj.y * stepPx);
         window.requestAnimationFrame(function () {
@@ -718,33 +655,28 @@
         });
       }
     }
-
     function calcScrollStepPx(distancePx) {
       return SCROLL_ZONE_PX - distancePx;
     }
+
     /**
      * If the pointer is next to the sides of the element to scroll, will trigger scrolling
      * Can be called repeatedly with updated pointer and elementToScroll values without issues
      * @return {boolean} - true if scrolling was needed
      */
-
-
     function scrollIfNeeded(pointer, elementToScroll) {
       if (!elementToScroll) {
         return false;
       }
-
       var distances = calcInnerDistancesBetweenPointAndSidesOfElement(pointer, elementToScroll);
-
       if (distances === null) {
         resetScrolling();
         return false;
       }
-
       var isAlreadyScrolling = !!scrollingInfo.directionObj;
       var scrollingVertically = false,
-          scrollingHorizontally = false; // vertical
-
+        scrollingHorizontally = false;
+      // vertical
       if (elementToScroll.scrollHeight > elementToScroll.clientHeight) {
         if (distances.bottom < SCROLL_ZONE_PX) {
           scrollingVertically = true;
@@ -761,14 +693,12 @@
           };
           scrollingInfo.stepPx = calcScrollStepPx(distances.top);
         }
-
         if (!isAlreadyScrolling && scrollingVertically) {
           scrollContainer(elementToScroll);
           return true;
         }
-      } // horizontal
-
-
+      }
+      // horizontal
       if (elementToScroll.scrollWidth > elementToScroll.clientWidth) {
         if (distances.right < SCROLL_ZONE_PX) {
           scrollingHorizontally = true;
@@ -785,17 +715,14 @@
           };
           scrollingInfo.stepPx = calcScrollStepPx(distances.left);
         }
-
         if (!isAlreadyScrolling && scrollingHorizontally) {
           scrollContainer(elementToScroll);
           return true;
         }
       }
-
       resetScrolling();
       return false;
     }
-
     return {
       scrollIfNeeded: scrollIfNeeded,
       resetScrolling: resetScrolling
@@ -809,110 +736,98 @@
   function toString(object) {
     return JSON.stringify(object, null, 2);
   }
+
   /**
    * Finds the depth of the given node in the DOM tree
    * @param {HTMLElement} node
    * @return {number} - the depth of the node
    */
-
   function getDepth(node) {
     if (!node) {
       throw new Error("cannot get depth of a falsy node");
     }
-
     return _getDepth(node, 0);
   }
-
   function _getDepth(node) {
     var countSoFar = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
-
     if (!node.parentElement) {
       return countSoFar - 1;
     }
-
     return _getDepth(node.parentElement, countSoFar + 1);
   }
+
   /**
    * A simple util to shallow compare objects quickly, it doesn't validate the arguments so pass objects in
    * @param {Object} objA
    * @param {Object} objB
    * @return {boolean} - true if objA and objB are shallow equal
    */
-
-
   function areObjectsShallowEqual(objA, objB) {
     if (Object.keys(objA).length !== Object.keys(objB).length) {
       return false;
     }
-
     for (var keyA in objA) {
       if (!{}.hasOwnProperty.call(objB, keyA) || objB[keyA] !== objA[keyA]) {
         return false;
       }
     }
-
     return true;
   }
+
   /**
    * Shallow compares two arrays
    * @param arrA
    * @param arrB
    * @return {boolean} - whether the arrays are shallow equal
    */
-
   function areArraysShallowEqualSameOrder(arrA, arrB) {
     if (arrA.length !== arrB.length) {
       return false;
     }
-
     for (var i = 0; i < arrA.length; i++) {
       if (arrA[i] !== arrB[i]) {
         return false;
       }
     }
-
     return true;
   }
 
   var INTERVAL_MS = 200;
   var TOLERANCE_PX = 10;
-
   var _makeScroller = makeScroller(),
-      scrollIfNeeded = _makeScroller.scrollIfNeeded,
-      resetScrolling = _makeScroller.resetScrolling;
-
+    scrollIfNeeded = _makeScroller.scrollIfNeeded,
+    resetScrolling = _makeScroller.resetScrolling;
   var next;
+
   /**
    * Tracks the dragged elements and performs the side effects when it is dragged over a drop zone (basically dispatching custom-events scrolling)
    * @param {Set<HTMLElement>} dropZones
    * @param {HTMLElement} draggedEl
    * @param {number} [intervalMs = INTERVAL_MS]
    */
-
   function observe(draggedEl, dropZones) {
     var intervalMs = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : INTERVAL_MS;
     // initialization
     var lastDropZoneFound;
     var lastIndexFound;
     var lastIsDraggedInADropZone = false;
-    var lastCentrePositionOfDragged; // We are sorting to make sure that in case of nested zones of the same type the one "on top" is considered first
-
+    var lastCentrePositionOfDragged;
+    // We are sorting to make sure that in case of nested zones of the same type the one "on top" is considered first
     var dropZonesFromDeepToShallow = Array.from(dropZones).sort(function (dz1, dz2) {
       return getDepth(dz2) - getDepth(dz1);
     });
+
     /**
      * The main function in this module. Tracks where everything is/ should be a take the actions
      */
-
     function andNow() {
       var currentCenterOfDragged = findCenterOfElement(draggedEl);
-      var scrolled = scrollIfNeeded(currentCenterOfDragged, lastDropZoneFound); // we only want to make a new decision after the element was moved a bit to prevent flickering
-
+      var scrolled = scrollIfNeeded(currentCenterOfDragged, lastDropZoneFound);
+      // we only want to make a new decision after the element was moved a bit to prevent flickering
       if (!scrolled && lastCentrePositionOfDragged && Math.abs(lastCentrePositionOfDragged.x - currentCenterOfDragged.x) < TOLERANCE_PX && Math.abs(lastCentrePositionOfDragged.y - currentCenterOfDragged.y) < TOLERANCE_PX) {
         next = window.setTimeout(andNow, intervalMs);
         return;
       }
-
       if (isElementOffDocument(draggedEl)) {
         printDebug(function () {
           return "off document";
@@ -920,28 +835,23 @@
         dispatchDraggedLeftDocument(draggedEl);
         return;
       }
-
-      lastCentrePositionOfDragged = currentCenterOfDragged; // this is a simple algorithm, potential improvement: first look at lastDropZoneFound
-
+      lastCentrePositionOfDragged = currentCenterOfDragged;
+      // this is a simple algorithm, potential improvement: first look at lastDropZoneFound
       var isDraggedInADropZone = false;
-
       var _iterator = _createForOfIteratorHelper(dropZonesFromDeepToShallow),
-          _step;
-
+        _step;
       try {
         for (_iterator.s(); !(_step = _iterator.n()).done;) {
           var dz = _step.value;
           if (scrolled) resetIndexesCacheForDz(lastDropZoneFound);
           var indexObj = findWouldBeIndex(draggedEl, dz);
-
           if (indexObj === null) {
             // it is not inside
             continue;
           }
-
           var index = indexObj.index;
-          isDraggedInADropZone = true; // the element is over a container
-
+          isDraggedInADropZone = true;
+          // the element is over a container
           if (dz !== lastDropZoneFound) {
             lastDropZoneFound && dispatchDraggedElementLeftContainerForAnother(lastDropZoneFound, draggedEl, dz);
             dispatchDraggedElementEnteredContainer(dz, indexObj, draggedEl);
@@ -949,18 +859,16 @@
           } else if (index !== lastIndexFound) {
             dispatchDraggedElementIsOverIndex(dz, indexObj, draggedEl);
             lastIndexFound = index;
-          } // we handle looping with the 'continue' statement above
-
-
+          }
+          // we handle looping with the 'continue' statement above
           break;
-        } // the first time the dragged element is not in any dropzone we need to notify the last dropzone it was in
-
+        }
+        // the first time the dragged element is not in any dropzone we need to notify the last dropzone it was in
       } catch (err) {
         _iterator.e(err);
       } finally {
         _iterator.f();
       }
-
       if (!isDraggedInADropZone && lastIsDraggedInADropZone && lastDropZoneFound) {
         dispatchDraggedElementLeftContainerForNone(lastDropZoneFound, draggedEl);
         lastDropZoneFound = undefined;
@@ -969,13 +877,12 @@
       } else {
         lastIsDraggedInADropZone = true;
       }
-
       next = window.setTimeout(andNow, intervalMs);
     }
-
     andNow();
-  } // assumption - we can only observe one dragged element at a time, this could be changed in the future
+  }
 
+  // assumption - we can only observe one dragged element at a time, this could be changed in the future
   function unobserve() {
     printDebug(function () {
       return "unobserving";
@@ -987,12 +894,12 @@
 
   var INTERVAL_MS$1 = 300;
   var mousePosition;
+
   /**
    * Do not use this! it is visible for testing only until we get over the issue Cypress not triggering the mousemove listeners
    * // TODO - make private (remove export)
    * @param {{clientX: number, clientY: number}} e
    */
-
   function updateMousePosition(e) {
     var c = e.touches ? e.touches[0] : e;
     mousePosition = {
@@ -1000,26 +907,21 @@
       y: c.clientY
     };
   }
-
   var _makeScroller$1 = makeScroller(),
-      scrollIfNeeded$1 = _makeScroller$1.scrollIfNeeded,
-      resetScrolling$1 = _makeScroller$1.resetScrolling;
-
+    scrollIfNeeded$1 = _makeScroller$1.scrollIfNeeded,
+    resetScrolling$1 = _makeScroller$1.resetScrolling;
   var next$1;
-
   function loop() {
     if (mousePosition) {
       var scrolled = scrollIfNeeded$1(mousePosition, document.documentElement);
       if (scrolled) resetIndexesCache();
     }
-
     next$1 = window.setTimeout(loop, INTERVAL_MS$1);
   }
+
   /**
    * will start watching the mouse pointer and scroll the window if it goes next to the edges
    */
-
-
   function armWindowScroller() {
     printDebug(function () {
       return "arming window scroller";
@@ -1028,10 +930,10 @@
     window.addEventListener("touchmove", updateMousePosition);
     loop();
   }
+
   /**
    * will stop watching the mouse pointer and won't scroll the window anymore
    */
-
   function disarmWindowScroller() {
     printDebug(function () {
       return "disarming window scroller";
@@ -1057,10 +959,8 @@
     var values = [];
     var elIsSelect = el.tagName === "SELECT";
     var selects = elIsSelect ? [el] : _toConsumableArray(el.querySelectorAll('select'));
-
     var _iterator = _createForOfIteratorHelper(selects),
-        _step;
-
+      _step;
     try {
       for (_iterator.s(); !(_step = _iterator.n()).done;) {
         var _select = _step.value;
@@ -1071,33 +971,28 @@
     } finally {
       _iterator.f();
     }
-
     if (selects.length <= 0) {
       return cloned;
     }
-
     var clonedSelects = elIsSelect ? [cloned] : _toConsumableArray(cloned.querySelectorAll('select'));
-
     for (var i = 0; i < clonedSelects.length; i++) {
       var select = clonedSelects[i];
       var value = values[i];
       var optionEl = select.querySelector("option[value=\"".concat(value, "\""));
-
       if (optionEl) {
         optionEl.setAttribute('selected', true);
       }
     }
-
     return cloned;
   }
 
   var TRANSITION_DURATION_SECONDS = 0.2;
+
   /**
    * private helper function - creates a transition string for a property
    * @param {string} property
    * @return {string} - the transition string
    */
-
   function trs(property) {
     return "".concat(property, " ").concat(TRANSITION_DURATION_SECONDS, "s ease");
   }
@@ -1107,8 +1002,6 @@
    * @param {Point} [positionCenterOnXY]
    * @return {Node} - the cloned, styled element
    */
-
-
   function createDraggedElementFrom(originalElement, positionCenterOnXY) {
     var rect = originalElement.getBoundingClientRect();
     var draggedEl = svelteNodeClone(originalElement);
@@ -1119,7 +1012,6 @@
     var elLeftPx = rect.left;
     draggedEl.style.top = "".concat(elTopPx, "px");
     draggedEl.style.left = "".concat(elLeftPx, "px");
-
     if (positionCenterOnXY) {
       var center = findCenter(rect);
       elTopPx -= center.y - positionCenterOnXY.y;
@@ -1129,14 +1021,13 @@
         draggedEl.style.left = "".concat(elLeftPx, "px");
       }, 0);
     }
-
-    draggedEl.style.margin = "0"; // we can't have relative or automatic height and width or it will break the illusion
-
+    draggedEl.style.margin = "0";
+    // we can't have relative or automatic height and width or it will break the illusion
     draggedEl.style.boxSizing = "border-box";
     draggedEl.style.height = "".concat(rect.height, "px");
     draggedEl.style.width = "".concat(rect.width, "px");
-    draggedEl.style.transition = "".concat(trs("top"), ", ").concat(trs("left"), ", ").concat(trs("background-color"), ", ").concat(trs("opacity"), ", ").concat(trs("color"), " "); // this is a workaround for a strange browser bug that causes the right border to disappear when all the transitions are added at the same time
-
+    draggedEl.style.transition = "".concat(trs("top"), ", ").concat(trs("left"), ", ").concat(trs("background-color"), ", ").concat(trs("opacity"), ", ").concat(trs("color"), " ");
+    // this is a workaround for a strange browser bug that causes the right border to disappear when all the transitions are added at the same time
     window.setTimeout(function () {
       return draggedEl.style.transition += ", ".concat(trs("width"), ", ").concat(trs("height"));
     }, 0);
@@ -1144,29 +1035,28 @@
     draggedEl.style.cursor = "grabbing";
     return draggedEl;
   }
+
   /**
    * styles the dragged element to a 'dropped' state
    * @param {HTMLElement} draggedEl
    */
-
   function moveDraggedElementToWasDroppedState(draggedEl) {
     draggedEl.style.cursor = "grab";
   }
+
   /**
    * Morphs the dragged element style, maintains the mouse pointer within the element
    * @param {HTMLElement} draggedEl
    * @param {HTMLElement} copyFromEl - the element the dragged element should look like, typically the shadow element
    * @param {number} currentMouseX
    * @param {number} currentMouseY
-   * @param {function} transformDraggedElement - function to transform the dragged element, does nothing by default.
    */
-
-  function morphDraggedElementToBeLike(draggedEl, copyFromEl, currentMouseX, currentMouseY, transformDraggedElement) {
+  function morphDraggedElementToBeLike(draggedEl, copyFromEl, currentMouseX, currentMouseY) {
+    copyStylesFromTo(copyFromEl, draggedEl);
     var newRect = copyFromEl.getBoundingClientRect();
     var draggedElRect = draggedEl.getBoundingClientRect();
     var widthChange = newRect.width - draggedElRect.width;
     var heightChange = newRect.height - draggedElRect.height;
-
     if (widthChange || heightChange) {
       var relativeDistanceOfMousePointerFromDraggedSides = {
         left: (currentMouseX - draggedElRect.left) / draggedElRect.width,
@@ -1176,17 +1066,13 @@
       draggedEl.style.width = "".concat(newRect.width, "px");
       draggedEl.style.left = "".concat(parseFloat(draggedEl.style.left) - relativeDistanceOfMousePointerFromDraggedSides.left * widthChange, "px");
       draggedEl.style.top = "".concat(parseFloat(draggedEl.style.top) - relativeDistanceOfMousePointerFromDraggedSides.top * heightChange, "px");
-    } /// other properties
-
-
-    copyStylesFromTo(copyFromEl, draggedEl);
-    transformDraggedElement();
+    }
   }
+
   /**
    * @param {HTMLElement} copyFromEl
    * @param {HTMLElement} copyToEl
    */
-
   function copyStylesFromTo(copyFromEl, copyToEl) {
     var computedStyle = window.getComputedStyle(copyFromEl);
     Array.from(computedStyle).filter(function (s) {
@@ -1195,20 +1081,17 @@
       return copyToEl.style.setProperty(s, computedStyle.getPropertyValue(s), computedStyle.getPropertyPriority(s));
     });
   }
+
   /**
    * makes the element compatible with being draggable
    * @param {HTMLElement} draggableEl
    * @param {boolean} dragDisabled
    */
-
-
   function styleDraggable(draggableEl, dragDisabled) {
     draggableEl.draggable = false;
-
     draggableEl.ondragstart = function () {
       return false;
     };
-
     if (!dragDisabled) {
       draggableEl.style.userSelect = "none";
       draggableEl.style.WebkitUserSelect = "none";
@@ -1219,41 +1102,41 @@
       draggableEl.style.cursor = "";
     }
   }
+
   /**
    * Hides the provided element so that it can stay in the dom without interrupting
    * @param {HTMLElement} dragTarget
    */
-
   function hideElement(dragTarget) {
     dragTarget.style.display = "none";
     dragTarget.style.position = "fixed";
     dragTarget.style.zIndex = "-5";
   }
+
   /**
    * styles the shadow element
    * @param {HTMLElement} shadowEl
    */
-
   function decorateShadowEl(shadowEl) {
     shadowEl.style.visibility = "hidden";
     shadowEl.setAttribute(SHADOW_ELEMENT_ATTRIBUTE_NAME, "true");
   }
+
   /**
    * undo the styles the shadow element
    * @param {HTMLElement} shadowEl
    */
-
   function unDecorateShadowElement(shadowEl) {
     shadowEl.style.visibility = "";
     shadowEl.removeAttribute(SHADOW_ELEMENT_ATTRIBUTE_NAME);
   }
+
   /**
    * will mark the given dropzones as visually active
    * @param {Array<HTMLElement>} dropZones
    * @param {Function} getStyles - maps a dropzone to a styles object (so the styles can be removed)
    * @param {Function} getClasses - maps a dropzone to a classList
    */
-
   function styleActiveDropZones(dropZones) {
     var getStyles = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
     var getClasses = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function () {
@@ -1269,13 +1152,13 @@
       });
     });
   }
+
   /**
    * will remove the 'active' styling from given dropzones
    * @param {Array<HTMLElement>} dropZones
    * @param {Function} getStyles - maps a dropzone to a styles object
    * @param {Function} getClasses - maps a dropzone to a classList
    */
-
   function styleInactiveDropZones(dropZones) {
     var getStyles = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : function () {};
     var getClasses = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : function () {
@@ -1291,12 +1174,12 @@
       });
     });
   }
+
   /**
    * will prevent the provided element from shrinking by setting its minWidth and minHeight to the current width and height values
    * @param {HTMLElement} el
    * @return {function(): void} - run this function to undo the operation and restore the original values
    */
-
   function preventShrinking(el) {
     var originalMinHeight = el.style.minHeight;
     el.style.minHeight = window.getComputedStyle(el).getPropertyValue("height");
@@ -1328,51 +1211,45 @@
   var finalizingPreviousDrag = false;
   var unlockOriginDzMinDimensions;
   var isDraggedOutsideOfAnyDz = false;
-  var scheduledForRemovalAfterDrop = []; // a map from type to a set of drop-zones
-
-  var typeToDropZones = new Map(); // important - this is needed because otherwise the config that would be used for everyone is the config of the element that created the event listeners
-
-  var dzToConfig = new Map(); // this is needed in order to be able to cleanup old listeners and avoid stale closures issues (as the listener is defined within each zone)
+  var scheduledForRemovalAfterDrop = [];
 
+  // a map from type to a set of drop-zones
+  var typeToDropZones = new Map();
+  // important - this is needed because otherwise the config that would be used for everyone is the config of the element that created the event listeners
+  var dzToConfig = new Map();
+  // this is needed in order to be able to cleanup old listeners and avoid stale closures issues (as the listener is defined within each zone)
   var elToMouseDownListener = new WeakMap();
-  /* drop-zones registration management */
 
+  /* drop-zones registration management */
   function registerDropZone(dropZoneEl, type) {
     printDebug(function () {
       return "registering drop-zone if absent";
     });
-
     if (!typeToDropZones.has(type)) {
       typeToDropZones.set(type, new Set());
     }
-
     if (!typeToDropZones.get(type).has(dropZoneEl)) {
       typeToDropZones.get(type).add(dropZoneEl);
       incrementActiveDropZoneCount();
     }
   }
-
   function unregisterDropZone(dropZoneEl, type) {
     typeToDropZones.get(type)["delete"](dropZoneEl);
     decrementActiveDropZoneCount();
-
     if (typeToDropZones.get(type).size === 0) {
       typeToDropZones["delete"](type);
     }
   }
-  /* functions to manage observing the dragged element and trigger custom drag-events */
-
 
+  /* functions to manage observing the dragged element and trigger custom drag-events */
   function watchDraggedElement() {
     printDebug(function () {
       return "watching dragged element";
     });
     armWindowScroller();
     var dropZones = typeToDropZones.get(draggedElType);
-
     var _iterator = _createForOfIteratorHelper(dropZones),
-        _step;
-
+      _step;
     try {
       for (_iterator.s(); !(_step = _iterator.n()).done;) {
         var dz = _step.value;
@@ -1385,25 +1262,21 @@
     } finally {
       _iterator.f();
     }
-
-    window.addEventListener(DRAGGED_LEFT_DOCUMENT_EVENT_NAME, handleDrop); // it is important that we don't have an interval that is faster than the flip duration because it can cause elements to jump bach and forth
-
+    window.addEventListener(DRAGGED_LEFT_DOCUMENT_EVENT_NAME, handleDrop);
+    // it is important that we don't have an interval that is faster than the flip duration because it can cause elements to jump bach and forth
     var observationIntervalMs = Math.max.apply(Math, [MIN_OBSERVATION_INTERVAL_MS].concat(_toConsumableArray(Array.from(dropZones.keys()).map(function (dz) {
       return dzToConfig.get(dz).dropAnimationDurationMs;
     }))));
     observe(draggedEl, dropZones, observationIntervalMs * 1.07);
   }
-
   function unWatchDraggedElement() {
     printDebug(function () {
       return "unwatching dragged element";
     });
     disarmWindowScroller();
     var dropZones = typeToDropZones.get(draggedElType);
-
     var _iterator2 = _createForOfIteratorHelper(dropZones),
-        _step2;
-
+      _step2;
     try {
       for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
         var dz = _step2.value;
@@ -1416,52 +1289,45 @@
     } finally {
       _iterator2.f();
     }
-
     window.removeEventListener(DRAGGED_LEFT_DOCUMENT_EVENT_NAME, handleDrop);
     unobserve();
-  } // finds the initial placeholder that is placed there on drag start
-
+  }
 
+  // finds the initial placeholder that is placed there on drag start
   function findShadowPlaceHolderIdx(items) {
     return items.findIndex(function (item) {
       return item[ITEM_ID_KEY] === SHADOW_PLACEHOLDER_ITEM_ID;
     });
   }
-
   function findShadowElementIdx(items) {
     // checking that the id is not the placeholder's for Dragula like usecases
     return items.findIndex(function (item) {
       return !!item[SHADOW_ITEM_MARKER_PROPERTY_NAME] && item[ITEM_ID_KEY] !== SHADOW_PLACEHOLDER_ITEM_ID;
     });
   }
-  /* custom drag-events handlers */
-
 
+  /* custom drag-events handlers */
   function handleDraggedEntered(e) {
     printDebug(function () {
       return ["dragged entered", e.currentTarget, e.detail];
     });
-
     var _dzToConfig$get = dzToConfig.get(e.currentTarget),
-        items = _dzToConfig$get.items,
-        dropFromOthersDisabled = _dzToConfig$get.dropFromOthersDisabled;
-
+      items = _dzToConfig$get.items,
+      dropFromOthersDisabled = _dzToConfig$get.dropFromOthersDisabled;
     if (dropFromOthersDisabled && e.currentTarget !== originDropZone) {
       printDebug(function () {
         return "ignoring dragged entered because drop is currently disabled";
       });
       return;
     }
-
-    isDraggedOutsideOfAnyDz = false; // this deals with another race condition. in rare occasions (super rapid operations) the list hasn't updated yet
-
+    isDraggedOutsideOfAnyDz = false;
+    // this deals with another race condition. in rare occasions (super rapid operations) the list hasn't updated yet
     items = items.filter(function (item) {
       return item[ITEM_ID_KEY] !== shadowElData[ITEM_ID_KEY];
     });
     printDebug(function () {
       return "dragged entered items ".concat(toString(items));
     });
-
     if (originDropZone !== e.currentTarget) {
       var originZoneItems = dzToConfig.get(originDropZone).items;
       var newOriginZoneItems = originZoneItems.filter(function (item) {
@@ -1474,7 +1340,6 @@
       });
     } else {
       var shadowPlaceHolderIdx = findShadowPlaceHolderIdx(items);
-
       if (shadowPlaceHolderIdx !== -1) {
         // only happens right after drag start, on the first drag entered event
         printDebug(function () {
@@ -1483,10 +1348,9 @@
         items.splice(shadowPlaceHolderIdx, 1);
       }
     }
-
     var _e$detail$indexObj = e.detail.indexObj,
-        index = _e$detail$indexObj.index,
-        isProximityBased = _e$detail$indexObj.isProximityBased;
+      index = _e$detail$indexObj.index,
+      isProximityBased = _e$detail$indexObj.isProximityBased;
     var shadowElIdx = isProximityBased && index === e.currentTarget.children.length - 1 ? index + 1 : index;
     shadowElDropZone = e.currentTarget;
     items.splice(shadowElIdx, 0, shadowElData);
@@ -1496,32 +1360,27 @@
       source: SOURCES.POINTER
     });
   }
-
   function handleDraggedLeft(e) {
     // dealing with a rare race condition on extremely rapid clicking and dropping
     if (!isWorkingOnPreviousDrag) return;
     printDebug(function () {
       return ["dragged left", e.currentTarget, e.detail];
     });
-
     var _dzToConfig$get2 = dzToConfig.get(e.currentTarget),
-        items = _dzToConfig$get2.items,
-        dropFromOthersDisabled = _dzToConfig$get2.dropFromOthersDisabled;
-
+      items = _dzToConfig$get2.items,
+      dropFromOthersDisabled = _dzToConfig$get2.dropFromOthersDisabled;
     if (dropFromOthersDisabled && e.currentTarget !== originDropZone && e.currentTarget !== shadowElDropZone) {
       printDebug(function () {
         return "drop is currently disabled";
       });
       return;
     }
-
     var shadowElIdx = findShadowElementIdx(items);
     var shadowItem = items.splice(shadowElIdx, 1)[0];
     shadowElDropZone = undefined;
     var _e$detail = e.detail,
-        type = _e$detail.type,
-        theOtherDz = _e$detail.theOtherDz;
-
+      type = _e$detail.type,
+      theOtherDz = _e$detail.theOtherDz;
     if (type === DRAGGED_LEFT_TYPES.OUTSIDE_OF_ANY || type === DRAGGED_LEFT_TYPES.LEFT_FOR_ANOTHER && theOtherDz !== originDropZone && dzToConfig.get(theOtherDz).dropFromOthersDisabled) {
       printDebug(function () {
         return "dragged left all, putting shadow element back in the origin dz";
@@ -1535,32 +1394,27 @@
         id: draggedElData[ITEM_ID_KEY],
         source: SOURCES.POINTER
       });
-    } // for the origin dz, when the dragged is outside of any, this will be fired in addition to the previous. this is for simplicity
-
-
+    }
+    // for the origin dz, when the dragged is outside of any, this will be fired in addition to the previous. this is for simplicity
     dispatchConsiderEvent(e.currentTarget, items, {
       trigger: TRIGGERS.DRAGGED_LEFT,
       id: draggedElData[ITEM_ID_KEY],
       source: SOURCES.POINTER
     });
   }
-
   function handleDraggedIsOverIndex(e) {
     printDebug(function () {
       return ["dragged is over index", e.currentTarget, e.detail];
     });
-
     var _dzToConfig$get3 = dzToConfig.get(e.currentTarget),
-        items = _dzToConfig$get3.items,
-        dropFromOthersDisabled = _dzToConfig$get3.dropFromOthersDisabled;
-
+      items = _dzToConfig$get3.items,
+      dropFromOthersDisabled = _dzToConfig$get3.dropFromOthersDisabled;
     if (dropFromOthersDisabled && e.currentTarget !== originDropZone) {
       printDebug(function () {
         return "drop is currently disabled";
       });
       return;
     }
-
     isDraggedOutsideOfAnyDz = false;
     var index = e.detail.indexObj.index;
     var shadowElIdx = findShadowElementIdx(items);
@@ -1571,9 +1425,9 @@
       id: draggedElData[ITEM_ID_KEY],
       source: SOURCES.POINTER
     });
-  } // Global mouse/touch-events handlers
-
+  }
 
+  // Global mouse/touch-events handlers
   function handleMouseMove(e) {
     e.preventDefault();
     var c = e.touches ? e.touches[0] : e;
@@ -1583,47 +1437,41 @@
     };
     draggedEl.style.transform = "translate3d(".concat(currentMousePosition.x - dragStartMousePosition.x, "px, ").concat(currentMousePosition.y - dragStartMousePosition.y, "px, 0)");
   }
-
   function handleDrop() {
     printDebug(function () {
       return "dropped";
     });
-    finalizingPreviousDrag = true; // cleanup
-
+    finalizingPreviousDrag = true;
+    // cleanup
     window.removeEventListener("mousemove", handleMouseMove);
     window.removeEventListener("touchmove", handleMouseMove);
     window.removeEventListener("mouseup", handleDrop);
     window.removeEventListener("touchend", handleDrop);
     unWatchDraggedElement();
     moveDraggedElementToWasDroppedState(draggedEl);
-
     if (!shadowElDropZone) {
       printDebug(function () {
         return "element was dropped right after it left origin but before entering somewhere else";
       });
       shadowElDropZone = originDropZone;
     }
-
     printDebug(function () {
       return ["dropped in dz", shadowElDropZone];
     });
-
     var _dzToConfig$get4 = dzToConfig.get(shadowElDropZone),
-        items = _dzToConfig$get4.items,
-        type = _dzToConfig$get4.type;
-
+      items = _dzToConfig$get4.items,
+      type = _dzToConfig$get4.type;
     styleInactiveDropZones(typeToDropZones.get(type), function (dz) {
       return dzToConfig.get(dz).dropTargetStyle;
     }, function (dz) {
       return dzToConfig.get(dz).dropTargetClasses;
     });
-    var shadowElIdx = findShadowElementIdx(items); // the handler might remove the shadow element, ex: dragula like copy on drag
-
+    var shadowElIdx = findShadowElementIdx(items);
+    // the handler might remove the shadow element, ex: dragula like copy on drag
     if (shadowElIdx === -1) shadowElIdx = originIndex;
     items = items.map(function (item) {
       return item[SHADOW_ITEM_MARKER_PROPERTY_NAME] ? draggedElData : item;
     });
-
     function finalizeWithinZone() {
       unlockOriginDzMinDimensions();
       dispatchFinalizeEvent(shadowElDropZone, items, {
@@ -1631,7 +1479,6 @@
         id: draggedElData[ITEM_ID_KEY],
         source: SOURCES.POINTER
       });
-
       if (shadowElDropZone !== originDropZone) {
         // letting the origin drop zone know the element was permanently taken away
         dispatchFinalizeEvent(originDropZone, dzToConfig.get(originDropZone).items, {
@@ -1640,31 +1487,26 @@
           source: SOURCES.POINTER
         });
       }
-
       unDecorateShadowElement(shadowElDropZone.children[shadowElIdx]);
       cleanupPostDrop();
     }
-
     animateDraggedToFinalPosition(shadowElIdx, finalizeWithinZone);
-  } // helper function for handleDrop
-
+  }
 
+  // helper function for handleDrop
   function animateDraggedToFinalPosition(shadowElIdx, callback) {
     var shadowElRect = getBoundingRectNoTransforms(shadowElDropZone.children[shadowElIdx]);
     var newTransform = {
       x: shadowElRect.left - parseFloat(draggedEl.style.left),
       y: shadowElRect.top - parseFloat(draggedEl.style.top)
     };
-
     var _dzToConfig$get5 = dzToConfig.get(shadowElDropZone),
-        dropAnimationDurationMs = _dzToConfig$get5.dropAnimationDurationMs;
-
+      dropAnimationDurationMs = _dzToConfig$get5.dropAnimationDurationMs;
     var transition = "transform ".concat(dropAnimationDurationMs, "ms ease");
     draggedEl.style.transition = draggedEl.style.transition ? draggedEl.style.transition + "," + transition : transition;
     draggedEl.style.transform = "translate3d(".concat(newTransform.x, "px, ").concat(newTransform.y, "px, 0)");
     window.setTimeout(callback, dropAnimationDurationMs);
   }
-
   function scheduleDZForRemovalAfterDrop(dz, destroy) {
     scheduledForRemovalAfterDrop.push({
       dz: dz,
@@ -1676,25 +1518,21 @@
     });
   }
   /* cleanup */
-
-
   function cleanupPostDrop() {
     draggedEl.remove();
     originalDragTarget.remove();
-
     if (scheduledForRemovalAfterDrop.length) {
       printDebug(function () {
         return ["will destroy zones that were removed during drag", scheduledForRemovalAfterDrop];
       });
       scheduledForRemovalAfterDrop.forEach(function (_ref) {
         var dz = _ref.dz,
-            destroy = _ref.destroy;
+          destroy = _ref.destroy;
         destroy();
         dz.remove();
       });
       scheduledForRemovalAfterDrop = [];
     }
-
     draggedEl = undefined;
     originalDragTarget = undefined;
     draggedElData = undefined;
@@ -1710,7 +1548,6 @@
     unlockOriginDzMinDimensions = undefined;
     isDraggedOutsideOfAnyDz = false;
   }
-
   function dndzone(node, options) {
     var initialized = false;
     var config = {
@@ -1731,7 +1568,6 @@
       }];
     });
     var elToIdx = new Map();
-
     function addMaybeListeners() {
       window.addEventListener("mousemove", handleMouseMoveMaybeDragStart, {
         passive: false
@@ -1747,21 +1583,18 @@
         passive: false
       });
     }
-
     function removeMaybeListeners() {
       window.removeEventListener("mousemove", handleMouseMoveMaybeDragStart);
       window.removeEventListener("touchmove", handleMouseMoveMaybeDragStart);
       window.removeEventListener("mouseup", handleFalseAlarm);
       window.removeEventListener("touchend", handleFalseAlarm);
     }
-
     function handleFalseAlarm() {
       removeMaybeListeners();
       originalDragTarget = undefined;
       dragStartMousePosition = undefined;
       currentMousePosition = undefined;
     }
-
     function handleMouseMoveMaybeDragStart(e) {
       e.preventDefault();
       var c = e.touches ? e.touches[0] : e;
@@ -1769,13 +1602,11 @@
         x: c.clientX,
         y: c.clientY
       };
-
       if (Math.abs(currentMousePosition.x - dragStartMousePosition.x) >= MIN_MOVEMENT_BEFORE_DRAG_START_PX || Math.abs(currentMousePosition.y - dragStartMousePosition.y) >= MIN_MOVEMENT_BEFORE_DRAG_START_PX) {
         removeMaybeListeners();
         handleDragStart();
       }
     }
-
     function handleMouseDown(e) {
       // on safari clicking on a select element doesn't fire mouseup at the end of the click and in general this makes more sense
       if (e.target !== e.currentTarget && (e.target.value !== undefined || e.target.isContentEditable)) {
@@ -1783,23 +1614,20 @@
           return "won't initiate drag on a nested input element";
         });
         return;
-      } // prevents responding to any button but left click which equals 0 (which is falsy)
-
-
+      }
+      // prevents responding to any button but left click which equals 0 (which is falsy)
       if (e.button) {
         printDebug(function () {
           return "ignoring none left click button: ".concat(e.button);
         });
         return;
       }
-
       if (isWorkingOnPreviousDrag) {
         printDebug(function () {
           return "cannot start a new drag before finalizing previous one";
         });
         return;
       }
-
       e.stopPropagation();
       var c = e.touches ? e.touches[0] : e;
       dragStartMousePosition = {
@@ -1810,36 +1638,35 @@
       originalDragTarget = e.currentTarget;
       addMaybeListeners();
     }
-
     function handleDragStart() {
       printDebug(function () {
         return ["drag start config: ".concat(toString(config)), originalDragTarget];
       });
-      isWorkingOnPreviousDrag = true; // initialising globals
+      isWorkingOnPreviousDrag = true;
 
+      // initialising globals
       var currentIdx = elToIdx.get(originalDragTarget);
       originIndex = currentIdx;
       originDropZone = originalDragTarget.parentElement;
       /** @type {ShadowRoot | HTMLDocument} */
-
       var rootNode = originDropZone.getRootNode();
       var originDropZoneRoot = rootNode.body || rootNode;
       var items = config.items,
-          type = config.type,
-          centreDraggedOnCursor = config.centreDraggedOnCursor;
+        type = config.type,
+        centreDraggedOnCursor = config.centreDraggedOnCursor;
       draggedElData = _objectSpread2({}, items[currentIdx]);
       draggedElType = type;
-      shadowElData = _objectSpread2(_objectSpread2({}, draggedElData), {}, _defineProperty({}, SHADOW_ITEM_MARKER_PROPERTY_NAME, true)); // The initial shadow element. We need a different id at first in order to avoid conflicts and timing issues
-
-      var placeHolderElData = _objectSpread2(_objectSpread2({}, shadowElData), {}, _defineProperty({}, ITEM_ID_KEY, SHADOW_PLACEHOLDER_ITEM_ID)); // creating the draggable element
-
-
-      draggedEl = createDraggedElementFrom(originalDragTarget, centreDraggedOnCursor && currentMousePosition); // We will keep the original dom node in the dom because touch events keep firing on it, we want to re-add it after the framework removes it
+      shadowElData = _objectSpread2(_objectSpread2({}, draggedElData), {}, _defineProperty({}, SHADOW_ITEM_MARKER_PROPERTY_NAME, true));
+      // The initial shadow element. We need a different id at first in order to avoid conflicts and timing issues
+      var placeHolderElData = _objectSpread2(_objectSpread2({}, shadowElData), {}, _defineProperty({}, ITEM_ID_KEY, SHADOW_PLACEHOLDER_ITEM_ID));
 
+      // creating the draggable element
+      draggedEl = createDraggedElementFrom(originalDragTarget, centreDraggedOnCursor && currentMousePosition);
+      // We will keep the original dom node in the dom because touch events keep firing on it, we want to re-add it after the framework removes it
       function keepOriginalElementInDom() {
         if (!draggedEl.parentElement) {
-          originDropZoneRoot.appendChild(draggedEl); // to prevent the outline from disappearing
-
+          originDropZoneRoot.appendChild(draggedEl);
+          // to prevent the outline from disappearing
           draggedEl.focus();
           watchDraggedElement();
           hideElement(originalDragTarget);
@@ -1848,7 +1675,6 @@
           window.requestAnimationFrame(keepOriginalElementInDom);
         }
       }
-
       window.requestAnimationFrame(keepOriginalElementInDom);
       styleActiveDropZones(Array.from(typeToDropZones.get(config.type)).filter(function (dz) {
         return dz === originDropZone || !dzToConfig.get(dz).dropFromOthersDisabled;
@@ -1856,16 +1682,18 @@
         return dzToConfig.get(dz).dropTargetStyle;
       }, function (dz) {
         return dzToConfig.get(dz).dropTargetClasses;
-      }); // removing the original element by removing its data entry
+      });
 
+      // removing the original element by removing its data entry
       items.splice(currentIdx, 1, placeHolderElData);
       unlockOriginDzMinDimensions = preventShrinking(originDropZone);
       dispatchConsiderEvent(originDropZone, items, {
         trigger: TRIGGERS.DRAG_STARTED,
         id: draggedElData[ITEM_ID_KEY],
         source: SOURCES.POINTER
-      }); // handing over to global handlers - starting to watch the element
+      });
 
+      // handing over to global handlers - starting to watch the element
       window.addEventListener("mousemove", handleMouseMove, {
         passive: false
       });
@@ -1880,42 +1708,40 @@
         passive: false
       });
     }
-
     function configure(_ref2) {
       var _ref2$items = _ref2.items,
-          items = _ref2$items === void 0 ? undefined : _ref2$items,
-          _ref2$flipDurationMs = _ref2.flipDurationMs,
-          dropAnimationDurationMs = _ref2$flipDurationMs === void 0 ? 0 : _ref2$flipDurationMs,
-          _ref2$type = _ref2.type,
-          newType = _ref2$type === void 0 ? DEFAULT_DROP_ZONE_TYPE : _ref2$type,
-          _ref2$dragDisabled = _ref2.dragDisabled,
-          dragDisabled = _ref2$dragDisabled === void 0 ? false : _ref2$dragDisabled,
-          _ref2$morphDisabled = _ref2.morphDisabled,
-          morphDisabled = _ref2$morphDisabled === void 0 ? false : _ref2$morphDisabled,
-          _ref2$dropFromOthersD = _ref2.dropFromOthersDisabled,
-          dropFromOthersDisabled = _ref2$dropFromOthersD === void 0 ? false : _ref2$dropFromOthersD,
-          _ref2$dropTargetStyle = _ref2.dropTargetStyle,
-          dropTargetStyle = _ref2$dropTargetStyle === void 0 ? DEFAULT_DROP_TARGET_STYLE : _ref2$dropTargetStyle,
-          _ref2$dropTargetClass = _ref2.dropTargetClasses,
-          dropTargetClasses = _ref2$dropTargetClass === void 0 ? [] : _ref2$dropTargetClass,
-          _ref2$transformDragge = _ref2.transformDraggedElement,
-          transformDraggedElement = _ref2$transformDragge === void 0 ? function () {} : _ref2$transformDragge,
-          _ref2$centreDraggedOn = _ref2.centreDraggedOnCursor,
-          centreDraggedOnCursor = _ref2$centreDraggedOn === void 0 ? false : _ref2$centreDraggedOn;
+        items = _ref2$items === void 0 ? undefined : _ref2$items,
+        _ref2$flipDurationMs = _ref2.flipDurationMs,
+        dropAnimationDurationMs = _ref2$flipDurationMs === void 0 ? 0 : _ref2$flipDurationMs,
+        _ref2$type = _ref2.type,
+        newType = _ref2$type === void 0 ? DEFAULT_DROP_ZONE_TYPE : _ref2$type,
+        _ref2$dragDisabled = _ref2.dragDisabled,
+        dragDisabled = _ref2$dragDisabled === void 0 ? false : _ref2$dragDisabled,
+        _ref2$morphDisabled = _ref2.morphDisabled,
+        morphDisabled = _ref2$morphDisabled === void 0 ? false : _ref2$morphDisabled,
+        _ref2$dropFromOthersD = _ref2.dropFromOthersDisabled,
+        dropFromOthersDisabled = _ref2$dropFromOthersD === void 0 ? false : _ref2$dropFromOthersD,
+        _ref2$dropTargetStyle = _ref2.dropTargetStyle,
+        dropTargetStyle = _ref2$dropTargetStyle === void 0 ? DEFAULT_DROP_TARGET_STYLE : _ref2$dropTargetStyle,
+        _ref2$dropTargetClass = _ref2.dropTargetClasses,
+        dropTargetClasses = _ref2$dropTargetClass === void 0 ? [] : _ref2$dropTargetClass,
+        _ref2$transformDragge = _ref2.transformDraggedElement,
+        transformDraggedElement = _ref2$transformDragge === void 0 ? function () {} : _ref2$transformDragge,
+        _ref2$centreDraggedOn = _ref2.centreDraggedOnCursor,
+        centreDraggedOnCursor = _ref2$centreDraggedOn === void 0 ? false : _ref2$centreDraggedOn;
       config.dropAnimationDurationMs = dropAnimationDurationMs;
-
       if (config.type && newType !== config.type) {
         unregisterDropZone(node, config.type);
       }
-
       config.type = newType;
       registerDropZone(node, newType);
       config.items = _toConsumableArray(items);
       config.dragDisabled = dragDisabled;
       config.morphDisabled = morphDisabled;
       config.transformDraggedElement = transformDraggedElement;
-      config.centreDraggedOnCursor = centreDraggedOnCursor; // realtime update for dropTargetStyle
+      config.centreDraggedOnCursor = centreDraggedOnCursor;
 
+      // realtime update for dropTargetStyle
       if (initialized && isWorkingOnPreviousDrag && !finalizingPreviousDrag && (!areObjectsShallowEqual(dropTargetStyle, config.dropTargetStyle) || !areArraysShallowEqualSameOrder(dropTargetClasses, config.dropTargetClasses))) {
         styleInactiveDropZones([node], function () {
           return config.dropTargetStyle;
@@ -1928,14 +1754,13 @@
           return dropTargetClasses;
         });
       }
-
       config.dropTargetStyle = dropTargetStyle;
-      config.dropTargetClasses = _toConsumableArray(dropTargetClasses); // realtime update for dropFromOthersDisabled
+      config.dropTargetClasses = _toConsumableArray(dropTargetClasses);
 
+      // realtime update for dropFromOthersDisabled
       function getConfigProp(dz, propName) {
         return dzToConfig.get(dz) ? dzToConfig.get(dz)[propName] : config[propName];
       }
-
       if (initialized && isWorkingOnPreviousDrag && config.dropFromOthersDisabled !== dropFromOthersDisabled) {
         if (dropFromOthersDisabled) {
           styleInactiveDropZones([node], function (dz) {
@@ -1951,50 +1776,34 @@
           });
         }
       }
-
       config.dropFromOthersDisabled = dropFromOthersDisabled;
       dzToConfig.set(node, config);
       var shadowElIdx = findShadowElementIdx(config.items);
-
-      var _loop = function _loop(idx) {
+      for (var idx = 0; idx < node.children.length; idx++) {
         var draggableEl = node.children[idx];
         styleDraggable(draggableEl, dragDisabled);
-
         if (idx === shadowElIdx) {
+          config.transformDraggedElement(draggedEl, draggedElData, idx);
           if (!morphDisabled) {
-            morphDraggedElementToBeLike(draggedEl, draggableEl, currentMousePosition.x, currentMousePosition.y, function () {
-              return config.transformDraggedElement(draggedEl, draggedElData, idx);
-            });
+            morphDraggedElementToBeLike(draggedEl, draggableEl, currentMousePosition.x, currentMousePosition.y);
           }
-
           decorateShadowEl(draggableEl);
-          return "continue";
+          continue;
         }
-
         draggableEl.removeEventListener("mousedown", elToMouseDownListener.get(draggableEl));
         draggableEl.removeEventListener("touchstart", elToMouseDownListener.get(draggableEl));
-
         if (!dragDisabled) {
           draggableEl.addEventListener("mousedown", handleMouseDown);
           draggableEl.addEventListener("touchstart", handleMouseDown);
           elToMouseDownListener.set(draggableEl, handleMouseDown);
-        } // updating the idx
-
-
+        }
+        // updating the idx
         elToIdx.set(draggableEl, idx);
-
         if (!initialized) {
           initialized = true;
         }
-      };
-
-      for (var idx = 0; idx < node.children.length; idx++) {
-        var _ret = _loop(idx);
-
-        if (_ret === "continue") continue;
       }
     }
-
     configure(options);
     return {
       update: function update(newOptions) {
@@ -2011,7 +1820,6 @@
           unregisterDropZone(node, dzToConfig.get(node).type);
           dzToConfig["delete"](node);
         }
-
         if (isWorkingOnPreviousDrag) {
           printDebug(function () {
             return "pointer dndzone will be scheduled for destruction";
@@ -2032,20 +1840,17 @@
   var ID_TO_INSTRUCTION = (_ID_TO_INSTRUCTION = {}, _defineProperty(_ID_TO_INSTRUCTION, INSTRUCTION_IDs.DND_ZONE_ACTIVE, "Tab to one the items and press space-bar or enter to start dragging it"), _defineProperty(_ID_TO_INSTRUCTION, INSTRUCTION_IDs.DND_ZONE_DRAG_DISABLED, "This is a disabled drag and drop list"), _ID_TO_INSTRUCTION);
   var ALERT_DIV_ID = "dnd-action-aria-alert";
   var alertsDiv;
-
   function initAriaOnBrowser() {
     if (alertsDiv) {
       // it is already initialized
       return;
-    } // setting the dynamic alerts
-
-
+    }
+    // setting the dynamic alerts
     alertsDiv = document.createElement("div");
-
     (function initAlertsDiv() {
-      alertsDiv.id = ALERT_DIV_ID; // tab index -1 makes the alert be read twice on chrome for some reason
+      alertsDiv.id = ALERT_DIV_ID;
+      // tab index -1 makes the alert be read twice on chrome for some reason
       //alertsDiv.tabIndex = -1;
-
       alertsDiv.style.position = "fixed";
       alertsDiv.style.bottom = "0";
       alertsDiv.style.left = "0";
@@ -2055,49 +1860,43 @@
       alertsDiv.style.width = "0";
       alertsDiv.setAttribute("role", "alert");
     })();
+    document.body.prepend(alertsDiv);
 
-    document.body.prepend(alertsDiv); // setting the instructions
-
+    // setting the instructions
     Object.entries(ID_TO_INSTRUCTION).forEach(function (_ref) {
       var _ref2 = _slicedToArray(_ref, 2),
-          id = _ref2[0],
-          txt = _ref2[1];
-
+        id = _ref2[0],
+        txt = _ref2[1];
       return document.body.prepend(instructionToHiddenDiv(id, txt));
     });
   }
+
   /**
    * Initializes the static aria instructions so they can be attached to zones
    * @return {{DND_ZONE_ACTIVE: string, DND_ZONE_DRAG_DISABLED: string} | null} - the IDs for static aria instruction (to be used via aria-describedby) or null on the server
    */
-
-
   function initAria() {
     if (isOnServer) return null;
-
     if (document.readyState === "complete") {
       initAriaOnBrowser();
     } else {
       window.addEventListener("DOMContentLoaded", initAriaOnBrowser);
     }
-
     return _objectSpread2({}, INSTRUCTION_IDs);
   }
+
   /**
    * Removes all the artifacts (dom elements) added by this module
    */
-
   function destroyAria() {
     if (isOnServer || !alertsDiv) return;
     Object.keys(ID_TO_INSTRUCTION).forEach(function (id) {
       var _document$getElementB;
-
       return (_document$getElementB = document.getElementById(id)) === null || _document$getElementB === void 0 ? void 0 : _document$getElementB.remove();
     });
     alertsDiv.remove();
     alertsDiv = undefined;
   }
-
   function instructionToHiddenDiv(id, txt) {
     var div = document.createElement("div");
     div.id = id;
@@ -2107,23 +1906,20 @@
     div.style.zIndex = "-5";
     return div;
   }
+
   /**
    * Will make the screen reader alert the provided text to the user
    * @param {string} txt
    */
-
-
   function alertToScreenReader(txt) {
     if (isOnServer) return;
-
     if (!alertsDiv) {
       initAriaOnBrowser();
     }
-
     alertsDiv.innerHTML = "";
     var alertText = document.createTextNode(txt);
-    alertsDiv.appendChild(alertText); // this is needed for Safari
-
+    alertsDiv.appendChild(alertText);
+    // this is needed for Safari
     alertsDiv.style.display = "none";
     alertsDiv.style.display = "inline";
   }
@@ -2145,19 +1941,19 @@
   var dzToHandles = new Map();
   var dzToConfig$1 = new Map();
   var typeToDropZones$1 = new Map();
+
   /* TODO (potentially)
    * what's the deal with the black border of voice-reader not following focus?
    * maybe keep focus on the last dragged item upon drop?
    */
 
   var INSTRUCTION_IDs$1;
-  /* drop-zones registration management */
 
+  /* drop-zones registration management */
   function registerDropZone$1(dropZoneEl, type) {
     printDebug(function () {
       return "registering drop-zone if absent";
     });
-
     if (typeToDropZones$1.size === 0) {
       printDebug(function () {
         return "adding global keydown and click handlers";
@@ -2166,33 +1962,26 @@
       window.addEventListener("keydown", globalKeyDownHandler);
       window.addEventListener("click", globalClickHandler);
     }
-
     if (!typeToDropZones$1.has(type)) {
       typeToDropZones$1.set(type, new Set());
     }
-
     if (!typeToDropZones$1.get(type).has(dropZoneEl)) {
       typeToDropZones$1.get(type).add(dropZoneEl);
       incrementActiveDropZoneCount();
     }
   }
-
   function unregisterDropZone$1(dropZoneEl, type) {
     printDebug(function () {
       return "unregistering drop-zone";
     });
-
     if (focusedDz === dropZoneEl) {
       handleDrop$1();
     }
-
     typeToDropZones$1.get(type)["delete"](dropZoneEl);
     decrementActiveDropZoneCount();
-
     if (typeToDropZones$1.get(type).size === 0) {
       typeToDropZones$1["delete"](type);
     }
-
     if (typeToDropZones$1.size === 0) {
       printDebug(function () {
         return "removing global keydown and click handlers";
@@ -2203,10 +1992,8 @@
       destroyAria();
     }
   }
-
   function globalKeyDownHandler(e) {
     if (!isDragging) return;
-
     switch (e.key) {
       case "Escape":
         {
@@ -2215,10 +2002,8 @@
         }
     }
   }
-
   function globalClickHandler() {
     if (!isDragging) return;
-
     if (!allDragTargets.has(document.activeElement)) {
       printDebug(function () {
         return "clicked outside of any draggable";
@@ -2226,7 +2011,6 @@
       handleDrop$1();
     }
   }
-
   function handleZoneFocus(e) {
     printDebug(function () {
       return "zone focus";
@@ -2235,34 +2019,27 @@
     var newlyFocusedDz = e.currentTarget;
     if (newlyFocusedDz === focusedDz) return;
     focusedDzLabel = newlyFocusedDz.getAttribute("aria-label") || "";
-
     var _dzToConfig$get = dzToConfig$1.get(focusedDz),
-        originItems = _dzToConfig$get.items;
-
+      originItems = _dzToConfig$get.items;
     var originItem = originItems.find(function (item) {
       return item[ITEM_ID_KEY] === focusedItemId;
     });
     var originIdx = originItems.indexOf(originItem);
     var itemToMove = originItems.splice(originIdx, 1)[0];
-
     var _dzToConfig$get2 = dzToConfig$1.get(newlyFocusedDz),
-        targetItems = _dzToConfig$get2.items,
-        autoAriaDisabled = _dzToConfig$get2.autoAriaDisabled;
-
+      targetItems = _dzToConfig$get2.items,
+      autoAriaDisabled = _dzToConfig$get2.autoAriaDisabled;
     if (newlyFocusedDz.getBoundingClientRect().top < focusedDz.getBoundingClientRect().top || newlyFocusedDz.getBoundingClientRect().left < focusedDz.getBoundingClientRect().left) {
       targetItems.push(itemToMove);
-
       if (!autoAriaDisabled) {
         alertToScreenReader("Moved item ".concat(focusedItemLabel, " to the end of the list ").concat(focusedDzLabel));
       }
     } else {
       targetItems.unshift(itemToMove);
-
       if (!autoAriaDisabled) {
         alertToScreenReader("Moved item ".concat(focusedItemLabel, " to the beginning of the list ").concat(focusedDzLabel));
       }
     }
-
     var dzFrom = focusedDz;
     dispatchFinalizeEvent(dzFrom, originItems, {
       trigger: TRIGGERS.DROPPED_INTO_ANOTHER,
@@ -2276,28 +2053,23 @@
     });
     focusedDz = newlyFocusedDz;
   }
-
   function triggerAllDzsUpdate() {
     dzToHandles.forEach(function (_ref, dz) {
       var update = _ref.update;
       return update(dzToConfig$1.get(dz));
     });
   }
-
   function handleDrop$1() {
     var dispatchConsider = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
     printDebug(function () {
       return "drop";
     });
-
     if (!dzToConfig$1.get(focusedDz).autoAriaDisabled) {
       alertToScreenReader("Stopped dragging item ".concat(focusedItemLabel));
     }
-
     if (allDragTargets.has(document.activeElement)) {
       document.activeElement.blur();
     }
-
     if (dispatchConsider) {
       dispatchConsiderEvent(focusedDz, dzToConfig$1.get(focusedDz).items, {
         trigger: TRIGGERS.DRAG_STOPPED,
@@ -2305,7 +2077,6 @@
         source: SOURCES.KEYBOARD
       });
     }
-
     styleInactiveDropZones(typeToDropZones$1.get(draggedItemType), function (dz) {
       return dzToConfig$1.get(dz).dropTargetStyle;
     }, function (dz) {
@@ -2319,9 +2090,8 @@
     focusedDzLabel = "";
     isDragging = false;
     triggerAllDzsUpdate();
-  } //////
-
-
+  }
+  //////
   function dndzone$1(node, options) {
     var config = {
       items: undefined,
@@ -2333,17 +2103,14 @@
       dropTargetClasses: [],
       autoAriaDisabled: false
     };
-
     function swap(arr, i, j) {
       if (arr.length <= 1) return;
       arr.splice(j, 1, arr.splice(i, 1, arr[j])[0]);
     }
-
     function handleKeyDown(e) {
       printDebug(function () {
         return ["handling key down", e.key];
       });
-
       switch (e.key) {
         case "Enter":
         case " ":
@@ -2352,11 +2119,8 @@
             if ((e.target.disabled !== undefined || e.target.href || e.target.isContentEditable) && !allDragTargets.has(e.target)) {
               return;
             }
-
             e.preventDefault(); // preventing scrolling on spacebar
-
             e.stopPropagation();
-
             if (isDragging) {
               // TODO - should this trigger a drop? only here or in general (as in when hitting space or enter outside of any zone)?
               handleDrop$1();
@@ -2364,32 +2128,25 @@
               // drag start
               handleDragStart(e);
             }
-
             break;
           }
-
         case "ArrowDown":
         case "ArrowRight":
           {
             if (!isDragging) return;
             e.preventDefault(); // prevent scrolling
-
             e.stopPropagation();
-
             var _dzToConfig$get3 = dzToConfig$1.get(node),
-                items = _dzToConfig$get3.items;
-
+              items = _dzToConfig$get3.items;
             var children = Array.from(node.children);
             var idx = children.indexOf(e.currentTarget);
             printDebug(function () {
               return ["arrow down", idx];
             });
-
             if (idx < children.length - 1) {
               if (!config.autoAriaDisabled) {
                 alertToScreenReader("Moved item ".concat(focusedItemLabel, " to position ").concat(idx + 2, " in the list ").concat(focusedDzLabel));
               }
-
               swap(items, idx, idx + 1);
               dispatchFinalizeEvent(node, items, {
                 trigger: TRIGGERS.DROPPED_INTO_ZONE,
@@ -2397,34 +2154,25 @@
                 source: SOURCES.KEYBOARD
               });
             }
-
             break;
           }
-
         case "ArrowUp":
         case "ArrowLeft":
           {
             if (!isDragging) return;
             e.preventDefault(); // prevent scrolling
-
             e.stopPropagation();
-
             var _dzToConfig$get4 = dzToConfig$1.get(node),
-                _items = _dzToConfig$get4.items;
-
+              _items = _dzToConfig$get4.items;
             var _children = Array.from(node.children);
-
             var _idx = _children.indexOf(e.currentTarget);
-
             printDebug(function () {
               return ["arrow up", _idx];
             });
-
             if (_idx > 0) {
               if (!config.autoAriaDisabled) {
                 alertToScreenReader("Moved item ".concat(focusedItemLabel, " to position ").concat(_idx, " in the list ").concat(focusedDzLabel));
               }
-
               swap(_items, _idx, _idx - 1);
               dispatchFinalizeEvent(node, _items, {
                 trigger: TRIGGERS.DROPPED_INTO_ZONE,
@@ -2432,12 +2180,10 @@
                 source: SOURCES.KEYBOARD
               });
             }
-
             break;
           }
       }
     }
-
     function handleDragStart(e) {
       printDebug(function () {
         return "drag start";
@@ -2454,17 +2200,13 @@
       }, function (dz) {
         return dzToConfig$1.get(dz).dropTargetClasses;
       });
-
       if (!config.autoAriaDisabled) {
         var msg = "Started dragging item ".concat(focusedItemLabel, ". Use the arrow keys to move it within its list ").concat(focusedDzLabel);
-
         if (dropTargets.length > 1) {
           msg += ", or tab to another list in order to move the item into it";
         }
-
         alertToScreenReader(msg);
       }
-
       dispatchConsiderEvent(node, dzToConfig$1.get(node).items, {
         trigger: TRIGGERS.DRAG_STARTED,
         id: focusedItemId,
@@ -2472,7 +2214,6 @@
       });
       triggerAllDzsUpdate();
     }
-
     function handleClick(e) {
       if (!isDragging) return;
       if (e.currentTarget === focusedItem) return;
@@ -2480,11 +2221,9 @@
       handleDrop$1(false);
       handleDragStart(e);
     }
-
     function setCurrentFocusedItem(draggableEl) {
       var _dzToConfig$get5 = dzToConfig$1.get(node),
-          items = _dzToConfig$get5.items;
-
+        items = _dzToConfig$get5.items;
       var children = Array.from(node.children);
       var focusedItemIdx = children.indexOf(draggableEl);
       focusedItem = draggableEl;
@@ -2492,24 +2231,23 @@
       focusedItemId = items[focusedItemIdx][ITEM_ID_KEY];
       focusedItemLabel = children[focusedItemIdx].getAttribute("aria-label") || "";
     }
-
     function configure(_ref2) {
       var _ref2$items = _ref2.items,
-          items = _ref2$items === void 0 ? [] : _ref2$items,
-          _ref2$type = _ref2.type,
-          newType = _ref2$type === void 0 ? DEFAULT_DROP_ZONE_TYPE$1 : _ref2$type,
-          _ref2$dragDisabled = _ref2.dragDisabled,
-          dragDisabled = _ref2$dragDisabled === void 0 ? false : _ref2$dragDisabled,
-          _ref2$zoneTabIndex = _ref2.zoneTabIndex,
-          zoneTabIndex = _ref2$zoneTabIndex === void 0 ? 0 : _ref2$zoneTabIndex,
-          _ref2$dropFromOthersD = _ref2.dropFromOthersDisabled,
-          dropFromOthersDisabled = _ref2$dropFromOthersD === void 0 ? false : _ref2$dropFromOthersD,
-          _ref2$dropTargetStyle = _ref2.dropTargetStyle,
-          dropTargetStyle = _ref2$dropTargetStyle === void 0 ? DEFAULT_DROP_TARGET_STYLE$1 : _ref2$dropTargetStyle,
-          _ref2$dropTargetClass = _ref2.dropTargetClasses,
-          dropTargetClasses = _ref2$dropTargetClass === void 0 ? [] : _ref2$dropTargetClass,
-          _ref2$autoAriaDisable = _ref2.autoAriaDisabled,
-          autoAriaDisabled = _ref2$autoAriaDisable === void 0 ? false : _ref2$autoAriaDisable;
+        items = _ref2$items === void 0 ? [] : _ref2$items,
+        _ref2$type = _ref2.type,
+        newType = _ref2$type === void 0 ? DEFAULT_DROP_ZONE_TYPE$1 : _ref2$type,
+        _ref2$dragDisabled = _ref2.dragDisabled,
+        dragDisabled = _ref2$dragDisabled === void 0 ? false : _ref2$dragDisabled,
+        _ref2$zoneTabIndex = _ref2.zoneTabIndex,
+        zoneTabIndex = _ref2$zoneTabIndex === void 0 ? 0 : _ref2$zoneTabIndex,
+        _ref2$dropFromOthersD = _ref2.dropFromOthersDisabled,
+        dropFromOthersDisabled = _ref2$dropFromOthersD === void 0 ? false : _ref2$dropFromOthersD,
+        _ref2$dropTargetStyle = _ref2.dropTargetStyle,
+        dropTargetStyle = _ref2$dropTargetStyle === void 0 ? DEFAULT_DROP_TARGET_STYLE$1 : _ref2$dropTargetStyle,
+        _ref2$dropTargetClass = _ref2.dropTargetClasses,
+        dropTargetClasses = _ref2$dropTargetClass === void 0 ? [] : _ref2$dropTargetClass,
+        _ref2$autoAriaDisable = _ref2.autoAriaDisabled,
+        autoAriaDisabled = _ref2$autoAriaDisable === void 0 ? false : _ref2$autoAriaDisable;
       config.items = _toConsumableArray(items);
       config.dragDisabled = dragDisabled;
       config.dropFromOthersDisabled = dropFromOthersDisabled;
@@ -2517,69 +2255,56 @@
       config.dropTargetStyle = dropTargetStyle;
       config.dropTargetClasses = dropTargetClasses;
       config.autoAriaDisabled = autoAriaDisabled;
-
       if (config.type && newType !== config.type) {
         unregisterDropZone$1(node, config.type);
       }
-
       config.type = newType;
       registerDropZone$1(node, newType);
-
       if (!autoAriaDisabled) {
         node.setAttribute("aria-disabled", dragDisabled);
         node.setAttribute("role", "list");
         node.setAttribute("aria-describedby", dragDisabled ? INSTRUCTION_IDs$1.DND_ZONE_DRAG_DISABLED : INSTRUCTION_IDs$1.DND_ZONE_ACTIVE);
       }
-
       dzToConfig$1.set(node, config);
-
       if (isDragging) {
         node.tabIndex = node === focusedDz || focusedItem.contains(node) || config.dropFromOthersDisabled || focusedDz && config.type !== dzToConfig$1.get(focusedDz).type ? -1 : 0;
       } else {
         node.tabIndex = config.zoneTabIndex;
       }
-
       node.addEventListener("focus", handleZoneFocus);
-
       var _loop = function _loop(i) {
         var draggableEl = node.children[i];
         allDragTargets.add(draggableEl);
         draggableEl.tabIndex = isDragging ? -1 : 0;
-
         if (!autoAriaDisabled) {
           draggableEl.setAttribute("role", "listitem");
         }
-
         draggableEl.removeEventListener("keydown", elToKeyDownListeners.get(draggableEl));
         draggableEl.removeEventListener("click", elToFocusListeners.get(draggableEl));
-
         if (!dragDisabled) {
           draggableEl.addEventListener("keydown", handleKeyDown);
           elToKeyDownListeners.set(draggableEl, handleKeyDown);
           draggableEl.addEventListener("click", handleClick);
           elToFocusListeners.set(draggableEl, handleClick);
         }
-
         if (isDragging && config.items[i][ITEM_ID_KEY] === focusedItemId) {
           printDebug(function () {
             return ["focusing on", {
               i: i,
               focusedItemId: focusedItemId
             }];
-          }); // if it is a nested dropzone, it was re-rendered and we need to refresh our pointer
-
+          });
+          // if it is a nested dropzone, it was re-rendered and we need to refresh our pointer
           focusedItem = draggableEl;
-          focusedItem.tabIndex = 0; // without this the element loses focus if it moves backwards in the list
-
+          focusedItem.tabIndex = 0;
+          // without this the element loses focus if it moves backwards in the list
           draggableEl.focus();
         }
       };
-
       for (var i = 0; i < node.children.length; i++) {
         _loop(i);
       }
     }
-
     configure(options);
     var handles = {
       update: function update(newOptions) {
@@ -2602,6 +2327,7 @@
   }
 
   var _excluded = ["items", "flipDurationMs", "type", "dragDisabled", "morphDisabled", "dropFromOthersDisabled", "zoneTabIndex", "dropTargetStyle", "dropTargetClasses", "transformDraggedElement", "autoAriaDisabled", "centreDraggedOnCursor"];
+
   /**
    * A custom action to turn any container to a dnd zone and all of its direct children to draggables
    * Supports mouse, touch and keyboard interactions.
@@ -2623,7 +2349,6 @@
    * @param {Options} options
    * @return {{update: function, destroy: function}}
    */
-
   function dndzone$2(node, options) {
     validateOptions(options);
     var pointerZone = dndzone(node, options);
@@ -2640,50 +2365,41 @@
       }
     };
   }
-
   function validateOptions(options) {
     /*eslint-disable*/
     var items = options.items,
-        flipDurationMs = options.flipDurationMs,
-        type = options.type,
-        dragDisabled = options.dragDisabled,
-        morphDisabled = options.morphDisabled,
-        dropFromOthersDisabled = options.dropFromOthersDisabled,
-        zoneTabIndex = options.zoneTabIndex,
-        dropTargetStyle = options.dropTargetStyle,
-        dropTargetClasses = options.dropTargetClasses,
-        transformDraggedElement = options.transformDraggedElement,
-        autoAriaDisabled = options.autoAriaDisabled,
-        centreDraggedOnCursor = options.centreDraggedOnCursor,
-        rest = _objectWithoutProperties(options, _excluded);
+      flipDurationMs = options.flipDurationMs,
+      type = options.type,
+      dragDisabled = options.dragDisabled,
+      morphDisabled = options.morphDisabled,
+      dropFromOthersDisabled = options.dropFromOthersDisabled,
+      zoneTabIndex = options.zoneTabIndex,
+      dropTargetStyle = options.dropTargetStyle,
+      dropTargetClasses = options.dropTargetClasses,
+      transformDraggedElement = options.transformDraggedElement,
+      autoAriaDisabled = options.autoAriaDisabled,
+      centreDraggedOnCursor = options.centreDraggedOnCursor,
+      rest = _objectWithoutProperties(options, _excluded);
     /*eslint-enable*/
-
-
     if (Object.keys(rest).length > 0) {
       console.warn("dndzone will ignore unknown options", rest);
     }
-
     if (!items) {
       throw new Error("no 'items' key provided to dndzone");
     }
-
     var itemWithMissingId = items.find(function (item) {
       return !{}.hasOwnProperty.call(item, ITEM_ID_KEY);
     });
-
     if (itemWithMissingId) {
       throw new Error("missing '".concat(ITEM_ID_KEY, "' property for item ").concat(toString(itemWithMissingId)));
     }
-
     if (dropTargetClasses && !Array.isArray(dropTargetClasses)) {
       throw new Error("dropTargetClasses should be an array but instead it is a ".concat(_typeof(dropTargetClasses), ", ").concat(toString(dropTargetClasses)));
     }
-
     if (zoneTabIndex && !isInt(zoneTabIndex)) {
       throw new Error("zoneTabIndex should be a number but instead it is a ".concat(_typeof(zoneTabIndex), ", ").concat(toString(zoneTabIndex)));
     }
   }
-
   function isInt(value) {
     return !isNaN(value) && function (x) {
       return (x | 0) === x;