@studiometa/js-toolkit 2.4.2 → 2.4.3

package/Base/index.d.ts

@@ -1,7 +1,7 @@
 /**
  * @typedef {typeof Base} BaseConstructor
  * @typedef {(Base) => Promise<BaseConstructor | { default: BaseConstructor }>} BaseAsyncConstructor
- * @typedef {OptionsManager & { [name:string]: any }} BaseOptions
+ * @typedef {{ [name:string]: any }} BaseOptions
  * @typedef {{ [name:string]: HTMLElement | HTMLElement[] }} BaseRefs
  * @typedef {{ [nameOrSelector:string]: Base[] | Promise<Base>[] }} BaseChildren
  * @typedef {{ [nameOrSelector:string]: BaseConstructor | BaseAsyncConstructor }} BaseConfigComponents
@@ -18,6 +18,14 @@
  * @property {BaseConfigComponents} [components]
  * @property {BaseConfigOptions} [options]
  */
+/**
+ * @typedef {{
+ *   $el?: HTMLElement,
+ *   $options?: BaseOptions,
+ *   $refs?: BaseRefs,
+ *   $children?: { [name:string]: Base | Promise<Base> },
+ * }} BaseTypeParameter
+ */
 /**
  * @typedef {Object} Managers
  * @property {typeof ChildrenManager} ChildrenManager
@@ -28,12 +36,15 @@
  */
 /**
  * Base class.
- * @template {{ $options: BaseOptions, $refs: BaseRefs, $children: BaseChildren }} BaseInterface
+ * @template {BaseTypeParameter} [BaseInterface={ $el: HTMLElement, $options: BaseOptions, $refs: BaseRefs, $children: { [name:string]: Base | Promise<Base> } }]
  */
-export default class Base<BaseInterface extends {
+export default class Base<BaseInterface extends BaseTypeParameter = {
+    $el: HTMLElement;
     $options: BaseOptions;
     $refs: BaseRefs;
-    $children: BaseChildren;
+    $children: {
+        [name: string]: Base<any> | Promise<Base<any>>;
+    };
 }> extends EventTarget {
     /**
      * This is a Base instance.
@@ -51,7 +62,7 @@ export default class Base<BaseInterface extends {
      * @param  {string}      nameOrSelector The selector on which to mount each instance.
      * @returns {Array<Base>}                A list of the created instance.
      */
-    static $factory(nameOrSelector: string): Array<Base<any>>;
+    static $factory(nameOrSelector: string): Array<Base>;
     /**
      * Class constructor where all the magic takes place.
      *
@@ -62,7 +73,7 @@ export default class Base<BaseInterface extends {
      * The instance parent.
      * @type {Base}
      */
-    $parent: Base<any>;
+    $parent: Base;
     /**
      * The instance id.
      * @type {string}
@@ -70,10 +81,10 @@ export default class Base<BaseInterface extends {
     $id: string;
     /**
      * The root element.
-     * @type {HTMLElement & { __base__?: WeakMap<BaseConstructor, Base | 'terminated'> }}
+     * @type {BaseInterface['$el'] & HTMLElement & { __base__?: WeakMap<BaseConstructor, Base | 'terminated'> }}
      */
-    $el: HTMLElement & {
-        __base__?: WeakMap<BaseConstructor, Base<any> | 'terminated'>;
+    $el: BaseInterface['$el'] & HTMLElement & {
+        __base__?: WeakMap<BaseConstructor, Base | 'terminated'>;
     };
     /**
      * The state of the component.
@@ -91,7 +102,14 @@ export default class Base<BaseInterface extends {
      * Get the root instance of the app.
      * @returns {Base}
      */
-    get $root(): Base<any>;
+    get $root(): Base<{
+        $el: HTMLElement;
+        $options: BaseOptions;
+        $refs: BaseRefs;
+        $children: {
+            [name: string]: Base<any> | Promise<Base<any>>;
+        };
+    }>;
     /**
      * Merge configuration with the parents' configurations.
      *
@@ -109,34 +127,32 @@ export default class Base<BaseInterface extends {
      */
     get $services(): ServicesManager;
     /**
-     * @type {RefsManager & { [key in keyof BaseInterface['$refs']]: BaseInterface['$refs'][key] }}
+     * @type {RefsManager & { [key in keyof BaseInterface['$refs']]: BaseInterface['$refs'][key] } & BaseRefs}
      * @private
      */
     private __refs;
     /**
-     * @returns {RefsManager & { [key in keyof BaseInterface['$refs']]: BaseInterface['$refs'][key] }}
+     * @returns {RefsManager & { [key in keyof BaseInterface['$refs']]: BaseInterface['$refs'][key] } & BaseRefs}
      */
-    get $refs(): RefsManager & (BaseInterface["$refs"] extends infer T ? { [key in keyof T]: BaseInterface["$refs"][key]; } : never);
+    get $refs(): RefsManager & (BaseInterface["$refs"] extends infer T ? { [key in keyof T]: BaseInterface["$refs"][key]; } : never) & BaseRefs;
     /**
-     * @type {BaseOptions & { [key in keyof BaseInterface['$options']]: BaseInterface['$options'][key] }}
+     * @type {OptionsManager & { [key in keyof BaseInterface['$options']]: BaseInterface['$options'][key] } & BaseOptions}
      * @private
      */
     private __options;
     /**
-     * @returns {BaseOptions & { [key in keyof BaseInterface['$options']]: BaseInterface['$options'][key] }}
+     * @returns {OptionsManager & { [key in keyof BaseInterface['$options']]: BaseInterface['$options'][key] } & BaseOptions}
      */
-    get $options(): OptionsManager & {
-        [name: string]: any;
-    } & (BaseInterface["$options"] extends infer T_1 ? { [key_1 in keyof T_1]: BaseInterface["$options"][key_1]; } : never);
+    get $options(): OptionsManager & (BaseInterface["$options"] extends infer T_1 ? { [key_1 in keyof T_1]: BaseInterface["$options"][key_1]; } : never) & BaseOptions;
     /**
-     * @type {ChildrenManager & { [key in keyof BaseInterface['$children']]: Array<BaseInterface['$children'][key]> }}
+     * @type {ChildrenManager & { [key in keyof BaseInterface['$children']]: Array<BaseInterface['$children'][key]> } & BaseChildren}
      * @private
      */
     private __children;
     /**
-     * @returns {ChildrenManager & { [key in keyof BaseInterface['$children']]: Array<BaseInterface['$children'][key]> }}
+     * @returns {ChildrenManager & { [key in keyof BaseInterface['$children']]: Array<BaseInterface['$children'][key]> } & BaseChildren}
      */
-    get $children(): ChildrenManager & (BaseInterface["$children"] extends infer T_2 ? { [key_2 in keyof T_2]: BaseInterface["$children"][key_2][]; } : never);
+    get $children(): ChildrenManager & (BaseInterface["$children"] extends infer T_2 ? { [key_2 in keyof T_2]: BaseInterface["$children"][key_2][]; } : never) & BaseChildren;
     /**
      * @type {EventsManager}
      * @private
@@ -260,13 +276,29 @@ export type BaseConstructor = typeof Base;
 export type BaseAsyncConstructor = (Base: any) => Promise<BaseConstructor | {
     default: BaseConstructor;
 }>;
-export type BaseOptions = OptionsManager & {
+export type BaseOptions = {
     [name: string]: any;
 };
 export type BaseRefs = {
     [name: string]: HTMLElement | HTMLElement[];
 };
-export type BaseChildren = BaseChildren;
+export type BaseChildren = {
+    [nameOrSelector: string]: Base<{
+        $el: HTMLElement;
+        $options: BaseOptions;
+        $refs: BaseRefs;
+        $children: {
+            [name: string]: Base<any> | Promise<Base<any>>;
+        };
+    }>[] | Promise<Base<{
+        $el: HTMLElement;
+        $options: BaseOptions;
+        $refs: BaseRefs;
+        $children: {
+            [name: string]: Base<any> | Promise<Base<any>>;
+        };
+    }>>[];
+};
 export type BaseConfigComponents = {
     [nameOrSelector: string]: typeof Base | BaseAsyncConstructor;
 };
@@ -281,6 +313,28 @@ export type BaseConfig = {
     components?: BaseConfigComponents;
     options?: BaseConfigOptions;
 };
+export type BaseTypeParameter = {
+    $el?: HTMLElement;
+    $options?: BaseOptions;
+    $refs?: BaseRefs;
+    $children?: {
+        [name: string]: Base<{
+            $el: HTMLElement;
+            $options: BaseOptions;
+            $refs: BaseRefs;
+            $children: {
+                [name: string]: Base<any> | Promise<Base<any>>;
+            };
+        }> | Promise<Base<{
+            $el: HTMLElement;
+            $options: BaseOptions;
+            $refs: BaseRefs;
+            $children: {
+                [name: string]: Base<any> | Promise<Base<any>>;
+            };
+        }>>;
+    };
+};
 export type Managers = {
     ChildrenManager: typeof ChildrenManager;
     EventsManager: typeof EventsManager;

package/Base/managers/AbstractManager.d.ts

@@ -12,11 +12,11 @@ export default class AbstractManager {
      *
      * @param   {Base} base
      */
-    constructor(base: import("../index.js").default<any>);
+    constructor(base: Base);
     /**
      * @type {Base}
      */
-    __base: import("../index.js").default<any>;
+    __base: Base;
     /**
      * Get the base instance root element.
      * @returns {HTMLElement}
@@ -39,6 +39,6 @@ export default class AbstractManager {
      */
     __hideProperties(properties: string[]): void;
 }
-export type Base = import("../index.js").default<any>;
+export type Base = import('../index.js').default;
 export type BaseConfig = import('../index.js').BaseConfig;
 export type EventsManager = import('./EventsManager.js').default;

package/Base/managers/ChildrenManager.d.ts

@@ -34,7 +34,7 @@ export default class ChildrenManager extends AbstractManager {
      */
     destroyAll(): void;
 }
-export type Base = import("../index.js").default<any>;
+export type Base = import('../index.js').default;
 export type BaseConstructor = import('../index.js').BaseConstructor;
 export type BaseAsyncConstructor = import('../index.js').BaseAsyncConstructor;
 export type BaseConfigComponents = import('../index.js').BaseConfigComponents;

package/Base/managers/EventsManager.d.ts

@@ -83,7 +83,7 @@ export default class EventsManager extends AbstractManager {
      *   A base instance.
      * @returns {void}
      */
-    bindChild(name: string, instance: import("../index.js").default<any>): void;
+    bindChild(name: string, instance: Base): void;
     /**
      * Unbind event methods to the given child instance.
      *
@@ -93,7 +93,7 @@ export default class EventsManager extends AbstractManager {
      *   A base instance.
      * @returns {void}
      */
-    unbindChild(name: string, instance: import("../index.js").default<any>): void;
+    unbindChild(name: string, instance: Base): void;
     /**
      * Bind event methods on the root element.
      *
@@ -107,6 +107,6 @@ export default class EventsManager extends AbstractManager {
      */
     unbindRootElement(): void;
 }
-export type Base = import("../index.js").default<any>;
+export type Base = import('../index.js').default;
 export type ChildrenManager = import('./ChildrenManager.js').default;
 import AbstractManager from "./AbstractManager.js";

package/Base/managers/OptionsManager.d.ts

@@ -52,7 +52,7 @@ export default class OptionsManager extends AbstractManager {
     set(name: string, value: any, config: OptionObject): void;
 }
 export type DeepmergeOptions = import('deepmerge').Options;
-export type Base = import("../index.js").default<any>;
+export type Base = import('../index.js').default;
 export type BaseConfig = import('../index.js').BaseConfig;
 export type OptionType = StringConstructor | NumberConstructor | BooleanConstructor | ArrayConstructor | ObjectConstructor;
 export type ArrayOption = {

package/Base/managers/ServicesManager.d.ts

@@ -79,7 +79,7 @@ export default class ServicesManager extends AbstractManager {
      */
     unregister(name: string): void;
 }
-export type Base = import("../index").default<any>;
+export type Base = import('../index').default;
 export type BaseConstructor = import('../index').BaseConstructor;
 export type ServiceInterface = import('../../services').ServiceInterface<any>;
 export type Services = typeof SERVICES_MAP & Record<string, () => ServiceInterface>;

package/Base/utils.d.ts

@@ -36,5 +36,5 @@ export function eventIsNative(event: string, element: HTMLElement): boolean;
  * @param   {import('./index.js').BaseConfig} config
  * @returns {Base|Base['$el']}
  */
-export function getEventTarget(instance: import("./index.js").default<any>, event: string, config: import('./index.js').BaseConfig): import("./index.js").default<any> | import("./index.js").default<any>['$el'];
-export type Base = import("./index.js").default<any>;
+export function getEventTarget(instance: Base, event: string, config: import('./index.js').BaseConfig): Base | Base['$el'];
+export type Base = import('./index.js').default;

package/decorators/withBreakpointManager.d.ts

@@ -6,5 +6,5 @@
  * @returns {T}
  */
 export default function withBreakpointManager<T extends typeof import("../Base").default>(BaseClass: T, breakpoints: Array<[string, BaseConstructor]>): T;
-export type Base = import("../Base").default<any>;
+export type Base = import('../Base').default;
 export type BaseConstructor = import('../Base').BaseConstructor;

package/decorators/withBreakpointObserver.d.ts

@@ -6,7 +6,7 @@
  * @returns {T}
  */
 export default function withBreakpointObserver<T extends typeof import("../Base").default>(BaseClass: T): T;
-export type Base = import("../Base").default<any>;
+export type Base = import('../Base').default;
 export type BaseConstructor = import('../Base').BaseConstructor;
 export type WithBreakpointObserverOptions = {
     activeBreakpoints?: string;

package/decorators/withDrag.d.ts

@@ -15,7 +15,16 @@
  * @returns {T}
  */
 export default function withDrag<T extends typeof import("../Base").default>(BaseClass: T, { target, ...options }?: DragDecoratorOptions): T;
-export type Base = import("../Base").default<any>;
+export type Base = import('../Base').default;
 export type BaseConstructor = import('../Base').BaseConstructor;
 export type DragServiceOptions = import('../services/drag').DragServiceOptions;
-export type DragDecoratorOptions = DragDecoratorOptions;
+export type DragDecoratorOptions = import("../services/drag.js").DragServiceOptions & {
+    target?: (this: import("../Base").default<{
+        $el: HTMLElement;
+        $options: import("../Base").BaseOptions;
+        $refs: import("../Base").BaseRefs;
+        $children: {
+            [name: string]: import("../Base").default<any> | Promise<import("../Base").default<any>>;
+        };
+    }>, Base: any) => HTMLElement;
+};

package/decorators/withIntersectionObserver.d.ts

@@ -11,7 +11,7 @@ export default function withIntersectionObserver<T extends typeof import("../Bas
         $observer: IntersectionObserver;
     };
 };
-export type Base = import("../Base").default<any>;
+export type Base = import('../Base').default;
 export type BaseConstructor = import('../Base').BaseConstructor;
 export type WithIntersectionObserverOptions = {
     intersectionObserver: any;

package/decorators/withMountWhenInView.d.ts

@@ -21,7 +21,7 @@
  * @returns {T}
  */
 export default function withMountWhenInView<T extends typeof import("../Base").default>(BaseClass: T, defaultOptions?: IntersectionObserverInit): T;
-export type Base = import("../Base").default<any>;
+export type Base = import('../Base').default;
 export type BaseOptions = import('../Base').BaseOptions;
 export type BaseConstructor = import('../Base').BaseConstructor;
 export type WithMountWhenInViewOptions = {

package/decorators/withScrolledInView.d.ts

@@ -9,7 +9,7 @@
 export default function withScrolledInView<T extends typeof import("../Base").default>(BaseClass: T, options?: IntersectionObserverInit & {
     useOffsetSizes?: boolean;
 }): T;
-export type Base = import("../Base").default<any>;
+export type Base = import('../Base').default;
 export type BaseConstructor = import('../Base').BaseConstructor;
 export type BaseConfig = import('../Base').BaseConfig;
 export type ScrollInViewProps = {

package/decorators/withVue2.d.ts

@@ -1,6 +1,6 @@
 declare function _default<T extends typeof import("../Base").default>(BaseClass: T, Vue: import('vue').VueConstructor): T;
 export default _default;
-export type Base = import("../Base").default<any>;
+export type Base = import('../Base').default;
 export type BaseConstructor = import('../Base').BaseConstructor;
 export type WithVue2Refs = {
     vue: HTMLElement;

package/helpers/getDirectChildren.d.ts

@@ -8,9 +8,16 @@
  * @param   {Base} parentInstance
  * @param   {string} parentName
  * @param   {string} childrenName
- * @returns {Array<T>}
+ * @returns {T[]}
  */
-export function getDirectChildren<T extends import("../Base/index.js").default<any>>(parentInstance: import("../Base/index.js").default<any>, parentName: string, childrenName: string): T[];
+export function getDirectChildren<T extends import("../Base/index.js").default<{
+    $el: HTMLElement;
+    $options: import("../Base/index.js").BaseOptions;
+    $refs: import("../Base/index.js").BaseRefs;
+    $children: {
+        [name: string]: import("../Base/index.js").default<any> | Promise<import("../Base/index.js").default<any>>;
+    };
+}>>(parentInstance: Base, parentName: string, childrenName: string): T[];
 /**
  * Test if a component instance is a direct child from the given component.
  *
@@ -20,5 +27,5 @@ export function getDirectChildren<T extends import("../Base/index.js").default<a
  * @param   {Base}    childInstance
  * @returns {boolean}
  */
-export function isDirectChild(parentInstance: import("../Base/index.js").default<any>, parentName: string, childrenName: string, childInstance: import("../Base/index.js").default<any>): boolean;
-export type Base = import("../Base/index.js").default<any>;
+export function isDirectChild(parentInstance: Base, parentName: string, childrenName: string, childInstance: Base): boolean;
+export type Base = import('../Base/index.js').default;

package/helpers/importOnInteraction.d.ts

@@ -18,6 +18,6 @@
  */
 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?: import("../Base/index.js").default<any>): Promise<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<any>;
+export type Base = import('../Base/index.js').default;

package/helpers/importWhenVisible.d.ts

@@ -18,6 +18,6 @@
  */
 export default function importWhenVisible<T extends typeof import("../Base/index.js").default>(fn: () => Promise<T | {
     default: T;
-}>, nameOrSelectorOrElement: string | HTMLElement | HTMLElement[], parent?: import("../Base/index.js").default<any>, observerOptions?: IntersectionObserverInit): Promise<T>;
-export type Base = import("../Base/index.js").default<any>;
+}>, 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/index.d.ts

@@ -2,3 +2,4 @@ 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 = import('./Base/index.js').BaseTypeParameter;

package/package.json

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