@studiometa/js-toolkit 2.0.0-rc.2 → 2.1.0

package/Base/index.cjs

@@ -40,6 +40,40 @@ var id = 0;
 var isDev = typeof __DEV__ !== "undefined" && __DEV__;
 function noop() {
 }
+function createAndTestManagers(instance) {
+  [
+    {
+      prop: "__options",
+      constructorName: "OptionsManager",
+      constructor: import_OptionsManager.default
+    },
+    {
+      prop: "__services",
+      constructorName: "ServicesManager",
+      constructor: import_ServicesManager.default
+    },
+    {
+      prop: "__events",
+      constructorName: "EventsManager",
+      constructor: import_EventsManager.default
+    },
+    {
+      prop: "__refs",
+      constructorName: "RefsManager",
+      constructor: import_RefsManager.default
+    },
+    {
+      prop: "__children",
+      constructorName: "ChildrenManager",
+      constructor: import_ChildrenManager.default
+    }
+  ].forEach(({ prop, constructorName, constructor }) => {
+    instance[prop] = new instance.__managers[constructorName](instance);
+    if (!(instance[prop] instanceof constructor)) {
+      throw new Error(`The \`$managers.${constructorName}\` must extend the \`${constructorName}\` class.`);
+    }
+  });
+}
 var Base = class extends EventTarget {
   constructor(element) {
     super();
@@ -67,15 +101,10 @@ var Base = class extends EventTarget {
       this.$el.__base__ = /* @__PURE__ */ new WeakMap();
     }
     this.$el.__base__.set(this.__ctor, this);
-    this.__options = new import_OptionsManager.default(element, __config.options || {}, __config);
-    this.__services = new import_ServicesManager.default(this);
-    this.__events = new import_EventsManager.default(element, this);
-    this.__children = new import_ChildrenManager.default(this, element, __config.components || {}, this.__events);
-    this.__refs = new import_RefsManager.default(this, element, __config.refs || [], this.__events);
+    createAndTestManagers(this);
     if (isDev) {
       this.__debug("constructor", this);
     }
-    return this;
   }
   get $root() {
     if (!this.$parent) {
@@ -92,24 +121,22 @@ var Base = class extends EventTarget {
     return root;
   }
   get __config() {
+    var _a, _b, _c;
     let proto = Object.getPrototypeOf(this);
     let { config } = proto.constructor;
     while (proto.constructor.config && proto.constructor.$isBase) {
-      config = {
-        ...proto.constructor.config,
-        ...config
-      };
+      config = { ...proto.constructor.config, ...config };
       if (proto.constructor.config.options) {
-        config.options = {
-          ...proto.constructor.config.options,
-          ...config.options
-        };
+        config.options = { ...proto.constructor.config.options, ...config.options };
       }
       if (proto.constructor.config.emits && config.emits) {
         config.emits = [...proto.constructor.config.emits, ...config.emits];
       }
       proto = Object.getPrototypeOf(proto);
     }
+    config.options = (_a = config.options) != null ? _a : {};
+    config.refs = (_b = config.refs) != null ? _b : [];
+    config.components = (_c = config.components) != null ? _c : {};
     return config;
   }
   get $services() {
@@ -130,6 +157,15 @@ var Base = class extends EventTarget {
   get __debug() {
     return isDev && this.__options.debug ? window.console.log.bind(window, `[debug] [${this.$id}]`) : noop;
   }
+  get __managers() {
+    return {
+      ChildrenManager: import_ChildrenManager.default,
+      EventsManager: import_EventsManager.default,
+      OptionsManager: import_OptionsManager.default,
+      RefsManager: import_RefsManager.default,
+      ServicesManager: import_ServicesManager.default
+    };
+  }
   __callMethod(method, ...args) {
     if (isDev) {
       this.__debug("callMethod", method, ...args);
@@ -151,6 +187,7 @@ var Base = class extends EventTarget {
     if (this.$isMounted) {
       return this;
     }
+    this.$emit("before-mounted");
     this.$isMounted = true;
     if (isDev) {
       this.__debug("$mount");
@@ -214,7 +251,7 @@ var Base = class extends EventTarget {
   }
   __removeEmits(event) {
     const ctor = this.__ctor;
-    const index = ctor.config.emits.findIndex((value) => value === event);
+    const index = ctor.config.emits.indexOf(event);
     ctor.config.emits.splice(index, 1);
   }
   get __ctor() {
@@ -255,9 +292,7 @@ var Base = class extends EventTarget {
     if (isDev) {
       this.__testEventIsDefined(event);
     }
-    this.dispatchEvent(new CustomEvent(event, {
-      detail: args
-    }));
+    this.dispatchEvent(new CustomEvent(event, { detail: args }));
   }
   static $factory(nameOrSelector) {
     if (!nameOrSelector) {
@@ -270,6 +305,7 @@ __publicField(Base, "$isBase", true);
 __publicField(Base, "config", {
   name: "Base",
   emits: [
+    "before-mounted",
     "mounted",
     "updated",
     "destroyed",

package/Base/index.d.ts

@@ -10,21 +10,29 @@
  */
 /**
  * @typedef {Object} BaseConfig
- * @property {String} name
- * @property {Boolean} [debug]
- * @property {Boolean} [log]
- * @property {String[]} [refs]
- * @property {String[]} [emits]
+ * @property {string} name
+ * @property {boolean} [debug]
+ * @property {boolean} [log]
+ * @property {string[]} [refs]
+ * @property {string[]} [emits]
  * @property {BaseConfigComponents} [components]
  * @property {BaseConfigOptions} [options]
  */
+/**
+ * @typedef {Object} Managers
+ * @property {typeof ChildrenManager} ChildrenManager
+ * @property {typeof EventsManager} EventsManager
+ * @property {typeof OptionsManager} OptionsManager
+ * @property {typeof RefsManager} RefsManager
+ * @property {typeof ServicesManager} ServicesManager
+ */
 /**
  * Base class.
  */
 export default class Base extends EventTarget {
     /**
      * This is a Base instance.
-     * @type {Boolean}
+     * @type {boolean}
      * @readonly
      */
     static readonly $isBase: boolean;
@@ -35,8 +43,8 @@ export default class Base extends EventTarget {
     /**
      * Factory method to generate multiple instance of the class.
      *
-     * @param  {String}      nameOrSelector The selector on which to mount each instance.
-     * @return {Array<Base>}                A list of the created instance.
+     * @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>;
     /**
@@ -64,7 +72,7 @@ export default class Base extends EventTarget {
     };
     /**
      * The state of the component.
-     * @type {Boolean}
+     * @type {boolean}
      */
     $isMounted: boolean;
     /**
@@ -76,13 +84,13 @@ export default class Base extends EventTarget {
     private __eventHandlers;
     /**
      * Get the root instance of the app.
-     * @return {Base}
+     * @returns {Base}
      */
     get $root(): Base;
     /**
      * Merge configuration with the parents' configurations.
      *
-     * @return {BaseConfig}
+     * @returns {BaseConfig}
      * @private
      */
     private get __config();
@@ -101,7 +109,7 @@ export default class Base extends EventTarget {
      */
     private __refs;
     /**
-     * @return {RefsManager}
+     * @returns {RefsManager}
      */
     get $refs(): RefsManager;
     /**
@@ -110,7 +118,7 @@ export default class Base extends EventTarget {
      */
     private __options;
     /**
-     * @return {BaseOptions}
+     * @returns {BaseOptions}
      */
     get $options(): BaseOptions;
     /**
@@ -119,7 +127,7 @@ export default class Base extends EventTarget {
      */
     private __children;
     /**
-     * @return {ChildrenManager}
+     * @returns {ChildrenManager}
      */
     get $children(): ChildrenManager;
     /**
@@ -130,23 +138,29 @@ export default class Base extends EventTarget {
     /**
      * Small helper to log stuff.
      *
-     * @return {(...args: any) => void}
+     * @returns {(...args: any) => void}
      */
     get $log(): (...args: any) => void;
     /**
      * Small helper to debug information.
      *
      * @private
-     * @return {(...args:any) => void}
+     * @returns {(...args:any) => void}
      */
     private get __debug();
+    /**
+     * Get manager constructors.
+     *
+     * @returns {Managers}
+     */
+    get __managers(): Managers;
     /**
      * Call an instance method and emit corresponding events.
      *
      * @private
      * @param {string} method
      * @param {any[]} args
-     * @return {void}
+     * @returns {void}
      */
     private __callMethod;
     /**
@@ -154,27 +168,27 @@ export default class Base extends EventTarget {
      *
      * @private
      * @param  {string} event The event's name.
-     * @return {boolean}      Wether the given event has been bound or not.
+     * @returns {boolean}      Wether the given event has been bound or not.
      */
     private __hasEvent;
     /**
      * Trigger the `mounted` callback.
-     * @return {this}
+     * @returns {this}
      */
     $mount(): this;
     /**
      * Update the instance children.
-     * @return {this}
+     * @returns {this}
      */
     $update(): this;
     /**
      * Trigger the `destroyed` callback.
-     * @return {this}
+     * @returns {this}
      */
     $destroy(): this;
     /**
      * Terminate a child instance when it is not needed anymore.
-     * @return {void}
+     * @returns {void}
      */
     $terminate(): void;
     /**
@@ -217,7 +231,7 @@ export default class Base extends EventTarget {
      *   Function to be called.
      * @param {boolean|AddEventListenerOptions} [options]
      *   Options for the `removeEventListener` method.
-     * @return {() => void}
+     * @returns {() => void}
      *   A function to unbind the listener.
      */
     $on(event: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): () => void;
@@ -230,8 +244,7 @@ export default class Base extends EventTarget {
      *   Function to be removed.
      * @param {boolean|EventListenerOptions} [options]
      *   Options for the `removeEventListener` method.
-     *
-     * @return {void}
+     * @returns {void}
      */
     $off(event: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
     /**
@@ -240,7 +253,7 @@ export default class Base extends EventTarget {
      * @param  {string} event
      *   Name of the event.
      * @param  {any[]}        args  The arguments to apply to the functions bound to this event.
-     * @return {void}
+     * @returns {void}
      */
     $emit(event: string, ...args: any[]): void;
 }
@@ -271,7 +284,15 @@ export type BaseConfig = {
     components?: BaseConfigComponents;
     options?: BaseConfigOptions;
 };
+export type Managers = {
+    ChildrenManager: typeof ChildrenManager;
+    EventsManager: typeof EventsManager;
+    OptionsManager: typeof OptionsManager;
+    RefsManager: typeof RefsManager;
+    ServicesManager: typeof ServicesManager;
+};
 import ServicesManager from "./managers/ServicesManager.js";
 import RefsManager from "./managers/RefsManager.js";
 import ChildrenManager from "./managers/ChildrenManager.js";
 import OptionsManager from "./managers/OptionsManager.js";
+import EventsManager from "./managers/EventsManager.js";

package/Base/index.js

@@ -14,6 +14,40 @@ let id = 0;
 const isDev = typeof __DEV__ !== "undefined" && __DEV__;
 function noop() {
 }
+function createAndTestManagers(instance) {
+  [
+    {
+      prop: "__options",
+      constructorName: "OptionsManager",
+      constructor: OptionsManager
+    },
+    {
+      prop: "__services",
+      constructorName: "ServicesManager",
+      constructor: ServicesManager
+    },
+    {
+      prop: "__events",
+      constructorName: "EventsManager",
+      constructor: EventsManager
+    },
+    {
+      prop: "__refs",
+      constructorName: "RefsManager",
+      constructor: RefsManager
+    },
+    {
+      prop: "__children",
+      constructorName: "ChildrenManager",
+      constructor: ChildrenManager
+    }
+  ].forEach(({ prop, constructorName, constructor }) => {
+    instance[prop] = new instance.__managers[constructorName](instance);
+    if (!(instance[prop] instanceof constructor)) {
+      throw new Error(`The \`$managers.${constructorName}\` must extend the \`${constructorName}\` class.`);
+    }
+  });
+}
 class Base extends EventTarget {
   constructor(element) {
     super();
@@ -41,15 +75,10 @@ class Base extends EventTarget {
       this.$el.__base__ = /* @__PURE__ */ new WeakMap();
     }
     this.$el.__base__.set(this.__ctor, this);
-    this.__options = new OptionsManager(element, __config.options || {}, __config);
-    this.__services = new ServicesManager(this);
-    this.__events = new EventsManager(element, this);
-    this.__children = new ChildrenManager(this, element, __config.components || {}, this.__events);
-    this.__refs = new RefsManager(this, element, __config.refs || [], this.__events);
+    createAndTestManagers(this);
     if (isDev) {
       this.__debug("constructor", this);
     }
-    return this;
   }
   get $root() {
     if (!this.$parent) {
@@ -66,24 +95,22 @@ class Base extends EventTarget {
     return root;
   }
   get __config() {
+    var _a, _b, _c;
     let proto = Object.getPrototypeOf(this);
     let { config } = proto.constructor;
     while (proto.constructor.config && proto.constructor.$isBase) {
-      config = {
-        ...proto.constructor.config,
-        ...config
-      };
+      config = { ...proto.constructor.config, ...config };
       if (proto.constructor.config.options) {
-        config.options = {
-          ...proto.constructor.config.options,
-          ...config.options
-        };
+        config.options = { ...proto.constructor.config.options, ...config.options };
       }
       if (proto.constructor.config.emits && config.emits) {
         config.emits = [...proto.constructor.config.emits, ...config.emits];
       }
       proto = Object.getPrototypeOf(proto);
     }
+    config.options = (_a = config.options) != null ? _a : {};
+    config.refs = (_b = config.refs) != null ? _b : [];
+    config.components = (_c = config.components) != null ? _c : {};
     return config;
   }
   get $services() {
@@ -104,6 +131,15 @@ class Base extends EventTarget {
   get __debug() {
     return isDev && this.__options.debug ? window.console.log.bind(window, `[debug] [${this.$id}]`) : noop;
   }
+  get __managers() {
+    return {
+      ChildrenManager,
+      EventsManager,
+      OptionsManager,
+      RefsManager,
+      ServicesManager
+    };
+  }
   __callMethod(method, ...args) {
     if (isDev) {
       this.__debug("callMethod", method, ...args);
@@ -125,6 +161,7 @@ class Base extends EventTarget {
     if (this.$isMounted) {
       return this;
     }
+    this.$emit("before-mounted");
     this.$isMounted = true;
     if (isDev) {
       this.__debug("$mount");
@@ -188,7 +225,7 @@ class Base extends EventTarget {
   }
   __removeEmits(event) {
     const ctor = this.__ctor;
-    const index = ctor.config.emits.findIndex((value) => value === event);
+    const index = ctor.config.emits.indexOf(event);
     ctor.config.emits.splice(index, 1);
   }
   get __ctor() {
@@ -229,9 +266,7 @@ class Base extends EventTarget {
     if (isDev) {
       this.__testEventIsDefined(event);
     }
-    this.dispatchEvent(new CustomEvent(event, {
-      detail: args
-    }));
+    this.dispatchEvent(new CustomEvent(event, { detail: args }));
   }
   static $factory(nameOrSelector) {
     if (!nameOrSelector) {
@@ -244,6 +279,7 @@ __publicField(Base, "$isBase", true);
 __publicField(Base, "config", {
   name: "Base",
   emits: [
+    "before-mounted",
     "mounted",
     "updated",
     "destroyed",

package/Base/managers/AbstractManager.cjs

@@ -0,0 +1,56 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+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);
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
+// packages/js-toolkit/Base/managers/AbstractManager.js
+var AbstractManager_exports = {};
+__export(AbstractManager_exports, {
+  default: () => AbstractManager
+});
+module.exports = __toCommonJS(AbstractManager_exports);
+var AbstractManager = class {
+  constructor(base) {
+    __publicField(this, "__base");
+    this.__base = base;
+    this.__hideProperties(["__base"]);
+  }
+  get __element() {
+    return this.__base.$el;
+  }
+  get __config() {
+    return this.__base.__config;
+  }
+  get __eventsManager() {
+    return this.__base.__events;
+  }
+  __hideProperties(properties) {
+    Object.defineProperties(this, Object.fromEntries(properties.map((property) => [
+      property,
+      {
+        enumerable: false,
+        writable: false,
+        value: this[property]
+      }
+    ])));
+  }
+};
+if (module.exports.default) module.exports = module.exports.default;

package/Base/managers/AbstractManager.d.ts

@@ -0,0 +1,44 @@
+/**
+ * @typedef {import('../index.js').default} Base
+ * @typedef {import('../index.js').BaseConfig} BaseConfig
+ * @typedef {import('./EventsManager.js').default} EventsManager
+ */
+/**
+ * AbstractManager class.
+ */
+export default class AbstractManager {
+    /**
+     * Class constructor.
+     *
+     * @param   {Base} base
+     */
+    constructor(base: Base);
+    /**
+     * @type {Base}
+     */
+    __base: Base;
+    /**
+     * Get the base instance root element.
+     * @returns {HTMLElement}
+     */
+    get __element(): HTMLElement;
+    /**
+     * Get the base instance config.
+     * @returns {BaseConfig}
+     */
+    get __config(): import("../index.js").BaseConfig;
+    /**
+     * Get the events manager.
+     * @returns {EventsManager}
+     */
+    get __eventsManager(): import("./EventsManager.js").default;
+    /**
+     * Prevent a list of properties from being enumerable and writable.
+     * @param   {string[]} properties
+     * @returns {void}
+     */
+    __hideProperties(properties: string[]): void;
+}
+export type Base = import('../index.js').default;
+export type BaseConfig = import('../index.js').BaseConfig;
+export type EventsManager = import('./EventsManager.js').default;

package/Base/managers/AbstractManager.js

@@ -0,0 +1,35 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+class AbstractManager {
+  constructor(base) {
+    __publicField(this, "__base");
+    this.__base = base;
+    this.__hideProperties(["__base"]);
+  }
+  get __element() {
+    return this.__base.$el;
+  }
+  get __config() {
+    return this.__base.__config;
+  }
+  get __eventsManager() {
+    return this.__base.__events;
+  }
+  __hideProperties(properties) {
+    Object.defineProperties(this, Object.fromEntries(properties.map((property) => [
+      property,
+      {
+        enumerable: false,
+        writable: false,
+        value: this[property]
+      }
+    ])));
+  }
+}
+export {
+  AbstractManager as default
+};