@onepercentio/one-ui 0.19.2 → 0.19.4

package/dist/hooks/useAsyncControl.js

@@ -1,50 +1,85 @@
 "use strict";
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useAsyncControl;
+var _react = require("react");
+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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+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 asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+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 _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function useAsyncControl(functionsToWrap) {
-    const [error, setError] = (0, react_1.useState)();
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const _process = (0, react_1.useCallback)((asyncFn) => __awaiter(this, void 0, void 0, function* () {
-        try {
-            setLoading(true);
-            setError(undefined);
-            return yield asyncFn();
-        }
-        catch (e) {
-            if (process.env.NODE_ENV === "development")
-                console.error(e);
-            setError(e);
-            throw e;
-        }
-        finally {
-            setLoading(false);
-        }
-    }), []);
-    const { functionsToMemoize, other } = Object.entries(functionsToWrap || {}).reduce((r, [k, func]) => {
-        return Object.assign(Object.assign({}, r), (typeof func === "function"
-            ? {
-                functionsToMemoize: Object.assign(Object.assign({}, r.functionsToMemoize), { [k]: func }),
-            }
-            : {
-                other: Object.assign(Object.assign({}, r.other), { [k]: func }),
-            }));
-    }, {
-        functionsToMemoize: {},
-        other: {},
+  const _useState = (0, _react.useState)(),
+    _useState2 = _slicedToArray(_useState, 2),
+    error = _useState2[0],
+    setError = _useState2[1];
+  const _useState3 = (0, _react.useState)(false),
+    _useState4 = _slicedToArray(_useState3, 2),
+    loading = _useState4[0],
+    setLoading = _useState4[1];
+  const _process = (0, _react.useCallback)( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(function* (asyncFn) {
+      try {
+        setLoading(true);
+        setError(undefined);
+        return yield asyncFn();
+      } catch (e) {
+        if (process.env.NODE_ENV === "development") console.error(e);
+        setError(e);
+        throw e;
+      } finally {
+        setLoading(false);
+      }
     });
-    return Object.assign(Object.assign({ process: _process, loading,
-        error,
-        setError,
-        setLoading }, other), Object.entries(functionsToMemoize).reduce((r, [k, v]) => (Object.assign(Object.assign({}, r), { [k]: (0, react_1.useMemo)(() => (...args) => _process(() => v(...args)), [v]) })), {}));
-}
-exports.default = useAsyncControl;
-//# sourceMappingURL=useAsyncControl.js.map
+    return function () {
+      return _ref.apply(this, arguments);
+    };
+  }(), []);
+  const _Object$entries$reduc = Object.entries(functionsToWrap || {}).reduce(function (r, _ref2) {
+      let _ref3 = _slicedToArray(_ref2, 2),
+        k = _ref3[0],
+        func = _ref3[1];
+      return _objectSpread(_objectSpread({}, r), typeof func === "function" ? {
+        functionsToMemoize: _objectSpread(_objectSpread({}, r.functionsToMemoize), {}, _defineProperty({}, k, func))
+      } : {
+        other: _objectSpread(_objectSpread({}, r.other), {}, _defineProperty({}, k, func))
+      });
+    }, {
+      functionsToMemoize: {},
+      other: {}
+    }),
+    functionsToMemoize = _Object$entries$reduc.functionsToMemoize,
+    other = _Object$entries$reduc.other;
+  return _objectSpread(_objectSpread({
+    process: _process,
+    loading: loading,
+    error: error,
+    setError: setError,
+    setLoading: setLoading
+  }, other), Object.entries(functionsToMemoize).reduce(function (r, _ref4) {
+    let _ref5 = _slicedToArray(_ref4, 2),
+      k = _ref5[0],
+      v = _ref5[1];
+    return _objectSpread(_objectSpread({}, r), {}, _defineProperty({}, k, (0, _react.useMemo)(function () {
+      return function () {
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+        return _process(function () {
+          return v.apply(void 0, args);
+        });
+      };
+    }, [v])));
+  }, {}));
+}

package/dist/hooks/useContainedRepositioning.js

@@ -1,79 +1,82 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-const debounce_1 = __importDefault(require("lodash/debounce"));
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useContainedRepositioning;
+var _debounce = _interopRequireDefault(require("lodash/debounce"));
+var _react = require("react");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * This hook takes an html and checks if its outside its parent
  * If it is, it should move it so it can be totally visible inside the container
  */
-function useContainedRepositioning(focused, getParent, { offset = 16, scale = 1, offsetLimit = Number.POSITIVE_INFINITY, } = {}) {
-    const elementToCheck = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
-        const el = elementToCheck.current;
-        if (!el)
-            return;
-        const curr = el;
-        const relativeParent = getParent(curr);
-        if (process.env.NODE_ENV === "development") {
-            if (window.getComputedStyle(el).position !== "relative")
-                throw new Error("The target element MUST have position relative so it can be moved");
-            if (window.getComputedStyle(relativeParent).position !== "relative")
-                throw new Error("The relative to element MUST have position relative so it can calculate correctly the target position");
+function useContainedRepositioning(focused, getParent) {
+  let _ref = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {},
+    _ref$offset = _ref.offset,
+    offset = _ref$offset === void 0 ? 16 : _ref$offset,
+    _ref$scale = _ref.scale,
+    scale = _ref$scale === void 0 ? 1 : _ref$scale,
+    _ref$offsetLimit = _ref.offsetLimit,
+    offsetLimit = _ref$offsetLimit === void 0 ? Number.POSITIVE_INFINITY : _ref$offsetLimit;
+  const elementToCheck = (0, _react.useRef)(null);
+  (0, _react.useEffect)(function () {
+    const el = elementToCheck.current;
+    if (!el) return;
+    const curr = el;
+    const relativeParent = getParent(curr);
+    if (process.env.NODE_ENV === "development") {
+      if (window.getComputedStyle(el).position !== "relative") throw new Error("The target element MUST have position relative so it can be moved");
+      if (window.getComputedStyle(relativeParent).position !== "relative") throw new Error("The relative to element MUST have position relative so it can calculate correctly the target position");
+    }
+    if (focused) {
+      curr.style.right = "0px";
+      const reposition = (0, _debounce.default)(function () {
+        const alreadyRight = Number(curr.style.right.replace("px", ""));
+        const limitOffset = relativeParent.scrollLeft + relativeParent.clientWidth;
+        const elWidth = curr.clientWidth * scale;
+        const offsetOfScale = (elWidth - curr.clientWidth) / 2;
+        const cardLimit = curr.offsetLeft - offsetOfScale + alreadyRight + elWidth;
+        const exceedingSpace = cardLimit - limitOffset;
+        const offsetLeft = curr.offsetLeft - offsetOfScale + alreadyRight - relativeParent.scrollLeft;
+        const isOverflowedRight = exceedingSpace > 0;
+        const isOverflowedLeft = offsetLeft < 0;
+        const limit = exceedingSpace + -offsetLeft;
+        if (isOverflowedRight) {
+          const val = Math.min(exceedingSpace - -Math.min(Math.abs(limit / 2), offset), offsetLimit);
+          curr.style.right = "".concat(val, "px");
         }
-        if (focused) {
-            curr.style.right = `0px`;
-            const reposition = (0, debounce_1.default)(() => {
-                const alreadyRight = Number(curr.style.right.replace("px", ""));
-                const limitOffset = relativeParent.scrollLeft + relativeParent.clientWidth;
-                const elWidth = curr.clientWidth * scale;
-                const offsetOfScale = (elWidth - curr.clientWidth) / 2;
-                const cardLimit = curr.offsetLeft - offsetOfScale + alreadyRight + elWidth;
-                const exceedingSpace = cardLimit - limitOffset;
-                const offsetLeft = curr.offsetLeft -
-                    offsetOfScale +
-                    alreadyRight -
-                    relativeParent.scrollLeft;
-                const isOverflowedRight = exceedingSpace > 0;
-                const isOverflowedLeft = offsetLeft < 0;
-                const limit = exceedingSpace + -offsetLeft;
-                if (isOverflowedRight) {
-                    const val = Math.min(exceedingSpace - -Math.min(Math.abs(limit / 2), offset), offsetLimit);
-                    curr.style.right = `${val}px`;
-                }
-                if (isOverflowedLeft) {
-                    const val = Math.max(offsetLeft - Math.min(Math.abs(limit) / 2, offset), -offsetLimit);
-                    curr.style.right = `${val}px`;
-                }
-                if (isOverflowedLeft || isOverflowedRight) {
-                    curr.style.zIndex = "1000";
-                }
-            }, 50);
-            reposition();
-            reposition.flush();
-            relativeParent.addEventListener("scroll", reposition, {
-                passive: true
-            });
-            return () => {
-                reposition.cancel();
-                relativeParent.removeEventListener("scroll", reposition);
-                el.style.right = `0px`;
-                const restore = ({ propertyName, currentTarget }) => {
-                    const targetTransformation = window.getComputedStyle(currentTarget).right;
-                    if (propertyName === "right" && targetTransformation === "0px") {
-                        curr.style.zIndex = "";
-                        el.removeEventListener("transitionend", restore);
-                    }
-                };
-                el.addEventListener("transitionend", restore);
-            };
+        if (isOverflowedLeft) {
+          const val = Math.max(offsetLeft - Math.min(Math.abs(limit) / 2, offset), -offsetLimit);
+          curr.style.right = "".concat(val, "px");
         }
-    }, [focused]);
-    return {
-        elementToCheck,
-    };
-}
-exports.default = useContainedRepositioning;
-//# sourceMappingURL=useContainedRepositioning.js.map
+        if (isOverflowedLeft || isOverflowedRight) {
+          curr.style.zIndex = "1000";
+        }
+      }, 50);
+      reposition();
+      reposition.flush();
+      relativeParent.addEventListener("scroll", reposition, {
+        passive: true
+      });
+      return function () {
+        reposition.cancel();
+        relativeParent.removeEventListener("scroll", reposition);
+        el.style.right = "0px";
+        const restore = function restore(_ref2) {
+          let propertyName = _ref2.propertyName,
+            currentTarget = _ref2.currentTarget;
+          const targetTransformation = window.getComputedStyle(currentTarget).right;
+          if (propertyName === "right" && targetTransformation === "0px") {
+            curr.style.zIndex = "";
+            el.removeEventListener("transitionend", restore);
+          }
+        };
+        el.addEventListener("transitionend", restore);
+      };
+    }
+  }, [focused]);
+  return {
+    elementToCheck: elementToCheck
+  };
+}

package/dist/hooks/useCustomHistory.js

@@ -1,15 +1,23 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_router_dom_1 = require("react-router-dom");
-function useCustomHistory() {
-    const customHistory = (0, react_router_dom_1.useHistory)();
-    const { state } = (0, react_router_dom_1.useLocation)();
-    return Object.assign(Object.assign({}, customHistory), { goBackWithFallback(fallbackRoute) {
-            if (state === null || state === void 0 ? void 0 : state.internalNavigation)
-                customHistory.goBack();
-            else
-                customHistory.push(fallbackRoute);
-        } });
-}
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.default = useCustomHistory;
-//# sourceMappingURL=useCustomHistory.js.map
+var _reactRouterDom = require("react-router-dom");
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+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 useCustomHistory() {
+  const customHistory = (0, _reactRouterDom.useHistory)();
+  const _useLocation = (0, _reactRouterDom.useLocation)(),
+    state = _useLocation.state;
+  return _objectSpread(_objectSpread({}, customHistory), {}, {
+    goBackWithFallback: function goBackWithFallback(fallbackRoute) {
+      if (state !== null && state !== void 0 && state.internalNavigation) customHistory.goBack();else customHistory.push(fallbackRoute);
+    }
+  });
+}

package/dist/hooks/useElementFit.js

@@ -1,43 +1,51 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useElementFit;
+var _react = require("react");
+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 _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 /**
  * This hook receives a base width of an element and returns how much items fit **vertically** inside the referenced html element
  *
  * @param baseWidth The base width of each element
  */
 function useElementFit(baseWidth, baseHeight) {
-    const ref = (0, react_1.useRef)(null);
-    function calculateDimension() {
-        var _a, _b;
-        function fittingRows() {
-            if (!ref.current || baseHeight === undefined)
-                return 1;
-            return Math.ceil(ref.current.clientHeight / baseHeight);
-        }
-        if (window.PRERENDER)
-            return 4;
-        const width = ((_a = ref.current) === null || _a === void 0 ? void 0 : _a.clientWidth) || window.visualViewport.width;
-        const maxItemsVertically = Math.floor(width / baseWidth) || 1;
-        if (process.env.NODE_ENV === "development")
-            require('../models/DebugLogger').default(`${useElementFit.name}:clientWidth`, (_b = ref.current) === null || _b === void 0 ? void 0 : _b.clientWidth);
-        return maxItemsVertically * fittingRows();
+  const ref = (0, _react.useRef)(null);
+  function calculateDimension() {
+    var _ref$current, _ref$current2;
+    function fittingRows() {
+      if (!ref.current || baseHeight === undefined) return 1;
+      return Math.ceil(ref.current.clientHeight / baseHeight);
+    }
+    if (window.PRERENDER) return 4;
+    const width = ((_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.clientWidth) || window.visualViewport.width;
+    const maxItemsVertically = Math.floor(width / baseWidth) || 1;
+    if (process.env.NODE_ENV === "development") require('../models/DebugLogger').default("".concat(useElementFit.name, ":clientWidth"), (_ref$current2 = ref.current) === null || _ref$current2 === void 0 ? void 0 : _ref$current2.clientWidth);
+    return maxItemsVertically * fittingRows();
+  }
+  const _useState = (0, _react.useState)(window.PRERENDER ? 4 : undefined),
+    _useState2 = _slicedToArray(_useState, 2),
+    itemsToShow = _useState2[0],
+    setItemsToShow = _useState2[1];
+  (0, _react.useLayoutEffect)(function () {
+    setItemsToShow(calculateDimension());
+    function onResize() {
+      setItemsToShow(calculateDimension());
     }
-    const [itemsToShow, setItemsToShow] = (0, react_1.useState)(window.PRERENDER ? 4 : undefined);
-    (0, react_1.useLayoutEffect)(() => {
-        setItemsToShow(calculateDimension());
-        function onResize() {
-            setItemsToShow(calculateDimension());
-        }
-        window.addEventListener("resize", onResize);
-        return () => {
-            window.removeEventListener("resize", onResize);
-        };
-    }, []);
-    return {
-        itemsToShow,
-        ref,
+    window.addEventListener("resize", onResize);
+    return function () {
+      window.removeEventListener("resize", onResize);
     };
-}
-exports.default = useElementFit;
-//# sourceMappingURL=useElementFit.js.map
+  }, []);
+  return {
+    itemsToShow: itemsToShow,
+    ref: ref
+  };
+}

package/dist/hooks/useFirestoreWatch.js

@@ -1,38 +1,57 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useFirestoreWatch;
+var _react = require("react");
+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 _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 _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 _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 function useFirestoreWatch(queryFactory, params) {
-    const [docsList, updateList] = (0, react_1.useState)();
-    (0, react_1.useEffect)(() => {
-        const unsub = queryFactory(...params)((changes) => {
-            updateList((prevList = []) => {
-                for (let docChange of changes) {
-                    switch (docChange.type) {
-                        case 'added':
-                            if (!prevList.find((f) => f.id === docChange.doc.id)) {
-                                prevList.unshift(docChange.doc);
-                            }
-                            break;
-                        case 'modified':
-                            prevList = prevList.map((item) => {
-                                if (item.id === docChange.doc.id)
-                                    for (let key in docChange.doc) {
-                                        item[key] = docChange.doc[key];
-                                    }
-                                return item;
-                            });
-                            break;
-                        case 'removed':
-                            prevList = prevList.filter((item) => item.id !== docChange.doc.id);
-                            break;
-                    }
+  const _useState = (0, _react.useState)(),
+    _useState2 = _slicedToArray(_useState, 2),
+    docsList = _useState2[0],
+    updateList = _useState2[1];
+  (0, _react.useEffect)(function () {
+    const unsub = queryFactory.apply(void 0, _toConsumableArray(params))(function (changes) {
+      updateList(function () {
+        let prevList = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
+        for (let docChange of changes) {
+          switch (docChange.type) {
+            case 'added':
+              if (!prevList.find(function (f) {
+                return f.id === docChange.doc.id;
+              })) {
+                prevList.unshift(docChange.doc);
+              }
+              break;
+            case 'modified':
+              prevList = prevList.map(function (item) {
+                if (item.id === docChange.doc.id) for (let key in docChange.doc) {
+                  item[key] = docChange.doc[key];
                 }
-                return [...prevList];
-            });
-        });
-        return unsub;
-    }, params);
-    return docsList;
-}
-exports.default = useFirestoreWatch;
-//# sourceMappingURL=useFirestoreWatch.js.map
+                return item;
+              });
+              break;
+            case 'removed':
+              prevList = prevList.filter(function (item) {
+                return item.id !== docChange.doc.id;
+              });
+              break;
+          }
+        }
+        return _toConsumableArray(prevList);
+      });
+    });
+    return unsub;
+  }, params);
+  return docsList;
+}

package/dist/hooks/useForm.js

@@ -1,24 +1,49 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
-function useContextForm(config, initialState) {
-    const [form, setForm] = (0, react_1.useState)(initialState);
-    const isValid = (0, react_1.useMemo)(() => !Object.keys(config).some((a) => typeof config[a].validator(form[a], form) === "string"), [form]);
-    const _setFormField = (key, value) => {
-        setForm(prev => (Object.assign(Object.assign({}, prev), { [key]: value })));
-    };
-    const validFormFields = (0, react_1.useMemo)(() => {
-        return Object.keys(config).reduce((result, field) => {
-            const fieldConfig = config[field];
-            const invalidMessage = fieldConfig.validator(form[field], form);
-            return Object.assign(Object.assign({}, result), { [field]: invalidMessage });
-        }, { isValid });
-    }, [form, isValid]);
-    return {
-        form: form,
-        formValidation: validFormFields,
-        set: _setFormField
-    };
-}
+
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
 exports.default = useContextForm;
-//# sourceMappingURL=useForm.js.map
+var _react = require("react");
+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 _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+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 _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 _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function useContextForm(config, initialState) {
+  const _useState = (0, _react.useState)(initialState),
+    _useState2 = _slicedToArray(_useState, 2),
+    form = _useState2[0],
+    setForm = _useState2[1];
+  const isValid = (0, _react.useMemo)(function () {
+    return !Object.keys(config).some(function (a) {
+      return typeof config[a].validator(form[a], form) === "string";
+    });
+  }, [form]);
+  const _setFormField = function _setFormField(key, value) {
+    setForm(function (prev) {
+      return _objectSpread(_objectSpread({}, prev), {}, _defineProperty({}, key, value));
+    });
+  };
+  const validFormFields = (0, _react.useMemo)(function () {
+    return Object.keys(config).reduce(function (result, field) {
+      const fieldConfig = config[field];
+      const invalidMessage = fieldConfig.validator(form[field], form);
+      return _objectSpread(_objectSpread({}, result), {}, _defineProperty({}, field, invalidMessage));
+    }, {
+      isValid: isValid
+    });
+  }, [form, isValid]);
+  return {
+    form: form,
+    formValidation: validFormFields,
+    set: _setFormField
+  };
+}

package/dist/hooks/useFreeze.js

@@ -1,14 +1,16 @@
 "use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const react_1 = require("react");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = useFreeze;
+var _react = require("react");
 /**
- * This hook pipes a data and when it is set to a falsy value ("", undefined, null, 0),
+ * This hook pipes a data and when it is set to a falsy value ("", undefined, null, 0), 
  * it returns the previous valid value
  */
 function useFreeze(something) {
-    const currChildOrPrev = (0, react_1.useRef)();
-    currChildOrPrev.current = something || currChildOrPrev.current;
-    return currChildOrPrev.current || null;
-}
-exports.default = useFreeze;
-//# sourceMappingURL=useFreeze.js.map
+  const currChildOrPrev = (0, _react.useRef)();
+  currChildOrPrev.current = something || currChildOrPrev.current;
+  return currChildOrPrev.current || null;
+}

package/dist/hooks/useHero.d.ts

@@ -41,6 +41,10 @@ export default function useHero(id: string, options?: Partial<{
      * @returns If the hero should be skipped or not
      */
     onHeroSkip?: (origin: HTMLDivElement, target: HTMLDivElement) => ShouldSkip;
+    /**
+     * Called when a hero is skipped
+     */
+    onHeroSkipped?: () => void;
     /**
      * Before transition start, setup the properties that will be used for hero animation
      * @returns The container that will be used to check if the hero is out or in the view