@studiometa/js-toolkit 2.4.4-alpha.0 → 2.4.4-alpha.1

package/helpers/getInstanceFromElement.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @typedef {import('../Base/index.js').BaseConstructor} BaseConstructor
+ */
+/**
+ * Get a component instance from a DOM element.
+ * @template {BaseConstructor} T
+ * @param    {HTMLElement & { __base__?: WeakMap<T, InstanceType<T>> }} element
+ * @param    {T} Constructor
+ * @returns  {null|InstanceType<T>}
+ */
+export default function getInstanceFromElement<T extends typeof import("../Base/index.js").default>(element: HTMLElement & {
+    __base__?: WeakMap<T, InstanceType<T>>;
+}, Constructor: T): InstanceType<T>;
+export type BaseConstructor = import('../Base/index.js').BaseConstructor;

package/helpers/importOnInteraction.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @typedef {import('../Base/index.js').BaseConstructor} BaseConstructor
+ * @typedef {import('../Base/index.js').default} Base
+ */
+/**
+ * Import a component on an interaction.
+ *
+ * @template {BaseConstructor} T
+ * @param {() => Promise<T|{default:T}>} fn
+ *   The import function.
+ * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement
+ *   The name or selector for the component.
+ * @param {string|string[]} events
+ *   The events to listen to to trigger the import.
+ * @param {Base} [parent]
+ *   The parent component.
+ * @returns {Promise<T>}
+ */
+export default function importOnInteraction<T extends typeof import("../Base/index.js").default>(fn: () => Promise<T | {
+    default: T;
+}>, nameOrSelectorOrElement: string | HTMLElement | HTMLElement[], events: string | string[], parent?: Base): Promise<T>;
+export type BaseConstructor = import('../Base/index.js').BaseConstructor;
+export type Base = import('../Base/index.js').default;

package/helpers/importWhenIdle.d.ts

@@ -0,0 +1,21 @@
+/**
+ * @typedef {import('../Base/index.js').BaseConstructor} BaseConstructor
+ * @typedef {{ timeout?: number }} ImportWhenIdleOptions
+ */
+/**
+ * Import a component when user is idle.
+ *
+ * @template {BaseConstructor} T
+ * @param {() => Promise<T|{default:T}>} fn
+ *   The import function.
+ * @param {ImportWhenIdleOptions} [options]
+ *   The time to wait before triggering the callback if never idle.
+ * @returns {Promise<T>}
+ */
+export default function importWhenIdle<T extends typeof import("../Base/index.js").default>(fn: () => Promise<T | {
+    default: T;
+}>, options?: ImportWhenIdleOptions): Promise<T>;
+export type BaseConstructor = import('../Base/index.js').BaseConstructor;
+export type ImportWhenIdleOptions = {
+    timeout?: number;
+};

package/helpers/importWhenVisible.d.ts

@@ -0,0 +1,23 @@
+/**
+ * @typedef {import('../Base/index.js').default} Base
+ * @typedef {import('../Base/index.js').BaseConstructor} BaseConstructor
+ */
+/**
+ * Import a component when it is visible.
+ *
+ * @template {BaseConstructor} T
+ * @param {() => Promise<T|{default:T}>} fn
+ *   The import function.
+ * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement
+ *   The name or selector for the component.
+ * @param {Base} [parent]
+ *   The parent component.
+ * @param {IntersectionObserverInit} [observerOptions]
+ *   Options for the `IntersectionObserver` instance.
+ * @returns {Promise<T>}
+ */
+export default function importWhenVisible<T extends typeof import("../Base/index.js").default>(fn: () => Promise<T | {
+    default: T;
+}>, nameOrSelectorOrElement: string | HTMLElement | HTMLElement[], parent?: Base, observerOptions?: IntersectionObserverInit): Promise<T>;
+export type Base = import('../Base/index.js').default;
+export type BaseConstructor = import('../Base/index.js').BaseConstructor;

package/helpers/index.d.ts

@@ -0,0 +1,6 @@
+export { default as createApp } from "./createApp.js";
+export * from "./getDirectChildren.js";
+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";

package/helpers/utils.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Get the target elements for the lazy import helper functions.
+ *
+ * @param {string|HTMLElement|HTMLElement[]} nameOrSelectorOrElement
+ *   The original selector or element, or list of elements.
+ * @param {HTMLElement} [context]
+ *   The optional context to use to query for elements.
+ * @returns {HTMLElement[]} A normalized list of elements.
+ */
+export function getTargetElements(nameOrSelectorOrElement: string | HTMLElement | HTMLElement[], context?: HTMLElement): HTMLElement[];

package/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Base } from './Base/index.js';
+export * from './decorators/index.js';
+export * from './helpers/index.js';
+export * from './services/index.js';
+export type { BaseTypeParameter, BaseConstructor, BaseAsyncConstructor, BaseConfig, } from './Base/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@studiometa/js-toolkit",
-  "version": "2.4.4-alpha.0",
+  "version": "2.4.4-alpha.1",
   "description": "A set of useful little bits of JavaScript to boost your project! 🚀",
   "publishConfig": {
     "access": "public"

package/services/drag.d.ts

@@ -14,7 +14,7 @@
  * @param {DragServiceOptions} options
  * @returns {DragService}
  */
-export default function useDrag(target: HTMLElement, options: DragServiceOptions): DragService;
+export default function useDrag(target: HTMLElement, options: DragServiceOptions): import("./index").ServiceInterface<DragServiceProps>;
 export type DragService = import('./index').ServiceInterface<DragServiceProps>;
 export type PointerServiceProps = import('./pointer.js').PointerServiceProps;
 export type DragLifecycle = 'start' | 'drag' | 'drop' | 'inertia' | 'stop';

package/services/index.cjs

@@ -22,7 +22,7 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 
-// packages/js-toolkit/services/index.js
+// packages/js-toolkit/services/index.ts
 var services_exports = {};
 __export(services_exports, {
   useDrag: () => import_drag.default,

package/services/index.d.ts

@@ -1,33 +1,41 @@
-export { default as useDrag } from "./drag.js";
-export { default as useKey } from "./key.js";
-export { default as useLoad } from "./load.js";
-export { default as usePointer } from "./pointer.js";
-export { default as useRaf } from "./raf.js";
-export { default as useResize } from "./resize.js";
-export { default as useScroll } from "./scroll.js";
-export { useService } from "./service.js";
-export type ServiceInterface<T> = {
+import type { DragServiceProps } from './drag.js';
+import type { KeyServiceProps } from './key.js';
+import type { LoadServiceProps } from './load.js';
+import type { PointerServiceProps } from './pointer.js';
+import type { RafServiceProps } from './raf.js';
+import type { ResizeServiceProps } from './resize.js';
+import type { ScrollServiceProps } from './scroll.js';
+export interface ServiceInterface<T> {
     /**
-     *   Remove a function from the resize service by its key.
+     * Remove a function from the resize service by its key.
      */
-    remove: (key: string) => void;
+    remove(key: string): void;
     /**
-     *   Add a callback to the service. The callback will receive the current service props as parameter.
+     * Add a callback to the service. The callback will receive the current service props as parameter.
      */
-    add: (key: string, cb: (props: T) => void) => void;
+    add(key: string, callback: (props: T) => void): void;
     /**
-     *   Test if the service has alreaydy a callback for the given key.
+     * Test if the service has alreaydy a callback for the given key.
      */
-    has: (key: string) => boolean;
+    has(key: string): boolean;
     /**
-     *   Get the service's props.
+     * Get the service's props.
      */
-    props: () => T;
-};
-export type DragServiceProps = import('./drag').DragServiceProps;
-export type KeyServiceProps = import('./key').KeyServiceProps;
-export type LoadServiceProps = import('./load').LoadServiceProps;
-export type PointerServiceProps = import('./pointer').PointerServiceProps;
-export type RafServiceProps = import('./raf').RafServiceProps;
-export type ResizeServiceProps = import('./resize').ResizeServiceProps;
-export type ScrollServiceProps = import('./scroll').ScrollServiceProps;
+    props(): T;
+}
+export declare type DragServiceInterface = ServiceInterface<DragServiceProps>;
+export declare type KeyServiceInterface = ServiceInterface<KeyServiceProps>;
+export declare type LoadServiceInterface = ServiceInterface<LoadServiceProps>;
+export declare type PointerServiceInterface = ServiceInterface<PointerServiceProps>;
+export declare type RafServiceInterface = ServiceInterface<RafServiceProps>;
+export declare type ResizeServiceInterface = ServiceInterface<ResizeServiceProps>;
+export declare type ScrollServiceInterface = ServiceInterface<ScrollServiceProps>;
+export type { DragServiceProps, KeyServiceProps, LoadServiceProps, PointerServiceProps, RafServiceProps, ResizeServiceProps, ScrollServiceProps, };
+export { default as useDrag } from './drag.js';
+export { default as useKey } from './key.js';
+export { default as useLoad } from './load.js';
+export { default as usePointer } from './pointer.js';
+export { default as useRaf } from './raf.js';
+export { default as useResize } from './resize.js';
+export { default as useScroll } from './scroll.js';
+export { useService } from './service.js';

package/services/key.d.ts

@@ -3,7 +3,7 @@
  *
  * @returns {KeyService}
  */
-export default function useKey(): KeyService;
+export default function useKey(): import("./index").ServiceInterface<KeyServiceProps>;
 export type KeyService = import('./index').ServiceInterface<KeyServiceProps>;
 export type KeyServiceProps = {
     event: KeyboardEvent;

package/services/load.d.ts

@@ -3,7 +3,7 @@
  *
  * @returns {LoadService}
  */
-export default function useLoad(): LoadService;
+export default function useLoad(): import("./index").ServiceInterface<LoadServiceProps>;
 export type LoadService = import('./index').ServiceInterface<LoadServiceProps>;
 export type LoadServiceProps = {
     time: DOMHighResTimeStamp;

package/services/pointer.d.ts

@@ -4,7 +4,7 @@
  * @todo Add element as parameter to get the pointer position relatively from.
  * @returns {PointerService}
  */
-export default function usePointer(): PointerService;
+export default function usePointer(): import("./index").ServiceInterface<PointerServiceProps>;
 export type PointerService = import('./index').ServiceInterface<PointerServiceProps>;
 export type PointerServiceProps = {
     event: MouseEvent | TouchEvent;

package/services/raf.d.ts

@@ -3,7 +3,7 @@
  *
  * @returns {RafService}
  */
-export default function useRaf(): RafService;
+export default function useRaf(): import("./index").ServiceInterface<RafServiceProps>;
 export type RafService = import('./index').ServiceInterface<RafServiceProps>;
 export type RafServiceProps = {
     time: DOMHighResTimeStamp;

package/services/resize.d.ts

@@ -3,7 +3,7 @@
  *
  * @returns {ResizeService}
  */
-export default function useResize(): ResizeService;
+export default function useResize(): import("./index").ServiceInterface<ResizeServiceProps>;
 export type ResizeService = import('./index').ServiceInterface<ResizeServiceProps>;
 export type ResizeServiceProps = {
     width: number;

package/services/scroll.d.ts

@@ -11,7 +11,7 @@
  *
  * @returns {ScrollService}
  */
-export default function useScroll(): ScrollService;
+export default function useScroll(): import("./index").ServiceInterface<ScrollServiceProps>;
 export type ScrollService = import('./index').ServiceInterface<ScrollServiceProps>;
 export type ScrollServiceProps = {
     x: number;