@studiometa/js-toolkit 2.0.0-alpha.1 → 2.0.0-alpha.10

package/components/Modal.js

@@ -1,270 +0,0 @@
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-import Base from '../Base/index.js';
-import transition from '../utils/css/transition.js';
-import { trap, untrap, saveActiveElement } from '../utils/focusTrap.js';
-
-var Modal = function (_Base) {
-  _inherits(Modal, _Base);
-
-  var _super = _createSuper(Modal);
-
-  function Modal() {
-    _classCallCheck(this, Modal);
-
-    return _super.apply(this, arguments);
-  }
-
-  _createClass(Modal, [{
-    key: "onOpenClick",
-    get: function get() {
-      return this.open;
-    }
-  }, {
-    key: "onCloseClick",
-    get: function get() {
-      return this.close;
-    }
-  }, {
-    key: "onOverlayClick",
-    get: function get() {
-      return this.close;
-    }
-  }, {
-    key: "mounted",
-    value: function mounted() {
-      this.isOpen = false;
-      this.close();
-
-      if (this.$options.move) {
-        var target = document.querySelector(this.$options.move) || document.body;
-        var refsBackup = this.$refs;
-        this.refModalPlaceholder = document.createComment('');
-        this.refModalParentBackup = this.$refs.modal.parentElement || this.$el;
-        this.refModalParentBackup.insertBefore(this.refModalPlaceholder, this.$refs.modal);
-        this.refModalUnbindGetRefFilter = this.$on('get:refs', function (refs) {
-          Object.entries(refsBackup).forEach(function (_ref) {
-            var _ref2 = _slicedToArray(_ref, 2),
-                key = _ref2[0],
-                ref = _ref2[1];
-
-            if (!refs[key]) {
-              refs[key] = ref;
-            }
-          });
-        });
-        target.appendChild(this.$refs.modal);
-      }
-
-      return this;
-    }
-  }, {
-    key: "destroyed",
-    value: function destroyed() {
-      this.close();
-
-      if (this.$options.move && this.refModalParentBackup) {
-        this.refModalParentBackup.insertBefore(this.$refs.modal, this.refModalPlaceholder);
-        this.refModalUnbindGetRefFilter();
-        this.refModalPlaceholder.remove();
-        delete this.refModalPlaceholder;
-        delete this.refModalParentBackup;
-        delete this.refModalUnbindGetRefFilter;
-      }
-
-      return this;
-    }
-  }, {
-    key: "keyed",
-    value: function keyed(_ref3) {
-      var event = _ref3.event,
-          isUp = _ref3.isUp,
-          isDown = _ref3.isDown,
-          ESC = _ref3.ESC;
-
-      if (!this.isOpen) {
-        return;
-      }
-
-      if (isDown) {
-        trap(this.$refs.modal, event);
-      }
-
-      if (ESC && isUp) {
-        this.close();
-      }
-    }
-  }, {
-    key: "open",
-    value: function () {
-      var _open = _asyncToGenerator(_regeneratorRuntime.mark(function _callee() {
-        var _this = this;
-
-        var refs;
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                if (!this.isOpen) {
-                  _context.next = 2;
-                  break;
-                }
-
-                return _context.abrupt("return", Promise.resolve(this));
-
-              case 2:
-                this.$refs.modal.setAttribute('aria-hidden', 'false');
-                document.documentElement.style.overflow = 'hidden';
-                this.isOpen = true;
-                this.$emit('open');
-                refs = this.$refs;
-                return _context.abrupt("return", Promise.all(Object.entries(this.$options.styles).map(function (_ref4) {
-                  var _ref5 = _slicedToArray(_ref4, 2),
-                      refName = _ref5[0],
-                      _ref5$ = _ref5[1];
-
-                  _ref5$ = _ref5$ === void 0 ? {
-                    open: '',
-                    active: '',
-                    closed: ''
-                  } : _ref5$;
-                  var open = _ref5$.open,
-                      active = _ref5$.active,
-                      closed = _ref5$.closed;
-                  return transition(refs[refName], {
-                    from: closed,
-                    active: active,
-                    to: open
-                  }, 'keep');
-                })).then(function () {
-                  if (_this.$options.autofocus && _this.$refs.modal.querySelector(_this.$options.autofocus)) {
-                    saveActiveElement();
-
-                    var autofocusElement = _this.$refs.modal.querySelector(_this.$options.autofocus);
-
-                    autofocusElement.focus();
-                  }
-
-                  return Promise.resolve(_this);
-                }));
-
-              case 8:
-              case "end":
-                return _context.stop();
-            }
-          }
-        }, _callee, this);
-      }));
-
-      function open() {
-        return _open.apply(this, arguments);
-      }
-
-      return open;
-    }()
-  }, {
-    key: "close",
-    value: function () {
-      var _close = _asyncToGenerator(_regeneratorRuntime.mark(function _callee2() {
-        var _this2 = this;
-
-        var refs;
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                if (this.isOpen) {
-                  _context2.next = 2;
-                  break;
-                }
-
-                return _context2.abrupt("return", Promise.resolve(this));
-
-              case 2:
-                this.$refs.modal.setAttribute('aria-hidden', 'true');
-                document.documentElement.style.overflow = '';
-                this.isOpen = false;
-                untrap();
-                this.$emit('close');
-                refs = this.$refs;
-                return _context2.abrupt("return", Promise.all(Object.entries(this.$options.styles).map(function (_ref6) {
-                  var _ref7 = _slicedToArray(_ref6, 2),
-                      refName = _ref7[0],
-                      _ref7$ = _ref7[1];
-
-                  _ref7$ = _ref7$ === void 0 ? {
-                    open: '',
-                    active: '',
-                    closed: ''
-                  } : _ref7$;
-                  var open = _ref7$.open,
-                      active = _ref7$.active,
-                      closed = _ref7$.closed;
-                  return transition(refs[refName], {
-                    from: open,
-                    active: active,
-                    to: closed
-                  }, 'keep');
-                })).then(function () {
-                  return Promise.resolve(_this2);
-                }));
-
-              case 9:
-              case "end":
-                return _context2.stop();
-            }
-          }
-        }, _callee2, this);
-      }));
-
-      function close() {
-        return _close.apply(this, arguments);
-      }
-
-      return close;
-    }()
-  }]);
-
-  return Modal;
-}(Base);
-
-_defineProperty(Modal, "config", {
-  name: 'Modal',
-  refs: ['close', 'container', 'content', 'modal', 'open', 'overlay'],
-  options: {
-    move: String,
-    autofocus: {
-      type: String,
-      default: '[autofocus]'
-    },
-    styles: {
-      type: Object,
-      default: function _default() {
-        return {
-          modal: {
-            closed: {
-              opacity: '0',
-              pointerEvents: 'none',
-              visibility: 'hidden'
-            }
-          }
-        };
-      }
-    }
-  }
-});
-
-export { Modal as default };
-//# sourceMappingURL=Modal.js.map

package/components/Modal.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../packages/js-toolkit/components/Modal.js"],"names":["Base","transition","trap","untrap","saveActiveElement","Modal","open","close","isOpen","$options","move","target","document","querySelector","body","refsBackup","$refs","refModalPlaceholder","createComment","refModalParentBackup","modal","parentElement","$el","insertBefore","refModalUnbindGetRefFilter","$on","refs","Object","entries","forEach","key","ref","appendChild","remove","event","isUp","isDown","ESC","Promise","resolve","setAttribute","documentElement","style","overflow","$emit","all","styles","map","refName","active","closed","from","to","then","autofocus","autofocusElement","focus","name","options","String","type","default","opacity","pointerEvents","visibility"],"mappings":"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","sourcesContent":["import Base from '../Base/index.js';\nimport transition from '../utils/css/transition.js';\nimport { trap, untrap, saveActiveElement } from '../utils/focusTrap.js';\n\n/**\n * @typedef {Object} ModalRefs\n * @property {HTMLElement} close\n * @property {HTMLElement} container\n * @property {HTMLElement} content\n * @property {HTMLElement} modal\n * @property {HTMLElement} open\n * @property {HTMLElement} overlay\n */\n\n/**\n * @typedef {import('../utils/css/styles.js').CssStyleObject} CssStyleObject\n * @typedef {Partial<Record<'open'|'active'|'closed', string|CssStyleObject>>} ModalStates\n * @typedef {Partial<Record<keyof ModalRefs, ModalStates>>} ModalStylesOption\n */\n\n/**\n * @typedef {Object} ModalOptions\n * @property {String}            move      A selector where to move the modal to.\n * @property {String}            autofocus A selector for the element to set the focus to when the modal opens.\n * @property {ModalStylesOption} styles    The styles for the different state of the modal.\n */\n\n/**\n * @typedef {Object} ModalPrivateInterface\n * @property {ModalRefs} $refs\n * @property {ModalOptions} $options\n * @property {Boolean} isOpen\n * @property {Comment} refModalPlaceholder\n * @property {HTMLElement} refModalParentBackup\n * @property {Function} refModalUnbindGetRefFilter\n */\n\n/**\n * @typedef {Modal & ModalPrivateInterface} ModalInterface\n */\n\n/**\n * Modal class.\n */\nexport default class Modal extends Base {\n  /**\n   * Modal options.\n   */\n  static config = {\n    name: 'Modal',\n    refs: ['close', 'container', 'content', 'modal', 'open', 'overlay'],\n    options: {\n      move: String,\n      autofocus: { type: String, default: '[autofocus]' },\n      styles: {\n        type: Object,\n        /**\n         * @return {ModalStylesOption}\n         */\n        default: () => ({\n          modal: {\n            closed: {\n              opacity: '0',\n              pointerEvents: 'none',\n              visibility: 'hidden',\n            },\n          },\n        }),\n      },\n    },\n  };\n\n  /**\n   * Open the modal on click on the `open` ref.\n   *\n   * @return {Function} The component's `open` method.\n   */\n  get onOpenClick() {\n    return this.open;\n  }\n\n  /**\n   * Close the modal on click on the `close` ref.\n   *\n   * @return {Function} The component's `close` method.\n   */\n  get onCloseClick() {\n    return this.close;\n  }\n\n  /**\n   * Close the modal on click on the `overlay` ref.\n   *\n   * @return {Function} The component's `close` method.\n   */\n  get onOverlayClick() {\n    return this.close;\n  }\n\n  /**\n   * Initialize the component's behaviours.\n   *\n   * @this {ModalInterface}\n   */\n  mounted() {\n    this.isOpen = false;\n    this.close();\n\n    if (this.$options.move) {\n      const target = document.querySelector(this.$options.move) || document.body;\n      const refsBackup = this.$refs;\n\n      this.refModalPlaceholder = document.createComment('');\n      this.refModalParentBackup = this.$refs.modal.parentElement || this.$el;\n      this.refModalParentBackup.insertBefore(this.refModalPlaceholder, this.$refs.modal);\n\n      this.refModalUnbindGetRefFilter = this.$on(\n        'get:refs',\n        /**\n         * @param {ModalRefs} refs\n         */\n        // @ts-ignore\n        (refs) => {\n          Object.entries(refsBackup).forEach(([key, ref]) => {\n            if (!refs[key]) {\n              refs[key] = ref;\n            }\n          });\n        }\n      );\n      target.appendChild(this.$refs.modal);\n    }\n\n    return this;\n  }\n\n  /**\n   * Unbind all events on destroy.\n   *\n   * @this {ModalInterface}\n   * @return {Modal} The Modal instance.\n   */\n  destroyed() {\n    this.close();\n\n    if (this.$options.move && this.refModalParentBackup) {\n      this.refModalParentBackup.insertBefore(this.$refs.modal, this.refModalPlaceholder);\n      this.refModalUnbindGetRefFilter();\n      this.refModalPlaceholder.remove();\n      delete this.refModalPlaceholder;\n      delete this.refModalParentBackup;\n      delete this.refModalUnbindGetRefFilter;\n    }\n\n    return this;\n  }\n\n  /**\n   * Close the modal on `ESC` and trap the tabulation.\n   *\n   * @this {ModalInterface}\n   * @param  {Object}        options\n   * @param  {KeyboardEvent} options.event  The original keyboard event\n   * @param  {Boolean}       options.isUp   Is it a keyup event?\n   * @param  {Boolean}       options.isDown Is it a keydown event?\n   * @param  {Boolean}       options.ESC    Is it the ESC key?\n   */\n  keyed({ event, isUp, isDown, ESC }) {\n    if (!this.isOpen) {\n      return;\n    }\n\n    if (isDown) {\n      trap(this.$refs.modal, event);\n    }\n\n    if (ESC && isUp) {\n      this.close();\n    }\n  }\n\n  /**\n   * Open the modal.\n   *\n   * @this {ModalInterface}\n   * @return {Promise<ModalInterface>} The Modal instance.\n   */\n  async open() {\n    if (this.isOpen) {\n      return Promise.resolve(this);\n    }\n\n    this.$refs.modal.setAttribute('aria-hidden', 'false');\n    document.documentElement.style.overflow = 'hidden';\n\n    this.isOpen = true;\n    this.$emit('open');\n\n    /** @type {ModalRefs} */\n    const refs = this.$refs;\n\n    return Promise.all(\n      Object.entries(this.$options.styles).map(\n        ([refName, { open, active, closed } = { open: '', active: '', closed: '' }]) =>\n          transition(\n            refs[refName],\n            {\n              from: closed,\n              active,\n              to: open,\n            },\n            'keep'\n          )\n      )\n    ).then(() => {\n      if (this.$options.autofocus && this.$refs.modal.querySelector(this.$options.autofocus)) {\n        saveActiveElement();\n        /** @type {HTMLElement} */\n        const autofocusElement = this.$refs.modal.querySelector(this.$options.autofocus);\n        autofocusElement.focus();\n      }\n      return Promise.resolve(this);\n    });\n  }\n\n  /**\n   * Close the modal.\n   *\n   * @this {ModalInterface}\n   * @return {Promise<ModalInterface>} The Modal instance.\n   */\n  async close() {\n    if (!this.isOpen) {\n      return Promise.resolve(this);\n    }\n\n    this.$refs.modal.setAttribute('aria-hidden', 'true');\n    document.documentElement.style.overflow = '';\n\n    this.isOpen = false;\n    untrap();\n    this.$emit('close');\n\n    /** @type {ModalRefs} */\n    const refs = this.$refs;\n\n    return Promise.all(\n      Object.entries(this.$options.styles).map(\n        ([refName, { open, active, closed } = { open: '', active: '', closed: '' }]) =>\n          transition(\n            refs[refName],\n            {\n              from: open,\n              active,\n              to: closed,\n            },\n            'keep'\n          )\n      )\n    ).then(() => Promise.resolve(this));\n  }\n}\n"],"file":"Modal.js"}

package/components/Tabs.d.ts

@@ -1,108 +0,0 @@
-/**
- * @typedef {import('../Base').BaseOptions} BaseOptions
- */
-/**
- * @typedef {Object} TabItem
- * @property {HTMLElement} btn
- * @property {HTMLElement} content
- * @property {Boolean} isEnabled
- */
-/**
- * @typedef {Object} TabsRefs
- * @property {HTMLElement[]} btn
- * @property {HTMLElement[]} content
- */
-/**
- * @typedef {import('../utils/css/styles.js').CssStyleObject} CssStyleObject
- * @typedef {Partial<Record<'open'|'active'|'closed', string|CssStyleObject>>} TabsStates
- * @typedef {Partial<Record<keyof TabsRefs, TabsStates>>} TabsStylesOption
- */
-/**
- * @typedef {Object} TabsOptions
- * @property {TabsStylesOption} styles
- */
-/**
- * @typedef {Object} TabsPrivateInterface
- * @property {TabsOptions} $options
- * @property {TabsRefs} $refs
- * @property {Array<TabItem>} items
- */
-/**
- * @typedef {Tabs & TabsPrivateInterface} TabsInterface
- */
-/**
- * Tabs class.
- */
-export default class Tabs extends Base {
-    /**
-     * Tabs config.
-     */
-    static config: {
-        name: string;
-        refs: string[];
-        options: {
-            styles: {
-                type: ObjectConstructor;
-                /**
-                 * @return {TabsStylesOption}
-                 */
-                default: () => TabsStylesOption;
-            };
-        };
-    };
-    /**
-     * Initialize the component's behaviours.
-     * @this {TabsInterface}
-     * @return {void}
-     */
-    mounted(): void;
-    items: any;
-    /**
-     * Switch tab on button click.
-     *
-     * @this {TabsInterface}
-     * @param  {Event}  event The click event object.
-     * @param  {Number} index The index of the clicked button.
-     * @return {void}
-     */
-    onBtnClick(event: Event, index: number): void;
-    /**
-     * Enable the given tab and its associated content.
-     *
-     * @this {TabsInterface}
-     * @param  {TabItem}                item The item to enable.
-     * @return {Promise<TabsInterface>}      Tabs instance.
-     */
-    enableItem(item: TabItem): Promise<TabsInterface>;
-    /**
-     * Disable the given tab and its associated content.
-     *
-     * @this {TabsInterface}
-     * @param  {TabItem}                item The item to disable.
-     * @return {Promise<TabsInterface>}      The Tabs instance.
-     */
-    disableItem(item: TabItem): Promise<TabsInterface>;
-}
-export type BaseOptions = import('../Base').BaseOptions;
-export type TabItem = {
-    btn: HTMLElement;
-    content: HTMLElement;
-    isEnabled: boolean;
-};
-export type TabsRefs = {
-    btn: HTMLElement[];
-    content: HTMLElement[];
-};
-export type CssStyleObject = import('../utils/css/styles.js').CssStyleObject;
-export type TabsStates = Partial<Record<'open' | 'active' | 'closed', string | CssStyleObject>>;
-export type TabsStylesOption = Partial<Record<keyof TabsRefs, TabsStates>>;
-export type TabsOptions = {
-    styles: TabsStylesOption;
-};
-export type TabsPrivateInterface = {
-    $options: TabsOptions;
-    $refs: TabsRefs;
-    items: Array<TabItem>;
-};
-export type TabsInterface = Tabs & TabsPrivateInterface;
-import Base from "../Base/index.js";

package/components/Tabs.js

@@ -1,195 +0,0 @@
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
-
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
-
-import Base from '../Base/index.js';
-import transition from '../utils/css/transition.js';
-
-var Tabs = function (_Base) {
-  _inherits(Tabs, _Base);
-
-  var _super = _createSuper(Tabs);
-
-  function Tabs() {
-    _classCallCheck(this, Tabs);
-
-    return _super.apply(this, arguments);
-  }
-
-  _createClass(Tabs, [{
-    key: "mounted",
-    value: function mounted() {
-      var _this = this;
-
-      this.items = this.$refs.btn.map(function (btn, index) {
-        var id = "".concat(_this.$id, "-").concat(index);
-        var content = _this.$refs.content[index];
-        btn.setAttribute('id', id);
-        content.setAttribute('aria-labelledby', id);
-        var item = {
-          btn: btn,
-          content: content,
-          isEnabled: index > 0
-        };
-
-        if (index > 0) {
-          _this.disableItem(item);
-        } else {
-          _this.enableItem(item);
-        }
-
-        return item;
-      });
-    }
-  }, {
-    key: "onBtnClick",
-    value: function onBtnClick(event, index) {
-      var _this2 = this;
-
-      this.items.forEach(function (item, i) {
-        if (i !== index) {
-          _this2.disableItem(item);
-        }
-      });
-      this.enableItem(this.items[index]);
-    }
-  }, {
-    key: "enableItem",
-    value: function () {
-      var _enableItem = _asyncToGenerator(_regeneratorRuntime.mark(function _callee(item) {
-        var _this3 = this;
-
-        var btn, content, btnStyles, contentStyles;
-        return _regeneratorRuntime.wrap(function _callee$(_context) {
-          while (1) {
-            switch (_context.prev = _context.next) {
-              case 0:
-                if (!(!item || item.isEnabled)) {
-                  _context.next = 2;
-                  break;
-                }
-
-                return _context.abrupt("return", Promise.resolve(this));
-
-              case 2:
-                item.isEnabled = true;
-                btn = item.btn, content = item.content;
-                btnStyles = this.$options.styles.btn || {};
-                contentStyles = this.$options.styles.content || {};
-                content.setAttribute('aria-hidden', 'false');
-                this.$emit('enable', item);
-                return _context.abrupt("return", Promise.all([transition(btn, {
-                  from: btnStyles.closed,
-                  active: btnStyles.active,
-                  to: btnStyles.open
-                }, 'keep'), transition(content, {
-                  from: contentStyles.closed,
-                  active: contentStyles.active,
-                  to: contentStyles.open
-                }, 'keep')]).then(function () {
-                  return Promise.resolve(_this3);
-                }));
-
-              case 9:
-              case "end":
-                return _context.stop();
-            }
-          }
-        }, _callee, this);
-      }));
-
-      function enableItem(_x) {
-        return _enableItem.apply(this, arguments);
-      }
-
-      return enableItem;
-    }()
-  }, {
-    key: "disableItem",
-    value: function () {
-      var _disableItem = _asyncToGenerator(_regeneratorRuntime.mark(function _callee2(item) {
-        var _this4 = this;
-
-        var btn, content, btnStyles, contentStyles;
-        return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-          while (1) {
-            switch (_context2.prev = _context2.next) {
-              case 0:
-                if (!(!item || !item.isEnabled)) {
-                  _context2.next = 2;
-                  break;
-                }
-
-                return _context2.abrupt("return", Promise.resolve(this));
-
-              case 2:
-                item.isEnabled = false;
-                btn = item.btn, content = item.content;
-                btnStyles = this.$options.styles.btn || {};
-                contentStyles = this.$options.styles.content || {};
-                content.setAttribute('aria-hidden', 'true');
-                this.$emit('disable', item);
-                return _context2.abrupt("return", Promise.all([transition(btn, {
-                  from: btnStyles.open,
-                  active: btnStyles.active,
-                  to: btnStyles.closed
-                }, 'keep'), transition(content, {
-                  from: contentStyles.open,
-                  active: contentStyles.active,
-                  to: contentStyles.closed
-                }, 'keep')]).then(function () {
-                  return Promise.resolve(_this4);
-                }));
-
-              case 9:
-              case "end":
-                return _context2.stop();
-            }
-          }
-        }, _callee2, this);
-      }));
-
-      function disableItem(_x2) {
-        return _disableItem.apply(this, arguments);
-      }
-
-      return disableItem;
-    }()
-  }]);
-
-  return Tabs;
-}(Base);
-
-_defineProperty(Tabs, "config", {
-  name: 'Tabs',
-  refs: ['btn[]', 'content[]'],
-  options: {
-    styles: {
-      type: Object,
-      default: function _default() {
-        return {
-          content: {
-            closed: {
-              position: 'absolute',
-              opacity: '0',
-              pointerEvents: 'none',
-              visibility: 'hidden'
-            }
-          }
-        };
-      }
-    }
-  }
-});
-
-export { Tabs as default };
-//# sourceMappingURL=Tabs.js.map

package/components/Tabs.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../packages/js-toolkit/components/Tabs.js"],"names":["Base","transition","Tabs","items","$refs","btn","map","index","id","$id","content","setAttribute","item","isEnabled","disableItem","enableItem","event","forEach","i","Promise","resolve","btnStyles","$options","styles","contentStyles","$emit","all","from","closed","active","to","open","then","name","refs","options","type","Object","default","position","opacity","pointerEvents","visibility"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,IAAP,MAAiB,kBAAjB;AACA,OAAOC,UAAP,MAAuB,4BAAvB;;IA4CqBC,I;;;;;;;;;;;;;WAgCnB,mBAAU;AAAA;;AACR,WAAKC,KAAL,GAAa,KAAKC,KAAL,CAAWC,GAAX,CAAeC,GAAf,CAAmB,UAACD,GAAD,EAAME,KAAN,EAAgB;AAC9C,YAAMC,EAAE,aAAM,KAAI,CAACC,GAAX,cAAkBF,KAAlB,CAAR;AACA,YAAMG,OAAO,GAAG,KAAI,CAACN,KAAL,CAAWM,OAAX,CAAmBH,KAAnB,CAAhB;AACAF,QAAAA,GAAG,CAACM,YAAJ,CAAiB,IAAjB,EAAuBH,EAAvB;AACAE,QAAAA,OAAO,CAACC,YAAR,CAAqB,iBAArB,EAAwCH,EAAxC;AAEA,YAAMI,IAAI,GAAG;AAAEP,UAAAA,GAAG,EAAHA,GAAF;AAAOK,UAAAA,OAAO,EAAPA,OAAP;AAAgBG,UAAAA,SAAS,EAAEN,KAAK,GAAG;AAAnC,SAAb;;AACA,YAAIA,KAAK,GAAG,CAAZ,EAAe;AACb,UAAA,KAAI,CAACO,WAAL,CAAiBF,IAAjB;AACD,SAFD,MAEO;AACL,UAAA,KAAI,CAACG,UAAL,CAAgBH,IAAhB;AACD;;AACD,eAAOA,IAAP;AACD,OAbY,CAAb;AAcD;;;WAUD,oBAAWI,KAAX,EAAkBT,KAAlB,EAAyB;AAAA;;AACvB,WAAKJ,KAAL,CAAWc,OAAX,CAAmB,UAACL,IAAD,EAAOM,CAAP,EAAa;AAC9B,YAAIA,CAAC,KAAKX,KAAV,EAAiB;AACf,UAAA,MAAI,CAACO,WAAL,CAAiBF,IAAjB;AACD;AACF,OAJD;AAMA,WAAKG,UAAL,CAAgB,KAAKZ,KAAL,CAAWI,KAAX,CAAhB;AACD;;;;mEASD,iBAAiBK,IAAjB;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBACM,CAACA,IAAD,IAASA,IAAI,CAACC,SADpB;AAAA;AAAA;AAAA;;AAAA,iDAEWM,OAAO,CAACC,OAAR,CAAgB,IAAhB,CAFX;;AAAA;AAKER,gBAAAA,IAAI,CAACC,SAAL,GAAiB,IAAjB;AACQR,gBAAAA,GANV,GAM2BO,IAN3B,CAMUP,GANV,EAMeK,OANf,GAM2BE,IAN3B,CAMeF,OANf;AAOQW,gBAAAA,SAPR,GAOoB,KAAKC,QAAL,CAAcC,MAAd,CAAqBlB,GAArB,IAA4B,EAPhD;AAQQmB,gBAAAA,aARR,GAQwB,KAAKF,QAAL,CAAcC,MAAd,CAAqBb,OAArB,IAAgC,EARxD;AAUEA,gBAAAA,OAAO,CAACC,YAAR,CAAqB,aAArB,EAAoC,OAApC;AACA,qBAAKc,KAAL,CAAW,QAAX,EAAqBb,IAArB;AAXF,iDAaSO,OAAO,CAACO,GAAR,CAAY,CACjBzB,UAAU,CACRI,GADQ,EAER;AACEsB,kBAAAA,IAAI,EAAEN,SAAS,CAACO,MADlB;AAEEC,kBAAAA,MAAM,EAAER,SAAS,CAACQ,MAFpB;AAGEC,kBAAAA,EAAE,EAAET,SAAS,CAACU;AAHhB,iBAFQ,EAOR,MAPQ,CADO,EAUjB9B,UAAU,CACRS,OADQ,EAER;AACEiB,kBAAAA,IAAI,EAAEH,aAAa,CAACI,MADtB;AAEEC,kBAAAA,MAAM,EAAEL,aAAa,CAACK,MAFxB;AAGEC,kBAAAA,EAAE,EAAEN,aAAa,CAACO;AAHpB,iBAFQ,EAOR,MAPQ,CAVO,CAAZ,EAmBJC,IAnBI,CAmBC;AAAA,yBAAMb,OAAO,CAACC,OAAR,CAAgB,MAAhB,CAAN;AAAA,iBAnBD,CAbT;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,O;;;;;;;;;;;oEA0CA,kBAAkBR,IAAlB;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBACM,CAACA,IAAD,IAAS,CAACA,IAAI,CAACC,SADrB;AAAA;AAAA;AAAA;;AAAA,kDAEWM,OAAO,CAACC,OAAR,CAAgB,IAAhB,CAFX;;AAAA;AAKER,gBAAAA,IAAI,CAACC,SAAL,GAAiB,KAAjB;AACQR,gBAAAA,GANV,GAM2BO,IAN3B,CAMUP,GANV,EAMeK,OANf,GAM2BE,IAN3B,CAMeF,OANf;AAOQW,gBAAAA,SAPR,GAOoB,KAAKC,QAAL,CAAcC,MAAd,CAAqBlB,GAArB,IAA4B,EAPhD;AAQQmB,gBAAAA,aARR,GAQwB,KAAKF,QAAL,CAAcC,MAAd,CAAqBb,OAArB,IAAgC,EARxD;AAUEA,gBAAAA,OAAO,CAACC,YAAR,CAAqB,aAArB,EAAoC,MAApC;AACA,qBAAKc,KAAL,CAAW,SAAX,EAAsBb,IAAtB;AAXF,kDAaSO,OAAO,CAACO,GAAR,CAAY,CACjBzB,UAAU,CACRI,GADQ,EAER;AACEsB,kBAAAA,IAAI,EAAEN,SAAS,CAACU,IADlB;AAEEF,kBAAAA,MAAM,EAAER,SAAS,CAACQ,MAFpB;AAGEC,kBAAAA,EAAE,EAAET,SAAS,CAACO;AAHhB,iBAFQ,EAOR,MAPQ,CADO,EAUjB3B,UAAU,CACRS,OADQ,EAER;AACEiB,kBAAAA,IAAI,EAAEH,aAAa,CAACO,IADtB;AAEEF,kBAAAA,MAAM,EAAEL,aAAa,CAACK,MAFxB;AAGEC,kBAAAA,EAAE,EAAEN,aAAa,CAACI;AAHpB,iBAFQ,EAOR,MAPQ,CAVO,CAAZ,EAmBJI,IAnBI,CAmBC;AAAA,yBAAMb,OAAO,CAACC,OAAR,CAAgB,MAAhB,CAAN;AAAA,iBAnBD,CAbT;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,O;;;;;;;;;;;EApHgCpB,I;;gBAAbE,I,YAIH;AACd+B,EAAAA,IAAI,EAAE,MADQ;AAEdC,EAAAA,IAAI,EAAE,CAAC,OAAD,EAAU,WAAV,CAFQ;AAGdC,EAAAA,OAAO,EAAE;AACPZ,IAAAA,MAAM,EAAE;AACNa,MAAAA,IAAI,EAAEC,MADA;AAKNC,MAAAA,OAAO,EAAE;AAAA,eAAO;AACd5B,UAAAA,OAAO,EAAE;AACPkB,YAAAA,MAAM,EAAE;AACNW,cAAAA,QAAQ,EAAE,UADJ;AAENC,cAAAA,OAAO,EAAE,GAFH;AAGNC,cAAAA,aAAa,EAAE,MAHT;AAINC,cAAAA,UAAU,EAAE;AAJN;AADD;AADK,SAAP;AAAA;AALH;AADD;AAHK,C;;SAJGxC,I","sourcesContent":["import Base from '../Base/index.js';\nimport transition from '../utils/css/transition.js';\n\n/**\n * @typedef {import('../Base').BaseOptions} BaseOptions\n */\n\n/**\n * @typedef {Object} TabItem\n * @property {HTMLElement} btn\n * @property {HTMLElement} content\n * @property {Boolean} isEnabled\n */\n\n/**\n * @typedef {Object} TabsRefs\n * @property {HTMLElement[]} btn\n * @property {HTMLElement[]} content\n */\n\n/**\n * @typedef {import('../utils/css/styles.js').CssStyleObject} CssStyleObject\n * @typedef {Partial<Record<'open'|'active'|'closed', string|CssStyleObject>>} TabsStates\n * @typedef {Partial<Record<keyof TabsRefs, TabsStates>>} TabsStylesOption\n */\n\n/**\n * @typedef {Object} TabsOptions\n * @property {TabsStylesOption} styles\n */\n\n/**\n * @typedef {Object} TabsPrivateInterface\n * @property {TabsOptions} $options\n * @property {TabsRefs} $refs\n * @property {Array<TabItem>} items\n */\n\n/**\n * @typedef {Tabs & TabsPrivateInterface} TabsInterface\n */\n\n/**\n * Tabs class.\n */\nexport default class Tabs extends Base {\n  /**\n   * Tabs config.\n   */\n  static config = {\n    name: 'Tabs',\n    refs: ['btn[]', 'content[]'],\n    options: {\n      styles: {\n        type: Object,\n        /**\n         * @return {TabsStylesOption}\n         */\n        default: () => ({\n          content: {\n            closed: {\n              position: 'absolute',\n              opacity: '0',\n              pointerEvents: 'none',\n              visibility: 'hidden',\n            },\n          },\n        }),\n      },\n    },\n  };\n\n  /**\n   * Initialize the component's behaviours.\n   * @this {TabsInterface}\n   * @return {void}\n   */\n  mounted() {\n    this.items = this.$refs.btn.map((btn, index) => {\n      const id = `${this.$id}-${index}`;\n      const content = this.$refs.content[index];\n      btn.setAttribute('id', id);\n      content.setAttribute('aria-labelledby', id);\n\n      const item = { btn, content, isEnabled: index > 0 };\n      if (index > 0) {\n        this.disableItem(item);\n      } else {\n        this.enableItem(item);\n      }\n      return item;\n    });\n  }\n\n  /**\n   * Switch tab on button click.\n   *\n   * @this {TabsInterface}\n   * @param  {Event}  event The click event object.\n   * @param  {Number} index The index of the clicked button.\n   * @return {void}\n   */\n  onBtnClick(event, index) {\n    this.items.forEach((item, i) => {\n      if (i !== index) {\n        this.disableItem(item);\n      }\n    });\n\n    this.enableItem(this.items[index]);\n  }\n\n  /**\n   * Enable the given tab and its associated content.\n   *\n   * @this {TabsInterface}\n   * @param  {TabItem}                item The item to enable.\n   * @return {Promise<TabsInterface>}      Tabs instance.\n   */\n  async enableItem(item) {\n    if (!item || item.isEnabled) {\n      return Promise.resolve(this);\n    }\n\n    item.isEnabled = true;\n    const { btn, content } = item;\n    const btnStyles = this.$options.styles.btn || {};\n    const contentStyles = this.$options.styles.content || {};\n\n    content.setAttribute('aria-hidden', 'false');\n    this.$emit('enable', item);\n\n    return Promise.all([\n      transition(\n        btn,\n        {\n          from: btnStyles.closed,\n          active: btnStyles.active,\n          to: btnStyles.open,\n        },\n        'keep'\n      ),\n      transition(\n        content,\n        {\n          from: contentStyles.closed,\n          active: contentStyles.active,\n          to: contentStyles.open,\n        },\n        'keep'\n      ),\n    ]).then(() => Promise.resolve(this));\n  }\n\n  /**\n   * Disable the given tab and its associated content.\n   *\n   * @this {TabsInterface}\n   * @param  {TabItem}                item The item to disable.\n   * @return {Promise<TabsInterface>}      The Tabs instance.\n   */\n  async disableItem(item) {\n    if (!item || !item.isEnabled) {\n      return Promise.resolve(this);\n    }\n\n    item.isEnabled = false;\n    const { btn, content } = item;\n    const btnStyles = this.$options.styles.btn || {};\n    const contentStyles = this.$options.styles.content || {};\n\n    content.setAttribute('aria-hidden', 'true');\n    this.$emit('disable', item);\n\n    return Promise.all([\n      transition(\n        btn,\n        {\n          from: btnStyles.open,\n          active: btnStyles.active,\n          to: btnStyles.closed,\n        },\n        'keep'\n      ),\n      transition(\n        content,\n        {\n          from: contentStyles.open,\n          active: contentStyles.active,\n          to: contentStyles.closed,\n        },\n        'keep'\n      ),\n    ]).then(() => Promise.resolve(this));\n  }\n}\n"],"file":"Tabs.js"}

package/components/index.d.ts

@@ -1,6 +0,0 @@
-import Accordion from "./Accordion/index.js";
-import Cursor from "./Cursor.js";
-import Draggable from "./Draggable.js";
-import Modal from "./Modal.js";
-import Tabs from "./Tabs.js";
-export { Accordion, Cursor, Draggable, Modal, Tabs };

package/components/index.js

@@ -1,7 +0,0 @@
-import Accordion from './Accordion/index.js';
-import Cursor from './Cursor.js';
-import Draggable from './Draggable.js';
-import Modal from './Modal.js';
-import Tabs from './Tabs.js';
-export { Accordion, Cursor, Draggable, Modal, Tabs };
-//# sourceMappingURL=index.js.map

package/components/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../packages/js-toolkit/components/index.js"],"names":["Accordion","Cursor","Draggable","Modal","Tabs"],"mappings":"AAAA,OAAOA,SAAP,MAAsB,sBAAtB;AACA,OAAOC,MAAP,MAAmB,aAAnB;AACA,OAAOC,SAAP,MAAsB,gBAAtB;AACA,OAAOC,KAAP,MAAkB,YAAlB;AACA,OAAOC,IAAP,MAAiB,WAAjB;AAEA,SAASJ,SAAT,EAAoBC,MAApB,EAA4BC,SAA5B,EAAuCC,KAAvC,EAA8CC,IAA9C","sourcesContent":["import Accordion from './Accordion/index.js';\nimport Cursor from './Cursor.js';\nimport Draggable from './Draggable.js';\nimport Modal from './Modal.js';\nimport Tabs from './Tabs.js';\n\nexport { Accordion, Cursor, Draggable, Modal, Tabs };\n"],"file":"index.js"}

package/decorators/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../packages/js-toolkit/decorators/index.js"],"names":["withBreakpointManager","withBreakpointObserver","withDrag","withExtraConfig","withIntersectionObserver","withMountWhenInView"],"mappings":"AAAA,OAAOA,qBAAP,MAAkC,4BAAlC;AACA,OAAOC,sBAAP,MAAmC,6BAAnC;AACA,OAAOC,QAAP,MAAqB,eAArB;AACA,OAAOC,eAAP,MAA4B,sBAA5B;AACA,OAAOC,wBAAP,MAAqC,+BAArC;AACA,OAAOC,mBAAP,MAAgC,0BAAhC;AAEA,SACEL,qBADF,EAEEC,sBAFF,EAGEC,QAHF,EAIEC,eAJF,EAKEC,wBALF,EAMEC,mBANF","sourcesContent":["import withBreakpointManager from './withBreakpointManager.js';\nimport withBreakpointObserver from './withBreakpointObserver.js';\nimport withDrag from './withDrag.js';\nimport withExtraConfig from './withExtraConfig.js';\nimport withIntersectionObserver from './withIntersectionObserver.js';\nimport withMountWhenInView from './withMountWhenInView.js';\n\nexport {\n  withBreakpointManager,\n  withBreakpointObserver,\n  withDrag,\n  withExtraConfig,\n  withIntersectionObserver,\n  withMountWhenInView,\n};\n"],"file":"index.js"}

package/decorators/withBreakpointManager.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../packages/js-toolkit/decorators/withBreakpointManager.js"],"names":["useResize","testBreakpoints","breakpoints","props","breakpoint","forEach","breakpointKeys","instance","includes","$isMounted","setTimeout","$mount","$destroy","mountComponents","map","bk","ComponentClass","child","$el","Object","defineProperty","get","$parent","instances","WeakMap","withBreakpointManager","BaseClass","Array","isArray","Error","length","add","element","has","set","$id"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,SAAP,MAAsB,uBAAtB;;AAYA,SAASC,eAAT,CAAyBC,WAAzB,EAAsC;AACpC,yBAAuBF,SAAS,GAAGG,KAAZ,EAAvB;AAAA,MAAQC,UAAR,oBAAQA,UAAR;;AACAF,EAAAA,WAAW,CAACG,OAAZ,CAAoB,gBAAgC;AAAA;AAAA,QAA9BC,cAA8B;AAAA,QAAdC,QAAc;;AAClD,QAAID,cAAc,CAACE,QAAf,CAAwBJ,UAAxB,KAAuC,CAACG,QAAQ,CAACE,UAArD,EAAiE;AAC/DC,MAAAA,UAAU,CAAC;AAAA,eAAMH,QAAQ,CAACI,MAAT,EAAN;AAAA,OAAD,EAA0B,CAA1B,CAAV;AACD,KAFD,MAEO,IAAI,CAACL,cAAc,CAACE,QAAf,CAAwBJ,UAAxB,CAAD,IAAwCG,QAAQ,CAACE,UAArD,EAAiE;AACtEF,MAAAA,QAAQ,CAACK,QAAT;AACD;AACF,GAND;AAOD;;AAQD,SAASC,eAAT,CAAyBN,QAAzB,EAAmCL,WAAnC,EAAgD;AAC9C,SAAOA,WAAW,CAACY,GAAZ,CAAgB,iBAA0B;AAAA;AAAA,QAAxBC,EAAwB;AAAA,QAApBC,cAAoB;;AAC/C,QAAMC,KAAK,GAAG,IAAID,cAAJ,CAAmBT,QAAQ,CAACW,GAA5B,CAAd;AACAC,IAAAA,MAAM,CAACC,cAAP,CAAsBH,KAAtB,EAA6B,SAA7B,EAAwC;AAAEI,MAAAA,GAAG,EAAE;AAAA,eAAMd,QAAQ,CAACe,OAAf;AAAA;AAAP,KAAxC;AACA,WAAO,CAACP,EAAD,EAAKE,KAAL,CAAP;AACD,GAJM,CAAP;AAKD;;AAMD,IAAMM,SAAS,GAAG,IAAIC,OAAJ,EAAlB;AASA,eAAe,SAASC,qBAAT,CAA+BC,SAA/B,EAA0CxB,WAA1C,EAAuD;AACpE,MAAI,CAACyB,KAAK,CAACC,OAAN,CAAc1B,WAAd,CAAL,EAAiC;AAC/B,UAAM,IAAI2B,KAAJ,CAAU,uEAAV,CAAN;AACD;;AAED,MAAI3B,WAAW,CAAC4B,MAAZ,GAAqB,CAAzB,EAA4B;AAC1B,UAAM,IAAID,KAAJ,CAAU,iEAAV,CAAN;AACD;;AAED,mBAAuB7B,SAAS,EAAhC;AAAA,MAAQ+B,GAAR,cAAQA,GAAR;AAAA,MAAa5B,KAAb,cAAaA,KAAb;;AAIA,MAAI,CAACA,KAAK,GAAGC,UAAb,EAAyB;AACvB,UAAM,IAAIyB,KAAJ,qEAAN;AACD;;AAGD;AAAA;;AAAA;;AAKE,oBAAYG,OAAZ,EAAqB;AAAA;;AAAA;;AACnB,gCAAMA,OAAN;;AAEA,UAAI,CAACT,SAAS,CAACU,GAAV,+BAAL,EAA0B;AACxBV,QAAAA,SAAS,CAACW,GAAV,gCAAoBrB,eAAe,gCAAOX,WAAP,CAAnC;AACD;;AAED6B,MAAAA,GAAG,6BAAsB,MAAKI,GAA3B,GAAkC,YAAM;AACzClC,QAAAA,eAAe,CAACsB,SAAS,CAACF,GAAV,+BAAD,CAAf;AACD,OAFE,CAAH;AAIA,YAAKE,SAAL,GAAiBA,SAAS,CAACF,GAAV,+BAAjB;AAEA;AACD;;AAnBH;AAAA;AAAA,aA2BE,kBAAS;AACP;;AAEApB,QAAAA,eAAe,CAACsB,SAAS,CAACF,GAAV,CAAc,IAAd,CAAD,CAAf;AAEA,eAAO,IAAP;AACD;AAjCH;AAAA;AAAA,aAwCE,oBAAW;AACT,YAAIM,KAAK,CAACC,OAAN,CAAcL,SAAS,CAACF,GAAV,CAAc,IAAd,CAAd,CAAJ,EAAwC;AACtCE,UAAAA,SAAS,CAACF,GAAV,CAAc,IAAd,EAAoBhB,OAApB,CAA4B,iBAAkB;AAAA;AAAA,gBAAdE,QAAc;;AAC5CA,YAAAA,QAAQ,CAACK,QAAT;AACD,WAFD;AAGD;;AAED;AACD;AAhDH;;AAAA;AAAA,IAAqBc,SAArB;AAkDD","sourcesContent":["import useResize from '../services/resize.js';\n\n/**\n * @typedef {import('../Base').default} Base\n * @typedef {import('../Base').BaseComponent} BaseComponent\n */\n\n/**\n * Test the breakpoins of the given Base instance and return the hook to call.\n *\n * @param  {Array<[String[], Base]>} breakpoints The breakpoints's data.\n */\nfunction testBreakpoints(breakpoints) {\n  const { breakpoint } = useResize().props();\n  breakpoints.forEach(([breakpointKeys, instance]) => {\n    if (breakpointKeys.includes(breakpoint) && !instance.$isMounted) {\n      setTimeout(() => instance.$mount(), 0);\n    } else if (!breakpointKeys.includes(breakpoint) && instance.$isMounted) {\n      instance.$destroy();\n    }\n  });\n}\n\n/**\n * Prepare the components.\n * @param {Base} instance\n * @param {Array<[String, BaseComponent]>} breakpoints\n * @return {Array<[String, Base]>}\n */\nfunction mountComponents(instance, breakpoints) {\n  return breakpoints.map(([bk, ComponentClass]) => {\n    const child = new ComponentClass(instance.$el);\n    Object.defineProperty(child, '$parent', { get: () => instance.$parent });\n    return [bk, child];\n  });\n}\n\n/**\n * A cache object to hold each Base sub-instances.\n * @type {Object}\n */\nconst instances = new WeakMap();\n\n/**\n * BreakpointManager class.\n * @template {BaseComponent} T\n * @param {T} BaseClass\n * @param {Array<[String, BaseComponent]>} breakpoints\n * @return {T}\n */\nexport default function withBreakpointManager(BaseClass, breakpoints) {\n  if (!Array.isArray(breakpoints)) {\n    throw new Error('[withBreakpointManager] The `breakpoints` parameter must be an array.');\n  }\n\n  if (breakpoints.length < 2) {\n    throw new Error('[withBreakpointManager] You must define at least 2 breakpoints.');\n  }\n\n  const { add, props } = useResize();\n\n  // Do nothing if no breakpoint has been defined.\n  // @see https://js-toolkit.meta.fr/services/resize.html#breakpoint\n  if (!props().breakpoint) {\n    throw new Error(`The \\`BreakpointManager\\` class requires breakpoints to be defined.`);\n  }\n\n  // @ts-ignore\n  return class extends BaseClass {\n    /**\n     * Watch for the document resize to test the breakpoints.\n     * @param {HTMLElement} element The component's root element.\n     */\n    constructor(element) {\n      super(element);\n\n      if (!instances.has(this)) {\n        instances.set(this, mountComponents(this, breakpoints));\n      }\n\n      add(`BreakpointManager-${this.$id}`, () => {\n        testBreakpoints(instances.get(this));\n      });\n\n      this.instances = instances.get(this);\n\n      return this;\n    }\n\n    /**\n     * Override the default $mount method to prevent component's from being\n     * mounted when they should not.\n     *\n     * @return {this}\n     */\n    $mount() {\n      super.$mount();\n\n      testBreakpoints(instances.get(this));\n\n      return this;\n    }\n\n    /**\n     * Destroy all instances when the main one is destroyed.\n     *\n     * @return {this}\n     */\n    $destroy() {\n      if (Array.isArray(instances.get(this))) {\n        instances.get(this).forEach(([, instance]) => {\n          instance.$destroy();\n        });\n      }\n\n      return super.$destroy();\n    }\n  };\n}\n"],"file":"withBreakpointManager.js"}