@studiometa/js-toolkit 2.9.1 → 2.10.0

package/decorators/index.cjs

@@ -26,5 +26,7 @@ __reExport(decorators_exports, require("./withMountWhenInView.cjs"), module.expo
 __reExport(decorators_exports, require("./withResponsiveOptions.cjs"), module.exports);
 __reExport(decorators_exports, require("./withScrolledInView/index.cjs"), module.exports);
 __reExport(decorators_exports, require("./withVue2.cjs"), module.exports);
+__reExport(decorators_exports, require("./withMountOnMediaQuery.cjs"), module.exports);
+__reExport(decorators_exports, require("./withMountWhenPrefersMotion"), module.exports);
 if (module.exports.default) module.exports = module.exports.default;
 //# sourceMappingURL=index.cjs.map

package/decorators/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/decorators/index.ts"],
-  "sourcesContent": ["export * from './withBreakpointManager.js';\nexport * from './withBreakpointObserver.js';\nexport * from './withDrag.js';\nexport * from './withExtraConfig.js';\nexport * from './withFreezedOptions.js';\nexport * from './withIntersectionObserver.js';\nexport * from './withMountWhenInView.js';\nexport * from './withResponsiveOptions.js';\nexport * from './withScrolledInView/index.js';\nexport * from './withVue2.js';\n"],
-  "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,+BAAc,wCAAd;AACA,+BAAc,yCADd;AAEA,+BAAc,2BAFd;AAGA,+BAAc,kCAHd;AAIA,+BAAc,qCAJd;AAKA,+BAAc,2CALd;AAMA,+BAAc,sCANd;AAOA,+BAAc,wCAPd;AAQA,+BAAc,2CARd;AASA,+BAAc,2BATd;",
+  "sourcesContent": ["export * from './withBreakpointManager.js';\nexport * from './withBreakpointObserver.js';\nexport * from './withDrag.js';\nexport * from './withExtraConfig.js';\nexport * from './withFreezedOptions.js';\nexport * from './withIntersectionObserver.js';\nexport * from './withMountWhenInView.js';\nexport * from './withResponsiveOptions.js';\nexport * from './withScrolledInView/index.js';\nexport * from './withVue2.js';\nexport * from './withMountOnMediaQuery.js';\nexport * from './withMountWhenPrefersMotion';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;AAAA;AAAA;AAAA,+BAAc,wCAAd;AACA,+BAAc,yCADd;AAEA,+BAAc,2BAFd;AAGA,+BAAc,kCAHd;AAIA,+BAAc,qCAJd;AAKA,+BAAc,2CALd;AAMA,+BAAc,sCANd;AAOA,+BAAc,wCAPd;AAQA,+BAAc,2CARd;AASA,+BAAc,2BATd;AAUA,+BAAc,wCAVd;AAWA,+BAAc,yCAXd;",
   "names": []
 }

package/decorators/index.d.ts

@@ -8,3 +8,5 @@ export * from './withMountWhenInView.js';
 export * from './withResponsiveOptions.js';
 export * from './withScrolledInView/index.js';
 export * from './withVue2.js';
+export * from './withMountOnMediaQuery.js';
+export * from './withMountWhenPrefersMotion';

package/decorators/index.js

@@ -8,4 +8,6 @@ export * from "./withMountWhenInView.js";
 export * from "./withResponsiveOptions.js";
 export * from "./withScrolledInView/index.js";
 export * from "./withVue2.js";
+export * from "./withMountOnMediaQuery.js";
+export * from "./withMountWhenPrefersMotion";
 //# sourceMappingURL=index.js.map

package/decorators/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/decorators/index.ts"],
-  "sourcesContent": ["export * from './withBreakpointManager.js';\nexport * from './withBreakpointObserver.js';\nexport * from './withDrag.js';\nexport * from './withExtraConfig.js';\nexport * from './withFreezedOptions.js';\nexport * from './withIntersectionObserver.js';\nexport * from './withMountWhenInView.js';\nexport * from './withResponsiveOptions.js';\nexport * from './withScrolledInView/index.js';\nexport * from './withVue2.js';\n"],
-  "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
+  "sourcesContent": ["export * from './withBreakpointManager.js';\nexport * from './withBreakpointObserver.js';\nexport * from './withDrag.js';\nexport * from './withExtraConfig.js';\nexport * from './withFreezedOptions.js';\nexport * from './withIntersectionObserver.js';\nexport * from './withMountWhenInView.js';\nexport * from './withResponsiveOptions.js';\nexport * from './withScrolledInView/index.js';\nexport * from './withVue2.js';\nexport * from './withMountOnMediaQuery.js';\nexport * from './withMountWhenPrefersMotion';\n"],
+  "mappings": "AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;",
   "names": []
 }

package/decorators/withMountOnMediaQuery.cjs

@@ -0,0 +1,70 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/js-toolkit/decorators/withMountOnMediaQuery.ts
+var withMountOnMediaQuery_exports = {};
+__export(withMountOnMediaQuery_exports, {
+  withMountOnMediaQuery: () => withMountOnMediaQuery
+});
+module.exports = __toCommonJS(withMountOnMediaQuery_exports);
+var import_is = require("../utils/is.cjs");
+function withMountOnMediaQuery(BaseClass, media) {
+  class WithMountOnMediaQuery extends BaseClass {
+    static config = {
+      ...BaseClass.config,
+      name: `${BaseClass.config.name}withMountOnMediaQuery`,
+      options: {
+        ...BaseClass.config?.options || {},
+        media: String
+      }
+    };
+    __matches = false;
+    constructor(element) {
+      super(element);
+      if (import_is.isDev && !this.$options.media && !media) {
+        this.$warn(
+          'Missing either "$options.media" or "media" argument in withMountOnMediaQuery decorator.'
+        );
+        return;
+      }
+      const mediaQueryList = window.matchMedia(this.$options.media || media);
+      this.__matches = mediaQueryList.matches;
+      const changeHandler = (event) => {
+        this.__matches = event.matches;
+        if (event.matches && !this.$isMounted) {
+          this.$mount();
+        } else if (this.$isMounted) {
+          setTimeout(() => this.$destroy());
+        }
+      };
+      mediaQueryList.addEventListener("change", changeHandler);
+      this.$on("terminated", () => {
+        mediaQueryList.removeEventListener("change", changeHandler);
+      });
+    }
+    $mount() {
+      if (this.__matches) {
+        super.$mount();
+      }
+      return this;
+    }
+  }
+  return WithMountOnMediaQuery;
+}
+if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=withMountOnMediaQuery.cjs.map

package/decorators/withMountOnMediaQuery.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/decorators/withMountOnMediaQuery.ts"],
+  "sourcesContent": ["import { BaseInterface, BaseDecorator } from '../Base/types.js';\nimport type { Base, BaseProps, BaseConfig } from '../Base/index.js';\nimport { isDev } from '../utils/is.js';\n\nexport interface withMountOnMediaQueryProps extends BaseProps {\n  $options: {\n    media: string;\n  };\n}\n\nexport interface withMountOnMediaQueryInterface extends BaseInterface {\n  /**\n   * @private\n   */\n  __matches: boolean;\n  $mount(): this;\n}\n\n/**\n * IntersectionObserver decoration.\n */\nexport function withMountOnMediaQuery<S extends Base = Base>(\n  BaseClass: typeof Base,\n  media,\n): BaseDecorator<withMountOnMediaQueryInterface, S, withMountOnMediaQueryProps> {\n  /**\n   * Class.\n   */\n  class WithMountOnMediaQuery<T extends BaseProps = BaseProps> extends BaseClass<\n    T & withMountOnMediaQueryProps\n  > {\n    /**\n     * Config.\n     */\n    static config: BaseConfig = {\n      ...BaseClass.config,\n      name: `${BaseClass.config.name}withMountOnMediaQuery`,\n      options: {\n        ...(BaseClass.config?.options || {}),\n        media: String,\n      },\n    };\n\n    /**\n     * Is the media query matches?\n     * @private\n     */\n    __matches = false;\n\n    /**\n     * Listen for media query changes when the class in instantiated.\n     *\n     * @param {HTMLElement} element The component's root element.\n     */\n    constructor(element: HTMLElement) {\n      super(element);\n\n      if (isDev && !this.$options.media && !media) {\n        this.$warn(\n          'Missing either \"$options.media\" or \"media\" argument in withMountOnMediaQuery decorator.',\n        );\n        return;\n      }\n\n      const mediaQueryList = window.matchMedia(this.$options.media || media);\n\n      // Set initial value\n      this.__matches = mediaQueryList.matches;\n\n      const changeHandler = (event: MediaQueryListEvent) => {\n        this.__matches = event.matches;\n\n        if (event.matches && !this.$isMounted) {\n          this.$mount();\n        } else if (this.$isMounted) {\n          setTimeout(() => this.$destroy());\n        }\n      };\n\n      // Start listening for changes\n      mediaQueryList.addEventListener('change', changeHandler);\n\n      this.$on('terminated', () => {\n        mediaQueryList.removeEventListener('change', changeHandler);\n      });\n    }\n\n    /**\n     * Override the mounting of the component.\n     */\n    $mount() {\n      if (this.__matches) {\n        super.$mount();\n      }\n\n      return this;\n    }\n  }\n\n  // @ts-ignore\n  return WithMountOnMediaQuery;\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAEA,gBAAsB;AAmBf,SAAS,sBACd,WACA,OAC8E;AAI9E,QAAM,8BAA+D,UAEnE;AAAA,IAIA,OAAO,SAAqB;AAAA,MAC1B,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO;AAAA,MAC1B,SAAS;AAAA,QACP,GAAI,UAAU,QAAQ,WAAW,CAAC;AAAA,QAClC,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IAMA,YAAY;AAAA,IAOZ,YAAY,SAAsB;AAChC,YAAM,OAAO;AAEb,UAAI,mBAAS,CAAC,KAAK,SAAS,SAAS,CAAC,OAAO;AAC3C,aAAK;AAAA,UACH;AAAA,QACF;AACA;AAAA,MACF;AAEA,YAAM,iBAAiB,OAAO,WAAW,KAAK,SAAS,SAAS,KAAK;AAGrE,WAAK,YAAY,eAAe;AAEhC,YAAM,gBAAgB,CAAC,UAA+B;AACpD,aAAK,YAAY,MAAM;AAEvB,YAAI,MAAM,WAAW,CAAC,KAAK,YAAY;AACrC,eAAK,OAAO;AAAA,QACd,WAAW,KAAK,YAAY;AAC1B,qBAAW,MAAM,KAAK,SAAS,CAAC;AAAA,QAClC;AAAA,MACF;AAGA,qBAAe,iBAAiB,UAAU,aAAa;AAEvD,WAAK,IAAI,cAAc,MAAM;AAC3B,uBAAe,oBAAoB,UAAU,aAAa;AAAA,MAC5D,CAAC;AAAA,IACH;AAAA,IAKA,SAAS;AACP,UAAI,KAAK,WAAW;AAClB,cAAM,OAAO;AAAA,MACf;AAEA,aAAO;AAAA,IACT;AAAA,EACF;AAGA,SAAO;AACT;",
+  "names": []
+}

package/decorators/withMountOnMediaQuery.d.ts

@@ -0,0 +1,18 @@
+import { BaseInterface, BaseDecorator } from '../Base/types.js';
+import type { Base, BaseProps } from '../Base/index.js';
+export interface withMountOnMediaQueryProps extends BaseProps {
+    $options: {
+        media: string;
+    };
+}
+export interface withMountOnMediaQueryInterface extends BaseInterface {
+    /**
+     * @private
+     */
+    __matches: boolean;
+    $mount(): this;
+}
+/**
+ * IntersectionObserver decoration.
+ */
+export declare function withMountOnMediaQuery<S extends Base = Base>(BaseClass: typeof Base, media: any): BaseDecorator<withMountOnMediaQueryInterface, S, withMountOnMediaQueryProps>;

package/decorators/withMountOnMediaQuery.js

@@ -0,0 +1,48 @@
+import { isDev } from "../utils/is.js";
+function withMountOnMediaQuery(BaseClass, media) {
+  class WithMountOnMediaQuery extends BaseClass {
+    static config = {
+      ...BaseClass.config,
+      name: `${BaseClass.config.name}withMountOnMediaQuery`,
+      options: {
+        ...BaseClass.config?.options || {},
+        media: String
+      }
+    };
+    __matches = false;
+    constructor(element) {
+      super(element);
+      if (isDev && !this.$options.media && !media) {
+        this.$warn(
+          'Missing either "$options.media" or "media" argument in withMountOnMediaQuery decorator.'
+        );
+        return;
+      }
+      const mediaQueryList = window.matchMedia(this.$options.media || media);
+      this.__matches = mediaQueryList.matches;
+      const changeHandler = (event) => {
+        this.__matches = event.matches;
+        if (event.matches && !this.$isMounted) {
+          this.$mount();
+        } else if (this.$isMounted) {
+          setTimeout(() => this.$destroy());
+        }
+      };
+      mediaQueryList.addEventListener("change", changeHandler);
+      this.$on("terminated", () => {
+        mediaQueryList.removeEventListener("change", changeHandler);
+      });
+    }
+    $mount() {
+      if (this.__matches) {
+        super.$mount();
+      }
+      return this;
+    }
+  }
+  return WithMountOnMediaQuery;
+}
+export {
+  withMountOnMediaQuery
+};
+//# sourceMappingURL=withMountOnMediaQuery.js.map

package/decorators/withMountOnMediaQuery.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/decorators/withMountOnMediaQuery.ts"],
+  "sourcesContent": ["import { BaseInterface, BaseDecorator } from '../Base/types.js';\nimport type { Base, BaseProps, BaseConfig } from '../Base/index.js';\nimport { isDev } from '../utils/is.js';\n\nexport interface withMountOnMediaQueryProps extends BaseProps {\n  $options: {\n    media: string;\n  };\n}\n\nexport interface withMountOnMediaQueryInterface extends BaseInterface {\n  /**\n   * @private\n   */\n  __matches: boolean;\n  $mount(): this;\n}\n\n/**\n * IntersectionObserver decoration.\n */\nexport function withMountOnMediaQuery<S extends Base = Base>(\n  BaseClass: typeof Base,\n  media,\n): BaseDecorator<withMountOnMediaQueryInterface, S, withMountOnMediaQueryProps> {\n  /**\n   * Class.\n   */\n  class WithMountOnMediaQuery<T extends BaseProps = BaseProps> extends BaseClass<\n    T & withMountOnMediaQueryProps\n  > {\n    /**\n     * Config.\n     */\n    static config: BaseConfig = {\n      ...BaseClass.config,\n      name: `${BaseClass.config.name}withMountOnMediaQuery`,\n      options: {\n        ...(BaseClass.config?.options || {}),\n        media: String,\n      },\n    };\n\n    /**\n     * Is the media query matches?\n     * @private\n     */\n    __matches = false;\n\n    /**\n     * Listen for media query changes when the class in instantiated.\n     *\n     * @param {HTMLElement} element The component's root element.\n     */\n    constructor(element: HTMLElement) {\n      super(element);\n\n      if (isDev && !this.$options.media && !media) {\n        this.$warn(\n          'Missing either \"$options.media\" or \"media\" argument in withMountOnMediaQuery decorator.',\n        );\n        return;\n      }\n\n      const mediaQueryList = window.matchMedia(this.$options.media || media);\n\n      // Set initial value\n      this.__matches = mediaQueryList.matches;\n\n      const changeHandler = (event: MediaQueryListEvent) => {\n        this.__matches = event.matches;\n\n        if (event.matches && !this.$isMounted) {\n          this.$mount();\n        } else if (this.$isMounted) {\n          setTimeout(() => this.$destroy());\n        }\n      };\n\n      // Start listening for changes\n      mediaQueryList.addEventListener('change', changeHandler);\n\n      this.$on('terminated', () => {\n        mediaQueryList.removeEventListener('change', changeHandler);\n      });\n    }\n\n    /**\n     * Override the mounting of the component.\n     */\n    $mount() {\n      if (this.__matches) {\n        super.$mount();\n      }\n\n      return this;\n    }\n  }\n\n  // @ts-ignore\n  return WithMountOnMediaQuery;\n}\n"],
+  "mappings": "AAEA,SAAS,aAAa;AAmBf,SAAS,sBACd,WACA,OAC8E;AAI9E,QAAM,8BAA+D,UAEnE;AAAA,IAIA,OAAO,SAAqB;AAAA,MAC1B,GAAG,UAAU;AAAA,MACb,MAAM,GAAG,UAAU,OAAO;AAAA,MAC1B,SAAS;AAAA,QACP,GAAI,UAAU,QAAQ,WAAW,CAAC;AAAA,QAClC,OAAO;AAAA,MACT;AAAA,IACF;AAAA,IAMA,YAAY;AAAA,IAOZ,YAAY,SAAsB;AAChC,YAAM,OAAO;AAEb,UAAI,SAAS,CAAC,KAAK,SAAS,SAAS,CAAC,OAAO;AAC3C,aAAK;AAAA,UACH;AAAA,QACF;AACA;AAAA,MACF;AAEA,YAAM,iBAAiB,OAAO,WAAW,KAAK,SAAS,SAAS,KAAK;AAGrE,WAAK,YAAY,eAAe;AAEhC,YAAM,gBAAgB,CAAC,UAA+B;AACpD,aAAK,YAAY,MAAM;AAEvB,YAAI,MAAM,WAAW,CAAC,KAAK,YAAY;AACrC,eAAK,OAAO;AAAA,QACd,WAAW,KAAK,YAAY;AAC1B,qBAAW,MAAM,KAAK,SAAS,CAAC;AAAA,QAClC;AAAA,MACF;AAGA,qBAAe,iBAAiB,UAAU,aAAa;AAEvD,WAAK,IAAI,cAAc,MAAM;AAC3B,uBAAe,oBAAoB,UAAU,aAAa;AAAA,MAC5D,CAAC;AAAA,IACH;AAAA,IAKA,SAAS;AACP,UAAI,KAAK,WAAW;AAClB,cAAM,OAAO;AAAA,MACf;AAEA,aAAO;AAAA,IACT;AAAA,EACF;AAGA,SAAO;AACT;",
+  "names": []
+}

package/decorators/withMountWhenPrefersMotion.cjs

@@ -0,0 +1,30 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/js-toolkit/decorators/withMountWhenPrefersMotion.ts
+var withMountWhenPrefersMotion_exports = {};
+__export(withMountWhenPrefersMotion_exports, {
+  withMountWhenPrefersMotion: () => withMountWhenPrefersMotion
+});
+module.exports = __toCommonJS(withMountWhenPrefersMotion_exports);
+var import_withMountOnMediaQuery = require("./withMountOnMediaQuery.cjs");
+function withMountWhenPrefersMotion(BaseClass) {
+  return (0, import_withMountOnMediaQuery.withMountOnMediaQuery)(BaseClass, "not (prefers-reduced-motion)");
+}
+if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=withMountWhenPrefersMotion.cjs.map

package/decorators/withMountWhenPrefersMotion.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/decorators/withMountWhenPrefersMotion.ts"],
+  "sourcesContent": ["import { withMountOnMediaQuery } from './withMountOnMediaQuery.js';\nimport type { Base } from '../Base/index.js';\nimport { BaseDecorator, BaseInterface } from '../Base/types.js';\n\nexport function withMountWhenPrefersMotion<S extends Base = Base>(\n  BaseClass: typeof Base,\n): BaseDecorator<BaseInterface, S> {\n  return withMountOnMediaQuery(BaseClass, 'not (prefers-reduced-motion)');\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mCAAsC;AAI/B,SAAS,2BACd,WACiC;AACjC,aAAO,oDAAsB,WAAW,8BAA8B;AACxE;",
+  "names": []
+}

package/decorators/withMountWhenPrefersMotion.d.ts

@@ -0,0 +1,3 @@
+import type { Base } from '../Base/index.js';
+import { BaseDecorator, BaseInterface } from '../Base/types.js';
+export declare function withMountWhenPrefersMotion<S extends Base = Base>(BaseClass: typeof Base): BaseDecorator<BaseInterface, S>;

package/decorators/withMountWhenPrefersMotion.js

@@ -0,0 +1,8 @@
+import { withMountOnMediaQuery } from "./withMountOnMediaQuery.js";
+function withMountWhenPrefersMotion(BaseClass) {
+  return withMountOnMediaQuery(BaseClass, "not (prefers-reduced-motion)");
+}
+export {
+  withMountWhenPrefersMotion
+};
+//# sourceMappingURL=withMountWhenPrefersMotion.js.map

package/decorators/withMountWhenPrefersMotion.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/decorators/withMountWhenPrefersMotion.ts"],
+  "sourcesContent": ["import { withMountOnMediaQuery } from './withMountOnMediaQuery.js';\nimport type { Base } from '../Base/index.js';\nimport { BaseDecorator, BaseInterface } from '../Base/types.js';\n\nexport function withMountWhenPrefersMotion<S extends Base = Base>(\n  BaseClass: typeof Base,\n): BaseDecorator<BaseInterface, S> {\n  return withMountOnMediaQuery(BaseClass, 'not (prefers-reduced-motion)');\n}\n"],
+  "mappings": "AAAA,SAAS,6BAA6B;AAI/B,SAAS,2BACd,WACiC;AACjC,SAAO,sBAAsB,WAAW,8BAA8B;AACxE;",
+  "names": []
+}

package/helpers/importOnInteraction.cjs

@@ -26,13 +26,7 @@ var import_utils = require("./utils.cjs");
 var import_utils2 = require("../utils/index.cjs");
 function importOnInteraction(fn, nameOrSelectorOrElement, events, parent) {
   const normalizedEvents = (0, import_utils2.isString)(events) ? [events] : events;
-  let ResolvedClass;
-  const resolver = (resolve) => {
-    fn().then((module2) => {
-      ResolvedClass = "default" in module2 ? module2.default : module2;
-      resolve(ResolvedClass);
-    });
-  };
+  const resolver = (0, import_utils2.getComponentResolver)(fn);
   return new Promise((resolve) => {
     const elements = (0, import_utils.getTargetElements)(nameOrSelectorOrElement, parent?.$el);
     const eventListenerOptions = {

package/helpers/importOnInteraction.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/importOnInteraction.ts"],
-  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {string|string[]} events\n *   The events to listen to to trigger the import.\n * @param {Base} [parent]\n *   The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  events: string | string[],\n  parent?: Base,\n): Promise<T> {\n  const normalizedEvents = isString(events) ? [events] : events;\n\n  let ResolvedClass;\n\n  const resolver = (resolve) => {\n    fn().then((module) => {\n      ResolvedClass = 'default' in module ? module.default : module;\n      resolve(ResolvedClass);\n    });\n  };\n\n  return new Promise((resolve) => {\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    const eventListenerOptions = {\n      capture: true,\n      passive: true,\n      once: true,\n    };\n    const handler = () => {\n      resolver(resolve);\n    };\n\n    elements.forEach((element) => {\n      normalizedEvents.forEach((event) => {\n        element.addEventListener(event, handler, eventListenerOptions);\n      });\n    });\n  });\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAAyB;AAgBV,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,uBAAmB,wBAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,MAAI;AAEJ,QAAM,WAAW,CAAC,YAAY;AAC5B,OAAG,EAAE,KAAK,CAACC,YAAW;AACpB,sBAAgB,aAAaA,UAASA,QAAO,UAAUA;AACvD,cAAQ,aAAa;AAAA,IACvB,CAAC;AAAA,EACH;AAEA,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,aAAS,QAAQ,CAAC,YAAY;AAC5B,uBAAiB,QAAQ,CAAC,UAAU;AAClC,gBAAQ,iBAAiB,OAAO,SAAS,oBAAoB;AAAA,MAC/D,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;",
-  "names": ["import_utils", "module"]
+  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString, getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {string|string[]} events\n *   The events to listen to to trigger the import.\n * @param {Base} [parent]\n *   The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  events: string | string[],\n  parent?: Base,\n): Promise<T> {\n  const normalizedEvents = isString(events) ? [events] : events;\n\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    const eventListenerOptions = {\n      capture: true,\n      passive: true,\n      once: true,\n    };\n    const handler = () => {\n      resolver(resolve);\n    };\n\n    elements.forEach((element) => {\n      normalizedEvents.forEach((event) => {\n        element.addEventListener(event, handler, eventListenerOptions);\n      });\n    });\n  });\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAA+C;AAgBhC,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,uBAAmB,wBAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,QAAM,eAAW,oCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,aAAS,QAAQ,CAAC,YAAY;AAC5B,uBAAiB,QAAQ,CAAC,UAAU;AAClC,gBAAQ,iBAAiB,OAAO,SAAS,oBAAoB;AAAA,MAC/D,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;",
+  "names": ["import_utils"]
 }

package/helpers/importOnInteraction.js

@@ -1,14 +1,8 @@
 import { getTargetElements } from "./utils.js";
-import { isString } from "../utils/index.js";
+import { isString, getComponentResolver } from "../utils/index.js";
 function importOnInteraction(fn, nameOrSelectorOrElement, events, parent) {
   const normalizedEvents = isString(events) ? [events] : events;
-  let ResolvedClass;
-  const resolver = (resolve) => {
-    fn().then((module) => {
-      ResolvedClass = "default" in module ? module.default : module;
-      resolve(ResolvedClass);
-    });
-  };
+  const resolver = getComponentResolver(fn);
   return new Promise((resolve) => {
     const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);
     const eventListenerOptions = {

package/helpers/importOnInteraction.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/importOnInteraction.ts"],
-  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {string|string[]} events\n *   The events to listen to to trigger the import.\n * @param {Base} [parent]\n *   The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  events: string | string[],\n  parent?: Base,\n): Promise<T> {\n  const normalizedEvents = isString(events) ? [events] : events;\n\n  let ResolvedClass;\n\n  const resolver = (resolve) => {\n    fn().then((module) => {\n      ResolvedClass = 'default' in module ? module.default : module;\n      resolve(ResolvedClass);\n    });\n  };\n\n  return new Promise((resolve) => {\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    const eventListenerOptions = {\n      capture: true,\n      passive: true,\n      once: true,\n    };\n    const handler = () => {\n      resolver(resolve);\n    };\n\n    elements.forEach((element) => {\n      normalizedEvents.forEach((event) => {\n        element.addEventListener(event, handler, eventListenerOptions);\n      });\n    });\n  });\n}\n"],
-  "mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,gBAAgB;AAgBV,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,mBAAmB,SAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,MAAI;AAEJ,QAAM,WAAW,CAAC,YAAY;AAC5B,OAAG,EAAE,KAAK,CAAC,WAAW;AACpB,sBAAgB,aAAa,SAAS,OAAO,UAAU;AACvD,cAAQ,aAAa;AAAA,IACvB,CAAC;AAAA,EACH;AAEA,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,aAAS,QAAQ,CAAC,YAAY;AAC5B,uBAAiB,QAAQ,CAAC,UAAU;AAClC,gBAAQ,iBAAiB,OAAO,SAAS,oBAAoB;AAAA,MAC/D,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;",
+  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isString, getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component on an interaction.\n *\n * @template {BaseConstructor} [T=BaseConstructor]\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {string|string[]} events\n *   The events to listen to to trigger the import.\n * @param {Base} [parent]\n *   The parent component.\n * @returns {Promise<InstanceType<T>>}\n */\nexport default function importOnInteraction<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  events: string | string[],\n  parent?: Base,\n): Promise<T> {\n  const normalizedEvents = isString(events) ? [events] : events;\n\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    const eventListenerOptions = {\n      capture: true,\n      passive: true,\n      once: true,\n    };\n    const handler = () => {\n      resolver(resolve);\n    };\n\n    elements.forEach((element) => {\n      normalizedEvents.forEach((event) => {\n        element.addEventListener(event, handler, eventListenerOptions);\n      });\n    });\n  });\n}\n"],
+  "mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,UAAU,4BAA4B;AAgBhC,SAAR,oBACL,IACA,yBACA,QACA,QACY;AACZ,QAAM,mBAAmB,SAAS,MAAM,IAAI,CAAC,MAAM,IAAI;AAEvD,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,UAAM,uBAAuB;AAAA,MAC3B,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,IACR;AACA,UAAM,UAAU,MAAM;AACpB,eAAS,OAAO;AAAA,IAClB;AAEA,aAAS,QAAQ,CAAC,YAAY;AAC5B,uBAAiB,QAAQ,CAAC,UAAU;AAClC,gBAAQ,iBAAiB,OAAO,SAAS,oBAAoB;AAAA,MAC/D,CAAC;AAAA,IACH,CAAC;AAAA,EACH,CAAC;AACH;",
   "names": []
 }

package/helpers/importOnMediaQuery.cjs

@@ -0,0 +1,44 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/js-toolkit/helpers/importOnMediaQuery.ts
+var importOnMediaQuery_exports = {};
+__export(importOnMediaQuery_exports, {
+  default: () => importOnMediaQuery
+});
+module.exports = __toCommonJS(importOnMediaQuery_exports);
+var import_utils = require("../utils");
+function importOnMediaQuery(fn, media) {
+  const resolver = (0, import_utils.getComponentResolver)(fn);
+  return new Promise((resolve) => {
+    const mediaQueryList = window.matchMedia(media);
+    if (mediaQueryList.matches) {
+      resolver(resolve);
+    }
+    const changeHandler = (event) => {
+      if (event.matches) {
+        setTimeout(() => {
+          resolver(resolve, () => mediaQueryList.removeEventListener("change", changeHandler));
+        }, 0);
+      }
+    };
+    mediaQueryList.addEventListener("change", changeHandler);
+  });
+}
+if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=importOnMediaQuery.cjs.map

package/helpers/importOnMediaQuery.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/helpers/importOnMediaQuery.ts"],
+  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\nimport { getComponentResolver } from '../utils';\n\n/**\n * Import a component when given media query is true.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string} media\n *   The media query name and value (see https://developer.mozilla.org/en-US/docs/Web/CSS/@media#media_features)\n * @returns {Promise<T>}\n */\nexport default function importOnMediaQuery<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  media: string,\n): Promise<T> {\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    const mediaQueryList = window.matchMedia(media);\n\n    if (mediaQueryList.matches) {\n      resolver(resolve);\n    }\n\n    const changeHandler = (event: MediaQueryListEvent) => {\n      if (event.matches) {\n        setTimeout(() => {\n          // Remove listener and mount the component\n          resolver(resolve, () => mediaQueryList.removeEventListener('change', changeHandler));\n        }, 0);\n      }\n    };\n\n    // Start listening for changes\n    mediaQueryList.addEventListener('change', changeHandler);\n  });\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAqC;AAYtB,SAAR,mBACL,IACA,OACY;AACZ,QAAM,eAAW,mCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,iBAAiB,OAAO,WAAW,KAAK;AAE9C,QAAI,eAAe,SAAS;AAC1B,eAAS,OAAO;AAAA,IAClB;AAEA,UAAM,gBAAgB,CAAC,UAA+B;AACpD,UAAI,MAAM,SAAS;AACjB,mBAAW,MAAM;AAEf,mBAAS,SAAS,MAAM,eAAe,oBAAoB,UAAU,aAAa,CAAC;AAAA,QACrF,GAAG,CAAC;AAAA,MACN;AAAA,IACF;AAGA,mBAAe,iBAAiB,UAAU,aAAa;AAAA,EACzD,CAAC;AACH;",
+  "names": []
+}

package/helpers/importOnMediaQuery.d.ts

@@ -0,0 +1,14 @@
+import type { BaseConstructor } from '../Base/index.js';
+/**
+ * Import a component when given media query is true.
+ *
+ * @template {BaseConstructor} T
+ * @param {() => Promise<T|{default:T}>} fn
+ *   The import function.
+ * @param {string} media
+ *   The media query name and value (see https://developer.mozilla.org/en-US/docs/Web/CSS/@media#media_features)
+ * @returns {Promise<T>}
+ */
+export default function importOnMediaQuery<T extends BaseConstructor = BaseConstructor>(fn: () => Promise<T | {
+    default: T;
+}>, media: string): Promise<T>;

package/helpers/importOnMediaQuery.js

@@ -0,0 +1,22 @@
+import { getComponentResolver } from "../utils";
+function importOnMediaQuery(fn, media) {
+  const resolver = getComponentResolver(fn);
+  return new Promise((resolve) => {
+    const mediaQueryList = window.matchMedia(media);
+    if (mediaQueryList.matches) {
+      resolver(resolve);
+    }
+    const changeHandler = (event) => {
+      if (event.matches) {
+        setTimeout(() => {
+          resolver(resolve, () => mediaQueryList.removeEventListener("change", changeHandler));
+        }, 0);
+      }
+    };
+    mediaQueryList.addEventListener("change", changeHandler);
+  });
+}
+export {
+  importOnMediaQuery as default
+};
+//# sourceMappingURL=importOnMediaQuery.js.map

package/helpers/importOnMediaQuery.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/helpers/importOnMediaQuery.ts"],
+  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\nimport { getComponentResolver } from '../utils';\n\n/**\n * Import a component when given media query is true.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string} media\n *   The media query name and value (see https://developer.mozilla.org/en-US/docs/Web/CSS/@media#media_features)\n * @returns {Promise<T>}\n */\nexport default function importOnMediaQuery<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  media: string,\n): Promise<T> {\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    const mediaQueryList = window.matchMedia(media);\n\n    if (mediaQueryList.matches) {\n      resolver(resolve);\n    }\n\n    const changeHandler = (event: MediaQueryListEvent) => {\n      if (event.matches) {\n        setTimeout(() => {\n          // Remove listener and mount the component\n          resolver(resolve, () => mediaQueryList.removeEventListener('change', changeHandler));\n        }, 0);\n      }\n    };\n\n    // Start listening for changes\n    mediaQueryList.addEventListener('change', changeHandler);\n  });\n}\n"],
+  "mappings": "AACA,SAAS,4BAA4B;AAYtB,SAAR,mBACL,IACA,OACY;AACZ,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,iBAAiB,OAAO,WAAW,KAAK;AAE9C,QAAI,eAAe,SAAS;AAC1B,eAAS,OAAO;AAAA,IAClB;AAEA,UAAM,gBAAgB,CAAC,UAA+B;AACpD,UAAI,MAAM,SAAS;AACjB,mBAAW,MAAM;AAEf,mBAAS,SAAS,MAAM,eAAe,oBAAoB,UAAU,aAAa,CAAC;AAAA,QACrF,GAAG,CAAC;AAAA,MACN;AAAA,IACF;AAGA,mBAAe,iBAAiB,UAAU,aAAa;AAAA,EACzD,CAAC;AACH;",
+  "names": []
+}

package/helpers/importWhenIdle.cjs

@@ -22,14 +22,9 @@ __export(importWhenIdle_exports, {
   default: () => importWhenIdle
 });
 module.exports = __toCommonJS(importWhenIdle_exports);
+var import_utils = require("../utils/index.cjs");
 function importWhenIdle(fn, { timeout = 1 } = {}) {
-  let ResolvedClass;
-  const resolver = (resolve) => {
-    fn().then((module2) => {
-      ResolvedClass = "default" in module2 ? module2.default : module2;
-      resolve(ResolvedClass);
-    });
-  };
+  const resolver = (0, import_utils.getComponentResolver)(fn);
   return new Promise((resolve) => {
     if (!("requestIdleCallback" in window)) {
       setTimeout(() => {

package/helpers/importWhenIdle.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/importWhenIdle.ts"],
-  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\n\ntype ImportWhenIdleOptions = {\n  timeout?: number;\n};\n\n/**\n * Import a component when user is idle.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {ImportWhenIdleOptions} [options]\n *   The time to wait before triggering the callback if never idle.\n * @returns {Promise<T>}\n */\nexport default function importWhenIdle<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  { timeout = 1 }: ImportWhenIdleOptions = {},\n): Promise<T> {\n  let ResolvedClass;\n\n  const resolver = (resolve) => {\n    fn().then((module) => {\n      ResolvedClass = 'default' in module ? module.default : module;\n      resolve(ResolvedClass);\n    });\n  };\n\n  return new Promise((resolve) => {\n    if (!('requestIdleCallback' in window)) {\n      setTimeout(() => {\n        resolver(resolve);\n      }, timeout);\n    } else {\n      window.requestIdleCallback(\n        () => {\n          setTimeout(() => {\n            resolver(resolve);\n          }, 0);\n        },\n        { timeout },\n      );\n    }\n  });\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBe,SAAR,eACL,IACA,EAAE,UAAU,EAAE,IAA2B,CAAC,GAC9B;AACZ,MAAI;AAEJ,QAAM,WAAW,CAAC,YAAY;AAC5B,OAAG,EAAE,KAAK,CAACA,YAAW;AACpB,sBAAgB,aAAaA,UAASA,QAAO,UAAUA;AACvD,cAAQ,aAAa;AAAA,IACvB,CAAC;AAAA,EACH;AAEA,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,QAAI,EAAE,yBAAyB,SAAS;AACtC,iBAAW,MAAM;AACf,iBAAS,OAAO;AAAA,MAClB,GAAG,OAAO;AAAA,IACZ,OAAO;AACL,aAAO;AAAA,QACL,MAAM;AACJ,qBAAW,MAAM;AACf,qBAAS,OAAO;AAAA,UAClB,GAAG,CAAC;AAAA,QACN;AAAA,QACA,EAAE,QAAQ;AAAA,MACZ;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
-  "names": ["module"]
+  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\nimport { getComponentResolver } from '../utils/index.js';\n\ntype ImportWhenIdleOptions = {\n  timeout?: number;\n};\n\n/**\n * Import a component when user is idle.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {ImportWhenIdleOptions} [options]\n *   The time to wait before triggering the callback if never idle.\n * @returns {Promise<T>}\n */\nexport default function importWhenIdle<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  { timeout = 1 }: ImportWhenIdleOptions = {},\n): Promise<T> {\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    if (!('requestIdleCallback' in window)) {\n      setTimeout(() => {\n        resolver(resolve);\n      }, timeout);\n    } else {\n      window.requestIdleCallback(\n        () => {\n          setTimeout(() => {\n            resolver(resolve);\n          }, 0);\n        },\n        { timeout },\n      );\n    }\n  });\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAqC;AAgBtB,SAAR,eACL,IACA,EAAE,UAAU,EAAE,IAA2B,CAAC,GAC9B;AACZ,QAAM,eAAW,mCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,QAAI,EAAE,yBAAyB,SAAS;AACtC,iBAAW,MAAM;AACf,iBAAS,OAAO;AAAA,MAClB,GAAG,OAAO;AAAA,IACZ,OAAO;AACL,aAAO;AAAA,QACL,MAAM;AACJ,qBAAW,MAAM;AACf,qBAAS,OAAO;AAAA,UAClB,GAAG,CAAC;AAAA,QACN;AAAA,QACA,EAAE,QAAQ;AAAA,MACZ;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
+  "names": []
 }

package/helpers/importWhenIdle.js

@@ -1,11 +1,6 @@
+import { getComponentResolver } from "../utils/index.js";
 function importWhenIdle(fn, { timeout = 1 } = {}) {
-  let ResolvedClass;
-  const resolver = (resolve) => {
-    fn().then((module) => {
-      ResolvedClass = "default" in module ? module.default : module;
-      resolve(ResolvedClass);
-    });
-  };
+  const resolver = getComponentResolver(fn);
   return new Promise((resolve) => {
     if (!("requestIdleCallback" in window)) {
       setTimeout(() => {

package/helpers/importWhenIdle.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/importWhenIdle.ts"],
-  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\n\ntype ImportWhenIdleOptions = {\n  timeout?: number;\n};\n\n/**\n * Import a component when user is idle.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {ImportWhenIdleOptions} [options]\n *   The time to wait before triggering the callback if never idle.\n * @returns {Promise<T>}\n */\nexport default function importWhenIdle<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  { timeout = 1 }: ImportWhenIdleOptions = {},\n): Promise<T> {\n  let ResolvedClass;\n\n  const resolver = (resolve) => {\n    fn().then((module) => {\n      ResolvedClass = 'default' in module ? module.default : module;\n      resolve(ResolvedClass);\n    });\n  };\n\n  return new Promise((resolve) => {\n    if (!('requestIdleCallback' in window)) {\n      setTimeout(() => {\n        resolver(resolve);\n      }, timeout);\n    } else {\n      window.requestIdleCallback(\n        () => {\n          setTimeout(() => {\n            resolver(resolve);\n          }, 0);\n        },\n        { timeout },\n      );\n    }\n  });\n}\n"],
-  "mappings": "AAgBe,SAAR,eACL,IACA,EAAE,UAAU,EAAE,IAA2B,CAAC,GAC9B;AACZ,MAAI;AAEJ,QAAM,WAAW,CAAC,YAAY;AAC5B,OAAG,EAAE,KAAK,CAAC,WAAW;AACpB,sBAAgB,aAAa,SAAS,OAAO,UAAU;AACvD,cAAQ,aAAa;AAAA,IACvB,CAAC;AAAA,EACH;AAEA,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,QAAI,EAAE,yBAAyB,SAAS;AACtC,iBAAW,MAAM;AACf,iBAAS,OAAO;AAAA,MAClB,GAAG,OAAO;AAAA,IACZ,OAAO;AACL,aAAO;AAAA,QACL,MAAM;AACJ,qBAAW,MAAM;AACf,qBAAS,OAAO;AAAA,UAClB,GAAG,CAAC;AAAA,QACN;AAAA,QACA,EAAE,QAAQ;AAAA,MACZ;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
+  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\nimport { getComponentResolver } from '../utils/index.js';\n\ntype ImportWhenIdleOptions = {\n  timeout?: number;\n};\n\n/**\n * Import a component when user is idle.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {ImportWhenIdleOptions} [options]\n *   The time to wait before triggering the callback if never idle.\n * @returns {Promise<T>}\n */\nexport default function importWhenIdle<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  { timeout = 1 }: ImportWhenIdleOptions = {},\n): Promise<T> {\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    if (!('requestIdleCallback' in window)) {\n      setTimeout(() => {\n        resolver(resolve);\n      }, timeout);\n    } else {\n      window.requestIdleCallback(\n        () => {\n          setTimeout(() => {\n            resolver(resolve);\n          }, 0);\n        },\n        { timeout },\n      );\n    }\n  });\n}\n"],
+  "mappings": "AACA,SAAS,4BAA4B;AAgBtB,SAAR,eACL,IACA,EAAE,UAAU,EAAE,IAA2B,CAAC,GAC9B;AACZ,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,QAAI,EAAE,yBAAyB,SAAS;AACtC,iBAAW,MAAM;AACf,iBAAS,OAAO;AAAA,MAClB,GAAG,OAAO;AAAA,IACZ,OAAO;AACL,aAAO;AAAA,QACL,MAAM;AACJ,qBAAW,MAAM;AACf,qBAAS,OAAO;AAAA,UAClB,GAAG,CAAC;AAAA,QACN;AAAA,QACA,EAAE,QAAQ;AAAA,MACZ;AAAA,IACF;AAAA,EACF,CAAC;AACH;",
   "names": []
 }

package/helpers/importWhenPrefersMotion.cjs

@@ -0,0 +1,36 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/js-toolkit/helpers/importWhenPrefersMotion.ts
+var importWhenPrefersMotion_exports = {};
+__export(importWhenPrefersMotion_exports, {
+  default: () => importWhenPrefersMotion
+});
+module.exports = __toCommonJS(importWhenPrefersMotion_exports);
+var import_importOnMediaQuery = __toESM(require("./importOnMediaQuery.cjs"), 1);
+function importWhenPrefersMotion(fn) {
+  return (0, import_importOnMediaQuery.default)(fn, "not (prefers-reduced-motion)");
+}
+if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=importWhenPrefersMotion.cjs.map

package/helpers/importWhenPrefersMotion.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/helpers/importWhenPrefersMotion.ts"],
+  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\nimport importOnMediaQuery from './importOnMediaQuery.js';\n\n/**\n * Import a component if user does not reduce motion.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n * @returns {Promise<T>}\n */\nexport default function importWhenPrefersMotion<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n): Promise<T> {\n  return importOnMediaQuery(fn, 'not (prefers-reduced-motion)');\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,gCAA+B;AAShB,SAAR,wBACL,IACY;AACZ,aAAO,0BAAAA,SAAmB,IAAI,8BAA8B;AAC9D;",
+  "names": ["importOnMediaQuery"]
+}

package/helpers/importWhenPrefersMotion.d.ts

@@ -0,0 +1,11 @@
+import type { BaseConstructor } from '../Base/index.js';
+/**
+ * Import a component if user does not reduce motion.
+ *
+ * @template {BaseConstructor} T
+ * @param {() => Promise<T|{default:T}>} fn
+ * @returns {Promise<T>}
+ */
+export default function importWhenPrefersMotion<T extends BaseConstructor = BaseConstructor>(fn: () => Promise<T | {
+    default: T;
+}>): Promise<T>;

package/helpers/importWhenPrefersMotion.js

@@ -0,0 +1,8 @@
+import importOnMediaQuery from "./importOnMediaQuery.js";
+function importWhenPrefersMotion(fn) {
+  return importOnMediaQuery(fn, "not (prefers-reduced-motion)");
+}
+export {
+  importWhenPrefersMotion as default
+};
+//# sourceMappingURL=importWhenPrefersMotion.js.map

package/helpers/importWhenPrefersMotion.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/helpers/importWhenPrefersMotion.ts"],
+  "sourcesContent": ["import type { BaseConstructor } from '../Base/index.js';\nimport importOnMediaQuery from './importOnMediaQuery.js';\n\n/**\n * Import a component if user does not reduce motion.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n * @returns {Promise<T>}\n */\nexport default function importWhenPrefersMotion<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n): Promise<T> {\n  return importOnMediaQuery(fn, 'not (prefers-reduced-motion)');\n}\n"],
+  "mappings": "AACA,OAAO,wBAAwB;AAShB,SAAR,wBACL,IACY;AACZ,SAAO,mBAAmB,IAAI,8BAA8B;AAC9D;",
+  "names": []
+}

package/helpers/importWhenVisible.cjs

@@ -25,16 +25,7 @@ module.exports = __toCommonJS(importWhenVisible_exports);
 var import_utils = require("./utils.cjs");
 var import_utils2 = require("../utils/index.cjs");
 function importWhenVisible(fn, nameOrSelectorOrElement, parent, observerOptions = {}) {
-  let ResolvedClass;
-  const resolver = (resolve, cb) => {
-    fn().then((module2) => {
-      ResolvedClass = "default" in module2 ? module2.default : module2;
-      resolve(ResolvedClass);
-      if ((0, import_utils2.isFunction)(cb)) {
-        cb();
-      }
-    });
-  };
+  const resolver = (0, import_utils2.getComponentResolver)(fn);
   return new Promise((resolve) => {
     const observer = new IntersectionObserver((entries) => {
       const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);

package/helpers/importWhenVisible.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/importWhenVisible.ts"],
-  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isFunction } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {Base} [parent]\n *   The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n *   Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  parent?: Base,\n  observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n  let ResolvedClass;\n\n  const resolver = (resolve, cb) => {\n    fn().then((module) => {\n      ResolvedClass = 'default' in module ? module.default : module;\n      resolve(ResolvedClass);\n\n      if (isFunction(cb)) {\n        cb();\n      }\n    });\n  };\n\n  return new Promise((resolve) => {\n    const observer = new IntersectionObserver((entries) => {\n      const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n      if (someEntriesAreVisible) {\n        setTimeout(() => {\n          resolver(resolve, () => observer.disconnect());\n        }, 0);\n      }\n    }, observerOptions);\n\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    elements.forEach((element) => observer.observe(element));\n  });\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAA2B;AAgBZ,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,MAAI;AAEJ,QAAM,WAAW,CAAC,SAAS,OAAO;AAChC,OAAG,EAAE,KAAK,CAACC,YAAW;AACpB,sBAAgB,aAAaA,UAASA,QAAO,UAAUA;AACvD,cAAQ,aAAa;AAErB,cAAI,0BAAW,EAAE,GAAG;AAClB,WAAG;AAAA,MACL;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,aAAS,QAAQ,CAAC,YAAY,SAAS,QAAQ,OAAO,CAAC;AAAA,EACzD,CAAC;AACH;",
-  "names": ["import_utils", "module"]
+  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {Base} [parent]\n *   The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n *   Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  parent?: Base,\n  observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    const observer = new IntersectionObserver((entries) => {\n      const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n      if (someEntriesAreVisible) {\n        setTimeout(() => {\n          resolver(resolve, () => observer.disconnect());\n        }, 0);\n      }\n    }, observerOptions);\n\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    elements.forEach((element) => observer.observe(element));\n  });\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,mBAAkC;AAClC,IAAAA,gBAAqC;AAgBtB,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,QAAM,eAAW,oCAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,eAAW,gCAAkB,yBAAyB,QAAQ,GAAG;AACvE,aAAS,QAAQ,CAAC,YAAY,SAAS,QAAQ,OAAO,CAAC;AAAA,EACzD,CAAC;AACH;",
+  "names": ["import_utils"]
 }

package/helpers/importWhenVisible.js

@@ -1,16 +1,7 @@
 import { getTargetElements } from "./utils.js";
-import { isFunction } from "../utils/index.js";
+import { getComponentResolver } from "../utils/index.js";
 function importWhenVisible(fn, nameOrSelectorOrElement, parent, observerOptions = {}) {
-  let ResolvedClass;
-  const resolver = (resolve, cb) => {
-    fn().then((module) => {
-      ResolvedClass = "default" in module ? module.default : module;
-      resolve(ResolvedClass);
-      if (isFunction(cb)) {
-        cb();
-      }
-    });
-  };
+  const resolver = getComponentResolver(fn);
   return new Promise((resolve) => {
     const observer = new IntersectionObserver((entries) => {
       const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);

package/helpers/importWhenVisible.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/importWhenVisible.ts"],
-  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { isFunction } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {Base} [parent]\n *   The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n *   Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  parent?: Base,\n  observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n  let ResolvedClass;\n\n  const resolver = (resolve, cb) => {\n    fn().then((module) => {\n      ResolvedClass = 'default' in module ? module.default : module;\n      resolve(ResolvedClass);\n\n      if (isFunction(cb)) {\n        cb();\n      }\n    });\n  };\n\n  return new Promise((resolve) => {\n    const observer = new IntersectionObserver((entries) => {\n      const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n      if (someEntriesAreVisible) {\n        setTimeout(() => {\n          resolver(resolve, () => observer.disconnect());\n        }, 0);\n      }\n    }, observerOptions);\n\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    elements.forEach((element) => observer.observe(element));\n  });\n}\n"],
-  "mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,kBAAkB;AAgBZ,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,MAAI;AAEJ,QAAM,WAAW,CAAC,SAAS,OAAO;AAChC,OAAG,EAAE,KAAK,CAAC,WAAW;AACpB,sBAAgB,aAAa,SAAS,OAAO,UAAU;AACvD,cAAQ,aAAa;AAErB,UAAI,WAAW,EAAE,GAAG;AAClB,WAAG;AAAA,MACL;AAAA,IACF,CAAC;AAAA,EACH;AAEA,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,aAAS,QAAQ,CAAC,YAAY,SAAS,QAAQ,OAAO,CAAC;AAAA,EACzD,CAAC;AACH;",
+  "sourcesContent": ["import type { Base, BaseConstructor } from '../Base/index.js';\nimport { getTargetElements } from './utils.js';\nimport { getComponentResolver } from '../utils/index.js';\n\n/**\n * Import a component when it is visible.\n *\n * @template {BaseConstructor} T\n * @param {() => Promise<T|{default:T}>} fn\n *   The import function.\n * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement\n *   The name or selector for the component.\n * @param {Base} [parent]\n *   The parent component.\n * @param {IntersectionObserverInit} [observerOptions]\n *   Options for the `IntersectionObserver` instance.\n * @returns {Promise<T>}\n */\nexport default function importWhenVisible<T extends BaseConstructor = BaseConstructor>(\n  fn: () => Promise<T | { default: T }>,\n  nameOrSelectorOrElement: string | HTMLElement | HTMLElement[],\n  parent?: Base,\n  observerOptions: IntersectionObserverInit = {},\n): Promise<T> {\n  const resolver = getComponentResolver(fn);\n\n  return new Promise((resolve) => {\n    const observer = new IntersectionObserver((entries) => {\n      const someEntriesAreVisible = entries.some((entry) => entry.isIntersecting);\n      if (someEntriesAreVisible) {\n        setTimeout(() => {\n          resolver(resolve, () => observer.disconnect());\n        }, 0);\n      }\n    }, observerOptions);\n\n    const elements = getTargetElements(nameOrSelectorOrElement, parent?.$el);\n    elements.forEach((element) => observer.observe(element));\n  });\n}\n"],
+  "mappings": "AACA,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AAgBtB,SAAR,kBACL,IACA,yBACA,QACA,kBAA4C,CAAC,GACjC;AACZ,QAAM,WAAW,qBAAqB,EAAE;AAExC,SAAO,IAAI,QAAQ,CAAC,YAAY;AAC9B,UAAM,WAAW,IAAI,qBAAqB,CAAC,YAAY;AACrD,YAAM,wBAAwB,QAAQ,KAAK,CAAC,UAAU,MAAM,cAAc;AAC1E,UAAI,uBAAuB;AACzB,mBAAW,MAAM;AACf,mBAAS,SAAS,MAAM,SAAS,WAAW,CAAC;AAAA,QAC/C,GAAG,CAAC;AAAA,MACN;AAAA,IACF,GAAG,eAAe;AAElB,UAAM,WAAW,kBAAkB,yBAAyB,QAAQ,GAAG;AACvE,aAAS,QAAQ,CAAC,YAAY,SAAS,QAAQ,OAAO,CAAC;AAAA,EACzD,CAAC;AACH;",
   "names": []
 }

package/helpers/index.cjs

@@ -30,7 +30,9 @@ __export(helpers_exports, {
   getClosestParent: () => import_getClosestParent.default,
   getInstanceFromElement: () => import_getInstanceFromElement.default,
   importOnInteraction: () => import_importOnInteraction.default,
+  importOnMediaQuery: () => import_importOnMediaQuery.default,
   importWhenIdle: () => import_importWhenIdle.default,
+  importWhenPrefersMotion: () => import_importWhenPrefersMotion.default,
   importWhenVisible: () => import_importWhenVisible.default
 });
 module.exports = __toCommonJS(helpers_exports);
@@ -41,5 +43,7 @@ var import_getInstanceFromElement = __toESM(require("./getInstanceFromElement.cj
 var import_importOnInteraction = __toESM(require("./importOnInteraction.cjs"), 1);
 var import_importWhenIdle = __toESM(require("./importWhenIdle.cjs"), 1);
 var import_importWhenVisible = __toESM(require("./importWhenVisible.cjs"), 1);
+var import_importOnMediaQuery = __toESM(require("./importOnMediaQuery.cjs"), 1);
+var import_importWhenPrefersMotion = __toESM(require("./importWhenPrefersMotion"), 1);
 if (module.exports.default) module.exports = module.exports.default;
 //# sourceMappingURL=index.cjs.map

package/helpers/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/index.ts"],
-  "sourcesContent": ["export * from './getDirectChildren.js';\nexport { default as createApp } from './createApp.js';\nexport { default as getClosestParent } from './getClosestParent.js';\nexport { default as getInstanceFromElement } from './getInstanceFromElement.js';\nexport { default as importOnInteraction } from './importOnInteraction.js';\nexport { default as importWhenIdle } from './importWhenIdle.js';\nexport { default as importWhenVisible } from './importWhenVisible.js';\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAAc,oCAAd;AACA,uBAAqC;AACrC,8BAA4C;AAC5C,oCAAkD;AAClD,iCAA+C;AAC/C,4BAA0C;AAC1C,+BAA6C;",
+  "sourcesContent": ["export * from './getDirectChildren.js';\nexport { default as createApp } from './createApp.js';\nexport { default as getClosestParent } from './getClosestParent.js';\nexport { default as getInstanceFromElement } from './getInstanceFromElement.js';\nexport { default as importOnInteraction } from './importOnInteraction.js';\nexport { default as importWhenIdle } from './importWhenIdle.js';\nexport { default as importWhenVisible } from './importWhenVisible.js';\nexport { default as importOnMediaQuery } from './importOnMediaQuery.js';\nexport { default as importWhenPrefersMotion } from './importWhenPrefersMotion';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,4BAAc,oCAAd;AACA,uBAAqC;AACrC,8BAA4C;AAC5C,oCAAkD;AAClD,iCAA+C;AAC/C,4BAA0C;AAC1C,+BAA6C;AAC7C,gCAA8C;AAC9C,qCAAmD;",
   "names": []
 }

package/helpers/index.d.ts

@@ -5,3 +5,5 @@ export { default as getInstanceFromElement } from './getInstanceFromElement.js';
 export { default as importOnInteraction } from './importOnInteraction.js';
 export { default as importWhenIdle } from './importWhenIdle.js';
 export { default as importWhenVisible } from './importWhenVisible.js';
+export { default as importOnMediaQuery } from './importOnMediaQuery.js';
+export { default as importWhenPrefersMotion } from './importWhenPrefersMotion';

package/helpers/index.js

@@ -5,12 +5,16 @@ import { default as default4 } from "./getInstanceFromElement.js";
 import { default as default5 } from "./importOnInteraction.js";
 import { default as default6 } from "./importWhenIdle.js";
 import { default as default7 } from "./importWhenVisible.js";
+import { default as default8 } from "./importOnMediaQuery.js";
+import { default as default9 } from "./importWhenPrefersMotion";
 export {
   default2 as createApp,
   default3 as getClosestParent,
   default4 as getInstanceFromElement,
   default5 as importOnInteraction,
+  default8 as importOnMediaQuery,
   default6 as importWhenIdle,
+  default9 as importWhenPrefersMotion,
   default7 as importWhenVisible
 };
 //# sourceMappingURL=index.js.map

package/helpers/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/helpers/index.ts"],
-  "sourcesContent": ["export * from './getDirectChildren.js';\nexport { default as createApp } from './createApp.js';\nexport { default as getClosestParent } from './getClosestParent.js';\nexport { default as getInstanceFromElement } from './getInstanceFromElement.js';\nexport { default as importOnInteraction } from './importOnInteraction.js';\nexport { default as importWhenIdle } from './importWhenIdle.js';\nexport { default as importWhenVisible } from './importWhenVisible.js';\n"],
-  "mappings": "AAAA,cAAc;AACd,SAAoB,WAAXA,gBAA4B;AACrC,SAAoB,WAAXA,gBAAmC;AAC5C,SAAoB,WAAXA,gBAAyC;AAClD,SAAoB,WAAXA,gBAAsC;AAC/C,SAAoB,WAAXA,gBAAiC;AAC1C,SAAoB,WAAXA,gBAAoC;",
+  "sourcesContent": ["export * from './getDirectChildren.js';\nexport { default as createApp } from './createApp.js';\nexport { default as getClosestParent } from './getClosestParent.js';\nexport { default as getInstanceFromElement } from './getInstanceFromElement.js';\nexport { default as importOnInteraction } from './importOnInteraction.js';\nexport { default as importWhenIdle } from './importWhenIdle.js';\nexport { default as importWhenVisible } from './importWhenVisible.js';\nexport { default as importOnMediaQuery } from './importOnMediaQuery.js';\nexport { default as importWhenPrefersMotion } from './importWhenPrefersMotion';\n"],
+  "mappings": "AAAA,cAAc;AACd,SAAoB,WAAXA,gBAA4B;AACrC,SAAoB,WAAXA,gBAAmC;AAC5C,SAAoB,WAAXA,gBAAyC;AAClD,SAAoB,WAAXA,gBAAsC;AAC/C,SAAoB,WAAXA,gBAAiC;AAC1C,SAAoB,WAAXA,gBAAoC;AAC7C,SAAoB,WAAXA,gBAAqC;AAC9C,SAAoB,WAAXA,gBAA0C;",
   "names": ["default"]
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/js-toolkit",
-  "version": "2.9.1",
+  "version": "2.10.0",
   "description": "A set of useful little bits of JavaScript to boost your project! 🚀",
   "publishConfig": {
     "access": "public"
@@ -42,9 +42,9 @@
   ],
   "dependencies": {
     "@motionone/easing": "^10.15.1",
-    "deepmerge": "^4.2.2"
+    "deepmerge": "^4.3.1"
   },
-  "devDependencies": {
-    "vue": "2.6"
+  "peerDependencies": {
+    "vue": "^2.6"
   }
 }

package/utils/getComponentResolver.cjs

@@ -0,0 +1,38 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// packages/js-toolkit/utils/getComponentResolver.ts
+var getComponentResolver_exports = {};
+__export(getComponentResolver_exports, {
+  default: () => getComponentResolver
+});
+module.exports = __toCommonJS(getComponentResolver_exports);
+var import_is = require("./is.cjs");
+function getComponentResolver(fn) {
+  return (resolve, cb) => {
+    fn().then((module2) => {
+      const ResolvedClass = module2.default ?? module2;
+      resolve(ResolvedClass);
+      if ((0, import_is.isFunction)(cb)) {
+        cb();
+      }
+    });
+  };
+}
+if (module.exports.default) module.exports = module.exports.default;
+//# sourceMappingURL=getComponentResolver.cjs.map

package/utils/getComponentResolver.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/utils/getComponentResolver.ts"],
+  "sourcesContent": ["import { isFunction } from './is.js';\n\n/**\n * Default component resolver\n *\n * @param {Function} fn\n * @returns {Function}\n */\nexport default function getComponentResolver(fn) {\n  return (resolve, cb?: () => unknown) => {\n    fn().then((module) => {\n      const ResolvedClass = module.default ?? module;\n      resolve(ResolvedClass);\n\n      if (isFunction(cb)) {\n        cb();\n      }\n    });\n  };\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAA2B;AAQZ,SAAR,qBAAsC,IAAI;AAC/C,SAAO,CAAC,SAAS,OAAuB;AACtC,OAAG,EAAE,KAAK,CAACA,YAAW;AACpB,YAAM,gBAAgBA,QAAO,WAAWA;AACxC,cAAQ,aAAa;AAErB,cAAI,sBAAW,EAAE,GAAG;AAClB,WAAG;AAAA,MACL;AAAA,IACF,CAAC;AAAA,EACH;AACF;",
+  "names": ["module"]
+}

package/utils/getComponentResolver.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Default component resolver
+ *
+ * @param {Function} fn
+ * @returns {Function}
+ */
+export default function getComponentResolver(fn: any): (resolve: any, cb?: () => unknown) => void;

package/utils/getComponentResolver.js

@@ -0,0 +1,16 @@
+import { isFunction } from "./is.js";
+function getComponentResolver(fn) {
+  return (resolve, cb) => {
+    fn().then((module) => {
+      const ResolvedClass = module.default ?? module;
+      resolve(ResolvedClass);
+      if (isFunction(cb)) {
+        cb();
+      }
+    });
+  };
+}
+export {
+  getComponentResolver as default
+};
+//# sourceMappingURL=getComponentResolver.js.map

package/utils/getComponentResolver.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../packages/js-toolkit/utils/getComponentResolver.ts"],
+  "sourcesContent": ["import { isFunction } from './is.js';\n\n/**\n * Default component resolver\n *\n * @param {Function} fn\n * @returns {Function}\n */\nexport default function getComponentResolver(fn) {\n  return (resolve, cb?: () => unknown) => {\n    fn().then((module) => {\n      const ResolvedClass = module.default ?? module;\n      resolve(ResolvedClass);\n\n      if (isFunction(cb)) {\n        cb();\n      }\n    });\n  };\n}\n"],
+  "mappings": "AAAA,SAAS,kBAAkB;AAQZ,SAAR,qBAAsC,IAAI;AAC/C,SAAO,CAAC,SAAS,OAAuB;AACtC,OAAG,EAAE,KAAK,CAAC,WAAW;AACpB,YAAM,gBAAgB,OAAO,WAAW;AACxC,cAAQ,aAAa;AAErB,UAAI,WAAW,EAAE,GAAG;AAClB,WAAG;AAAA,MACL;AAAA,IACF,CAAC;AAAA,EACH;AACF;",
+  "names": []
+}

package/utils/index.cjs

@@ -30,6 +30,7 @@ __export(utils_exports, {
   SmartQueue: () => import_SmartQueue.SmartQueue,
   debounce: () => import_debounce.default,
   focusTrap: () => import_focusTrap.default,
+  getComponentResolver: () => import_getComponentResolver.default,
   historyPush: () => import_history.push,
   historyReplace: () => import_history.replace,
   keyCodes: () => import_keyCodes.default,
@@ -52,6 +53,7 @@ var import_nextTick = __toESM(require("./nextTick.cjs"), 1);
 var import_nextMicrotask = __toESM(require("./nextMicrotask.cjs"), 1);
 var import_throttle = __toESM(require("./throttle.cjs"), 1);
 var import_scrollTo = __toESM(require("./scrollTo.cjs"), 1);
+var import_getComponentResolver = __toESM(require("./getComponentResolver.cjs"), 1);
 __reExport(utils_exports, require("./is.cjs"), module.exports);
 __reExport(utils_exports, require("./has.cjs"), module.exports);
 __reExport(utils_exports, require("./css/index.cjs"), module.exports);

package/utils/index.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/utils/index.ts"],
-  "sourcesContent": ["export { default as debounce } from './debounce.js';\nexport { default as focusTrap } from './focusTrap.js';\nexport { default as keyCodes } from './keyCodes.js';\nexport { default as memoize } from './memoize.js';\nexport { nextFrame } from './nextFrame.js';\nexport { default as nextTick } from './nextTick.js';\nexport { default as nextMicrotask } from './nextMicrotask.js';\nexport { default as throttle } from './throttle.js';\nexport { default as scrollTo } from './scrollTo.js';\nexport * from './is.js';\nexport * from './has.js';\n// eslint-disable-next-line import/extensions\nexport * from './css/index.js';\nexport {\n  objectToURLSearchParams,\n  push as historyPush,\n  replace as historyReplace,\n} from './history.js';\nexport * from './collide/index.js';\nexport * from './math/index.js';\nexport * from './string/index.js';\nexport * from './scheduler.js';\nexport * from './noop.js';\nexport { tween } from './tween.js';\nexport { Queue } from './Queue.js';\nexport { SmartQueue } from './SmartQueue.js';\nexport * from './dom/index.js';\nexport * from './wait.js';\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAoC;AACpC,uBAAqC;AACrC,sBAAoC;AACpC,qBAAmC;AACnC,uBAA0B;AAC1B,sBAAoC;AACpC,2BAAyC;AACzC,sBAAoC;AACpC,sBAAoC;AACpC,0BAAc,qBATd;AAUA,0BAAc,sBAVd;AAYA,0BAAc,4BAZd;AAaA,qBAIO;AACP,0BAAc,gCAlBd;AAmBA,0BAAc,6BAnBd;AAoBA,0BAAc,+BApBd;AAqBA,0BAAc,4BArBd;AAsBA,0BAAc,uBAtBd;AAuBA,mBAAsB;AACtB,mBAAsB;AACtB,wBAA2B;AAC3B,0BAAc,4BA1Bd;AA2BA,0BAAc,uBA3Bd;",
+  "sourcesContent": ["export { default as debounce } from './debounce.js';\nexport { default as focusTrap } from './focusTrap.js';\nexport { default as keyCodes } from './keyCodes.js';\nexport { default as memoize } from './memoize.js';\nexport { nextFrame } from './nextFrame.js';\nexport { default as nextTick } from './nextTick.js';\nexport { default as nextMicrotask } from './nextMicrotask.js';\nexport { default as throttle } from './throttle.js';\nexport { default as scrollTo } from './scrollTo.js';\nexport { default as getComponentResolver } from './getComponentResolver.js';\nexport * from './is.js';\nexport * from './has.js';\n// eslint-disable-next-line import/extensions\nexport * from './css/index.js';\nexport {\n  objectToURLSearchParams,\n  push as historyPush,\n  replace as historyReplace,\n} from './history.js';\nexport * from './collide/index.js';\nexport * from './math/index.js';\nexport * from './string/index.js';\nexport * from './scheduler.js';\nexport * from './noop.js';\nexport { tween } from './tween.js';\nexport { Queue } from './Queue.js';\nexport { SmartQueue } from './SmartQueue.js';\nexport * from './dom/index.js';\nexport * from './wait.js';\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,sBAAoC;AACpC,uBAAqC;AACrC,sBAAoC;AACpC,qBAAmC;AACnC,uBAA0B;AAC1B,sBAAoC;AACpC,2BAAyC;AACzC,sBAAoC;AACpC,sBAAoC;AACpC,kCAAgD;AAChD,0BAAc,qBAVd;AAWA,0BAAc,sBAXd;AAaA,0BAAc,4BAbd;AAcA,qBAIO;AACP,0BAAc,gCAnBd;AAoBA,0BAAc,6BApBd;AAqBA,0BAAc,+BArBd;AAsBA,0BAAc,4BAtBd;AAuBA,0BAAc,uBAvBd;AAwBA,mBAAsB;AACtB,mBAAsB;AACtB,wBAA2B;AAC3B,0BAAc,4BA3Bd;AA4BA,0BAAc,uBA5Bd;",
   "names": []
 }

package/utils/index.d.ts

@@ -7,6 +7,7 @@ export { default as nextTick } from './nextTick.js';
 export { default as nextMicrotask } from './nextMicrotask.js';
 export { default as throttle } from './throttle.js';
 export { default as scrollTo } from './scrollTo.js';
+export { default as getComponentResolver } from './getComponentResolver.js';
 export * from './is.js';
 export * from './has.js';
 export * from './css/index.js';

package/utils/index.js

@@ -7,6 +7,7 @@ import { default as default6 } from "./nextTick.js";
 import { default as default7 } from "./nextMicrotask.js";
 import { default as default8 } from "./throttle.js";
 import { default as default9 } from "./scrollTo.js";
+import { default as default10 } from "./getComponentResolver.js";
 export * from "./is.js";
 export * from "./has.js";
 export * from "./css/index.js";
@@ -30,6 +31,7 @@ export {
   SmartQueue,
   default2 as debounce,
   default3 as focusTrap,
+  default10 as getComponentResolver,
   push as historyPush,
   replace as historyReplace,
   default4 as keyCodes,

package/utils/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../packages/js-toolkit/utils/index.ts"],
-  "sourcesContent": ["export { default as debounce } from './debounce.js';\nexport { default as focusTrap } from './focusTrap.js';\nexport { default as keyCodes } from './keyCodes.js';\nexport { default as memoize } from './memoize.js';\nexport { nextFrame } from './nextFrame.js';\nexport { default as nextTick } from './nextTick.js';\nexport { default as nextMicrotask } from './nextMicrotask.js';\nexport { default as throttle } from './throttle.js';\nexport { default as scrollTo } from './scrollTo.js';\nexport * from './is.js';\nexport * from './has.js';\n// eslint-disable-next-line import/extensions\nexport * from './css/index.js';\nexport {\n  objectToURLSearchParams,\n  push as historyPush,\n  replace as historyReplace,\n} from './history.js';\nexport * from './collide/index.js';\nexport * from './math/index.js';\nexport * from './string/index.js';\nexport * from './scheduler.js';\nexport * from './noop.js';\nexport { tween } from './tween.js';\nexport { Queue } from './Queue.js';\nexport { SmartQueue } from './SmartQueue.js';\nexport * from './dom/index.js';\nexport * from './wait.js';\n"],
-  "mappings": "AAAA,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAA4B;AACrC,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAA0B;AACnC,SAAS,iBAAiB;AAC1B,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAAgC;AACzC,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAA2B;AACpC,cAAc;AACd,cAAc;AAEd,cAAc;AACd;AAAA,EACE;AAAA,EACQ;AAAA,EACG;AAAA,OACN;AACP,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,aAAa;AACtB,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAC3B,cAAc;AACd,cAAc;",
+  "sourcesContent": ["export { default as debounce } from './debounce.js';\nexport { default as focusTrap } from './focusTrap.js';\nexport { default as keyCodes } from './keyCodes.js';\nexport { default as memoize } from './memoize.js';\nexport { nextFrame } from './nextFrame.js';\nexport { default as nextTick } from './nextTick.js';\nexport { default as nextMicrotask } from './nextMicrotask.js';\nexport { default as throttle } from './throttle.js';\nexport { default as scrollTo } from './scrollTo.js';\nexport { default as getComponentResolver } from './getComponentResolver.js';\nexport * from './is.js';\nexport * from './has.js';\n// eslint-disable-next-line import/extensions\nexport * from './css/index.js';\nexport {\n  objectToURLSearchParams,\n  push as historyPush,\n  replace as historyReplace,\n} from './history.js';\nexport * from './collide/index.js';\nexport * from './math/index.js';\nexport * from './string/index.js';\nexport * from './scheduler.js';\nexport * from './noop.js';\nexport { tween } from './tween.js';\nexport { Queue } from './Queue.js';\nexport { SmartQueue } from './SmartQueue.js';\nexport * from './dom/index.js';\nexport * from './wait.js';\n"],
+  "mappings": "AAAA,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAA4B;AACrC,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAA0B;AACnC,SAAS,iBAAiB;AAC1B,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAAgC;AACzC,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,gBAA2B;AACpC,SAAoB,WAAXA,iBAAuC;AAChD,cAAc;AACd,cAAc;AAEd,cAAc;AACd;AAAA,EACE;AAAA,EACQ;AAAA,EACG;AAAA,OACN;AACP,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,SAAS,aAAa;AACtB,SAAS,aAAa;AACtB,SAAS,kBAAkB;AAC3B,cAAc;AACd,cAAc;",
   "names": ["default"]
 }

package/utils/math/ease.cjs

@@ -74,7 +74,7 @@ function easeInCirc(progress) {
 var easeOutCirc = (0, import_createEases.createEaseOut)(easeInCirc);
 var easeInOutCirc = (0, import_createEases.createEaseInOut)(easeInCirc);
 function easeInExpo(progress) {
-  return 2 ** (10 * (progress - 1));
+  return progress === 0 ? 0 : 2 ** (10 * (progress - 1));
 }
 var easeOutExpo = (0, import_createEases.createEaseOut)(easeInExpo);
 var easeInOutExpo = (0, import_createEases.createEaseInOut)(easeInExpo);

package/utils/math/ease.cjs.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/math/ease.ts"],
-  "sourcesContent": ["import { createEaseOut, createEaseInOut } from './createEases.js';\n\n/**\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuad(progress: number) {\n  return progress ** 2;\n}\n\nexport const easeOutQuad = createEaseOut(easeInQuad);\nexport const easeInOutQuad = createEaseInOut(easeInQuad);\n\n/**\n * Ease in cubic.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCubic(progress: number) {\n  return progress ** 3;\n}\n\nexport const easeOutCubic = createEaseOut(easeInCubic);\nexport const easeInOutCubic = createEaseInOut(easeInCubic);\n\n/**\n * Ease in quart.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuart(progress: number) {\n  return progress ** 4;\n}\n\nexport const easeOutQuart = createEaseOut(easeInQuart);\nexport const easeInOutQuart = createEaseInOut(easeInQuart);\n\n/**\n * Ease in quint.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuint(progress: number) {\n  return progress ** 5;\n}\n\nexport const easeOutQuint = createEaseOut(easeInQuint);\nexport const easeInOutQuint = createEaseInOut(easeInQuint);\n\n/**\n * Ease in sine.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInSine(progress: number) {\n  return progress === 1 ? 1 : -Math.cos((progress * Math.PI) / 2) + 1;\n}\n\nexport const easeOutSine = createEaseOut(easeInSine);\nexport const easeInOutSine = createEaseInOut(easeInSine);\n\n/**\n * Ease in circ.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCirc(progress: number) {\n  return -(Math.sqrt(1 - progress * progress) - 1);\n}\n\nexport const easeOutCirc = createEaseOut(easeInCirc);\nexport const easeInOutCirc = createEaseInOut(easeInCirc);\n\n/**\n * Ease in exponential.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInExpo(progress: number) {\n  return 2 ** (10 * (progress - 1));\n}\n\nexport const easeOutExpo = createEaseOut(easeInExpo);\nexport const easeInOutExpo = createEaseInOut(easeInExpo);\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAA+C;AAMxC,SAAS,WAAW,UAAkB;AAC3C,SAAO,YAAY;AACrB;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;AAQhD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,IAAM,mBAAe,kCAAc,WAAW;AAC9C,IAAM,qBAAiB,oCAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,IAAM,mBAAe,kCAAc,WAAW;AAC9C,IAAM,qBAAiB,oCAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,IAAM,mBAAe,kCAAc,WAAW;AAC9C,IAAM,qBAAiB,oCAAgB,WAAW;AAQlD,SAAS,WAAW,UAAkB;AAC3C,SAAO,aAAa,IAAI,IAAI,CAAC,KAAK,IAAK,WAAW,KAAK,KAAM,CAAC,IAAI;AACpE;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,EAAE,KAAK,KAAK,IAAI,WAAW,QAAQ,IAAI;AAChD;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,MAAM,MAAM,WAAW;AAChC;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;",
+  "sourcesContent": ["import { createEaseOut, createEaseInOut } from './createEases.js';\n\n/**\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuad(progress: number) {\n  return progress ** 2;\n}\n\nexport const easeOutQuad = createEaseOut(easeInQuad);\nexport const easeInOutQuad = createEaseInOut(easeInQuad);\n\n/**\n * Ease in cubic.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCubic(progress: number) {\n  return progress ** 3;\n}\n\nexport const easeOutCubic = createEaseOut(easeInCubic);\nexport const easeInOutCubic = createEaseInOut(easeInCubic);\n\n/**\n * Ease in quart.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuart(progress: number) {\n  return progress ** 4;\n}\n\nexport const easeOutQuart = createEaseOut(easeInQuart);\nexport const easeInOutQuart = createEaseInOut(easeInQuart);\n\n/**\n * Ease in quint.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuint(progress: number) {\n  return progress ** 5;\n}\n\nexport const easeOutQuint = createEaseOut(easeInQuint);\nexport const easeInOutQuint = createEaseInOut(easeInQuint);\n\n/**\n * Ease in sine.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInSine(progress: number) {\n  return progress === 1 ? 1 : -Math.cos((progress * Math.PI) / 2) + 1;\n}\n\nexport const easeOutSine = createEaseOut(easeInSine);\nexport const easeInOutSine = createEaseInOut(easeInSine);\n\n/**\n * Ease in circ.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCirc(progress: number) {\n  return -(Math.sqrt(1 - progress * progress) - 1);\n}\n\nexport const easeOutCirc = createEaseOut(easeInCirc);\nexport const easeInOutCirc = createEaseInOut(easeInCirc);\n\n/**\n * Ease in exponential.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInExpo(progress: number) {\n  return progress === 0 ? 0 : 2 ** (10 * (progress - 1));\n}\n\nexport const easeOutExpo = createEaseOut(easeInExpo);\nexport const easeInOutExpo = createEaseInOut(easeInExpo);\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAA+C;AAMxC,SAAS,WAAW,UAAkB;AAC3C,SAAO,YAAY;AACrB;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;AAQhD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,IAAM,mBAAe,kCAAc,WAAW;AAC9C,IAAM,qBAAiB,oCAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,IAAM,mBAAe,kCAAc,WAAW;AAC9C,IAAM,qBAAiB,oCAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,IAAM,mBAAe,kCAAc,WAAW;AAC9C,IAAM,qBAAiB,oCAAgB,WAAW;AAQlD,SAAS,WAAW,UAAkB;AAC3C,SAAO,aAAa,IAAI,IAAI,CAAC,KAAK,IAAK,WAAW,KAAK,KAAM,CAAC,IAAI;AACpE;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,EAAE,KAAK,KAAK,IAAI,WAAW,QAAQ,IAAI;AAChD;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,aAAa,IAAI,IAAI,MAAM,MAAM,WAAW;AACrD;AAEO,IAAM,kBAAc,kCAAc,UAAU;AAC5C,IAAM,oBAAgB,oCAAgB,UAAU;",
   "names": []
 }

package/utils/math/ease.js

@@ -30,7 +30,7 @@ function easeInCirc(progress) {
 const easeOutCirc = createEaseOut(easeInCirc);
 const easeInOutCirc = createEaseInOut(easeInCirc);
 function easeInExpo(progress) {
-  return 2 ** (10 * (progress - 1));
+  return progress === 0 ? 0 : 2 ** (10 * (progress - 1));
 }
 const easeOutExpo = createEaseOut(easeInExpo);
 const easeInOutExpo = createEaseInOut(easeInExpo);

package/utils/math/ease.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../packages/js-toolkit/utils/math/ease.ts"],
-  "sourcesContent": ["import { createEaseOut, createEaseInOut } from './createEases.js';\n\n/**\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuad(progress: number) {\n  return progress ** 2;\n}\n\nexport const easeOutQuad = createEaseOut(easeInQuad);\nexport const easeInOutQuad = createEaseInOut(easeInQuad);\n\n/**\n * Ease in cubic.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCubic(progress: number) {\n  return progress ** 3;\n}\n\nexport const easeOutCubic = createEaseOut(easeInCubic);\nexport const easeInOutCubic = createEaseInOut(easeInCubic);\n\n/**\n * Ease in quart.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuart(progress: number) {\n  return progress ** 4;\n}\n\nexport const easeOutQuart = createEaseOut(easeInQuart);\nexport const easeInOutQuart = createEaseInOut(easeInQuart);\n\n/**\n * Ease in quint.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuint(progress: number) {\n  return progress ** 5;\n}\n\nexport const easeOutQuint = createEaseOut(easeInQuint);\nexport const easeInOutQuint = createEaseInOut(easeInQuint);\n\n/**\n * Ease in sine.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInSine(progress: number) {\n  return progress === 1 ? 1 : -Math.cos((progress * Math.PI) / 2) + 1;\n}\n\nexport const easeOutSine = createEaseOut(easeInSine);\nexport const easeInOutSine = createEaseInOut(easeInSine);\n\n/**\n * Ease in circ.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCirc(progress: number) {\n  return -(Math.sqrt(1 - progress * progress) - 1);\n}\n\nexport const easeOutCirc = createEaseOut(easeInCirc);\nexport const easeInOutCirc = createEaseInOut(easeInCirc);\n\n/**\n * Ease in exponential.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInExpo(progress: number) {\n  return 2 ** (10 * (progress - 1));\n}\n\nexport const easeOutExpo = createEaseOut(easeInExpo);\nexport const easeInOutExpo = createEaseInOut(easeInExpo);\n"],
-  "mappings": "AAAA,SAAS,eAAe,uBAAuB;AAMxC,SAAS,WAAW,UAAkB;AAC3C,SAAO,YAAY;AACrB;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;AAQhD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,MAAM,eAAe,cAAc,WAAW;AAC9C,MAAM,iBAAiB,gBAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,MAAM,eAAe,cAAc,WAAW;AAC9C,MAAM,iBAAiB,gBAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,MAAM,eAAe,cAAc,WAAW;AAC9C,MAAM,iBAAiB,gBAAgB,WAAW;AAQlD,SAAS,WAAW,UAAkB;AAC3C,SAAO,aAAa,IAAI,IAAI,CAAC,KAAK,IAAK,WAAW,KAAK,KAAM,CAAC,IAAI;AACpE;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,EAAE,KAAK,KAAK,IAAI,WAAW,QAAQ,IAAI;AAChD;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,MAAM,MAAM,WAAW;AAChC;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;",
+  "sourcesContent": ["import { createEaseOut, createEaseInOut } from './createEases.js';\n\n/**\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuad(progress: number) {\n  return progress ** 2;\n}\n\nexport const easeOutQuad = createEaseOut(easeInQuad);\nexport const easeInOutQuad = createEaseInOut(easeInQuad);\n\n/**\n * Ease in cubic.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCubic(progress: number) {\n  return progress ** 3;\n}\n\nexport const easeOutCubic = createEaseOut(easeInCubic);\nexport const easeInOutCubic = createEaseInOut(easeInCubic);\n\n/**\n * Ease in quart.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuart(progress: number) {\n  return progress ** 4;\n}\n\nexport const easeOutQuart = createEaseOut(easeInQuart);\nexport const easeInOutQuart = createEaseInOut(easeInQuart);\n\n/**\n * Ease in quint.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInQuint(progress: number) {\n  return progress ** 5;\n}\n\nexport const easeOutQuint = createEaseOut(easeInQuint);\nexport const easeInOutQuint = createEaseInOut(easeInQuint);\n\n/**\n * Ease in sine.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInSine(progress: number) {\n  return progress === 1 ? 1 : -Math.cos((progress * Math.PI) / 2) + 1;\n}\n\nexport const easeOutSine = createEaseOut(easeInSine);\nexport const easeInOutSine = createEaseInOut(easeInSine);\n\n/**\n * Ease in circ.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInCirc(progress: number) {\n  return -(Math.sqrt(1 - progress * progress) - 1);\n}\n\nexport const easeOutCirc = createEaseOut(easeInCirc);\nexport const easeInOutCirc = createEaseInOut(easeInCirc);\n\n/**\n * Ease in exponential.\n *\n * @param  {number} progress Progress value betwen 0 and 1.\n * @returns {number}          Eased value between 0 and 1.\n */\nexport function easeInExpo(progress: number) {\n  return progress === 0 ? 0 : 2 ** (10 * (progress - 1));\n}\n\nexport const easeOutExpo = createEaseOut(easeInExpo);\nexport const easeInOutExpo = createEaseInOut(easeInExpo);\n"],
+  "mappings": "AAAA,SAAS,eAAe,uBAAuB;AAMxC,SAAS,WAAW,UAAkB;AAC3C,SAAO,YAAY;AACrB;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;AAQhD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,MAAM,eAAe,cAAc,WAAW;AAC9C,MAAM,iBAAiB,gBAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,MAAM,eAAe,cAAc,WAAW;AAC9C,MAAM,iBAAiB,gBAAgB,WAAW;AAQlD,SAAS,YAAY,UAAkB;AAC5C,SAAO,YAAY;AACrB;AAEO,MAAM,eAAe,cAAc,WAAW;AAC9C,MAAM,iBAAiB,gBAAgB,WAAW;AAQlD,SAAS,WAAW,UAAkB;AAC3C,SAAO,aAAa,IAAI,IAAI,CAAC,KAAK,IAAK,WAAW,KAAK,KAAM,CAAC,IAAI;AACpE;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,EAAE,KAAK,KAAK,IAAI,WAAW,QAAQ,IAAI;AAChD;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;AAQhD,SAAS,WAAW,UAAkB;AAC3C,SAAO,aAAa,IAAI,IAAI,MAAM,MAAM,WAAW;AACrD;AAEO,MAAM,cAAc,cAAc,UAAU;AAC5C,MAAM,gBAAgB,gBAAgB,UAAU;",
   "names": []
 }