@onepercentio/one-ui 0.20.4 → 0.21.0

package/dist/components/LoaderDotsIndicator/LoaderDotsIndicator.js

@@ -11,22 +11,22 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 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 _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; 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 _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+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 _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 /**
  * . .. ... . .. ...
  **/
 function LoaderDotsIndicator(_ref) {
-  var _ref$dotsCount = _ref.dotsCount,
+  let _ref$dotsCount = _ref.dotsCount,
     dotsCount = _ref$dotsCount === void 0 ? 3 : _ref$dotsCount;
-  var _useState = (0, _react.useState)("."),
+  const _useState = (0, _react.useState)("."),
     _useState2 = _slicedToArray(_useState, 2),
     text = _useState2[0],
     setText = _useState2[1];
   (0, _react.useEffect)(function () {
-    var fullText = new Array(dotsCount).fill(".").join("");
-    var intervalId = setInterval(function () {
+    const fullText = new Array(dotsCount).fill(".").join("");
+    const intervalId = setInterval(function () {
       setText(function (a) {
         return a === fullText ? "." : a + ".";
       });

package/dist/components/LoopableVideo/LoopableVideo.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = LoopableVideo;
 var _react = _interopRequireDefault(require("react"));
-var _excluded = ["videoSrc", "percentToBackTo"];
+const _excluded = ["videoSrc", "percentToBackTo"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 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; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -14,7 +14,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
  * Plays a video and loops between the end and the timestamp you set
  **/
 function LoopableVideo(_ref) {
-  var videoSrc = _ref.videoSrc,
+  let videoSrc = _ref.videoSrc,
     percentToBackTo = _ref.percentToBackTo,
     props = _objectWithoutProperties(_ref, _excluded);
   if (process.env.NODE_ENV === "development") if (percentToBackTo < 0 || percentToBackTo > 1) throw new Error("percentToBackTo should be a value between 0-1");
@@ -22,8 +22,8 @@ function LoopableVideo(_ref) {
     autoPlay: true,
     muted: true,
     onEnded: function onEnded(_ref2) {
-      var currentTarget = _ref2.currentTarget;
-      var el = currentTarget;
+      let currentTarget = _ref2.currentTarget;
+      const el = currentTarget;
       el.currentTime = el.duration * percentToBackTo;
       el.play();
     }

package/dist/components/MainGrid/MainGrid.js

@@ -15,10 +15,10 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
  * This layout provides 3 parts to compose screens
  **/
 function MainGrid(_ref, ref) {
-  var children = _ref.children,
+  let children = _ref.children,
     leftContent = _ref.leftContent,
     rightContent = _ref.rightContent;
-  var refs = [(0, _react.useRef)(null), (0, _react.useRef)(null), (0, _react.useRef)(null)];
+  const refs = [(0, _react.useRef)(null), (0, _react.useRef)(null), (0, _react.useRef)(null)];
   (0, _react.useImperativeHandle)(ref, function () {
     return {
       setOrientation: function setOrientation(orientation) {

package/dist/components/MutableHamburgerButton/MutableHamburgerButton.js

@@ -6,7 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = MutableHamburgerButton;
 var _react = _interopRequireDefault(require("react"));
 var _MutableHamburgerButtonModule = _interopRequireDefault(require("./MutableHamburgerButton.module.scss"));
-var _excluded = ["state", "size", "className"];
+const _excluded = ["state", "size", "className"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 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; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
@@ -15,7 +15,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
  * A hamburger button that mutates according to it's state
  **/
 function MutableHamburgerButton(_ref) {
-  var _ref$state = _ref.state,
+  let _ref$state = _ref.state,
     state = _ref$state === void 0 ? "default" : _ref$state,
     size = _ref.size,
     _ref$className = _ref.className,

package/dist/components/Notification/Notification.js

@@ -12,7 +12,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
  * A layout for the notification card
  **/
 function Notification(_ref) {
-  var type = _ref.type,
+  let type = _ref.type,
     children = _ref.children;
   return /*#__PURE__*/_react.default.createElement(_Card.default, {
     className: "".concat(_NotificationModule.default.container, " ").concat(_NotificationModule.default[type])

package/dist/components/OrderableList/OrderableList.js

@@ -18,7 +18,7 @@ var _Transition = require("../Transition");
 var _OrderableListModule = _interopRequireDefault(require("./OrderableList.module.scss"));
 var _useEvents = _interopRequireDefault(require("../../hooks/utility/useEvents"));
 var _ownEvent = _interopRequireDefault(require("../../utils/ownEvent"));
-var _excluded = ["children", "className", "mode", "shrinkToOnOrder", "reorderingClassName", "cloneClassName"];
+const _excluded = ["children", "className", "mode", "shrinkToOnOrder", "reorderingClassName", "cloneClassName"];
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -28,21 +28,20 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
 function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
-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 F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, 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; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 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 _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0) { ; } } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 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 _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; 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 _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
-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 _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 _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; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
 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; }
-var OrderableListContext = /*#__PURE__*/(0, _react.createContext)(null);
-var OrderableListReorderMode = /*#__PURE__*/function (OrderableListReorderMode) {
+const OrderableListContext = /*#__PURE__*/(0, _react.createContext)(null);
+let OrderableListReorderMode = /*#__PURE__*/function (OrderableListReorderMode) {
   OrderableListReorderMode["VERTICAL"] = "v";
   OrderableListReorderMode["TWO_DIMENSIONS"] = "hv";
   return OrderableListReorderMode;
@@ -58,7 +57,7 @@ function cleanKeys(keys) {
  * This component receives a list of keyed elements and orders it based of the order provided via the prop "keyOrder"
  **/
 function OrderableList(_ref) {
-  var children = _ref.children,
+  let children = _ref.children,
     _ref$className = _ref.className,
     className = _ref$className === void 0 ? "" : _ref$className,
     _ref$mode = _ref.mode,
@@ -67,48 +66,48 @@ function OrderableList(_ref) {
     reorderingClassName = _ref.reorderingClassName,
     cloneClassName = _ref.cloneClassName,
     props = _objectWithoutProperties(_ref, _excluded);
-  var availableKeys = children.map(function (a) {
+  const availableKeys = children.map(function (a) {
     return a.key;
   });
-  var availableKeysDep = availableKeys.join(",");
-  var initializeOrder = (0, _react.useCallback)(function () {
-    var missingOrderKeys = "keyOrder" in props && props.keyOrder ? availableKeys.filter(function (a) {
+  const availableKeysDep = availableKeys.join(",");
+  const initializeOrder = (0, _react.useCallback)(function () {
+    const missingOrderKeys = "keyOrder" in props && props.keyOrder ? availableKeys.filter(function (a) {
       return !props.keyOrder.includes(a);
     }) : [];
     return ("keyOrder" in props && props.keyOrder ? [].concat(_toConsumableArray(props.keyOrder), _toConsumableArray(missingOrderKeys)) : undefined) || availableKeys;
   }, [availableKeysDep, props.keyOrder]);
-  var _useRef = (0, _react.useRef)([]),
+  const _useRef = (0, _react.useRef)([]),
     anchorsList = _useRef.current;
-  var eventEmitter = (0, _useEvents.default)();
-  var currentClone = (0, _react.useRef)(null);
-  var currentWorkingKey = (0, _react.useRef)();
-  var rootRef = (0, _react.useRef)(null);
-  var _useState = (0, _react.useState)(initializeOrder),
+  const eventEmitter = (0, _useEvents.default)();
+  const currentClone = (0, _react.useRef)(null);
+  const currentWorkingKey = (0, _react.useRef)();
+  const rootRef = (0, _react.useRef)(null);
+  const _useState = (0, _react.useState)(initializeOrder),
     _useState2 = _slicedToArray(_useState, 2),
     _order = _useState2[0],
     setOrder = _useState2[1];
   (0, _react.useEffect)(function () {
     return setOrder(initializeOrder());
   }, [initializeOrder]);
-  var order = (0, _react.useMemo)(function () {
+  const order = (0, _react.useMemo)(function () {
     return ("currentOrder" in props ? props.currentOrder || _order : _order).filter(function (o) {
       return o.includes(";") || availableKeys.includes(o);
     });
   }, [props.currentOrder, _order, availableKeysDep]);
-  var cleanOrder = (0, _react.useMemo)(function () {
+  const cleanOrder = (0, _react.useMemo)(function () {
     return order.map(function (a) {
       return a.split(";")[0];
     });
   }, [order]);
-  var orderId = (0, _react.useMemo)(function () {
+  const orderId = (0, _react.useMemo)(function () {
     return "key-" + cleanOrder.join("");
   }, [cleanOrder]);
   function rootEl() {
     if (mode === OrderableListReorderMode.TWO_DIMENSIONS) return rootRef.current.lastElementChild.lastElementChild;
     return rootRef.current;
   }
-  var findParentElement = function findParentElement(target) {
-    var parent = target;
+  const findParentElement = function findParentElement(target) {
+    let parent = target;
     while (parent.parentElement !== rootEl()) {
       if (parent.parentElement === null) break;
       parent = parent.parentElement;
@@ -119,52 +118,52 @@ function OrderableList(_ref) {
   (0, _react.useLayoutEffect)(function () {
     if (shrinkToOnOrder) rootEl().style.setProperty("--shrink-to", "".concat(shrinkToOnOrder, "px"));
   }, [shrinkToOnOrder]);
-  var calculateReordering = (0, _react.useMemo)(function () {
+  const calculateReordering = (0, _react.useMemo)(function () {
     return (0, _throttle.default)(function (e, els, currentOrder) {
       if (els.length > currentOrder.length || !currentWorkingKey.current) return;
-      var parent = findParentElement(e.target);
-      var indexOfKeyInCleanOrder = els.indexOf(parent);
-      var keyOfTheOverElement = currentOrder[indexOfKeyInCleanOrder];
-      var isDraggingOwnElement = currentWorkingKey.current === keyOfTheOverElement;
+      const parent = findParentElement(e.target);
+      const indexOfKeyInCleanOrder = els.indexOf(parent);
+      const keyOfTheOverElement = currentOrder[indexOfKeyInCleanOrder];
+      const isDraggingOwnElement = currentWorkingKey.current === keyOfTheOverElement;
       if (indexOfKeyInCleanOrder === -1 || keyOfTheOverElement === undefined) return;
       if (!isDraggingOwnElement) {
-        var _ref2 = function () {
+        const _ref2 = function () {
             if (mode === OrderableListReorderMode.TWO_DIMENSIONS) {
-              var distanceFromLeft = e.offsetX;
-              var widthOfEl = parent.clientWidth;
-              var offset = widthOfEl * 0.25;
-              var _isAfter = distanceFromLeft > widthOfEl - offset;
-              var _isBefore = distanceFromLeft < offset;
+              const distanceFromLeft = e.offsetX;
+              const widthOfEl = parent.clientWidth;
+              const offset = widthOfEl * 0.25;
+              const isAfter = distanceFromLeft > widthOfEl - offset;
+              const isBefore = distanceFromLeft < offset;
               return {
-                isAfter: _isAfter,
-                isBefore: _isBefore
+                isAfter: isAfter,
+                isBefore: isBefore
               };
             } else {
-              var distanceFromTop = e.offsetY;
-              var heightOfEl = parent.clientHeight;
-              var _offset = heightOfEl * 0.25;
-              var _isAfter2 = distanceFromTop > heightOfEl - _offset;
-              var _isBefore2 = distanceFromTop < _offset;
+              const distanceFromTop = e.offsetY;
+              const heightOfEl = parent.clientHeight;
+              const offset = heightOfEl * 0.25;
+              const isAfter = distanceFromTop > heightOfEl - offset;
+              const isBefore = distanceFromTop < offset;
               return {
-                isAfter: _isAfter2,
-                isBefore: _isBefore2
+                isAfter: isAfter,
+                isBefore: isBefore
               };
             }
           }(),
           isAfter = _ref2.isAfter,
           isBefore = _ref2.isBefore;
-        var checkIfCanMove = function checkIfCanMove(keyOfOverElement) {
+        const checkIfCanMove = function checkIfCanMove(keyOfOverElement) {
           return keyOfOverElement === undefined || keyOfOverElement !== currentWorkingKey.current;
         };
-        var indexOfTheNewElement = indexOfKeyInCleanOrder + (isAfter ? 1 : -1);
-        var shouldTriggerReordering = (isAfter || isBefore) && checkIfCanMove(currentOrder[indexOfTheNewElement]);
+        const indexOfTheNewElement = indexOfKeyInCleanOrder + (isAfter ? 1 : -1);
+        const shouldTriggerReordering = (isAfter || isBefore) && checkIfCanMove(currentOrder[indexOfTheNewElement]);
         if (shouldTriggerReordering) {
           setOrder(function (p) {
-            var previousIndex = currentOrder.indexOf(currentWorkingKey.current);
-            var indexOfKeyInProvidedOrder = cleanKeys(p).indexOf(keyOfTheOverElement);
-            var indexOfTheNewElement = indexOfKeyInProvidedOrder + (isBefore ? -1 : 0);
+            const previousIndex = currentOrder.indexOf(currentWorkingKey.current);
+            const indexOfKeyInProvidedOrder = cleanKeys(p).indexOf(keyOfTheOverElement);
+            let indexOfTheNewElement = indexOfKeyInProvidedOrder + (isBefore ? -1 : 0);
             if (previousIndex > indexOfTheNewElement) indexOfTheNewElement++;
-            var orderWithoutCurrent = p.filter(function (a) {
+            const orderWithoutCurrent = p.filter(function (a) {
               if (a.startsWith("".concat(currentWorkingKey.current, ";"))) return false;
               return a !== currentWorkingKey.current;
             });
@@ -177,27 +176,21 @@ function OrderableList(_ref) {
   }, []);
   (0, _react.useEffect)(function () {
     function registerListeners() {
-      var els = Array.from(rootEl().children);
-      var calculateReorderingCall = function calculateReorderingCall(e) {
-        var els = Array.from(rootEl().children);
+      const els = Array.from(rootEl().children);
+      const calculateReorderingCall = function calculateReorderingCall(e) {
+        const els = Array.from(rootEl().children);
         calculateReordering(e, els, cleanOrder);
       };
-      for (var _i2 = 0, _els = els; _i2 < _els.length; _i2++) {
-        var el = _els[_i2];
-        el.addEventListener("mousemove", calculateReorderingCall);
-      }
+      for (let el of els) el.addEventListener("mousemove", calculateReorderingCall);
       return function () {
-        for (var _i3 = 0, _els2 = els; _i3 < _els2.length; _i3++) {
-          var _el = _els2[_i3];
-          _el.removeEventListener("mousemove", calculateReorderingCall);
-        }
+        for (let el of els) el.removeEventListener("mousemove", calculateReorderingCall);
       };
     }
     if (mode === OrderableListReorderMode.VERTICAL) {
       return registerListeners();
     } else {
-      var unsubscribe;
-      var timeout = setTimeout(function () {
+      let unsubscribe;
+      let timeout = setTimeout(function () {
         unsubscribe = registerListeners();
       }, 250);
       return function () {
@@ -209,18 +202,18 @@ function OrderableList(_ref) {
   (0, _react.useEffect)(function () {
     if ("onChangeKeyOrder" in props) props.onChangeKeyOrder(cleanKeys(_order));
   }, [_order]);
-  var cleanOrderRef = (0, _react.useRef)(cleanOrder);
+  const cleanOrderRef = (0, _react.useRef)(cleanOrder);
   (0, _react.useEffect)(function () {
     cleanOrderRef.current = cleanOrder;
   }, [cleanOrder]);
-  var onAnchorClick = (0, _react.useCallback)(function (_ref3) {
-    var anchor = _ref3.target;
-    var offset;
-    var orderableListItemForAnchor = findParentElement(anchor);
-    var box = orderableListItemForAnchor.getBoundingClientRect();
-    var els = Array.from(rootEl().children);
-    var elIndex = els.indexOf(orderableListItemForAnchor);
-    var clone = orderableListItemForAnchor.cloneNode(true);
+  const onAnchorClick = (0, _react.useCallback)(function (_ref3) {
+    let anchor = _ref3.target;
+    let offset;
+    const orderableListItemForAnchor = findParentElement(anchor);
+    const box = orderableListItemForAnchor.getBoundingClientRect();
+    const els = Array.from(rootEl().children);
+    const elIndex = els.indexOf(orderableListItemForAnchor);
+    const clone = orderableListItemForAnchor.cloneNode(true);
     currentClone.current = clone;
     if (process.env.NODE_ENV === "development") clone.setAttribute("data-testid", "orderable-list-clone");
     clone.setAttribute("data-orderableid", "orderable-list-clone");
@@ -236,23 +229,23 @@ function OrderableList(_ref) {
     }, 0);
     orderableListItemForAnchor.classList.add(_OrderableListModule.default.currentOrdering);
     orderableListItemForAnchor.classList.remove(_OrderableListModule.default.visible);
-    var movementControl = function movementControl(e) {
-      var _ref4 = "touches" in e ? {
+    const movementControl = function movementControl(e) {
+      const _ref4 = "touches" in e ? {
           x: e.touches[0].pageX,
           y: e.touches[0].pageY
         } : e,
         x1 = _ref4.x,
         y1 = _ref4.y;
       if (!offset) offset = [x1 - box.left, y1 - box.top];
-      var _offset2 = offset,
-        _offset3 = _slicedToArray(_offset2, 2),
-        offsetX = _offset3[0],
-        offsetY = _offset3[1];
+      const _offset = offset,
+        _offset2 = _slicedToArray(_offset, 2),
+        offsetX = _offset2[0],
+        offsetY = _offset2[1];
       clone.style.top = "".concat(y1 - offsetY, "px");
       clone.style.left = "".concat(x1 - offsetX, "px");
     };
     document.body.appendChild(clone);
-    var deleteClone = function deleteClone() {
+    const deleteClone = function deleteClone() {
       window.removeEventListener("mousemove", movementControl);
       window.removeEventListener("touchmove", movementControl);
       window.removeEventListener("touchend", deleteClone);
@@ -261,7 +254,7 @@ function OrderableList(_ref) {
       currentWorkingKey.current = undefined;
       window.document.body.classList.remove(_OrderableListModule.default.unselectable);
       {
-        var cleanUp = function cleanUp() {
+        let cleanUp = function cleanUp() {
           if (shrinkToOnOrder) {
             rootEl().style.removeProperty("padding-top");
             rootEl().style.removeProperty("min-height");
@@ -269,38 +262,32 @@ function OrderableList(_ref) {
           eventEmitter.dispatcher("order-stop");
           rootEl().classList.remove(_OrderableListModule.default.ordering);
           if (reorderingClassName) rootEl().classList.remove(reorderingClassName);
-          for (var _i4 = 0, _els4 = _els3; _i4 < _els4.length; _i4++) {
-            var el = _els4[_i4];
-            el.classList.remove(_OrderableListModule.default.visible);
-          }
+          for (let el of els) el.classList.remove(_OrderableListModule.default.visible);
           clone.remove();
           currentClone.current = null;
-          for (var _i5 = 0, _arr2 = Array.from(elInvisible.children); _i5 < _arr2.length; _i5++) {
-            var _el2 = _arr2[_i5];
-            _el2.style.height = "";
-          }
+          for (let el of Array.from(elInvisible.children)) el.style.height = "";
         };
-        var _els3 = Array.from(rootEl().children);
-        var elInvisible = _els3.find(function (a) {
+        const els = Array.from(rootEl().children);
+        const elInvisible = els.find(function (a) {
           return !a.classList.contains(_OrderableListModule.default.visible) && a.style.maxHeight !== "0px";
         });
         if (shrinkToOnOrder) {
-          var child = elInvisible.lastElementChild;
+          const child = elInvisible.lastElementChild;
           child.style.maxHeight = "".concat(child.scrollHeight, "px");
           child.classList.add(_OrderableListModule.default.transitionHeight);
-          var onEnd = (0, _ownEvent.default)(function () {
+          const onEnd = (0, _ownEvent.default)(function () {
             child.removeEventListener("transitionend", onEnd);
             child.style.maxHeight = "initial";
             child.classList.remove(_OrderableListModule.default.transitionHeight);
           });
           child.addEventListener("transitionend", onEnd);
         }
-        var _box = elInvisible.getBoundingClientRect();
-        if (clone.style.top.startsWith(Math.floor(_box.top).toString()) && clone.style.left.startsWith(Math.floor(_box.left).toString())) {
+        const box = elInvisible.getBoundingClientRect();
+        if (clone.style.top.startsWith(Math.floor(box.top).toString()) && clone.style.left.startsWith(Math.floor(box.left).toString())) {
           cleanUp();
         } else {
-          clone.style.top = "".concat(_box.top, "px");
-          clone.style.left = "".concat(_box.left, "px");
+          clone.style.top = "".concat(box.top, "px");
+          clone.style.left = "".concat(box.left, "px");
           clone.style.transition = "top 500ms linear, left 500ms linear";
           clone.addEventListener("transitionend", function () {
             cleanUp();
@@ -308,26 +295,14 @@ function OrderableList(_ref) {
         }
       }
     };
-    for (var _i6 = 0, _els5 = els; _i6 < _els5.length; _i6++) {
-      var el = _els5[_i6];
+    for (let el of els) {
       el.classList.add(_OrderableListModule.default.visible);
     }
     if (shrinkToOnOrder) {
-      var _iterator = _createForOfIteratorHelper(els),
-        _step;
-      try {
-        for (_iterator.s(); !(_step = _iterator.n()).done;) {
-          var _el3 = _step.value;
-          _el3.style.maxHeight = "".concat(_el3.scrollHeight, "px");
-        }
-      } catch (err) {
-        _iterator.e(err);
-      } finally {
-        _iterator.f();
-      }
-      var targetHeight = elIndex * shrinkToOnOrder;
-      var currentHeight = orderableListItemForAnchor.offsetTop - els[0].offsetTop;
-      var paddingTop = currentHeight - targetHeight;
+      for (let el of els) el.style.maxHeight = "".concat(el.scrollHeight, "px");
+      const targetHeight = elIndex * shrinkToOnOrder;
+      const currentHeight = orderableListItemForAnchor.offsetTop - els[0].offsetTop;
+      const paddingTop = currentHeight - targetHeight;
       rootEl().style.paddingTop = "".concat(paddingTop, "px");
       rootEl().style.minHeight = "".concat(rootEl().clientHeight, "px");
     }
@@ -345,8 +320,8 @@ function OrderableList(_ref) {
   }, []);
   (0, _react.useLayoutEffect)(function () {
     if (currentClone.current) {
-      var els = Array.from(rootEl().children);
-      var elInvisible = els.find(function (a) {
+      const els = Array.from(rootEl().children);
+      const elInvisible = els.find(function (a) {
         return !a.classList.contains(_OrderableListModule.default.visible) && a.style.maxHeight !== "0px";
       });
       elInvisible.children[0].style.height = "".concat(currentClone.current.clientHeight, "px");
@@ -355,10 +330,10 @@ function OrderableList(_ref) {
       }, 150);
     }
   }, [cleanOrder]);
-  var toSpread = _objectSpread({}, props);
+  const toSpread = _objectSpread({}, props);
   delete toSpread.keyOrder;
   delete toSpread.onChangeKeyOrder;
-  var childrenToRender = _toConsumableArray(children).filter(function (a) {
+  const childrenToRender = _toConsumableArray(children).filter(function (a) {
     return cleanOrder.includes(a.key);
   }).sort(function (a, b) {
     return cleanOrder.indexOf(a.key) - cleanOrder.indexOf(b.key);
@@ -369,7 +344,7 @@ function OrderableList(_ref) {
   });
   (0, _react.useLayoutEffect)(function () {
     rootEl().addEventListener("touchstart", function (e) {
-      var relatedAnchor = anchorsList.find(function (anchor) {
+      const relatedAnchor = anchorsList.find(function (anchor) {
         return anchor.contains(e.target);
       });
       if (relatedAnchor) {
@@ -377,33 +352,33 @@ function OrderableList(_ref) {
         onAnchorClick({
           target: relatedAnchor
         });
-        var moveCb = (0, _throttle.default)(function (e) {
-          var touch = e.touches[0];
-          var _ref5 = [touch.clientX, touch.clientY],
+        const moveCb = (0, _throttle.default)(function (e) {
+          const touch = e.touches[0];
+          const _ref5 = [touch.clientX, touch.clientY],
             x = _ref5[0],
             y = _ref5[1];
-          var els = Array.from(rootEl().children);
-          var currentElementIdx = els.findIndex(function (c, i) {
-            var rect = c === null || c === void 0 ? void 0 : c.getBoundingClientRect();
+          const els = Array.from(rootEl().children);
+          const currentElementIdx = els.findIndex(function (c, i) {
+            const rect = c === null || c === void 0 ? void 0 : c.getBoundingClientRect();
             if (!rect) return false;
             return rect.top < y && rect.top + rect.height > y;
           });
           if (currentElementIdx !== -1) {
-            var el = els[currentElementIdx];
-            var rect = el.getBoundingClientRect();
+            const el = els[currentElementIdx];
+            const rect = el.getBoundingClientRect();
             calculateReordering({
               target: el,
               offsetY: y - rect.top
             }, els, cleanOrderRef.current);
           }
         }, 500);
-        var t = e.target;
-        var touchMoveCb = function touchMoveCb(e) {
+        const t = e.target;
+        const touchMoveCb = function touchMoveCb(e) {
           e.stopPropagation();
           window.dispatchEvent(new TouchEvent(e.type, e));
           moveCb(e);
         };
-        var removeCb = function removeCb(e) {
+        const removeCb = function removeCb(e) {
           t.removeEventListener("touchmove", touchMoveCb);
           t.removeEventListener("touchend", removeCb);
           window.dispatchEvent(new TouchEvent(e.type, e));
@@ -413,7 +388,7 @@ function OrderableList(_ref) {
       }
     });
   }, []);
-  var e = (0, _react.useMemo)(function () {
+  const e = (0, _react.useMemo)(function () {
     return {
       bindAnchor: function bindAnchor(el) {
         el.addEventListener("mousedown", onAnchorClick);
@@ -459,9 +434,9 @@ function OrderableList(_ref) {
   })))));
 }
 function HeroWrapper(_ref6) {
-  var children = _ref6.children,
+  let children = _ref6.children,
     id = _ref6.id;
-  var _useHero = (0, _useHero2.default)(id, undefined, {
+  const _useHero = (0, _useHero2.default)(id, undefined, {
       onHeroStart: function onHeroStart(_c, _o, t) {
         t.querySelectorAll("img").forEach(function (img) {
           return img.style.visibility = "hidden";
@@ -482,11 +457,11 @@ function HeroWrapper(_ref6) {
   }, children);
 }
 function useOrderableListAnchor() {
-  var anchorRef = (0, _react.useRef)(null);
-  var ctx = (0, _react.useContext)(OrderableListContext);
+  const anchorRef = (0, _react.useRef)(null);
+  const ctx = (0, _react.useContext)(OrderableListContext);
   (0, _react.useLayoutEffect)(function () {
     if (!ctx) return;
-    var bindAnchor = ctx.bindAnchor,
+    const bindAnchor = ctx.bindAnchor,
       unbindAnchor = ctx.unbindAnchor;
     bindAnchor(anchorRef.current);
     return function () {
@@ -498,12 +473,12 @@ function useOrderableListAnchor() {
   };
 }
 function useOrderableEvents(events) {
-  var _useContext = (0, _react.useContext)(OrderableListContext),
+  const _useContext = (0, _react.useContext)(OrderableListContext),
     on = _useContext.on;
   (0, _react.useEffect)(function () {
-    var unsubscribers = [];
-    for (var _eventName in events) {
-      unsubscribers.push(on(_eventName, events[_eventName]));
+    const unsubscribers = [];
+    for (let eventName in events) {
+      unsubscribers.push(on(eventName, events[eventName]));
     }
     return function () {
       unsubscribers.forEach(function (u) {