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

package/index.umd.js

@@ -1,3586 +1 @@
-(function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
-  typeof define === 'function' && define.amd ? define(['exports'], factory) :
-  (global = global || self, factory(global.Base = {}));
-}(this, (function (exports) {
-  function _defineProperties(target, props) {
-    for (var i = 0; i < props.length; i++) {
-      var descriptor = props[i];
-      descriptor.enumerable = descriptor.enumerable || false;
-      descriptor.configurable = true;
-      if ("value" in descriptor) descriptor.writable = true;
-      Object.defineProperty(target, descriptor.key, descriptor);
-    }
-  }
-
-  function _createClass(Constructor, protoProps, staticProps) {
-    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-    if (staticProps) _defineProperties(Constructor, staticProps);
-    return Constructor;
-  }
-
-  function _extends() {
-    _extends = Object.assign || 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 _inheritsLoose(subClass, superClass) {
-    subClass.prototype = Object.create(superClass.prototype);
-    subClass.prototype.constructor = subClass;
-
-    _setPrototypeOf(subClass, superClass);
-  }
-
-  function _setPrototypeOf(o, p) {
-    _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) {
-      o.__proto__ = p;
-      return o;
-    };
-
-    return _setPrototypeOf(o, p);
-  }
-
-  function _objectWithoutPropertiesLoose(source, excluded) {
-    if (source == null) return {};
-    var target = {};
-    var sourceKeys = Object.keys(source);
-    var key, i;
-
-    for (i = 0; i < sourceKeys.length; i++) {
-      key = sourceKeys[i];
-      if (excluded.indexOf(key) >= 0) continue;
-      target[key] = source[key];
-    }
-
-    return target;
-  }
-
-  function _assertThisInitialized(self) {
-    if (self === void 0) {
-      throw new ReferenceError("this hasn't been initialised - super() hasn't been called");
-    }
-
-    return self;
-  }
-
-  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 _createForOfIteratorHelperLoose(o, allowArrayLike) {
-    var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
-    if (it) return (it = it.call(o)).next.bind(it);
-
-    if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
-      if (it) o = it;
-      var i = 0;
-      return function () {
-        if (i >= o.length) return {
-          done: true
-        };
-        return {
-          done: false,
-          value: o[i++]
-        };
-      };
-    }
-
-    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 id$1 = 0;
-
-  function _classPrivateFieldLooseKey(name) {
-    return "__private_" + id$1++ + "_" + name;
-  }
-
-  function _classPrivateFieldLooseBase(receiver, privateKey) {
-    if (!Object.prototype.hasOwnProperty.call(receiver, privateKey)) {
-      throw new TypeError("attempted to use private field on non-instance");
-    }
-
-    return receiver;
-  }
-
-  /**
-   * Gets all non-builtin properties up the prototype chain.
-   *
-   * @param  {Object} object The object to get the propeties from.
-   * @param  {Array=} [props=[]] The already existing properties.
-   * @return {Array<[String, Object]>} An array of properties and the prototype they belong to.
-   */
-  function getAllProperties(object, props) {
-    if (props === void 0) {
-      props = [];
-    }
-
-    var proto = Object.getPrototypeOf(object);
-
-    if (proto === Object.prototype) {
-      return props;
-    }
-
-    return getAllProperties(proto, Object.getOwnPropertyNames(proto).map(function (name) {
-      return [name, proto];
-    }).reduce(function (acc, val) {
-      return [].concat(acc, [val]);
-    }, props));
-  }
-
-  /**
-   * Auto-bind methods to an instance.
-   *
-   * @param  {Object}               instance          The instance.
-   * @param  {Object}               options           Define specific methods to include or exlude.
-   * @param  {Array<String|RegExp>} [options.include] Methods to include.
-   * @param  {Array<String|RegExp>} [options.exclude] Methods to exclude.
-   * @return {Object}                                 The instance.
-   */
-
-  function autoBind(instance, options) {
-    var _ref = options || {},
-        exclude = _ref.exclude,
-        include = _ref.include;
-
-    var filter = function filter(key) {
-      var match = function match(pattern) {
-        return typeof pattern === 'string' ? key === pattern : pattern.test(key);
-      };
-
-      if (include) {
-        return include.some(match);
-      }
-
-      if (exclude) {
-        return !exclude.some(match);
-      }
-
-      return true;
-    };
-
-    getAllProperties(instance).filter(function (_ref2) {
-      var key = _ref2[0];
-      return key !== 'constructor' && filter(key);
-    }).forEach(function (_ref3) {
-      var key = _ref3[0],
-          object = _ref3[1];
-      var descriptor = Object.getOwnPropertyDescriptor(object, key);
-
-      if (descriptor && typeof descriptor.value === 'function') {
-        instance[key] = instance[key].bind(instance);
-      }
-    });
-    return instance;
-  }
-
-  /* eslint no-underscore-dangle: ["error", { "allow": ["_events"] }] */
-
-  /**
-   * Event management class.
-   */
-  var EventManager = /*#__PURE__*/function () {
-    function EventManager() {
-      this._events = {};
-    }
-
-    var _proto = EventManager.prototype;
-
-    /**
-     * Bind a listener function to an event.
-     *
-     * @param  {String}   event    Name of the event.
-     * @param  {Function} listener Function to be called.
-     * @return {Function}          A function to unbind the listener.
-     */
-    _proto.$on = function $on(event, listener) {
-      var _this = this;
-
-      if (!Array.isArray(this._events[event])) {
-        this._events[event] = [];
-      }
-
-      this._events[event].push(listener);
-
-      return function () {
-        _this.$off(event, listener);
-      };
-    }
-    /**
-     * Unbind a listener function from an event.
-     *
-     * @param  {String}       event    Name of the event.
-     * @param  {Function}     listener Function to be removed.
-     * @return {EventManager}          The current instance.
-     */
-    ;
-
-    _proto.$off = function $off(event, listener) {
-      // If no event specified, we remove them all.
-      if (!event) {
-        this._events = {};
-        return this;
-      } // If no listener have been specified, we remove all
-      // the listeners for the given event.
-
-
-      if (!listener) {
-        this._events[event] = [];
-        return this;
-      }
-
-      var index = this._events[event].indexOf(listener);
-
-      if (index > -1) {
-        this._events[event].splice(index, 1);
-      }
-
-      return this;
-    }
-    /**
-     * Emits an event.
-     *
-     * @param  {String}       event Name of the event.
-     * @param  {Array}        args  The arguments to apply to the functions bound to this event.
-     * @return {EventManager}       The current instance.
-     */
-    ;
-
-    _proto.$emit = function $emit(event) {
-      var _arguments = arguments,
-          _this2 = this;
-
-      if (!Array.isArray(this._events[event])) {
-        return this;
-      }
-
-      this._events[event].forEach(function (listener) {
-        listener.apply(_this2, [].slice.call(_arguments, 1));
-      });
-
-      return this;
-    }
-    /**
-     * Bind a listener function to an event for one execution only.
-     *
-     * @param  {String}       event    Name of the event.
-     * @param  {Function}     listener Function to be called.
-     * @return {EventManager}          The current instance.
-     */
-    ;
-
-    _proto.$once = function $once(event, listener) {
-      var instance = this;
-      this.$on(event,
-      /**
-       * @param {...any} args
-       */
-      function handler() {
-        instance.$off(event, handler);
-        listener.apply(instance, [].slice.call(arguments));
-      });
-      return this;
-    };
-
-    return EventManager;
-  }();
-
-  /**
-   * @typedef {import('./index.js').default} Base
-   * @typedef {import('./index.js').BaseConfig} BaseConfig
-   */
-
-  /**
-   * Get the config from a Base instance, either the new static one or the old getter one.
-   *
-   * @param  {Base}       instance The instance to get the config from.
-   * @return {BaseConfig}         A Base class configuration object.
-   */
-  function getConfig(instance) {
-    // @ts-ignore
-    var config = instance.constructor.config || instance.config;
-
-    if (!config) {
-      throw new Error('The `config` property must be defined.');
-    }
-
-    if (!config.name) {
-      throw new Error('The `config.name` property is required.');
-    } // @ts-ignore
-
-
-    if (instance.config && !instance.constructor.config) {
-      console.warn("[" + config.name + "]", 'Defining the `config` as a getter is deprecated, replace it with a static property.');
-    }
-
-    return config;
-  }
-  /**
-   * Display a console warning for the given instance.
-   *
-   * @param {Base}      instance A Base instance.
-   * @param {...String} msg   Values to display in the console.
-   */
-
-  function warn(instance) {
-    var _console;
-
-    var _getConfig = getConfig(instance),
-        name = _getConfig.name;
-
-    (_console = console).warn.apply(_console, ["[" + name + "]"].concat([].slice.call(arguments, 1)));
-  }
-  /**
-   * Display a console log for the given instance.
-   *
-   * @param {Base}   instance The instance to log information from.
-   * @param {...any} msg      The data to print to the console.
-   */
-
-  function log(instance) {
-    var _console2;
-
-    var _getConfig2 = getConfig(instance),
-        name = _getConfig2.name;
-
-    (_console2 = console).log.apply(_console2, ["[" + name + "]"].concat([].slice.call(arguments, 1)));
-  }
-  /**
-   * Verbose debug for the component.
-   *
-   * @param {Base}   instance The instance to debug.
-   * @param {...any} args     The data to print.
-   */
-
-  function debug(instance) {
-    if (instance.$options.debug) {
-      log.apply(void 0, [instance, '[debug]'].concat([].slice.call(arguments, 1)));
-    }
-  }
-  /**
-   * Test if an object has a method.
-   *
-   * @param  {Object}  obj  The object to test
-   * @param  {String}  name The method's name
-   * @return {Boolean}
-   */
-
-  function hasMethod(obj, name) {
-    return typeof obj[name] === 'function';
-  }
-  /**
-   * Call the given method while applying the given arguments.
-   *
-   * @param {Base}   instance The Base instance on which to trigger the method.
-   * @param {String} method   The method to call.
-   * @param {...any} args     The arguments to pass to the method.
-   */
-
-  function callMethod(instance, method) {
-    var _instance$method;
-
-    var args = [].slice.call(arguments, 2);
-
-    if (__DEV__) {
-      debug.apply(void 0, [instance, 'callMethod', method].concat(args));
-    } // Prevent duplicate call of `mounted` and `destroyed`
-    // methods based on the component status
-
-
-    if (method === 'destroyed' && !instance.$isMounted || method === 'mounted' && instance.$isMounted) {
-      if (__DEV__) {
-        debug(instance, 'not', method, 'because the method has already been triggered once.');
-      }
-
-      return instance;
-    }
-
-    instance.$emit.apply(instance, [method].concat(args)); // We always emit an event, but we do not call the method if it does not exist
-
-    if (!hasMethod(instance, method)) {
-      return instance;
-    }
-
-    (_instance$method = instance[method]).call.apply(_instance$method, [instance].concat(args));
-
-    if (__DEV__) {
-      debug.apply(void 0, [instance, method, instance].concat(args));
-    }
-
-    return instance;
-  }
-  /**
-   * Get a list of elements based on the name of a component.
-   *
-   * @param {String} nameOrSelector
-   *   The name or selector to used for this component.
-   * @param {HTMLElement|Document} element
-   *   The root element on which to query the selector, defaults to `document`.
-   * @return {Array<HTMLElement>}
-   *   A list of elements on which the component should be mounted.
-   */
-
-  function getComponentElements(nameOrSelector, element) {
-    if (element === void 0) {
-      element = document;
-    }
-
-    var selector = "[data-component=\"" + nameOrSelector + "\"]";
-    var elements = [];
-
-    try {
-      elements = Array.from(element.querySelectorAll(selector)); // eslint-disable-next-line no-empty
-    } catch (_unused) {} // If no child component found with the default selector, try a classic DOM selector
-
-
-    if (elements.length === 0) {
-      elements = Array.from(element.querySelectorAll(nameOrSelector));
-    }
-
-    return elements;
-  }
-
-  /**
-   * @typedef {import('./index.js').default} Base
-   * @typedef {import('./index.js').BaseComponent} BaseComponent
-   * @typedef {import('./index.js').BaseAsyncComponent} BaseAsyncComponent
-   * @typedef {import('./index.js').BaseConfigComponents} BaseConfigComponents
-   */
-
-  /**
-   * Get a child component.
-   *
-   * @param {HTMLElement & { __base__?: Base | 'terminated' }} el
-   *   The root element of the child component.
-   * @param {BaseComponent|BaseAsyncComponent} ComponentClass
-   *   A Base class or a Promise for async components.
-   * @param {Base} parent
-   *   The parent component instance.
-   * @return {Base|Promise|'terminated'}
-   *   A Base instance or a Promise resolving to a Base instance.
-   */
-
-  function getChild(el, ComponentClass, parent) {
-    // Return existing instance if it exists
-    if (el.__base__) {
-      return el.__base__;
-    } // Return a new instance if the component class is a child of the Base class
-
-
-    if ('$isBase' in ComponentClass) {
-      var child = new ComponentClass(el);
-      Object.defineProperty(child, '$parent', {
-        get: function get() {
-          return parent;
-        }
-      });
-      return child;
-    } // Resolve async components
-
-
-    return ComponentClass(parent).then(function (module) {
-      var _module$default;
-
-      // @ts-ignore
-      return getChild(el, (_module$default = module.default) != null ? _module$default : module, parent);
-    });
-  }
-  /**
-   * Get child components.
-   * @param  {Base}                 instance   The component's instance.
-   * @param  {HTMLElement}          element    The component's root element
-   * @param  {BaseConfigComponents} components The children components' classes
-   * @return {null|Object}                     Returns `null` if no child components are defined or an object of all child component instances
-   */
-
-
-  function getChildren(instance, element, components) {
-    if (__DEV__) {
-      debug(instance, 'before:getChildren', element, components);
-    }
-
-    var children = Object.entries(components).reduce(function (acc, _ref) {
-      var name = _ref[0],
-          ComponentClass = _ref[1];
-      Object.defineProperty(acc, name, {
-        get: function get() {
-          var elements = getComponentElements(name, element);
-
-          if (elements.length === 0) {
-            return [];
-          }
-
-          return elements.map(function (el) {
-            return getChild(el, ComponentClass, instance);
-          }) // Filter out terminated children
-          // @ts-ignore
-          .filter(function (el) {
-            return el !== 'terminated';
-          });
-        },
-        enumerable: true,
-        configurable: true
-      });
-      return acc;
-    }, {});
-    instance.$emit('get:children', children);
-
-    if (__DEV__) {
-      debug(instance, 'after:getChildren', children);
-    }
-
-    return children;
-  }
-
-  var isMergeableObject = function isMergeableObject(value) {
-  	return isNonNullObject(value)
-  		&& !isSpecial(value)
-  };
-
-  function isNonNullObject(value) {
-  	return !!value && typeof value === 'object'
-  }
-
-  function isSpecial(value) {
-  	var stringValue = Object.prototype.toString.call(value);
-
-  	return stringValue === '[object RegExp]'
-  		|| stringValue === '[object Date]'
-  		|| isReactElement(value)
-  }
-
-  // see https://github.com/facebook/react/blob/b5ac963fb791d1298e7f396236383bc955f916c1/src/isomorphic/classic/element/ReactElement.js#L21-L25
-  var canUseSymbol = typeof Symbol === 'function' && Symbol.for;
-  var REACT_ELEMENT_TYPE = canUseSymbol ? Symbol.for('react.element') : 0xeac7;
-
-  function isReactElement(value) {
-  	return value.$$typeof === REACT_ELEMENT_TYPE
-  }
-
-  function emptyTarget(val) {
-  	return Array.isArray(val) ? [] : {}
-  }
-
-  function cloneUnlessOtherwiseSpecified(value, options) {
-  	return (options.clone !== false && options.isMergeableObject(value))
-  		? deepmerge(emptyTarget(value), value, options)
-  		: value
-  }
-
-  function defaultArrayMerge(target, source, options) {
-  	return target.concat(source).map(function(element) {
-  		return cloneUnlessOtherwiseSpecified(element, options)
-  	})
-  }
-
-  function getMergeFunction(key, options) {
-  	if (!options.customMerge) {
-  		return deepmerge
-  	}
-  	var customMerge = options.customMerge(key);
-  	return typeof customMerge === 'function' ? customMerge : deepmerge
-  }
-
-  function getEnumerableOwnPropertySymbols(target) {
-  	return Object.getOwnPropertySymbols
-  		? Object.getOwnPropertySymbols(target).filter(function(symbol) {
-  			return target.propertyIsEnumerable(symbol)
-  		})
-  		: []
-  }
-
-  function getKeys(target) {
-  	return Object.keys(target).concat(getEnumerableOwnPropertySymbols(target))
-  }
-
-  function propertyIsOnObject(object, property) {
-  	try {
-  		return property in object
-  	} catch(_) {
-  		return false
-  	}
-  }
-
-  // Protects from prototype poisoning and unexpected merging up the prototype chain.
-  function propertyIsUnsafe(target, key) {
-  	return propertyIsOnObject(target, key) // Properties are safe to merge if they don't exist in the target yet,
-  		&& !(Object.hasOwnProperty.call(target, key) // unsafe if they exist up the prototype chain,
-  			&& Object.propertyIsEnumerable.call(target, key)) // and also unsafe if they're nonenumerable.
-  }
-
-  function mergeObject(target, source, options) {
-  	var destination = {};
-  	if (options.isMergeableObject(target)) {
-  		getKeys(target).forEach(function(key) {
-  			destination[key] = cloneUnlessOtherwiseSpecified(target[key], options);
-  		});
-  	}
-  	getKeys(source).forEach(function(key) {
-  		if (propertyIsUnsafe(target, key)) {
-  			return
-  		}
-
-  		if (propertyIsOnObject(target, key) && options.isMergeableObject(source[key])) {
-  			destination[key] = getMergeFunction(key, options)(target[key], source[key], options);
-  		} else {
-  			destination[key] = cloneUnlessOtherwiseSpecified(source[key], options);
-  		}
-  	});
-  	return destination
-  }
-
-  function deepmerge(target, source, options) {
-  	options = options || {};
-  	options.arrayMerge = options.arrayMerge || defaultArrayMerge;
-  	options.isMergeableObject = options.isMergeableObject || isMergeableObject;
-  	// cloneUnlessOtherwiseSpecified is added to `options` so that custom arrayMerge()
-  	// implementations can use it. The caller may not replace it.
-  	options.cloneUnlessOtherwiseSpecified = cloneUnlessOtherwiseSpecified;
-
-  	var sourceIsArray = Array.isArray(source);
-  	var targetIsArray = Array.isArray(target);
-  	var sourceAndTargetTypesMatch = sourceIsArray === targetIsArray;
-
-  	if (!sourceAndTargetTypesMatch) {
-  		return cloneUnlessOtherwiseSpecified(source, options)
-  	} else if (sourceIsArray) {
-  		return options.arrayMerge(target, source, options)
-  	} else {
-  		return mergeObject(target, source, options)
-  	}
-  }
-
-  deepmerge.all = function deepmergeAll(array, options) {
-  	if (!Array.isArray(array)) {
-  		throw new Error('first argument should be an array')
-  	}
-
-  	return array.reduce(function(prev, next) {
-  		return deepmerge(prev, next, options)
-  	}, {})
-  };
-
-  var deepmerge_1 = deepmerge;
-
-  var cjs = deepmerge_1;
-
-  /**
-   * Source: ftp://ftp.unicode.org/Public/UCD/latest/ucd/SpecialCasing.txt
-   */
-  /**
-   * Lower case as a function.
-   */
-  function lowerCase(str) {
-      return str.toLowerCase();
-  }
-
-  // Support camel case ("camelCase" -> "camel Case" and "CAMELCase" -> "CAMEL Case").
-  var DEFAULT_SPLIT_REGEXP = [/([a-z0-9])([A-Z])/g, /([A-Z])([A-Z][a-z])/g];
-  // Remove all non-word characters.
-  var DEFAULT_STRIP_REGEXP = /[^A-Z0-9]+/gi;
-  /**
-   * Normalize the string into something other libraries can manipulate easier.
-   */
-  function noCase(input, options) {
-      if (options === void 0) { options = {}; }
-      var _a = options.splitRegexp, splitRegexp = _a === void 0 ? DEFAULT_SPLIT_REGEXP : _a, _b = options.stripRegexp, stripRegexp = _b === void 0 ? DEFAULT_STRIP_REGEXP : _b, _c = options.transform, transform = _c === void 0 ? lowerCase : _c, _d = options.delimiter, delimiter = _d === void 0 ? " " : _d;
-      var result = replace(replace(input, splitRegexp, "$1\0$2"), stripRegexp, "\0");
-      var start = 0;
-      var end = result.length;
-      // Trim the delimiter from around the output string.
-      while (result.charAt(start) === "\0")
-          start++;
-      while (result.charAt(end - 1) === "\0")
-          end--;
-      // Transform each token independently.
-      return result.slice(start, end).split("\0").map(transform).join(delimiter);
-  }
-  /**
-   * Replace `re` in the input string with the replacement value.
-   */
-  function replace(input, re, value) {
-      if (re instanceof RegExp)
-          return input.replace(re, value);
-      return re.reduce(function (input, re) { return input.replace(re, value); }, input);
-  }
-
-  var copyProperty = function copyProperty(to, from, property, ignoreNonConfigurable) {
-    // `Function#length` should reflect the parameters of `to` not `from` since we keep its body.
-    // `Function#prototype` is non-writable and non-configurable so can never be modified.
-    if (property === 'length' || property === 'prototype') {
-      return;
-    } // `Function#arguments` and `Function#caller` should not be copied. They were reported to be present in `Reflect.ownKeys` for some devices in React Native (#41), so we explicitly ignore them here.
-
-
-    if (property === 'arguments' || property === 'caller') {
-      return;
-    }
-
-    var toDescriptor = Object.getOwnPropertyDescriptor(to, property);
-    var fromDescriptor = Object.getOwnPropertyDescriptor(from, property);
-
-    if (!canCopyProperty(toDescriptor, fromDescriptor) && ignoreNonConfigurable) {
-      return;
-    }
-
-    Object.defineProperty(to, property, fromDescriptor);
-  }; // `Object.defineProperty()` throws if the property exists, is not configurable and either:
-  // - one its descriptors is changed
-  // - it is non-writable and its value is changed
-
-
-  var canCopyProperty = function canCopyProperty(toDescriptor, fromDescriptor) {
-    return toDescriptor === undefined || toDescriptor.configurable || toDescriptor.writable === fromDescriptor.writable && toDescriptor.enumerable === fromDescriptor.enumerable && toDescriptor.configurable === fromDescriptor.configurable && (toDescriptor.writable || toDescriptor.value === fromDescriptor.value);
-  };
-
-  var changePrototype = function changePrototype(to, from) {
-    var fromPrototype = Object.getPrototypeOf(from);
-
-    if (fromPrototype === Object.getPrototypeOf(to)) {
-      return;
-    }
-
-    Object.setPrototypeOf(to, fromPrototype);
-  };
-
-  var wrappedToString = function wrappedToString(withName, fromBody) {
-    return "/* Wrapped " + withName + "*/\n" + fromBody;
-  };
-
-  var toStringDescriptor = Object.getOwnPropertyDescriptor(Function.prototype, 'toString');
-  var toStringName = Object.getOwnPropertyDescriptor(Function.prototype.toString, 'name'); // We call `from.toString()` early (not lazily) to ensure `from` can be garbage collected.
-  // We use `bind()` instead of a closure for the same reason.
-  // Calling `from.toString()` early also allows caching it in case `to.toString()` is called several times.
-
-  var changeToString = function changeToString(to, from, name) {
-    var withName = name === '' ? '' : "with " + name.trim() + "() ";
-    var newToString = wrappedToString.bind(null, withName, from.toString()); // Ensure `to.toString.toString` is non-enumerable and has the same `same`
-
-    Object.defineProperty(newToString, 'name', toStringName);
-    Object.defineProperty(to, 'toString', _extends({}, toStringDescriptor, {
-      value: newToString
-    }));
-  };
-
-  function mimicFunction(to, from, _temp) {
-    var _ref = _temp === void 0 ? {} : _temp,
-        _ref$ignoreNonConfigu = _ref.ignoreNonConfigurable,
-        ignoreNonConfigurable = _ref$ignoreNonConfigu === void 0 ? false : _ref$ignoreNonConfigu;
-
-    var name = to.name;
-
-    for (var _iterator = _createForOfIteratorHelperLoose(Reflect.ownKeys(from)), _step; !(_step = _iterator()).done;) {
-      var property = _step.value;
-      copyProperty(to, from, property, ignoreNonConfigurable);
-    }
-
-    changePrototype(to, from);
-    changeToString(to, from, name);
-    return to;
-  }
-
-  var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
-
-  function getDefaultExportFromCjs (x) {
-  	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
-  }
-
-  function createCommonjsModule(fn) {
-    var module = { exports: {} };
-  	return fn(module, module.exports), module.exports;
-  }
-
-  var pDefer = () => {
-  	const ret = {};
-
-  	ret.promise = new Promise((resolve, reject) => {
-  		ret.resolve = resolve;
-  		ret.reject = reject;
-  	});
-
-  	return ret;
-  };
-
-  var dist = createCommonjsModule(function (module, exports) {
-  var __awaiter = (commonjsGlobal && commonjsGlobal.__awaiter) || function (thisArg, _arguments, P, generator) {
-      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) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
-          step((generator = generator.apply(thisArg, _arguments || [])).next());
-      });
-  };
-  var __importDefault = (commonjsGlobal && commonjsGlobal.__importDefault) || function (mod) {
-      return (mod && mod.__esModule) ? mod : { "default": mod };
-  };
-  Object.defineProperty(exports, "__esModule", { value: true });
-  const p_defer_1 = __importDefault(pDefer);
-  function mapAgeCleaner(map, property = 'maxAge') {
-      let processingKey;
-      let processingTimer;
-      let processingDeferred;
-      const cleanup = () => __awaiter(this, void 0, void 0, function* () {
-          if (processingKey !== undefined) {
-              // If we are already processing an item, we can safely exit
-              return;
-          }
-          const setupTimer = (item) => __awaiter(this, void 0, void 0, function* () {
-              processingDeferred = p_defer_1.default();
-              const delay = item[1][property] - Date.now();
-              if (delay <= 0) {
-                  // Remove the item immediately if the delay is equal to or below 0
-                  map.delete(item[0]);
-                  processingDeferred.resolve();
-                  return;
-              }
-              // Keep track of the current processed key
-              processingKey = item[0];
-              processingTimer = setTimeout(() => {
-                  // Remove the item when the timeout fires
-                  map.delete(item[0]);
-                  if (processingDeferred) {
-                      processingDeferred.resolve();
-                  }
-              }, delay);
-              // tslint:disable-next-line:strict-type-predicates
-              if (typeof processingTimer.unref === 'function') {
-                  // Don't hold up the process from exiting
-                  processingTimer.unref();
-              }
-              return processingDeferred.promise;
-          });
-          try {
-              for (const entry of map) {
-                  yield setupTimer(entry);
-              }
-          }
-          catch (_a) {
-              // Do nothing if an error occurs, this means the timer was cleaned up and we should stop processing
-          }
-          processingKey = undefined;
-      });
-      const reset = () => {
-          processingKey = undefined;
-          if (processingTimer !== undefined) {
-              clearTimeout(processingTimer);
-              processingTimer = undefined;
-          }
-          if (processingDeferred !== undefined) { // tslint:disable-line:early-exit
-              processingDeferred.reject(undefined);
-              processingDeferred = undefined;
-          }
-      };
-      const originalSet = map.set.bind(map);
-      map.set = (key, value) => {
-          if (map.has(key)) {
-              // If the key already exist, remove it so we can add it back at the end of the map.
-              map.delete(key);
-          }
-          // Call the original `map.set`
-          const result = originalSet(key, value);
-          // If we are already processing a key and the key added is the current processed key, stop processing it
-          if (processingKey && processingKey === key) {
-              reset();
-          }
-          // Always run the cleanup method in case it wasn't started yet
-          cleanup(); // tslint:disable-line:no-floating-promises
-          return result;
-      };
-      cleanup(); // tslint:disable-line:no-floating-promises
-      return map;
-  }
-  exports.default = mapAgeCleaner;
-  // Add support for CJS
-  module.exports = mapAgeCleaner;
-  module.exports.default = mapAgeCleaner;
-  });
-
-  var mapAgeCleaner = /*@__PURE__*/getDefaultExportFromCjs(dist);
-
-  var cacheStore = new WeakMap();
-  /**
-  [Memoize](https://en.wikipedia.org/wiki/Memoization) functions - An optimization used to speed up consecutive function calls by caching the result of calls with identical input.
-
-  @param fn - Function to be memoized.
-
-  @example
-  ```
-  import mem from 'mem';
-
-  let index = 0;
-  const counter = () => ++index;
-  const memoized = mem(counter);
-
-  memoized('foo');
-  //=> 1
-
-  // Cached as it's the same argument
-  memoized('foo');
-  //=> 1
-
-  // Not cached anymore as the arguments changed
-  memoized('bar');
-  //=> 2
-
-  memoized('bar');
-  //=> 2
-  ```
-  */
-
-  function mem(fn, _temp) {
-    var _ref = _temp === void 0 ? {} : _temp,
-        cacheKey = _ref.cacheKey,
-        _ref$cache = _ref.cache,
-        cache = _ref$cache === void 0 ? new Map() : _ref$cache,
-        maxAge = _ref.maxAge;
-
-    if (typeof maxAge === 'number') {
-      mapAgeCleaner(cache);
-    }
-
-    var memoized = function memoized() {
-      var arguments_ = [].slice.call(arguments);
-      var key = cacheKey ? cacheKey(arguments_) : arguments_[0];
-      var cacheItem = cache.get(key);
-
-      if (cacheItem) {
-        return cacheItem.data; // eslint-disable-line @typescript-eslint/no-unsafe-return
-      }
-
-      var result = fn.apply(this, arguments_);
-      cache.set(key, {
-        data: result,
-        maxAge: maxAge ? Date.now() + maxAge : Number.POSITIVE_INFINITY
-      });
-      return result; // eslint-disable-line @typescript-eslint/no-unsafe-return
-    };
-
-    mimicFunction(memoized, fn, {
-      ignoreNonConfigurable: true
-    });
-    cacheStore.set(memoized, cache);
-    return memoized;
-  }
-
-  /**
-   * Test if the given value is an object.
-   *
-   * @param {*} value The value to test.
-   * @return {Boolean} Whether or not the value is an object.
-   */
-  function isObject(value) {
-    return typeof value === 'object' && !!value && value.toString() === '[object Object]';
-  }
-
-  /**
-   * @typedef {StringConstructor|NumberConstructor|BooleanConstructor|ArrayConstructor|ObjectConstructor} OptionType
-   * @typedef {{ [name:string]: OptionType | { type: OptionType, default: String|Number|Boolean|(() => Array|Object)} }} OptionsSchema
-   * @typedef {{ [optionName:string]: any }} OptionsInterface
-   */
-
-  /**
-   * Get the attribute name based on the given option name.
-   * @param {String} name The option name.
-   */
-
-  function getAttributeName(name) {
-    return "data-option-" + noCase(name, {
-      delimiter: '-'
-    });
-  }
-
-  var memoizedGetAttributeName = mem(getAttributeName);
-  /**
-   * Class options to manage options as data attributes on an HTML element.
-   * @augments {OptionsInterface}
-   */
-
-  var _element = /*#__PURE__*/_classPrivateFieldLooseKey("element");
-
-  var _values = /*#__PURE__*/_classPrivateFieldLooseKey("values");
-
-  var _defaultValues = /*#__PURE__*/_classPrivateFieldLooseKey("defaultValues");
-
-  var Options = /*#__PURE__*/function () {
-    /** @type {HTMLElement} The HTML element holding the options attributes. */
-
-    /** @type {Object} An object to store Array and Object values for reference. */
-
-    /** @type {Array} List of allowed types. */
-
-    /**
-     * The default values to return for each available type.
-     * @type {Object}
-     */
-
-    /**
-     * Class constructor.
-     *
-     * @param {HTMLElement}   element The HTML element storing the options.
-     * @param {OptionsSchema} schema  A Base class config.
-     */
-    function Options(element, schema) {
-      var _this = this;
-
-      Object.defineProperty(this, _element, {
-        writable: true,
-        value: void 0
-      });
-      Object.defineProperty(this, _values, {
-        writable: true,
-        value: {}
-      });
-      Object.defineProperty(this, _defaultValues, {
-        writable: true,
-        value: {
-          String: '',
-          Number: 0,
-          Boolean: false,
-          Array: function Array() {
-            return [];
-          },
-          Object: function Object() {
-            return {};
-          }
-        }
-      });
-      _classPrivateFieldLooseBase(this, _element)[_element] = element;
-      Object.entries(schema).forEach(function (_ref) {
-        var name = _ref[0],
-            config = _ref[1];
-        var isObjectConfig = !Options.types.includes(config);
-        /** @type {OptionType} */
-        // @ts-ignore
-
-        var type = isObjectConfig ? config.type : config;
-
-        if (!Options.types.includes(type)) {
-          throw new Error("The \"" + name + "\" option has an invalid type. The allowed types are: String, Number, Boolean, Array and Object.");
-        } // @ts-ignore
-
-
-        var defaultValue = isObjectConfig ? config.default : _classPrivateFieldLooseBase(_this, _defaultValues)[_defaultValues][type.name];
-
-        if ((type === Array || type === Object) && typeof defaultValue !== 'function') {
-          throw new Error("The default value for options of type \"" + type.name + "\" must be returned by a function.");
-        }
-
-        Object.defineProperty(_this, name, {
-          get: function get() {
-            return this.get(name, type, defaultValue);
-          },
-          set: function set(value) {
-            this.set(name, type, value, defaultValue);
-          },
-          enumerable: true
-        });
-      });
-      return this;
-    }
-    /**
-     * Get an option value.
-     *
-     * @param {String} name The option name.
-     * @param {ArrayConstructor|ObjectConstructor|StringConstructor|NumberConstructor|BooleanConstructor} type The option data's type.
-     * @param {any} defaultValue The default value for this option.
-     */
-
-
-    var _proto = Options.prototype;
-
-    _proto.get = function get(name, type, defaultValue) {
-      var _this2 = this;
-
-      var attributeName = memoizedGetAttributeName(name);
-
-      var hasAttribute = _classPrivateFieldLooseBase(this, _element)[_element].hasAttribute(attributeName);
-
-      if (type === Boolean) {
-        if (defaultValue) {
-          var negatedAttributeName = memoizedGetAttributeName("no-" + name);
-
-          var hasNegatedAttribute = _classPrivateFieldLooseBase(this, _element)[_element].hasAttribute(negatedAttributeName);
-
-          return !hasNegatedAttribute;
-        }
-
-        return hasAttribute || defaultValue;
-      }
-
-      var value = _classPrivateFieldLooseBase(this, _element)[_element].getAttribute(attributeName);
-
-      if (type === Number) {
-        return hasAttribute ? Number(value) : defaultValue;
-      }
-
-      if (type === Array || type === Object) {
-        var val = cjs(defaultValue(), hasAttribute ? JSON.parse(value) : _classPrivateFieldLooseBase(this, _defaultValues)[_defaultValues][type.name]());
-
-        if (!_classPrivateFieldLooseBase(this, _values)[_values][name]) {
-          _classPrivateFieldLooseBase(this, _values)[_values][name] = val;
-        } else if (val !== _classPrivateFieldLooseBase(this, _values)[_values][name]) {
-          // When getting the value, wait for the next loop to update the data attribute
-          // with the new value. This is a simple trick to avoid using a Proxy to watch
-          // for any deep changes on an array or object. It should not break anything as
-          // the original value is read once from the data attribute and is then read from
-          // the private property `#values`.
-          setTimeout(function () {
-            _classPrivateFieldLooseBase(_this2, _element)[_element].setAttribute(attributeName, JSON.stringify(_classPrivateFieldLooseBase(_this2, _values)[_values][name]));
-          }, 0);
-        }
-
-        return _classPrivateFieldLooseBase(this, _values)[_values][name];
-      }
-
-      return hasAttribute ? value : defaultValue;
-    }
-    /**
-     * Set an option value.
-     *
-     * @param {String} name The option name.
-     * @param {ArrayConstructor|ObjectConstructor|StringConstructor|NumberConstructor|BooleanConstructor} type The option data's type.
-     * @param {any} value The new value for this option.
-     */
-    ;
-
-    _proto.set = function set(name, type, value, defaultValue) {
-      var attributeName = memoizedGetAttributeName(name);
-
-      if (value.constructor.name !== type.name) {
-        var val = Array.isArray(value) || isObject(value) ? JSON.stringify(value) : value;
-        throw new TypeError("The \"" + val + "\" value for the \"" + name + "\" option must be of type \"" + type.name + "\"");
-      }
-
-      switch (type) {
-        case Boolean:
-          if (defaultValue) {
-            var negatedAttributeName = memoizedGetAttributeName("no-" + name);
-
-            if (value) {
-              _classPrivateFieldLooseBase(this, _element)[_element].removeAttribute(negatedAttributeName);
-            } else {
-              _classPrivateFieldLooseBase(this, _element)[_element].setAttribute(negatedAttributeName, '');
-            }
-          } else if (value) {
-            _classPrivateFieldLooseBase(this, _element)[_element].setAttribute(attributeName, '');
-          } else {
-            _classPrivateFieldLooseBase(this, _element)[_element].removeAttribute(attributeName);
-          }
-
-          break;
-
-        case Array:
-        case Object:
-          _classPrivateFieldLooseBase(this, _values)[_values][name] = value;
-
-          _classPrivateFieldLooseBase(this, _element)[_element].setAttribute(attributeName, JSON.stringify(value));
-
-          break;
-
-        default:
-          _classPrivateFieldLooseBase(this, _element)[_element].setAttribute(attributeName, value);
-
-      }
-    };
-
-    return Options;
-  }();
-
-  Options.types = [String, Number, Boolean, Array, Object];
-
-  /**
-   * @typedef {import('./index.js').default} Base
-   * @typedef {import('./index.js').BaseOptions} BaseOptions
-   * @typedef {import('./classes/Options.js').OptionsSchema} OptionsSchema
-   */
-
-  /**
-   * Get the legacy options from the `config` properties.
-   *
-   * @param {Base}   instance The component's instance.
-   * @param {Object} config   The component's config.
-   * @return {OptionsSchema}
-   */
-
-  function getLegacyOptionsSchema(instance, config) {
-    // Add legacy options to the schema
-    var propsToExclude = ['name', 'log', 'debug', 'components', 'refs', 'options'];
-    return Object.keys(config).reduce(
-    /**
-     * @param {OptionsSchema} schema
-     * @param {String} propName
-     */
-    function (schema, propName) {
-      if (propsToExclude.includes(propName)) {
-        return schema;
-      }
-
-      var value = config[propName];
-      var type = value === null || value === undefined ? Object : value.constructor; // Default to object type as it should work for any values.
-
-      if (!Options.types.includes(type)) {
-        type = Object;
-      }
-
-      warn(instance, '\n  Options must be defined in the `config.options` property.', "\n  Consider moving the `config." + propName + "` option to `config.options." + propName + "`.");
-
-      if (type === Array || type === Object) {
-        schema[propName] = {
-          type: type,
-          default: function _default() {
-            return value;
-          }
-        };
-      } else {
-        schema[propName] = {
-          type: type,
-          default: value
-        };
-      }
-
-      return schema;
-    }, {});
-  }
-  /**
-   * Get the inherited options values from the current instance parent classes.
-   * @param {Base} instance The component's instance.
-   * @return {OptionsSchema}
-   */
-
-
-  function getParentOptionsSchema(instance) {
-    /** @type {OptionsSchema} [description] */
-    var schema = {};
-    /** @type {Base|false} Merge inherited options. */
-
-    var prototype = instance;
-
-    while (prototype) {
-      var getterConfig = prototype.config; // @ts-ignore
-
-      var staticConfig = prototype.constructor.config;
-
-      if (getterConfig || staticConfig) {
-        schema = Object.assign((getterConfig || {}).options || {}, (staticConfig || {}).options || {}, schema);
-        prototype = Object.getPrototypeOf(prototype);
-      } else {
-        prototype = false;
-      }
-    }
-
-    return schema;
-  }
-  /**
-   * Update an Options object with the legacy values from the element's `data-options` attribute.
-   *
-   * @param {Base}        instance The component's instance.
-   * @param {HTMLElement} element The component's root element.
-   * @param {Options}     options The component's options.
-   */
-
-
-  function updateOptionsWithLegacyValues(instance, element, options) {
-    // Update legacy options with value from the `data-options` attribute
-    var legacyOptionsValues = {};
-
-    if (element.dataset.options) {
-      warn(instance, 'The `data-options` attribute usage is deprecated, use multiple `data-option-...` attributes instead.');
-
-      try {
-        legacyOptionsValues = JSON.parse(element.dataset.options);
-      } catch (err) {
-        throw new Error('Can not parse the `data-options` attribute. Is it a valid JSON string?');
-      }
-    }
-
-    Object.entries(legacyOptionsValues).forEach(function (_ref) {
-      var optionName = _ref[0],
-          optionValue = _ref[1];
-      options[optionName] = optionValue;
-    });
-  }
-  /**
-   * Get a component's options.
-   *
-   * @param  {Base}        instance The component's instance.
-   * @param  {HTMLElement} element  The component's root element.
-   * @param  {Object}      config   The component's default config.
-   * @return {Options & BaseOptions}              The component's merged options.
-   */
-
-
-  function getOptions(instance, element, config) {
-    var _config$log, _config$debug;
-
-    /** @type {OptionsSchema} */
-    var schema = _extends({
-      name: {
-        type: String,
-        default: config.name
-      },
-      log: {
-        type: Boolean,
-        default: (_config$log = config.log) != null ? _config$log : false
-      },
-      debug: {
-        type: Boolean,
-        default: (_config$debug = config.debug) != null ? _config$debug : false
-      }
-    }, getParentOptionsSchema(instance), getLegacyOptionsSchema(instance, config), config.options || {});
-
-    var options = new Options(element, schema);
-    updateOptionsWithLegacyValues(instance, element, options);
-    instance.$emit('get:options', options);
-    return options;
-  }
-
-  /**
-   * @typedef {import('./index.js').default} Base
-   */
-
-  /**
-   * A ponyfill for the CSS `:scope` selector which is not supported in IE11.
-   * The following method will return an array of elements similare to the
-   * `:scope ${selector}` selector.
-   *
-   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/:scope
-   * @see https://github.com/jonathantneal/element-qsa-scope
-   *
-   * @param  {HTMLElement} element  The element from which the scope is taken.
-   * @param  {String}      selector The children selector.
-   * @param  {String}      uniqId   A uniq ID to prefix the selector with.
-   * @return {Array}                A list of elements.
-   */
-
-  function scopeSelectorPonyfill(element, selector, uniqId) {
-    var list = [];
-
-    try {
-      list = Array.from(element.querySelectorAll(":scope " + selector));
-    } catch (err) {
-      var attr = "data-uniq-id";
-      var scopedSelector = "[" + attr + "=\"" + uniqId + "\"] " + selector;
-      element.setAttribute(attr, uniqId);
-      list = Array.from(element.querySelectorAll(scopedSelector));
-      element.removeAttribute(attr);
-    }
-
-    return list;
-  }
-  /**
-   * Get all refs of a component.
-   *
-   * @param  {Base}        instance The component's instance.
-   * @param  {HTMLElement} element  The component's root element.
-   * @return {Object}               Return an object containing all the component's refs.
-   */
-
-  function getRefs(instance, element) {
-    var definedRefs = getConfig(instance).refs || [];
-    /** @type {Array<HTMLElement>} */
-
-    var allRefs = Array.from(element.querySelectorAll("[data-ref]"));
-    var childrenRefs = scopeSelectorPonyfill(element, '[data-component] [data-ref]', instance.$id);
-    var elements = allRefs.filter(function (ref) {
-      return !childrenRefs.includes(ref);
-    });
-    var refs = elements.reduce(
-    /**
-     * @param {Object} $refs
-     * @param {HTMLElement & {__base__?: Base}} $ref
-     */
-    function ($refs, $ref) {
-      var refName = $ref.dataset.ref;
-
-      if (!definedRefs.includes(refName)) {
-        warn(instance, "The \"" + refName + "\" ref is not defined in the class configuration.", 'Did you forgot to define it?');
-      }
-
-      var $realRef = $ref.__base__ ? $ref.__base__ : $ref;
-
-      if (refName.endsWith('[]')) {
-        refName = refName.replace(/\[\]$/, '');
-
-        if (!$refs[refName]) {
-          $refs[refName] = [];
-        }
-      }
-
-      if ($refs[refName]) {
-        if (Array.isArray($refs[refName])) {
-          $refs[refName].push($realRef);
-        } else {
-          $refs[refName] = [$refs[refName], $realRef];
-          warn(instance, "The \"" + refName + "\" ref has been found multiple times.", 'Did you forgot to add the `[]` suffix to its name?');
-        }
-      } else {
-        $refs[refName] = $realRef;
-      }
-
-      return $refs;
-    }, {});
-    instance.$emit('get:refs', refs);
-    return refs;
-  }
-
-  /**
-   * @typedef {import('./index.js').default} Base
-   */
-
-  /**
-   * Mount a given component which might be async.
-   *
-   * @param  {Base|Promise<Base>} component The component to mount.
-   * @return {void}
-   */
-
-  function mountComponent(component) {
-    if (component instanceof Promise) {
-      component.then(function (instance) {
-        return instance.$mount();
-      });
-    } else {
-      component.$mount();
-    }
-  }
-  /**
-   * Mount children components of a given instance.
-   *
-   * @param  {Base} instance The parent component's instance.
-   * @return {void}
-   */
-
-
-  function mountComponents(instance) {
-    if (__DEV__) {
-      debug(instance, 'mountComponents', instance.$children);
-    }
-
-    Object.values(instance.$children).forEach(function ($child) {
-      if (__DEV__) {
-        debug(instance, 'mountComponent', $child);
-      }
-
-      $child.forEach(mountComponent);
-    });
-  }
-  /**
-   * Mount or update the given component.
-   *
-   * @param {Base|Promise<Base>} component [description]
-   * @return {void}
-   */
-
-  function mountOrUpdateComponent(component) {
-    if (component instanceof Promise) {
-      component.then(function (instance) {
-        return instance.$isMounted ? instance.$update() : instance.$mount();
-      });
-    } else {
-      var method = component.$isMounted ? '$update' : '$mount';
-      component[method]();
-    }
-  }
-  /**
-   * Mount or updte children components of the given instance.
-   *
-   * @param {Base} instance The parent component's instance.
-   * @return {void}
-   */
-
-
-  function mountOrUpdateComponents(instance) {
-    if (__DEV__) {
-      debug(instance, 'mountComponents', instance.$children);
-    }
-
-    Object.values(instance.$children).forEach(function ($child) {
-      $child.forEach(mountOrUpdateComponent);
-    });
-  }
-  /**
-   * Destroy a given component which might be async.
-   *
-   * @param  {Base|Promise} component The component to destroy.
-   * @return {void}
-   */
-
-  function destroyComponent(component) {
-    if (component instanceof Promise) {
-      component.then(function (instance) {
-        return instance.$destroy();
-      });
-    } else {
-      component.$destroy();
-    }
-  }
-  /**
-   * Destroy children components of a given instance.
-   *
-   * @param  {Base} instance The parent component's instance.
-   * @return {void}
-   */
-
-
-  function destroyComponents(instance) {
-    if (__DEV__) {
-      debug(instance, 'destroyComponents', instance.$children);
-    }
-
-    Object.values(instance.$children).forEach(
-    /**
-     * @param {Array<Base>} $child
-     */
-    function ($child) {
-      $child.forEach(destroyComponent);
-    });
-  }
-
-  /**
-   * Service abstract class
-   */
-  var Service = /*#__PURE__*/function () {
-    /**
-     * Class constructor, used to test the abstract class implementation.
-     */
-    function Service() {
-      this.callbacks = new Map();
-      this.isInit = false;
-    }
-    /**
-     * Getter to get the services properties.
-     * This getter MUST be implementer by the service extending this class.
-     * @return {Object}
-     */
-
-
-    var _proto = Service.prototype;
-
-    /**
-     * Method to initialize the service behaviors.
-     * This method MUST be implemented by the service extending this class.
-     *
-     * @return {Service} The current instance
-     */
-    _proto.init = function init() {
-      throw new Error('The `init` method must be implemented.');
-    }
-    /**
-     * Method to kill the service behaviors.
-     * This method MUST be implemented by the service extending this class.
-     *
-     * @return {Service} The current instance
-     */
-    ;
-
-    _proto.kill = function kill() {
-      throw new Error('The `kill` method must be implemented.');
-    }
-    /**
-     * Add a callback.
-     *
-     * @param  {String}   key      The callback's identifier
-     * @param  {Function} callback The callback function
-     * @return {this} The current instance
-     */
-    ;
-
-    _proto.add = function add(key, callback) {
-      if (this.has(key)) {
-        throw new Error("A callback with the key `" + key + "` has already been registered.");
-      } // Initialize the service when we add the first callback
-
-
-      if (this.callbacks.size === 0 && !this.isInit) {
-        this.init();
-        this.isInit = true;
-      }
-
-      this.callbacks.set(key, callback);
-      return this;
-    }
-    /**
-     * Test if a callback with the given key has already been added.
-     *
-     * @param  {String}  key The identifier to test
-     * @return {Boolean}     Whether or not the identifier already exists
-     */
-    ;
-
-    _proto.has = function has(key) {
-      return this.callbacks.has(key);
-    }
-    /**
-     * Get the callback tied to the given key.
-     *
-     * @param  {String}   key The identifier to get
-     * @return {Function}     The callback function
-     */
-    ;
-
-    _proto.get = function get(key) {
-      return this.callbacks.get(key);
-    }
-    /**
-     * Remove the callback tied to the given key.
-     *
-     * @param  {String} key The identifier to remove
-     * @return {Service}    The current instance
-     */
-    ;
-
-    _proto.remove = function remove(key) {
-      this.callbacks.delete(key); // Kill the service when we remove the last callback
-
-      if (this.callbacks.size === 0 && this.isInit) {
-        this.kill();
-        this.isInit = false;
-      }
-
-      return this;
-    }
-    /**
-     * Trigger each added callback with the given arguments.
-     *
-     * @param  {Array}   args All the arguments to apply to the callback
-     * @return {Service}      The current instance
-     */
-    ;
-
-    _proto.trigger = function trigger() {
-      var args = [].slice.call(arguments);
-      this.callbacks.forEach(function forEachCallback(callback) {
-        callback.apply(void 0, args);
-      });
-      return this;
-    };
-
-    _createClass(Service, [{
-      key: "props",
-      get: function get() {
-        throw new Error('The `props` getter must be implemented.');
-      }
-    }]);
-
-    return Service;
-  }();
-
-  /**
-   * @typedef {import('./index').ServiceInterface} ServiceInterface
-   */
-
-  /**
-   * @typedef {Object} PointerServiceProps
-   * @property {MouseEvent | TouchEvent} event
-   * @property {Boolean} isDown
-   * @property {Number} x
-   * @property {Number} y
-   * @property {{ x: Boolean, y: Boolean }} changed
-   * @property {{ x: Number, y: Number }} last
-   * @property {{ x: Number, y: Number }} delta
-   * @property {{ x: Number, y: Number }} progress
-   * @property {{ x: Number, y: Number }} max
-   */
-
-  /**
-   * @typedef {Object} PointerService
-   * @property {(key:String, callback:(props:PointerServiceProps) => void) => void} add
-   *   Add a function to the resize service. The key must be uniq.
-   * @property {() => PointerServiceProps} props
-   *   Get the current values of the resize service props.
-   */
-
-  /**
-   * Test if an event is an instance of TouchEvent.
-   *
-   * @param {TouchEvent|MouseEvent} event The event instance to test.
-   * @return {Boolean}                    Is it a TouchEvent?
-   */
-
-  function isTouchEvent(event) {
-    return typeof TouchEvent !== 'undefined' && event instanceof TouchEvent;
-  }
-  /**
-   * Pointer service
-   */
-
-
-  var Pointer = /*#__PURE__*/function (_Service) {
-    _inheritsLoose(Pointer, _Service);
-
-    function Pointer() {
-      var _this;
-
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-
-      _this = _Service.call.apply(_Service, [this].concat(args)) || this;
-      _this.isDown = false;
-      _this.y = window.innerHeight / 2;
-      _this.yLast = window.innerHeight / 2;
-      _this.x = window.innerWidth / 2;
-      _this.xLast = window.innerWidth / 2;
-      _this.hasRaf = false;
-      return _this;
-    }
-
-    var _proto = Pointer.prototype;
-
-    /**
-     * Bind the handler to the mousemove and touchmove events.
-     * Bind the up and down handler to the mousedown, mouseup, touchstart and touchend events.
-     *
-     * @return {Pointer}
-     */
-    _proto.init = function init() {
-      document.documentElement.addEventListener('mouseenter', this, {
-        once: true,
-        capture: true
-      });
-      var options = {
-        passive: true,
-        capture: true
-      };
-      document.addEventListener('mousemove', this, options);
-      document.addEventListener('touchmove', this, options);
-      document.addEventListener('mousedown', this, options);
-      document.addEventListener('touchstart', this, options);
-      document.addEventListener('mouseup', this, options);
-      document.addEventListener('touchend', this, options);
-      return this;
-    }
-    /**
-     * Handle events.
-     * @param {MouseEvent|TouchEvent} event The event object.
-     */
-    ;
-
-    _proto.handleEvent = function handleEvent(event) {
-      // eslint-disable-next-line default-case
-      switch (event.type) {
-        case 'mouseenter':
-        case 'mousemove':
-        case 'touchmove':
-          this.handler(event);
-          break;
-
-        case 'mousedown':
-        case 'touchstart':
-          this.downHandler();
-          break;
-
-        case 'mouseup':
-        case 'touchend':
-          this.upHandler();
-          break;
-      }
-    }
-    /**
-     * Unbind all handlers from their bounded event.
-     *
-     * @return {Pointer}
-     */
-    ;
-
-    _proto.kill = function kill() {
-      document.removeEventListener('mousemove', this);
-      document.removeEventListener('touchmove', this);
-      document.removeEventListener('mousedown', this);
-      document.removeEventListener('touchstart', this);
-      document.removeEventListener('mouseup', this);
-      document.removeEventListener('touchend', this);
-      return this;
-    }
-    /**
-     * The service handler.
-     * @param {MouseEvent|TouchEvent} event The mouse event object.
-     */
-    ;
-
-    _proto.handler = function handler(event) {
-      this.updateValues(event);
-      this.trigger(this.props);
-    }
-    /**
-     * Handler for the pointer's down action.
-     *
-     * @return {void}
-     */
-    ;
-
-    _proto.downHandler = function downHandler() {
-      this.isDown = true;
-      this.trigger(this.props);
-    }
-    /**
-     * Handler for the pointer's up action.
-     *
-     * @return {void}
-     */
-    ;
-
-    _proto.upHandler = function upHandler() {
-      this.isDown = false;
-      this.trigger(this.props);
-    }
-    /**
-     * Update the pointer positions.
-     *
-     * @param  {MouseEvent|TouchEvent} event The event object.
-     * @return {void}
-     */
-    ;
-
-    _proto.updateValues = function updateValues(event) {
-      var _event$touches$, _event$touches$2;
-
-      this.event = event;
-      this.yLast = this.y;
-      this.xLast = this.x; // Check pointer Y
-      // We either get data from a touch event `event.touches[0].clientY` or from
-      // a mouse event `event.clientY`.
-
-      var y = isTouchEvent(event) ?
-      /** @type {TouchEvent} */
-      (_event$touches$ = event.touches[0]) == null ? void 0 : _event$touches$.clientY :
-      /** @type {MouseEvent} */
-      event.clientY;
-
-      if (y !== this.y) {
-        this.y = y;
-      } // Check pointer X
-      // We either get data from a touch event `event.touches[0].clientX` or from
-      // a mouse event `event.clientX`.
-
-
-      var x = isTouchEvent(event) ?
-      /** @type {TouchEvent} */
-      (_event$touches$2 = event.touches[0]) == null ? void 0 : _event$touches$2.clientX :
-      /** @type {MouseEvent} */
-      event.clientX;
-
-      if (x !== this.x) {
-        this.x = x;
-      }
-    }
-    /**
-     * Get the pointer props.
-     *
-     * @type {Object}
-     */
-    ;
-
-    _createClass(Pointer, [{
-      key: "props",
-      get: function get() {
-        return {
-          event: this.event,
-          isDown: this.isDown,
-          x: this.x,
-          y: this.y,
-          changed: {
-            x: this.x !== this.xLast,
-            y: this.y !== this.yLast
-          },
-          last: {
-            x: this.xLast,
-            y: this.yLast
-          },
-          delta: {
-            x: this.x - this.xLast,
-            y: this.y - this.yLast
-          },
-          progress: {
-            x: this.x / window.innerWidth,
-            y: this.y / window.innerHeight
-          },
-          max: {
-            x: window.innerWidth,
-            y: window.innerHeight
-          }
-        };
-      }
-    }]);
-
-    return Pointer;
-  }(Service);
-
-  var pointer = null;
-  /**
-   * Use the pointer.
-   *
-   * ```js
-   * import usePointer from '@studiometa/js-toolkit/services';
-   * const { add, remove, props } = usePointer();
-   * add('id', () => {});
-   * remove('id');
-   * props();
-   * ```
-   *
-   * @return {ServiceInterface & PointerService}
-   */
-
-  function usePointer() {
-    if (!pointer) {
-      pointer = new Pointer();
-    }
-
-    var add = pointer.add.bind(pointer);
-    var remove = pointer.remove.bind(pointer);
-    var has = pointer.has.bind(pointer);
-
-    var props = function props() {
-      return pointer.props;
-    };
-
-    return {
-      add: add,
-      remove: remove,
-      has: has,
-      props: props
-    };
-  }
-
-  /**
-   * RequestAnimation frame polyfill.
-   * @see  https://github.com/vuejs/vue/blob/ec78fc8b6d03e59da669be1adf4b4b5abf670a34/dist/vue.runtime.esm.js#L7355
-   * @return {(handler: Function) => number}
-   */
-  function getRaf() {
-    return typeof window !== 'undefined' && window.requestAnimationFrame ? window.requestAnimationFrame.bind(window) : setTimeout;
-  }
-  /**
-   * Get a function to cancel the method returned by `getRaf()`.
-   *
-   * @return {(id:number) => void}
-   */
-
-  function getCancelRaf() {
-    return typeof window !== 'undefined' && window.cancelAnimationFrame ? window.cancelAnimationFrame.bind(window) : clearTimeout;
-  }
-
-  /**
-   * @typedef {import('./index').ServiceInterface} ServiceInterface
-   */
-
-  /**
-   * @typedef {Object} RafServiceProps
-   * @property {DOMHighResTimeStamp} time
-   */
-
-  /**
-   * @typedef {Object} RafService
-   * @property {(key:String, callback:(props:RafServiceProps) => void) => void} add
-   *   Add a function to the resize service. The key must be uniq.
-   * @property {() => RafServiceProps} props
-   *   Get the current values of the resize service props.
-   */
-
-  /**
-   * Tick service
-   */
-
-  var Raf = /*#__PURE__*/function (_Service) {
-    _inheritsLoose(Raf, _Service);
-
-    /** @type {Boolean} Whether the loop is running or not. */
-
-    /** @type {number} */
-
-    /**
-     * Bind loop to the instance.
-     */
-    function Raf() {
-      var _this;
-
-      _this = _Service.call(this) || this;
-      _this.isTicking = false;
-      _this.id = 0;
-      _this.raf = getRaf();
-      _this.cancelRaf = getCancelRaf();
-      _this.loop = _this.loop.bind(_assertThisInitialized(_this));
-      return _this;
-    }
-    /**
-     * Start the requestAnimationFrame loop.
-     *
-     * @return {Raf}
-     */
-
-
-    var _proto = Raf.prototype;
-
-    _proto.init = function init() {
-      this.isTicking = true;
-      this.loop();
-      return this;
-    }
-    /**
-     * Loop method.
-     */
-    ;
-
-    _proto.loop = function loop() {
-      this.trigger(this.props);
-
-      if (!this.isTicking) {
-        return;
-      }
-
-      this.id = this.raf(this.loop);
-    }
-    /**
-     * Stop the requestAnimationFrame loop.
-     *
-     * @return {Raf}
-     */
-    ;
-
-    _proto.kill = function kill() {
-      this.cancelRaf(this.id);
-      this.isTicking = false;
-      return this;
-    }
-    /**
-     * Get raf props.
-     *
-     * @todo Return elapsed time / index?
-     * @type {Object}
-     */
-    ;
-
-    _createClass(Raf, [{
-      key: "props",
-      get: function get() {
-        return {
-          time: window.performance.now()
-        };
-      }
-    }]);
-
-    return Raf;
-  }(Service);
-
-  var instance$1 = null;
-  /**
-   * Use the RequestAnimationFrame (raf) service.
-   *
-   * ```js
-   * import { useRaf } from '@studiometa/js/services';
-   * const { add, remove, props } = useRag();
-   * add(id, (props) => {});
-   * remove(id);
-   * props();
-   * ```
-   *
-   * @return {ServiceInterface & RafService}
-   */
-
-  function useRaf$1() {
-    if (!instance$1) {
-      instance$1 = new Raf();
-    }
-
-    var add = instance$1.add.bind(instance$1);
-    var remove = instance$1.remove.bind(instance$1);
-    var has = instance$1.has.bind(instance$1); // eslint-disable-next-line require-jsdoc
-
-    function props() {
-      return instance$1.props;
-    }
-
-    return {
-      add: add,
-      remove: remove,
-      has: has,
-      props: props
-    };
-  }
-
-  /**
-   * Returns a function, that, as long as it continues to be invoked,
-   * will not be triggered. The function will be called after it stops
-   * being called for N milliseconds.
-   *
-   * @param {(...args:any[]) => void} fn The function to call.
-   * @param {Number=} [delay=300] The delay in ms to wait before calling the function.
-   * @return {(...args:any[]) => void} The debounced function.
-   */
-  function debounce(fn, delay) {
-    if (delay === void 0) {
-      delay = 300;
-    }
-
-    var timeout;
-    return function debounced() {
-      var _arguments = arguments;
-      clearTimeout(timeout);
-      timeout = setTimeout(function () {
-        fn.apply(void 0, [].slice.call(_arguments));
-      }, delay);
-    };
-  }
-
-  /**
-   * @typedef {import('./index').ServiceInterface} ServiceInterface
-   */
-
-  /**
-   * @typedef {Object} ResizeServiceProps
-   * @property {Number} width
-   * @property {Number} height
-   * @property {Number} ratio
-   * @property {'square'|'landscape'|'portrait'} orientation
-   * @property {String} [breakpoint]
-   * @property {String[]} [breakpoints]
-   */
-
-  /**
-   * @typedef {Object} ResizeService
-   * @property {(key:String, callback:(props:ResizeServiceProps) => void) => void} add
-   *   Add a function to the resize service. The key must be uniq.
-   * @property {() => ResizeServiceProps} props
-   *   Get the current values of the resize service props.
-   */
-
-  /**
-   * Resize service
-   *
-   * ```
-   * import { useResize } from '@studiometa/js/services';
-   * const { add, remove, props } = useResize();
-   * add(key, (props) => {});
-   * remove(key);
-   * props();
-   * ```
-   */
-
-  var Resize = /*#__PURE__*/function (_Service) {
-    _inheritsLoose(Resize, _Service);
-
-    function Resize() {
-      return _Service.apply(this, arguments) || this;
-    }
-
-    var _proto = Resize.prototype;
-
-    /**
-     * Bind the handler to the resize event.
-     *
-     * @return {this}
-     */
-    _proto.init = function init() {
-      var _this = this;
-
-      this.handler = debounce(function () {
-        _this.trigger(_this.props);
-      }).bind(this);
-
-      if (this.canUseResizeObserver) {
-        this.resizeObserver = new ResizeObserver(this.handler);
-        this.resizeObserver.observe(document.documentElement);
-      } else {
-        window.addEventListener('resize', this.handler);
-      }
-
-      return this;
-    }
-    /**
-     * Unbind the handler from the resize event.
-     *
-     * @return {this}
-     */
-    ;
-
-    _proto.kill = function kill() {
-      if (this.canUseResizeObserver) {
-        this.resizeObserver.disconnect();
-      } else {
-        window.removeEventListener('resize', this.handler);
-      }
-
-      delete this.resizeObserver;
-      return this;
-    }
-    /**
-     * Get resize props.
-     *
-     * @type {ResizeServiceProps}
-     */
-    ;
-
-    _createClass(Resize, [{
-      key: "props",
-      get: function get() {
-        /** @type {ResizeServiceProps} [description] */
-        var props = {
-          width: window.innerWidth,
-          height: window.innerHeight,
-          ratio: window.innerWidth / window.innerHeight,
-          orientation: 'square'
-        };
-
-        if (props.ratio > 1) {
-          props.orientation = 'landscape';
-        }
-
-        if (props.ratio < 1) {
-          props.orientation = 'portrait';
-        }
-
-        if (this.breakpointElement) {
-          props.breakpoint = this.breakpoint;
-          props.breakpoints = this.breakpoints;
-        }
-
-        return props;
-      }
-      /**
-       * The element holding the breakpoints data.
-       * @return {HTMLElement}
-       */
-
-    }, {
-      key: "breakpointElement",
-      get: function get() {
-        return document.querySelector('[data-breakpoint]') || null;
-      }
-      /**
-       * Get the current breakpoint.
-       * @return {String}
-       */
-
-    }, {
-      key: "breakpoint",
-      get: function get() {
-        return window.getComputedStyle(this.breakpointElement, '::before').getPropertyValue('content').replace(/"/g, '');
-      }
-      /**
-       * Get all breakpoints.
-       * @return {Array}
-       */
-
-    }, {
-      key: "breakpoints",
-      get: function get() {
-        var breakpoints = window.getComputedStyle(this.breakpointElement, '::after').getPropertyValue('content').replace(/"/g, '');
-        return breakpoints.split(',');
-      }
-      /**
-       * Test if we can use the `ResizeObserver` API.
-       * @return {Boolean}
-       */
-
-    }, {
-      key: "canUseResizeObserver",
-      get: function get() {
-        return typeof window.ResizeObserver !== 'undefined';
-      }
-    }]);
-
-    return Resize;
-  }(Service);
-
-  var resize = null;
-  /**
-   * Use the resize service.
-   *
-   * ```js
-   * import useResize from '@studiometa/js-toolkit/services/resize';
-   * const { add, remove, props } = useResize();
-   * add(key, (props) => {});
-   * remove(key);
-   * props();
-   * ```
-   * @return {ServiceInterface & ResizeService}
-   */
-
-  function useResize() {
-    if (!resize) {
-      resize = new Resize();
-    }
-
-    var add = resize.add.bind(resize);
-    var remove = resize.remove.bind(resize);
-    var has = resize.has.bind(resize);
-
-    var props = function props() {
-      return resize.props;
-    };
-
-    return {
-      add: add,
-      remove: remove,
-      has: has,
-      props: props
-    };
-  }
-
-  /**
-   * @typedef {import('./index').ServiceInterface} ServiceInterface
-   */
-
-  /**
-   * @typedef {Object} ScrollServiceProps
-   * @property {Number} x
-   * @property {Number} y
-   * @property {{ x: Boolean, y: Boolean }} changed
-   * @property {{ x: Number, y: Number }} last
-   * @property {{ x: Number, y: Number }} delta
-   * @property {{ x: Number, y: Number }} progress
-   * @property {{ x: Number, y: Number }} max
-   * @property {{ x: 'LEFT'|'RIGHT'|'NONE', y: 'UP'|'DOWN'|'NONE' }} direction
-   */
-
-  /**
-   * @typedef {Object} ScrollService
-   * @property {(key:String, callback:(props:ScrollServiceProps) => void) => void} add
-   *   Add a function to the resize service. The key must be uniq.
-   * @property {() => ScrollServiceProps} props
-   *   Get the current values of the resize service props.
-   */
-
-  /**
-   * Scroll service
-   */
-
-  var Scroll = /*#__PURE__*/function (_Service) {
-    _inheritsLoose(Scroll, _Service);
-
-    function Scroll() {
-      var _this;
-
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-
-      _this = _Service.call.apply(_Service, [this].concat(args)) || this;
-      _this.y = window.pageYOffset;
-      _this.yLast = window.pageYOffset;
-      _this.x = window.pageXOffset;
-      _this.xLast = window.pageXOffset;
-      return _this;
-    }
-
-    var _proto = Scroll.prototype;
-
-    /**
-     * Bind the handler to the scroll event.
-     *
-     * @return {Scroll}
-     */
-    _proto.init = function init() {
-      document.addEventListener('scroll', this, {
-        passive: true,
-        capture: true
-      });
-      return this;
-    }
-    /**
-     * Debounced handler.
-     *
-     * @return {() => void}
-     */
-    ;
-
-    /**
-     * Scroll event handler.
-     *
-     * @return {void}
-     */
-    _proto.handleEvent = function handleEvent() {
-      this.trigger(this.props);
-      this.debouncedHandler();
-    }
-    /**
-     * Unbind the handler from the scroll event.
-     *
-     * @return {Scroll}
-     */
-    ;
-
-    _proto.kill = function kill() {
-      document.removeEventListener('scroll', this);
-      return this;
-    }
-    /**
-     * Get scroll props.
-     *
-     * @type {Object}
-     */
-    ;
-
-    _createClass(Scroll, [{
-      key: "debouncedHandler",
-      get: function get() {
-        var _this2 = this;
-
-        var debounced = debounce(function () {
-          _this2.trigger(_this2.props);
-        }, 0); // Define property to avoid multiple call to the getter
-
-        Object.defineProperty(this, 'debouncedHandler', {
-          value: debounced
-        });
-        return debounced;
-      }
-    }, {
-      key: "props",
-      get: function get() {
-        this.yLast = this.y;
-        this.xLast = this.x; // Check scroll Y
-
-        if (window.pageYOffset !== this.y) {
-          this.y = window.pageYOffset;
-        } // Check scroll x
-
-
-        if (window.pageXOffset !== this.x) {
-          this.x = window.pageXOffset;
-        }
-
-        return {
-          x: this.x,
-          y: this.y,
-          changed: {
-            x: this.x !== this.xLast,
-            y: this.y !== this.yLast
-          },
-          last: {
-            x: this.xLast,
-            y: this.yLast
-          },
-          delta: {
-            x: this.x - this.xLast,
-            y: this.y - this.yLast
-          },
-          progress: {
-            x: this.max.x === 0 ? 1 : this.x / this.max.x,
-            y: this.max.y === 0 ? 1 : this.y / this.max.y
-          },
-          direction: {
-            /* eslint-disable no-nested-ternary */
-            x: this.x > this.xLast ? 'RIGHT' : this.x < this.xLast ? 'LEFT' : 'NONE',
-            y: this.y > this.yLast ? 'DOWN' : this.y < this.yLast ? 'UP' : 'NONE'
-            /* eslint-enable no-nested-ternary */
-
-          },
-          max: this.max
-        };
-      }
-      /**
-       * Get scroll max values.
-       *
-       * @type {Object}
-       */
-
-    }, {
-      key: "max",
-      get: function get() {
-        return {
-          x: (document.scrollingElement || document.body).scrollWidth - window.innerWidth,
-          y: (document.scrollingElement || document.body).scrollHeight - window.innerHeight
-        };
-      }
-    }]);
-
-    return Scroll;
-  }(Service);
-
-  var scroll = null;
-  /**
-   * Use the scroll service.
-   *
-   * ```js
-   * import { useScroll } from '@studiometa/js-toolkit/services';
-   * const { add, remove, props } = useScroll();
-   * add(key, (props) => {});
-   * remove(key);
-   * props();
-   * ```
-   *
-   * @return {ServiceInterface & ScrollService}
-   */
-
-  function useScroll() {
-    if (!scroll) {
-      scroll = new Scroll();
-    }
-
-    var add = scroll.add.bind(scroll);
-    var remove = scroll.remove.bind(scroll);
-    var has = scroll.has.bind(scroll);
-
-    var props = function props() {
-      return scroll.props;
-    };
-
-    return {
-      add: add,
-      remove: remove,
-      has: has,
-      props: props
-    };
-  }
-
-  var keyCodes = {
-    ENTER: 13,
-    SPACE: 32,
-    TAB: 9,
-    ESC: 27,
-    LEFT: 37,
-    UP: 38,
-    RIGHT: 39,
-    DOWN: 40
-  };
-
-  /**
-   * @typedef {import('./index').ServiceInterface} ServiceInterface
-   */
-
-  /**
-   * @typedef {Object} KeyServiceProps
-   * @property {KeyboardEvent} event
-   * @property {Number} triggered
-   * @property {Boolean} isUp
-   * @property {Boolean} isDown
-   * @property {Boolean} ENTER
-   * @property {Boolean} SPACE
-   * @property {Boolean} TAB
-   * @property {Boolean} ESC
-   * @property {Boolean} LEFT
-   * @property {Boolean} UP
-   * @property {Boolean} RIGHT
-   * @property {Boolean} DOWN
-   */
-
-  /**
-   * @typedef {Object} KeyService
-   * @property {(key:String, callback:(props:KeyServiceProps) => void) => void} add
-   *   Add a function to the resize service. The key must be uniq.
-   * @property {() => KeyServiceProps} props
-   *   Get the current values of the resize service props.
-   */
-
-  /**
-   * Scroll service
-   */
-
-  var Key = /*#__PURE__*/function (_Service) {
-    _inheritsLoose(Key, _Service);
-
-    function Key() {
-      var _this;
-
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-
-      _this = _Service.call.apply(_Service, [this].concat(args)) || this;
-      _this.event = {};
-      _this.triggered = 0;
-      _this.previousEvent = {};
-      return _this;
-    }
-
-    var _proto = Key.prototype;
-
-    /**
-     * Bind the handler to the keyboard event.
-     *
-     * @return {Key}
-     */
-    _proto.init = function init() {
-      var _this2 = this;
-
-      this.handler = function (event) {
-        _this2.event = event;
-
-        _this2.trigger(_this2.props);
-      };
-
-      document.addEventListener('keydown', this.handler, {
-        passive: false
-      });
-      document.addEventListener('keyup', this.handler, {
-        passive: false
-      });
-      return this;
-    }
-    /**
-     * Unbind the handler from the keyboard event.
-     *
-     * @return {Key}
-     */
-    ;
-
-    _proto.kill = function kill() {
-      document.removeEventListener('keydown', this.handler);
-      document.removeEventListener('keyup', this.handler);
-      return this;
-    }
-    /**
-     * Get keyboard props.
-     *
-     * @type {Object}
-     */
-    ;
-
-    _createClass(Key, [{
-      key: "props",
-      get: function get() {
-        var _this3 = this;
-
-        var keys = Object.entries(keyCodes).reduce(function (acc, _ref) {
-          var name = _ref[0],
-              code = _ref[1];
-          acc[name] = code === _this3.event.keyCode;
-          return acc;
-        }, {});
-
-        if (!this.previousEvent.type) {
-          this.triggered = 0;
-        }
-
-        if (this.event.type === 'keydown' && this.previousEvent.type === 'keydown') {
-          this.triggered += 1;
-        } else {
-          this.triggered = 1;
-        }
-
-        this.previousEvent = this.event;
-        return _extends({
-          event: this.event,
-          triggered: this.triggered,
-          direction: this.event.type === 'keydown' ? 'down' : 'up',
-          isUp: this.event.type === 'keyup',
-          isDown: this.event.type === 'keydown'
-        }, keys);
-      }
-    }]);
-
-    return Key;
-  }(Service);
-
-  var key = null;
-  /**
-   * Use the keyboard service.
-   *
-   * ```js
-   * import { useKey } from '@studiometa/js-toolkit/services';
-   * const { add, remove, props } = useKey();
-   * add(key, (props) => {});
-   * remove(key);
-   * props();
-   * ```
-   *
-   * @return {ServiceInterface & KeyService}
-   */
-
-  function useKey() {
-    if (!key) {
-      key = new Key();
-    }
-
-    var add = key.add.bind(key);
-    var remove = key.remove.bind(key);
-    var has = key.has.bind(key);
-
-    var props = function props() {
-      return key.props;
-    };
-
-    return {
-      add: add,
-      remove: remove,
-      has: has,
-      props: props
-    };
-  }
-
-  /**
-   * @typedef {import('./index').ServiceInterface} ServiceInterface
-   */
-
-  /**
-   * @typedef {Object} LoadServiceProps
-   * @property {DOMHighResTimeStamp} time
-   */
-
-  /**
-   * @typedef {Object} LoadService
-   * @property {(key:String, callback:(props:LoadServiceProps) => void) => void} add
-   *   Add a function to the resize service. The key must be uniq.
-   * @property {() => LoadServiceProps} props
-   *   Get the current values of the resize service props.
-   */
-
-  /**
-   * Load service
-   */
-
-  var Load = /*#__PURE__*/function (_Service) {
-    _inheritsLoose(Load, _Service);
-
-    function Load() {
-      return _Service.apply(this, arguments) || this;
-    }
-
-    var _proto = Load.prototype;
-
-    /**
-     * Start the requestAnimationFrame loop.
-     *
-     * @return {Load}
-     */
-    _proto.init = function init() {
-      var _this = this;
-
-      this.handler = function () {
-        _this.trigger(_this.props);
-      };
-
-      window.addEventListener('load', this.handler);
-      return this;
-    }
-    /**
-     * Stop the requestAnimationFrame loop.
-     *
-     * @return {Load}
-     */
-    ;
-
-    _proto.kill = function kill() {
-      window.removeEventListener('load', this.handler);
-      return this;
-    }
-    /**
-     * Get raf props.
-     *
-     * @todo Return elapsed time / index?
-     * @type {Object}
-     */
-    ;
-
-    _createClass(Load, [{
-      key: "props",
-      get: function get() {
-        return {};
-      }
-    }]);
-
-    return Load;
-  }(Service);
-
-  var instance = null;
-  /**
-   * Use the load service.
-   *
-   * ```js
-   * import { useLoad } from '@studiometa/js/services';
-   * const { add, remove, props } = useRag();
-   * add(id, (props) => {});
-   * remove(id);
-   * props();
-   * ```
-   *
-   * @return {ServiceInterface & LoadService}
-   */
-
-  function useRaf() {
-    if (!instance) {
-      instance = new Load();
-    }
-
-    var add = instance.add.bind(instance);
-    var remove = instance.remove.bind(instance);
-    var has = instance.has.bind(instance); // eslint-disable-next-line require-jsdoc
-
-    function props() {
-      return instance.props;
-    }
-
-    return {
-      add: add,
-      remove: remove,
-      has: has,
-      props: props
-    };
-  }
-
-  /**
-   * @typedef {import('../index').default} Base
-   * @typedef {import('../../../services').ServiceInterface} ServiceInterface
-   */
-
-  /**
-   * @type {Record<string, () => ServiceInterface>}
-   */
-
-  var SERVICES_MAP = {
-    scrolled: useScroll,
-    resized: useResize,
-    ticked: useRaf$1,
-    moved: usePointer,
-    keyed: useKey,
-    loaded: useRaf
-  };
-  /**
-   * @typedef {keyof SERVICES_MAP} ServiceName
-   */
-
-  /**
-   * Services management for the Base class.
-   */
-
-  var _base = /*#__PURE__*/_classPrivateFieldLooseKey("base");
-
-  var Services = /*#__PURE__*/function () {
-    /** @type {Base} */
-
-    /**
-     * Class constructor.
-     * @param {Base} instance The Base instance.
-     */
-    function Services(instance) {
-      Object.defineProperty(this, _base, {
-        writable: true,
-        value: void 0
-      });
-      _classPrivateFieldLooseBase(this, _base)[_base] = instance;
-    }
-    /**
-     * Test if the given service is registered.
-     *
-     * @param  {ServiceName} service The name of the service.
-     * @return {Boolean}
-     */
-
-
-    var _proto = Services.prototype;
-
-    _proto.has = function has(service) {
-      if (!hasMethod(_classPrivateFieldLooseBase(this, _base)[_base], service) && !SERVICES_MAP[service]) {
-        return false;
-      }
-
-      var _SERVICES_MAP$service = SERVICES_MAP[service](),
-          has = _SERVICES_MAP$service.has;
-
-      return has(_classPrivateFieldLooseBase(this, _base)[_base].$id);
-    }
-    /**
-     * Init the given service and bind it to the given instance.
-     *
-     * @param  {ServiceName} service The name of the service.
-     * @return {() => void}          A function to unbind the service.
-     */
-    ;
-
-    _proto.enable = function enable(service) {
-      if (this.has(service)) {
-        return this.disable.bind(this, service);
-      }
-
-      if (!hasMethod(_classPrivateFieldLooseBase(this, _base)[_base], service) || !SERVICES_MAP[service]) {
-        return function noop() {};
-      }
-
-      var _SERVICES_MAP$service2 = SERVICES_MAP[service](),
-          add = _SERVICES_MAP$service2.add;
-
-      var self = this;
-      /**
-       * @param {any[]} args
-       */
-
-      function serviceHandler() {
-        callMethod.apply(void 0, [_classPrivateFieldLooseBase(self, _base)[_base], service].concat([].slice.call(arguments)));
-      }
-
-      add(_classPrivateFieldLooseBase(this, _base)[_base].$id, serviceHandler);
-      return this.disable.bind(this, service);
-    }
-    /**
-     * Enable all services and return methods to disable them.
-     *
-     * @return {Function[]}
-     */
-    ;
-
-    _proto.enableAll = function enableAll() {
-      var _this = this;
-
-      return Object.keys(SERVICES_MAP).map(
-      /** @param {ServiceName} serviceName */
-      function (serviceName) {
-        return _this.enable(serviceName);
-      });
-    }
-    /**
-     * Disable all services.
-     *
-     * @return {void}
-     */
-    ;
-
-    _proto.disableAll = function disableAll() {
-      var _this2 = this;
-
-      Object.keys(SERVICES_MAP).forEach(
-      /** @param {ServiceName} serviceName */
-      function (serviceName) {
-        _this2.disable(serviceName);
-      });
-    }
-    /**
-     * Disable a service.
-     *
-     * @param  {String} service  The name of the service.
-     * @return {void}
-     */
-    ;
-
-    _proto.disable = function disable(service) {
-      if (!SERVICES_MAP[service]) {
-        return;
-      }
-
-      var _SERVICES_MAP$service3 = SERVICES_MAP[service](),
-          remove = _SERVICES_MAP$service3.remove;
-
-      remove(_classPrivateFieldLooseBase(this, _base)[_base].$id);
-    }
-    /**
-     * Register a new service to be enabled/disabled.
-     *
-     * @param {string}                 name        The name of the service hook.
-     * @param {() => ServiceInterface} useFunction The `use...` function for the service.
-     */
-    ;
-
-    _proto.register = function register(name, useFunction) {
-      SERVICES_MAP[name] = useFunction;
-    }
-    /**
-     * Unregister a new service to be enabled disabled.
-     *
-     * @param {string} name The name of the service hooK
-     */
-    ;
-
-    _proto.unregister = function unregister(name) {
-      delete SERVICES_MAP[name];
-    };
-
-    return Services;
-  }();
-
-  /**
-   * @typedef {import('./index.js').default} Base
-   */
-
-  /**
-   * Bind event handler methods to the root HTML element.
-   *
-   * @param  {Base}  instance     A Base instance.
-   * @param  {Array} eventMethods A list of methods to bind.
-   * @return {Array}              A list of unbind functions.
-   */
-
-  function bindRootEvents(instance, eventMethods) {
-    return eventMethods.map(function (eventMethod) {
-      var eventName = eventMethod.replace(/^on/, '').toLowerCase();
-
-      var handler = function handler() {
-        var args = [].slice.call(arguments);
-
-        if (__DEV__) {
-          debug.apply(void 0, [instance, eventMethod, instance.$el].concat(args));
-        }
-
-        instance[eventMethod].apply(instance, args);
-      };
-
-      instance.$el.addEventListener(eventName, handler);
-      return function () {
-        instance.$el.removeEventListener(eventName, handler);
-      };
-    });
-  }
-  /**
-   * Bind event handler methods to refs HTML element.
-   *
-   * @param  {Base}  instance     A Base instance.
-   * @param  {Array} eventMethods A list of methods to bind.
-   * @return {Array}              A list of unbind functions.
-   */
-
-
-  function bindRefsEvents(instance, eventMethods) {
-    var unbindMethods = [];
-    Object.entries(instance.$refs).forEach(function (_ref) {
-      var refName = _ref[0],
-          $refOrRefs = _ref[1];
-      var $refs = Array.isArray($refOrRefs) ? $refOrRefs : [$refOrRefs];
-      var refEventMethod = "on" + refName.replace(/^\w/, function (c) {
-        return c.toUpperCase();
-      });
-      eventMethods.filter(function (eventMethod) {
-        return eventMethod.startsWith(refEventMethod);
-      }).forEach(function (eventMethod) {
-        $refs.forEach(function ($ref, index) {
-          var eventName = eventMethod.replace(refEventMethod, '').toLowerCase();
-
-          var handler = function handler() {
-            var args = [].slice.call(arguments);
-
-            if (__DEV__) {
-              debug.apply(void 0, [instance, eventMethod, $ref].concat(args, [index]));
-            }
-
-            instance[eventMethod].apply(instance, args.concat([index]));
-          };
-
-          if (__DEV__) {
-            debug(instance, 'binding ref event', refName, eventName);
-          }
-
-          if ($ref instanceof instance.constructor) {
-            // @ts-ignore
-            $ref = $ref.$el; // eslint-disable-line no-param-reassign
-          }
-          /** @type {HTMLElement} */
-
-
-          $ref.addEventListener(eventName, handler);
-
-          var unbindMethod = function unbindMethod() {
-            if (__DEV__) {
-              debug(instance, 'unbinding ref event', refName, eventMethod);
-            }
-            /** @type {HTMLElement} */
-
-
-            $ref.removeEventListener(eventName, handler);
-          };
-
-          unbindMethods.push(unbindMethod);
-        });
-      });
-    });
-    return unbindMethods;
-  }
-  /**
-   * Bind event handler methods to children Base instance.
-   * @param  {Base}  instance     A Base instance.
-   * @param  {Array} eventMethods A list of methods to bind.
-   * @return {Array}              A list of unbind functions.
-   */
-
-
-  function bindChildrenEvents(instance, eventMethods) {
-    var unbindMethods = [];
-    Object.entries(instance.$children).forEach(function (_ref2) {
-      var childName = _ref2[0],
-          $children = _ref2[1];
-      var childEventMethod = "on" + childName.replace(/^\w/, function (c) {
-        return c.toUpperCase();
-      });
-      eventMethods.filter(function (eventMethod) {
-        return eventMethod.startsWith(childEventMethod);
-      }).forEach(function (eventMethod) {
-        $children.forEach(
-        /**
-         * @param {Base|Promise<Base>} $child
-         * @param {Number} index
-         */
-        function ($child, index) {
-          try {
-            var _temp3 = function _temp3() {
-              var unbindMethod = $child.$on(eventName, handler);
-              unbindMethods.push(function () {
-                if (__DEV__) {
-                  debug(instance, 'unbinding child event', childName, eventName);
-                }
-
-                unbindMethod();
-              });
-            };
-
-            var eventName = eventMethod.replace(childEventMethod, '').toLowerCase();
-
-            var handler = function handler() {
-              var args = [].slice.call(arguments);
-
-              if (__DEV__) {
-                debug.apply(void 0, [instance, eventMethod, $child].concat(args, [index]));
-              }
-
-              instance[eventMethod].apply(instance, args.concat([index]));
-            };
-
-            if (__DEV__) {
-              debug(instance, 'binding child event', childName, eventName);
-            }
-
-            var _temp4 = function () {
-              if ($child instanceof Promise) {
-                // eslint-disable-next-line no-param-reassign
-                return Promise.resolve($child).then(function (_$child) {
-                  $child = _$child;
-                });
-              }
-            }();
-
-            return Promise.resolve(_temp4 && _temp4.then ? _temp4.then(_temp3) : _temp3(_temp4));
-          } catch (e) {
-            return Promise.reject(e);
-          }
-        });
-      });
-    });
-    return unbindMethods;
-  }
-  /**
-   * Bind ref and children component's events to their corresponding method.
-   *
-   * @param  {Base} instance  A Base instance.
-   * @return {Array}          A list of methods to unbind the events.
-   */
-
-
-  function bindEvents(instance) {
-    var ROOT_EVENT_REGEX = /^on[A-Z][a-z]+$/;
-    var REFS_CHILDREN_EVENT_REGEX = /^on([A-Z]([a-z]+)?)([A-Z][a-z]+)+$/; // Get all event methods
-
-    var eventMethods = getAllProperties(instance).reduce(function (acc, _ref3) {
-      var name = _ref3[0];
-
-      // Testing camelCase with one word: onEvent.
-      if (ROOT_EVENT_REGEX.test(name) && !acc.root.includes(name)) {
-        acc.root.push(name);
-        return acc;
-      } // Testing camelCase with more than two words: onRefEvent.
-
-
-      if (REFS_CHILDREN_EVENT_REGEX.test(name) && !acc.refsOrChildren.includes(name)) {
-        acc.refsOrChildren.push(name);
-      }
-
-      return acc;
-    }, {
-      root: [],
-      refsOrChildren: []
-    });
-    var unbindMethods = [].concat(bindRootEvents(instance, eventMethods.root), bindRefsEvents(instance, eventMethods.refsOrChildren), bindChildrenEvents(instance, eventMethods.refsOrChildren));
-    return unbindMethods;
-  }
-
-  if (typeof __DEV__ === 'undefined') {
-    if (typeof globalThis !== 'undefined') {
-      globalThis.__DEV__ = false;
-    } else if (typeof window !== 'undefined') {
-      window.__DEV__ = false;
-    }
-  }
-
-  var id = 0;
-  /**
-   * @typedef {typeof Base} BaseComponent
-   * @typedef {(Base) => Promise<BaseComponent | { default: BaseComponent }>} BaseAsyncComponent
-   * @typedef {{ name: string, debug: boolean, log: boolean, [name:string]: any }} BaseOptions
-   * @typedef {{ [name:string]: HTMLElement | HTMLElement[] | Base | Base[] | Promise<Base> | Promise<Base>[] }} BaseRefs
-   * @typedef {{ [nameOrSelector:string]: Base[] | Promise<Base>[] }} BaseChildren
-   * @typedef {{ [nameOrSelector:string]: BaseComponent | BaseAsyncComponent }} BaseConfigComponents
-   * @typedef {import('./classes/Options').OptionsSchema} BaseConfigOptions
-   */
-
-  /**
-   * @typedef {Object} BaseConfig
-   * @property {String} name
-   * @property {Boolean} [debug]
-   * @property {Boolean} [log]
-   * @property {String[]} [refs]
-   * @property {BaseConfigComponents} [components]
-   * @property {BaseConfigOptions} [options]
-   */
-
-  /**
-   * @typedef {import('./classes/Services.js').ServiceName} ServiceName
-   */
-
-  /**
-   * Base class to easily create components.
-   *
-   * @example
-   * ```js
-   * class Component extends Base {
-   *   static config = {
-   *     name: 'Component',
-   *     log: true,
-   *   };
-   *
-   *   mounted() {
-   *     this.$log('Component is mounted!');
-   *   }
-   * }
-   *
-   * class App extends Base {
-   *   static config = {
-   *     name: 'App',
-   *     components: {
-   *       Component,
-   *     },
-   *   };
-   * }
-   *
-   * new App(document.body).$mount();
-   * ```
-   */
-
-  var Base = /*#__PURE__*/function (_EventManager) {
-    _inheritsLoose(Base, _EventManager);
-
-    /**
-     * Class constructor where all the magic takes place.
-     *
-     * @param {HTMLElement} element The component's root element dd.
-     */
-    function Base(element) {
-      var _this;
-
-      _this = _EventManager.call(this) || this;
-      _this.$parent = null;
-      _this.$isMounted = false;
-
-      if (!element) {
-        throw new Error('The root element must be defined.');
-      }
-
-      var _getConfig = getConfig(_assertThisInitialized(_this)),
-          name = _getConfig.name;
-      /** @type {String} */
-
-
-      _this.$id = name + "-" + id;
-      id += 1;
-      /** @type {HTMLElement} */
-
-      _this.$el = element;
-      _this.$options = getOptions(_assertThisInitialized(_this), element, getConfig(_assertThisInitialized(_this)));
-      _this.$children = getChildren(_assertThisInitialized(_this), _this.$el, getConfig(_assertThisInitialized(_this)).components || {});
-      _this.$services = new Services(_assertThisInitialized(_this));
-
-      if (!('__base__' in _this.$el)) {
-        Object.defineProperty(_this.$el, '__base__', {
-          get: function get() {
-            return _assertThisInitialized(_this);
-          },
-          configurable: true
-        });
-      } // Autobind all methods to the instance
-
-
-      autoBind(_assertThisInitialized(_this), {
-        exclude: [].concat(_this._excludeFromAutoBind)
-      });
-      var unbindMethods = [];
-
-      _this.$on('mounted', function () {
-        _this.$services.enableAll();
-
-        unbindMethods = [].concat(bindEvents(_assertThisInitialized(_this)));
-        mountComponents(_assertThisInitialized(_this));
-        _this.$isMounted = true;
-      });
-
-      _this.$on('updated', function () {
-        _this.$services.disableAll();
-
-        unbindMethods.forEach(function (method) {
-          return method();
-        });
-        unbindMethods = [].concat(bindEvents(_assertThisInitialized(_this)));
-
-        _this.$services.enableAll();
-
-        mountOrUpdateComponents(_assertThisInitialized(_this));
-      });
-
-      _this.$on('destroyed', function () {
-        _this.$isMounted = false;
-
-        _this.$services.disableAll();
-
-        unbindMethods.forEach(function (method) {
-          return method();
-        });
-        destroyComponents(_assertThisInitialized(_this));
-      });
-
-      if (__DEV__) {
-        debug(_assertThisInitialized(_this), 'constructor', _assertThisInitialized(_this));
-      }
-
-      return _assertThisInitialized(_this) || _assertThisInitialized(_this);
-    }
-    /**
-     * Small helper to log stuff.
-     *
-     * @return {(...args: any) => void} A log function if the log options is active.
-     */
-
-
-    var _proto = Base.prototype;
-
-    /**
-     * Trigger the `mounted` callback.
-     */
-    _proto.$mount = function $mount() {
-      if (__DEV__) {
-        debug(this, '$mount');
-      }
-
-      callMethod(this, 'mounted');
-      return this;
-    }
-    /**
-     * Update the instance children.
-     */
-    ;
-
-    _proto.$update = function $update() {
-      if (__DEV__) {
-        debug(this, '$update');
-      }
-
-      callMethod(this, 'updated');
-      return this;
-    }
-    /**
-     * Trigger the `destroyed` callback.
-     */
-    ;
-
-    _proto.$destroy = function $destroy() {
-      if (__DEV__) {
-        debug(this, '$destroy');
-      }
-
-      callMethod(this, 'destroyed');
-      return this;
-    }
-    /**
-     * Terminate a child instance when it is not needed anymore.
-     * @return {void}
-     */
-    ;
-
-    _proto.$terminate = function $terminate() {
-      if (__DEV__) {
-        debug(this, '$terminate');
-      } // First, destroy the component.
-
-
-      this.$destroy(); // Execute the `terminated` hook if it exists
-
-      callMethod(this, 'terminated'); // Delete the reference to the instance
-      // delete this.$el.__base__;
-      // And update its status to prevent re-instantiation when accessing the
-      // parent's `$children` property
-
-      Object.defineProperty(this.$el, '__base__', {
-        value: 'terminated',
-        configurable: false,
-        writable: false
-      });
-    }
-    /**
-     * Factory method to generate multiple instance of the class.
-     *
-     * @param  {String}      nameOrSelector The selector on which to mount each instance.
-     * @return {Array<Base>}                A list of the created instance.
-     */
-    ;
-
-    Base.$factory = function $factory(nameOrSelector) {
-      var _this2 = this;
-
-      if (!nameOrSelector) {
-        throw new Error('The $factory method requires a component’s name or selector to be specified.');
-      }
-
-      return getComponentElements(nameOrSelector).map(function (el) {
-        return new _this2(el).$mount();
-      });
-    };
-
-    _createClass(Base, [{
-      key: "_excludeFromAutoBind",
-      get:
-      /**
-       * The instance parent.
-       * @type {Base}
-       */
-
-      /**
-       * The state of the component.
-       * @type {Boolean}
-       */
-
-      /**
-       * This is a Base instance.
-       * @type {Boolean}
-       */
-
-      /**
-       * Get properties to exclude from the autobind call.
-       * @return {Array<String|RegExp>}
-       */
-      function get() {
-        return ['$mount', '$update', '$destroy', '$terminate', '$log', '$on', '$once', '$off', '$emit', 'mounted', 'loaded', 'ticked', 'resized', 'moved', 'keyed', 'scrolled', 'destroyed', 'terminated'];
-      }
-      /**
-       * @deprecated Use the static `config` property instead.
-       * @return {BaseConfig}
-       */
-
-    }, {
-      key: "config",
-      get: function get() {
-        return null;
-      }
-      /** @type {BaseConfig} */
-
-    }, {
-      key: "$refs",
-      get:
-      /**
-       * Get the component's refs.
-       * @return {BaseRefs}
-       */
-      function get() {
-        return getRefs(this, this.$el);
-      }
-    }, {
-      key: "$log",
-      get: function get() {
-        return this.$options.log ? window.console.log.bind(window, "[" + this.$options.name + "]") : function noop() {};
-      }
-    }]);
-
-    return Base;
-  }(EventManager);
-
-  Base.$isBase = true;
-
-  var _excluded = ["config", "methods"];
-  /**
-   * @typedef {import('../abstracts/Base').BaseComponent} BaseComponent
-   */
-
-  /**
-   * Define a component without a class.
-   *
-   * @param  {Object} options The component's object
-   * @return {BaseComponent}           A component's class.
-   */
-
-  function defineComponent(options) {
-    var config = options.config,
-        methods = options.methods,
-        hooks = _objectWithoutPropertiesLoose(options, _excluded);
-
-    if (!config) {
-      throw new Error('The `config` property is required.');
-    }
-
-    if (!config.name) {
-      throw new Error('The `config.name` property is required.');
-    }
-    /**
-     * Component class.
-     */
-
-
-    var Component = /*#__PURE__*/function (_Base) {
-      _inheritsLoose(Component, _Base);
-
-      function Component() {
-        return _Base.apply(this, arguments) || this;
-      }
-
-      return Component;
-    }(Base);
-
-    Component.config = config;
-    var allowedHooks = ['mounted', 'loaded', 'ticked', 'resized', 'moved', 'keyed', 'scrolled', 'destroyed', 'terminated'];
-    var filteredHooks = Object.entries(hooks).reduce(function (acc, _ref) {
-      var name = _ref[0],
-          fn = _ref[1];
-
-      if (allowedHooks.includes(name)) {
-        acc[name] = fn;
-      } else {
-        throw new Error("\n          The \"" + name + "\" method is not a Base lifecycle hook,\n          it should be placed in the \"method\" property.\n          The following hooks are available: " + allowedHooks.join(', ') + "\n        ");
-      }
-
-      return acc;
-    }, {});
-    [].concat(Object.entries(methods || {}), Object.entries(filteredHooks)).forEach(function (_ref2) {
-      var name = _ref2[0],
-          fn = _ref2[1];
-      Component.prototype[name] = fn;
-    });
-    return Component;
-  }
-
-  /**
-   * Create a Base instance with the given object configuration.
-   *
-   * @param {HTMLElement|String} elementOrSelector The instance root HTML element.
-   * @param {Object}             options           The Base class configuration.
-   */
-
-  function createBase(elementOrSelector, options) {
-    var Component = defineComponent(options);
-    /** @type {HTMLElement} */
-
-    var element = typeof elementOrSelector === 'string' ? document.querySelector(elementOrSelector) : elementOrSelector;
-    return new Component(element);
-  }
-
-  exports.Base = Base;
-  exports.createBase = createBase;
-  exports.default = Base;
-  exports.defineComponent = defineComponent;
-
-})));
-//# sourceMappingURL=index.umd.js.map
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e||self).Base={})}(this,function(e){function t(){return(t=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var i=arguments[t];for(var r in i)Object.prototype.hasOwnProperty.call(i,r)&&(e[r]=i[r])}return e}).apply(this,arguments)}var i=0;function r(e){return"__private_"+i+++"_"+e}function s(e,t){if(!Object.prototype.hasOwnProperty.call(e,t))throw new TypeError("attempted to use private field on non-instance");return e}function n(e,t){return"function"==typeof e[t]}function o(e,t){var i=[].slice.call(arguments,2);return e.__debug("callMethod",t,...i),"destroyed"===t&&!e.$isMounted||"mounted"===t&&e.$isMounted?(e.__debug("not",t,"because the method has already been triggered once."),e):(e.$emit(t,...i),n(e,t)?(e[t].call(e,...i),e.__debug(t,e,...i),e):e)}function a(e,t){void 0===t&&(t=document);var i='[data-component="'+e+'"]',r=[];try{r=Array.from(t.querySelectorAll(i))}catch(e){}return 0===r.length&&(r=Array.from(t.querySelectorAll(e))),r}class h{get registeredNames(){return Object.keys(this).filter(e=>!e.startsWith("__"))}constructor(e,t,i,r){Object.defineProperties(this,{__base:{enumerable:!1,writable:!1,value:e},__element:{enumerable:!1,writable:!1,value:t},__components:{enumerable:!1,writable:!1,value:i},__eventsManager:{enumerable:!1,writable:!1,value:r}})}registerAll(){Object.entries(this.__components).forEach(e=>{var[t,i]=e;return this.__register(t,i)})}__register(e,t){Object.defineProperty(this,e,{enumerable:!0,configurable:!0,get:()=>{var i=a(e,this.__element);return 0===i.length?[]:i.map(i=>this.__getChild(i,t,e)).filter(e=>"terminated"!==e)}})}__getChild(e,t,i){if(e.__base__)return e.__base__;if("$isBase"in t){var r=new t(e);return Object.defineProperty(r,"$parent",{get:()=>this.__base}),r}return t(this.__base).then(t=>{var r;return this.__getChild(e,null!=(r=t.default)?r:t,i)})}mountAll(){this.__triggerHookForAll("$mount")}updateAll(){this.__triggerHookForAll("$update")}destroyAll(){this.__triggerHookForAll("$destroy")}__triggerHookForAll(e){this.registeredNames.forEach(t=>{this[t].forEach(i=>{i instanceof Promise?i.then(i=>this.__triggerHook(e,i,t)):this.__triggerHook(e,i,t)})})}__triggerHook(e,t,i){"$update"!==e||t.$isMounted||(e="$mount"),"$update"!==e&&"$destroy"!==e||this.__eventsManager.unbindChild(i,t),"$update"!==e&&"$mount"!==e||this.__eventsManager.bindChild(i,t),t[e]()}}class d{constructor(e,t,i,r){Object.defineProperties(this,{__element:{enumerable:!1,writable:!1,value:t},__refs:{enumerable:!1,writable:!1,value:i},__base:{enumerable:!1,writable:!1,value:e},__eventsManager:{enumerable:!1,writable:!1,value:r}})}registerAll(){this.__refs.forEach(e=>this.__register(e))}unregisterAll(){this.__refs.forEach(e=>this.__unregister(e))}__register(e){var t=e.endsWith("[]"),i=d.normalizeRefName(e),r=Array.from(this.__element.querySelectorAll('[data-ref="'+e+'"]')).filter(e=>this.__filterRefsBelongingToInstance(e));!t&&r.length>1&&console.warn("["+this.__base.$options.name+"]",'The "'+e+'" ref has been found multiple times.',"Did you forgot to add the `[]` suffix to its name?"),this.__eventsManager.bindRef(e,r),Object.defineProperty(this,i,{value:t||r.length>1?r:r[0],enumerable:!0,configurable:!0})}__unregister(e){var t=d.normalizeRefName(e),i=Array.isArray(this[t])?this[t]:[this[t]];this.__eventsManager.unbindRef(e,i)}static normalizeRefName(e){return e.endsWith("[]")?e.replace(/\[\]$/,""):e}__filterRefsBelongingToInstance(e){for(var t=e.parentElement;t&&void 0===t.dataset.component;)t=t.parentElement;return null===t||t===this.__element}}class l{constructor(){this.callbacks=new Map,this.isInit=!1}get props(){throw new Error("The `props` getter must be implemented.")}init(){throw new Error("The `init` method must be implemented.")}kill(){throw new Error("The `kill` method must be implemented.")}add(e,t){if(this.has(e))throw new Error("A callback with the key `"+e+"` has already been registered.");return 0!==this.callbacks.size||this.isInit||(this.init(),this.isInit=!0),this.callbacks.set(e,t),this}has(e){return this.callbacks.has(e)}get(e){return this.callbacks.get(e)}remove(e){return this.callbacks.delete(e),0===this.callbacks.size&&this.isInit&&(this.kill(),this.isInit=!1),this}trigger(){var e=[].slice.call(arguments);return this.callbacks.forEach(function(t){t(...e)}),this}}function u(e){return"undefined"!=typeof TouchEvent&&e instanceof TouchEvent}class c extends l{constructor(){super(...arguments),this.isDown=!1,this.y=window.innerHeight/2,this.yLast=window.innerHeight/2,this.x=window.innerWidth/2,this.xLast=window.innerWidth/2,this.hasRaf=!1}init(){document.documentElement.addEventListener("mouseenter",this,{once:!0,capture:!0});var e={passive:!0,capture:!0};return document.addEventListener("mousemove",this,e),document.addEventListener("touchmove",this,e),document.addEventListener("mousedown",this,e),document.addEventListener("touchstart",this,e),document.addEventListener("mouseup",this,e),document.addEventListener("touchend",this,e),this}handleEvent(e){switch(e.type){case"mouseenter":case"mousemove":case"touchmove":this.handler(e);break;case"mousedown":case"touchstart":this.downHandler();break;case"mouseup":case"touchend":this.upHandler()}}kill(){return document.removeEventListener("mousemove",this),document.removeEventListener("touchmove",this),document.removeEventListener("mousedown",this),document.removeEventListener("touchstart",this),document.removeEventListener("mouseup",this),document.removeEventListener("touchend",this),this}handler(e){this.updateValues(e),this.trigger(this.props)}downHandler(){this.isDown=!0,this.trigger(this.props)}upHandler(){this.isDown=!1,this.trigger(this.props)}updateValues(e){var t,i;this.event=e,this.yLast=this.y,this.xLast=this.x;var r=u(e)?null==(t=e.touches[0])?void 0:t.clientY:e.clientY;r!==this.y&&(this.y=r);var s=u(e)?null==(i=e.touches[0])?void 0:i.clientX:e.clientX;s!==this.x&&(this.x=s)}get props(){return{event:this.event,isDown:this.isDown,x:this.x,y:this.y,changed:{x:this.x!==this.xLast,y:this.y!==this.yLast},last:{x:this.xLast,y:this.yLast},delta:{x:this.x-this.xLast,y:this.y-this.yLast},progress:{x:this.x/window.innerWidth,y:this.y/window.innerHeight},max:{x:window.innerWidth,y:window.innerHeight}}}}var p=null;function m(){return p||(p=new c),{add:p.add.bind(p),remove:p.remove.bind(p),has:p.has.bind(p),props:()=>p.props}}class v extends l{constructor(){super(),this.isTicking=!1,this.id=0,this.raf="undefined"!=typeof window&&window.requestAnimationFrame?window.requestAnimationFrame.bind(window):setTimeout,this.cancelRaf="undefined"!=typeof window&&window.cancelAnimationFrame?window.cancelAnimationFrame.bind(window):clearTimeout,this.loop=this.loop.bind(this)}init(){return this.isTicking=!0,this.loop(),this}loop(){this.trigger(this.props),this.isTicking&&(this.id=this.raf(this.loop))}kill(){return this.cancelRaf(this.id),this.isTicking=!1,this}get props(){return{time:window.performance.now()}}}var _=null;function f(){return _||(_=new v),{add:_.add.bind(_),remove:_.remove.bind(_),has:_.has.bind(_),props:function(){return _.props}}}function g(e,t){var i;return void 0===t&&(t=300),function(){clearTimeout(i),i=setTimeout(()=>{e(...[].slice.call(arguments))},t)}}class b extends l{init(){return this.handler=g(()=>{this.trigger(this.props)}).bind(this),window.addEventListener("resize",this.handler),this}kill(){return window.removeEventListener("resize",this.handler),this}get props(){var e={width:window.innerWidth,height:window.innerHeight,ratio:window.innerWidth/window.innerHeight,orientation:"square"};return e.ratio>1&&(e.orientation="landscape"),e.ratio<1&&(e.orientation="portrait"),this.breakpointElement&&(e.breakpoint=this.breakpoint,e.breakpoints=this.breakpoints),e}get breakpointElement(){return document.querySelector("[data-breakpoint]")||null}get breakpoint(){return window.getComputedStyle(this.breakpointElement,"::before").getPropertyValue("content").replace(/"/g,"")}get breakpoints(){return window.getComputedStyle(this.breakpointElement,"::after").getPropertyValue("content").replace(/"/g,"").split(",")}}var y=null;function w(){return y||(y=new b),{add:y.add.bind(y),remove:y.remove.bind(y),has:y.has.bind(y),props:()=>y.props}}class $ extends l{constructor(){super(...arguments),this.y=window.pageYOffset,this.yLast=window.pageYOffset,this.x=window.pageXOffset,this.xLast=window.pageXOffset}init(){return document.addEventListener("scroll",this,{passive:!0,capture:!0}),this}get debouncedHandler(){var e=g(()=>{this.trigger(this.props)},0);return Object.defineProperty(this,"debouncedHandler",{value:e}),e}handleEvent(){this.trigger(this.props),this.debouncedHandler()}kill(){return document.removeEventListener("scroll",this),this}get props(){return this.yLast=this.y,this.xLast=this.x,window.pageYOffset!==this.y&&(this.y=window.pageYOffset),window.pageXOffset!==this.x&&(this.x=window.pageXOffset),{x:this.x,y:this.y,changed:{x:this.x!==this.xLast,y:this.y!==this.yLast},last:{x:this.xLast,y:this.yLast},delta:{x:this.x-this.xLast,y:this.y-this.yLast},progress:{x:0===this.max.x?1:this.x/this.max.x,y:0===this.max.y?1:this.y/this.max.y},direction:{x:this.x>this.xLast?"RIGHT":this.x<this.xLast?"LEFT":"NONE",y:this.y>this.yLast?"DOWN":this.y<this.yLast?"UP":"NONE"},max:this.max}}get max(){return{x:(document.scrollingElement||document.body).scrollWidth-window.innerWidth,y:(document.scrollingElement||document.body).scrollHeight-window.innerHeight}}}var E=null;function x(){return E||(E=new $),{add:E.add.bind(E),remove:E.remove.bind(E),has:E.has.bind(E),props:()=>E.props}}var k={ENTER:13,SPACE:32,TAB:9,ESC:27,LEFT:37,UP:38,RIGHT:39,DOWN:40};class O extends l{constructor(){super(...arguments),this.event={},this.triggered=0,this.previousEvent={}}init(){return this.handler=e=>{this.event=e,this.trigger(this.props)},document.addEventListener("keydown",this.handler,{passive:!1}),document.addEventListener("keyup",this.handler,{passive:!1}),this}kill(){return document.removeEventListener("keydown",this.handler),document.removeEventListener("keyup",this.handler),this}get props(){var e=Object.entries(k).reduce((e,t)=>{var[i,r]=t;return e[i]=r===this.event.keyCode,e},{});return this.previousEvent.type||(this.triggered=0),"keydown"===this.event.type&&"keydown"===this.previousEvent.type?this.triggered+=1:this.triggered=1,this.previousEvent=this.event,t({event:this.event,triggered:this.triggered,direction:"keydown"===this.event.type?"down":"up",isUp:"keyup"===this.event.type,isDown:"keydown"===this.event.type},e)}}var A=null;function L(){return A||(A=new O),{add:A.add.bind(A),remove:A.remove.bind(A),has:A.has.bind(A),props:()=>A.props}}class j extends l{init(){return this.handler=()=>{this.trigger(this.props)},window.addEventListener("load",this.handler),this}kill(){return window.removeEventListener("load",this.handler),this}get props(){return{}}}var M=null;function N(){return M||(M=new j),{add:M.add.bind(M),remove:M.remove.bind(M),has:M.has.bind(M),props:function(){return M.props}}}var T={scrolled:x,resized:w,ticked:f,moved:m,keyed:L,loaded:N},B=Object.keys(T);class H{get __services(){return t({},this.__customServices,T)}constructor(e){this.__customServices={},Object.defineProperties(this,{__base:{enumerable:!1,writable:!1,value:e}})}has(e){if(!n(this.__base,e)&&!this.__services[e])return!1;var{has:t}=this.__services[e]();return t(this.__base.$id)}enable(e){if(this.has(e))return this.disable.bind(this,e);if(!n(this.__base,e)||!this.__services[e])return function(){};var{add:t}=this.__services[e](),i=this;return t(this.__base.$id,function(){o(i.__base,e,...[].slice.call(arguments))}),this.disable.bind(this,e)}enableAll(){return Object.keys(this.__services).map(e=>this.enable(e))}disableAll(){Object.keys(this.__services).forEach(e=>{this.disable(e)})}disable(e){if(this.__services[e]){var{remove:t}=this.__services[e]();t(this.__base.$id)}}register(e,t){this.__customServices[e]=t}unregister(e){if(B.includes(e))throw new Error("[ServicesManager] The `"+e+"` core service can not be unregistered.");delete this.__customServices[e]}}function P(e,t,i){void 0===t&&(t=[]),void 0===i&&(i=null);var r=Object.getPrototypeOf(e);if(r===Object.prototype)return t;var s=Object.getOwnPropertyNames(r);return"function"==typeof i&&(s=s.filter(e=>i(e,r))),s=s.map(e=>[e,r]).reduce((e,t)=>[...e,t],t),P(r,s,i)}class S{constructor(e,t){this.__methodsCache=new Map,this.__rootElementHandler={handleEvent:e=>{var t=S.normalizeName(e.type);this.__base["on"+t](e)}},this.__refsHandler={handleEvent:e=>{var t=e.currentTarget,i=d.normalizeRefName(t.dataset.ref),r="on"+S.normalizeName(i)+S.normalizeName(e.type),s=0;Array.isArray(this.__base.$refs[i])&&(s=this.__base.$refs[i].indexOf(t)),this.__base[r](e,s)}},this.__childrenHandler={handleEvent:e=>{var t,i=e.currentTarget.__base__,r=0,s=this.__base.$children;s.registeredNames.find(e=>!!s[e].includes(i)&&(t=e,r=s[e].indexOf(i),!0));var n="on"+S.normalizeName(t)+S.normalizeName(e.type),o=Array.isArray(e.detail)?e.detail:[];this.__base[n](...o,r,e)}},Object.defineProperties(this,{__rootElement:{enumerable:!1,writable:!1,value:e},__base:{enumerable:!1,writable:!1,value:t},__methodsCache:{enumerable:!1,writable:!1,value:this.__methodsCache},__rootElementHandler:{enumerable:!1,writable:!1,value:this.__rootElementHandler},__refsHandler:{enumerable:!1,writable:!1,value:this.__refsHandler},__childrenHandler:{enumerable:!1,writable:!1,value:this.__childrenHandler}})}__manageRef(e,t,i){void 0===i&&(i="add");var r=i+"EventListener";this.__getEventMethodsByName(e).forEach(i=>{var s=this.__getEventNameByMethod(i,e);t.forEach(e=>e[r](s,this.__refsHandler))})}bindRef(e,t){this.__manageRef(e,t)}unbindRef(e,t){this.__manageRef(e,t,"remove")}__manageChild(e,t,i){void 0===i&&(i="add");var r="add"===i?"$on":"$off";this.__getEventMethodsByName(e).forEach(i=>{var s=this.__getEventNameByMethod(i,e);t[r](s,this.__childrenHandler)})}bindChild(e,t){this.__manageChild(e,t)}unbindChild(e,t){this.__manageChild(e,t,"remove")}__manageRootElement(e){void 0===e&&(e="add");var t=e+"EventListener";this.__getEventMethodsByName().forEach(e=>{var i=this.__getEventNameByMethod(e);this.__rootElement[t](i,this.__rootElementHandler)})}bindRootElement(){this.__manageRootElement()}unbindRootElement(){this.__manageRootElement("remove")}__getEventNameByMethod(e,t){void 0===t&&(t="");var i=S.normalizeName(t),r=new RegExp("^on"+i+"([A-Z].*)$"),[,s]=e.match(r);return S.normalizeEventName(s)}__getEventMethodsByName(e){void 0===e&&(e="");var t=S.normalizeName(e),i=new RegExp("^on"+t+"[A-Z].*$"),r=i.toString(),s=this.__methodsCache.get(r);return s||(s=Array.from(P(this.__base,[],e=>i.test(e)).reduce((e,t)=>{var[i]=t;return e.add(i)},new Set)),this.__methodsCache.set(r,s)),s}static normalizeName(e){return e.replace(/[A-Z]([A-Z].*)/g,e=>e.toLowerCase()).replace(/[^a-zA-Z\d\s:]/g," ").replace(/(^\w|\s+\w)/g,e=>e.trim().toUpperCase()).trim()}static normalizeEventName(e){return e.replace(/[A-Z]/g,e=>"-"+e.toLowerCase()).replace(/^-/,"")}}var C=function(e){return function(e){return!!e&&"object"==typeof e}(e)&&!function(e){var t=Object.prototype.toString.call(e);return"[object RegExp]"===t||"[object Date]"===t||function(e){return e.$$typeof===I}(e)}(e)},I="function"==typeof Symbol&&Symbol.for?Symbol.for("react.element"):60103;function R(e,t){return!1!==t.clone&&t.isMergeableObject(e)?V(Array.isArray(e)?[]:{},e,t):e}function W(e,t,i){return e.concat(t).map(function(e){return R(e,i)})}function z(e){return Object.keys(e).concat(function(e){return Object.getOwnPropertySymbols?Object.getOwnPropertySymbols(e).filter(function(t){return e.propertyIsEnumerable(t)}):[]}(e))}function D(e,t){try{return t in e}catch(e){return!1}}function V(e,t,i){(i=i||{}).arrayMerge=i.arrayMerge||W,i.isMergeableObject=i.isMergeableObject||C,i.cloneUnlessOtherwiseSpecified=R;var r=Array.isArray(t);return r===Array.isArray(e)?r?i.arrayMerge(e,t,i):function(e,t,i){var r={};return i.isMergeableObject(e)&&z(e).forEach(function(t){r[t]=R(e[t],i)}),z(t).forEach(function(s){(function(e,t){return D(e,t)&&!(Object.hasOwnProperty.call(e,t)&&Object.propertyIsEnumerable.call(e,t))})(e,s)||(r[s]=D(e,s)&&i.isMergeableObject(t[s])?function(e,t){if(!t.customMerge)return V;var i=t.customMerge(e);return"function"==typeof i?i:V}(s,i)(e[s],t[s],i):R(t[s],i))}),r}(e,t,i):R(t,i)}V.all=function(e,t){if(!Array.isArray(e))throw new Error("first argument should be an array");return e.reduce(function(e,i){return V(e,i,t)},{})};var q=V;class F{constructor(e,t,i){var r,s;return this.__values={},this.__defaultValues={String:"",Number:0,Boolean:!1,Array:()=>[],Object:()=>({})},this.name="Base",this.debug=!1,this.log=!1,Object.defineProperties(this,{__element:{enumerable:!1,writable:!1,value:e},__values:{enumerable:!1,writable:!1,value:this.__values},__defaultValues:{enumerable:!1,writable:!1,value:this.__defaultValues}}),this.name=i.name,t.debug={type:Boolean,default:null!=(r=i.debug)&&r},t.log={type:Boolean,default:null!=(s=i.log)&&s},Object.entries(t).forEach(e=>{var[t,i]=e;this.__register(t,i)}),this}__register(e,t){var i=!F.types.includes(t),r=i?t.type:t;if(!F.types.includes(r))throw new Error('The "'+e+'" option has an invalid type. The allowed types are: String, Number, Boolean, Array and Object.');var s=i?t.default:this.__defaultValues[r.name];if((r===Array||r===Object)&&"function"!=typeof s)throw new Error('The default value for options of type "'+r.name+'" must be returned by a function.');Object.defineProperty(this,e,{get:()=>this.get(e,r,s),set:t=>{this.set(e,r,t,s)},enumerable:!0})}get(e,t,i){var r=F.__getPropertyName(e),s=this.__hasProperty(r);if(t===Boolean){if(i){var n=F.__getPropertyName(e,"No");return!this.__hasProperty(n)}return s||i}var o=this.__element.dataset[r];if(t===Number)return s?Number(o):i;if(t===Array||t===Object){var a=q(i(),s?JSON.parse(o):this.__defaultValues[t.name]());return this.__values[e]||(this.__values[e]=a),this.__values[e]}return s?o:i}set(e,t,i,r){var s=F.__getPropertyName(e);if(i.constructor.name!==t.name){var n=Array.isArray(i)||function(e){return"object"==typeof e&&!!e&&"[object Object]"===e.toString()}(i)?JSON.stringify(i):i;throw new TypeError('The "'+n+'" value for the "'+e+'" option must be of type "'+t.name+'"')}switch(t){case Boolean:if(r){var o=F.__getPropertyName(e,"No");i?delete this.__element.dataset[o]:this.__element.dataset[o]=""}else i?this.__element.dataset[s]="":delete this.__element.dataset[s];break;case Array:case Object:this.__values[e]=i;break;default:this.__element.dataset[s]=i}}__hasProperty(e){return void 0!==this.__element.dataset[e]}static __getPropertyName(e,t){void 0===t&&(t="");var i=e+t;if(F.__propertyNameCache.has(i))return F.__propertyNameCache.get(i);var r="option"+t+e.replace(/^\w/,e=>e.toUpperCase());return F.__propertyNameCache.set(i,r),r}}F.types=[String,Number,Boolean,Array,Object],F.__propertyNameCache=new Map;var G=0;function Y(){}class X{get $root(){if(!this.$parent)return this;for(var e=this.$parent,t=this.$parent;e;)e.$parent||(t=e),e=e.$parent;return t}get __config(){for(var e=Object.getPrototypeOf(this),{config:i}=e.constructor;e.constructor.config&&e.constructor.$isBase;)i=t({},e.constructor.config,i),e.constructor.config.options&&(i.options=t({},e.constructor.config.options,i.options)),e=Object.getPrototypeOf(e);return i}get $services(){var e=this.__services;return this.$emit("get:services",e),e}get $refs(){var e=this.__refs;return this.$emit("get:refs",e),e}get $options(){var e=this.__options;return this.$emit("get:options",e),e}get $children(){var e=this.__children;return this.$emit("get:children",e),e}get $log(){return this.__options.log?window.console.log.bind(window,"["+this.__config.name+"]"):Y}get __debug(){return this.__options.debug&&void 0!==window.__DEV__&&window.__DEV__?window.console.log.bind(window,"[debug] ["+this.$id+"]"):Y}constructor(e){if(this.$parent=null,this.$isMounted=!1,!e)throw new Error("The root element must be defined.");var{__config:t}=this;if(!t)throw new Error("The `config` static property must be defined.");if(!t.name)throw new Error("The `config.name` property is required.");return this.$id=t.name+"-"+G,G+=1,this.$el=e,"__base__"in this.$el||Object.defineProperty(this.$el,"__base__",{get:()=>this,configurable:!0}),this.__options=new F(e,t.options||{},t),this.__services=new H(this),this.__events=new S(e,this),this.__children=new h(this,e,t.components||{},this.__events),this.__refs=new d(this,e,t.refs||[],this.__events),this.__debug("constructor",this),this}$mount(){return this.__debug("$mount"),this.$children.registerAll(),this.$refs.registerAll(),this.__events.bindRootElement(),this.$services.enableAll(),this.$children.mountAll(),o(this,"mounted"),this.$isMounted=!0,this}$update(){return this.__debug("$update"),this.$refs.unregisterAll(),this.$services.disableAll(),this.$children.registerAll(),this.$refs.registerAll(),this.$services.enableAll(),this.$children.updateAll(),o(this,"updated"),this}$destroy(){return this.__debug("$destroy"),this.__events.unbindRootElement(),this.$refs.unregisterAll(),this.$services.disableAll(),this.$children.destroyAll(),o(this,"destroyed"),this.$isMounted=!1,this}$terminate(){this.__debug("$terminate"),this.$destroy(),o(this,"terminated"),Object.defineProperty(this.$el,"__base__",{value:"terminated",configurable:!1,writable:!1})}static $factory(e){if(!e)throw new Error("The $factory method requires a component’s name or selector to be specified.");return a(e).map(e=>new this(e).$mount())}$on(e,t,i){return this.__debug("$on",e,t,i),this.$el.addEventListener(e,t,i),()=>{this.$off(e,t,i)}}$off(e,t,i){this.__debug("$off",e,t),this.$el.removeEventListener(e,t,i)}$emit(e){var t=[].slice.call(arguments,1);this.__debug("$emit",e,t),this.$el.dispatchEvent(new CustomEvent(e,{detail:t}))}}function U(e){var{breakpoint:t}=w().props();e.forEach(e=>{var[i,r]=e;i.includes(t)&&!r.$isMounted?setTimeout(()=>r.$mount(),0):!i.includes(t)&&r.$isMounted&&r.$destroy()})}X.$isBase=!0;var Z=new WeakMap;function J(e,t){void 0===t&&(t=w().props().breakpoint);var{activeBreakpoints:i,inactiveBreakpoints:r}=e.$options,s=i&&i.split(" ").includes(t),n=r&&r.split(" ").includes(t);return i&&s||r&&!n?"$mount":"$destroy"}function K(e){var{activeBreakpoints:t,inactiveBreakpoints:i}=e.$options;return Boolean(t||i)}function Q(e,t){!function(e){var{activeBreakpoints:t,inactiveBreakpoints:i,name:r}=e.$options;if(t&&i)throw new Error("["+r+"] Incorrect configuration: the `activeBreakpoints` and `inactiveBreakpoints` are not compatible.")}(t);var{add:i,has:r}=w();r(e)||i(e,function(e){var{breakpoint:i}=e,r=J(t,i);"$destroy"===r&&t.$isMounted?t[r]():"$mount"!==r||t.$isMounted||setTimeout(()=>t[r](),0)})}function ee(e,t,i){if(void 0===i&&(i=.85),i>=1||i<=0)throw new Error("The `factor` parameter must be a number greater than 0 and smaller than 1, `"+i+"` given.");for(var r=t,s=e;Math.abs(r)>.1;)s+=r,r*=i;return s}var te="drag",ie="inertia",re=0;class se extends l{constructor(e,i){return void 0===i&&(i={}),super(),this.isGrabbing=!1,this.hasInertia=!1,this.x=0,this.y=0,this.delta={x:0,y:0},this.origin={x:0,y:0},this.distance={x:0,y:0},this.final={x:0,y:0},this.options={factor:.85},this.id="drag-"+(re+=1),this.target=e,this.options=t({},this.options,i),this.pointerHandler=this.pointerHandler.bind(this),this.rafHandler=this.rafHandler.bind(this),this}init(){var e={passive:!0};return this.target.addEventListener("mousedown",this,e),this.target.addEventListener("touchstart",this,e),m().add(this.id,this.pointerHandler),this}kill(){return this.target.removeEventListener("mousemove",this),this.target.removeEventListener("touchmove",this),m().remove(this.id),this}handleEvent(e){var t=e instanceof MouseEvent?e.clientX:e.touches[0].clientX,i=e instanceof MouseEvent?e.clientY:e.touches[0].clientY;this.start(t,i)}start(e,t){this.x=e,this.y=t,this.origin.x=e,this.origin.y=t,this.delta.x=0,this.delta.y=0,this.distance.x=0,this.distance.y=0,this.final.x=e,this.final.y=t,this.mode="start",this.isGrabbing=!0,this.trigger(this.props)}drop(){this.isGrabbing=!1,this.mode="drop",this.hasInertia=!0,this.final.x=ee(this.x,this.delta.x,this.options.factor),this.final.y=ee(this.y,this.delta.y,this.options.factor),this.trigger(this.props),setTimeout(()=>{var e=f();e.remove(this.id),e.add(this.id,this.rafHandler)},0)}stop(){f().remove(this.id),this.hasInertia=!1,this.mode="stop",this.trigger(this.props)}rafHandler(){this.isGrabbing||(this.x+=this.delta.x,this.y+=this.delta.y,this.distance.x=this.x-this.origin.x,this.distance.y=this.y-this.origin.y,this.delta.x*=this.options.factor,this.delta.y*=this.options.factor,this.mode!==ie&&(this.mode=ie),this.trigger(this.props),Math.abs(this.delta.x)<.1&&Math.abs(this.delta.y)<.1&&this.stop())}pointerHandler(e){this.isGrabbing&&(this.x=e.x,this.y=e.y,this.delta.x=e.delta.x,this.delta.y=e.delta.y,this.final.x=e.x,this.final.y=e.y,this.distance.x=this.x-this.origin.x,this.distance.y=this.y-this.origin.y,this.mode!==te&&(this.mode=te),this.trigger(this.props),e.isDown||this.drop())}get props(){return{target:this.target,mode:this.mode,isGrabbing:this.isGrabbing,hasInertia:this.hasInertia,x:this.x,y:this.y,delta:this.delta,origin:this.origin,distance:this.distance,final:this.final}}}var ne=new WeakMap;function oe(e,t){var i=ne.get(e);return i||(i=new se(e,t),ne.set(e,i)),{add:i.add.bind(i),remove:i.remove.bind(i),has:i.has.bind(i),props:()=>i.props}}var ae=["target"];function he(e,t){return"string"==typeof e?a(e,t):Array.isArray(e)?e:[e]}e.Base=X,e.createApp=function(e,t){var i,r="complete"===document.readyState;r?i=new e(t).$mount():document.addEventListener("readystatechange",()=>{"complete"===document.readyState&&(i=new e(t).$mount(),r=!0)});var s=new Promise(e=>{document.addEventListener("readystatechange",()=>{"complete"===document.readyState&&setTimeout(()=>e(i),0)})});return function(){return r?Promise.resolve(i):s}},e.importOnInteraction=function(e,t,i,r){var s="string"==typeof i?[i]:i;return new Promise(i=>{var n=he(t,null==r?void 0:r.$el),o={capture:!0,passive:!0,once:!0},a=()=>{(t=>{e().then(e=>{t("default"in e?e.default:e)})})(i)};n.forEach(e=>{s.forEach(t=>{e.addEventListener(t,a,o)})})})},e.importWhenIdle=function(e,t){var i=t=>{e().then(e=>{t("default"in e?e.default:e)})};return new Promise(e=>{var r,s=null!=(r=null==t?void 0:t.timeout)?r:1;"requestIdleCallback"in window?window.requestIdleCallback(()=>{setTimeout(()=>{i(e)},0)},{timeout:null==t?void 0:t.timeout}):setTimeout(()=>{i(e)},s)})},e.importWhenVisible=function(e,t,i,r){return void 0===r&&(r={}),new Promise(s=>{var n=new IntersectionObserver(t=>{t.some(e=>e.isIntersecting)&&setTimeout(()=>{((t,i)=>{e().then(e=>{t("default"in e?e.default:e),n.disconnect()})})(s)},0)},r);he(t,null==i?void 0:i.$el).forEach(e=>n.observe(e))})},e.useDrag=oe,e.useKey=L,e.useLoad=N,e.usePointer=m,e.useRaf=f,e.useResize=w,e.useScroll=x,e.withBreakpointManager=function(e,t){if(!Array.isArray(t))throw new Error("[withBreakpointManager] The `breakpoints` parameter must be an array.");if(t.length<2)throw new Error("[withBreakpointManager] You must define at least 2 breakpoints.");var{add:i,props:r}=w();if(!r().breakpoint)throw new Error("The `BreakpointManager` class requires breakpoints to be defined.");return class extends e{constructor(e){return super(e),Z.has(this)||Z.set(this,function(e,t){return t.map(t=>{var[i,r]=t,s=new r(e.$el);return Object.defineProperty(s,"$parent",{get:()=>e.$parent}),[i,s]})}(this,t)),i("BreakpointManager-"+this.$id,()=>{U(Z.get(this))}),this.instances=Z.get(this),this}$mount(){return super.$mount(),U(Z.get(this)),this}$destroy(){return Array.isArray(Z.get(this))&&Z.get(this).forEach(e=>{var[,t]=e;t.$destroy()}),super.$destroy()}}},e.withBreakpointObserver=function(e){var i,r,s,n,o;return r=i=class extends e{constructor(e){super(e);var{remove:t,props:i}=w(),{name:r}=this.$options;if(!i().breakpoint)throw new Error("["+r+"] The `BreakpointObserver` class requires breakpoints to be defined.");var s="BreakpointObserver-"+this.$id;return new MutationObserver(e=>{var[i]=e;if("attributes"===i.type&&("data-options"===i.attributeName||i.attributeName.startsWith("data-option-"))){if(!K(this))return this.$mount(),void t(s);Q(s,this)}}).observe(this.$el,{attributes:!0}),K(this)?(Q(s,this),this):this}$mount(){return K(this)?"$mount"===J(this)?super.$mount():this:super.$mount()}},i.config=t({},e.config||{},{name:(null!=(s=null==e||null==(n=e.config)?void 0:n.name)?s:"")+"WithBreakpointObserver",options:t({},(null==e||null==(o=e.config)?void 0:o.options)||{},{activeBreakpoints:String,inactiveBreakpoints:String})}),r},e.withDrag=function(e,t){return void 0===t&&(t={target(){return this.$el}}),class extends e{constructor(e){super(e),this.$on("mounted",()=>{var{target:e}=t,i=function(e,t){if(null==e)return{};var i,r,s={},n=Object.keys(e);for(r=0;r<n.length;r++)t.indexOf(i=n[r])>=0||(s[i]=e[i]);return s}(t,ae),r=oe.bind(void 0,e.call(this),i);this.$services.register("dragged",r),this.$services.enable("dragged")}),this.$on("destroyed",()=>{this.$services.disable("dragged"),this.$services.unregister("dragged")})}}},e.withExtraConfig=function(e,t,i){var r,s;void 0===i&&(i={});var n=q(e.config,t,i);return n.name===e.config.name&&(n.name=e.config.name+"WithExtraConfig"),s=r=class extends e{},r.config=n,s},e.withIntersectionObserver=function(e,i){var r,s,n,o,a;return void 0===i&&(i={threshold:[...new Array(101)].map((e,t)=>t/100)}),s=r=class extends e{constructor(e){if(super(e),!this.intersected||"function"!=typeof this.intersected)throw new Error("[withIntersectionObserver] The `intersected` method must be defined.");return this.$observer=new IntersectionObserver(e=>{this.__debug("intersected",e),this.$emit("intersected",e),this.intersected(e)},t({},i,this.$options.intersectionObserver||{})),this.$on("mounted",()=>{this.$observer.observe(this.$el)}),this.$on("destroyed",()=>{this.$observer.unobserve(this.$el)}),this}},r.config=t({},e.config||{},{name:(null!=(n=null==e||null==(o=e.config)?void 0:o.name)?n:"")+"WithIntersectionObserver",options:t({},(null==e||null==(a=e.config)?void 0:a.options)||{},{intersectionObserver:Object})}),s},e.withMountWhenInView=function(e,i){var n,o,a,h,d,l,u;return void 0===i&&(i={threshold:[0,1]}),o=r("isVisible"),a=r("observer"),h=n=class extends e{constructor(e){return super(e),Object.defineProperty(this,o,{writable:!0,value:!1}),Object.defineProperty(this,a,{writable:!0,value:void 0}),s(this,a)[a]=new IntersectionObserver(e=>{var t=e.reduce((e,t)=>e||t.isIntersecting,!1);s(this,o)[o]!==t&&(s(this,o)[o]=t,this[t?"$mount":"$destroy"]())},t({},i,this.$options.intersectionObserver)),s(this,a)[a].observe(this.$el),this.$on("terminated",()=>{s(this,a)[a].disconnect()}),this}$mount(){return s(this,o)[o]&&super.$mount(),this}},n.config=t({},e.config||{},{name:(null!=(d=null==e||null==(l=e.config)?void 0:l.name)?d:"")+"WithMountWhenInView",options:t({},(null==e||null==(u=e.config)?void 0:u.options)||{},{intersectionObserver:Object})}),h}});