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

package/Base/managers/EventsManager.cjs

@@ -27,19 +27,70 @@ var __publicField = (obj, key, value) => {
 // packages/js-toolkit/Base/managers/EventsManager.js
 var EventsManager_exports = {};
 __export(EventsManager_exports, {
-  default: () => EventsManager
+  default: () => EventsManager,
+  normalizeEventName: () => normalizeEventName,
+  normalizeName: () => normalizeName
 });
 module.exports = __toCommonJS(EventsManager_exports);
 var import_getAllProperties = __toESM(require("../../utils/object/getAllProperties.cjs"), 1);
-var import_RefsManager = __toESM(require("./RefsManager.cjs"), 1);
-var EventsManager = class {
-  constructor(rootElement, base) {
-    __publicField(this, "__rootElement");
-    __publicField(this, "__base");
+var import_AbstractManager = __toESM(require("./AbstractManager.cjs"), 1);
+var import_RefsManager = require("./RefsManager.cjs");
+function normalizeName(name) {
+  return name.replace(/[A-Z]([A-Z].*)/g, (c) => c.toLowerCase()).replace(/[^a-zA-Z\d\s:]/g, " ").replace(/(^\w|\s+\w)/g, (c) => c.trim().toUpperCase()).trim();
+}
+function normalizeEventName(name) {
+  return name.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`).replace(/^-/, "");
+}
+function __getEventNameByMethod(that, method, name = "") {
+  const normalizedName = normalizeName(name);
+  const regex = new RegExp(`^on${normalizedName}([A-Z].*)$`);
+  const [, event] = method.match(regex);
+  return normalizeEventName(event);
+}
+function __getEventMethodsByName(that, name = "") {
+  const normalizedName = normalizeName(name);
+  const regex = new RegExp(`^on${normalizedName}[A-Z].*$`);
+  const key = regex.toString();
+  let methods = that.__methodsCache.get(key);
+  if (!methods) {
+    methods = Array.from((0, import_getAllProperties.default)(that.__base, [], (method) => regex.test(method)).reduce((set, [method]) => set.add(method), /* @__PURE__ */ new Set()));
+    that.__methodsCache.set(key, methods);
+  }
+  return methods;
+}
+function __manageRef(that, name, elements, mode = "add") {
+  const action = `${mode}EventListener`;
+  const methods = __getEventMethodsByName(that, name);
+  methods.forEach((method) => {
+    const event = __getEventNameByMethod(that, method, name);
+    elements.forEach((element) => element[action](event, that.__refsHandler));
+  });
+}
+function __manageChild(that, name, instance, mode = "add") {
+  const action = mode === "add" ? "$on" : "$off";
+  const methods = __getEventMethodsByName(that, name);
+  methods.forEach((method) => {
+    const event = __getEventNameByMethod(that, method, name);
+    instance[action](event, that.__childrenHandler);
+  });
+}
+function __manageRootElement(that, mode = "add") {
+  const modeMethod = `${mode}EventListener`;
+  const methods = __getEventMethodsByName(that);
+  const { emits = [] } = that.__base.__config;
+  methods.forEach((method) => {
+    const event = __getEventNameByMethod(that, method);
+    const target = emits.includes(event) ? that.__base : that.__element;
+    target[modeMethod](event, that.__rootElementHandler);
+  });
+}
+var EventsManager = class extends import_AbstractManager.default {
+  constructor(base) {
+    super(base);
     __publicField(this, "__methodsCache", /* @__PURE__ */ new Map());
     __publicField(this, "__rootElementHandler", {
       handleEvent: (event) => {
-        const normalizedEventName = EventsManager.normalizeName(event.type);
+        const normalizedEventName = normalizeName(event.type);
         const method = `on${normalizedEventName}`;
         this.__base[method](event);
       }
@@ -47,9 +98,9 @@ var EventsManager = class {
     __publicField(this, "__refsHandler", {
       handleEvent: (event) => {
         const ref = event.currentTarget;
-        const refName = import_RefsManager.default.normalizeRefName(ref.dataset.ref);
-        const normalizedRefName = EventsManager.normalizeName(refName);
-        const normalizedEventName = EventsManager.normalizeName(event.type);
+        const refName = (0, import_RefsManager.normalizeRefName)(ref.dataset.ref);
+        const normalizedRefName = normalizeName(refName);
+        const normalizedEventName = normalizeName(event.type);
         const method = `on${normalizedRefName}${normalizedEventName}`;
         let index = 0;
         if (Array.isArray(this.__base.$refs[refName])) {
@@ -72,112 +123,37 @@ var EventsManager = class {
           }
           return false;
         });
-        const normalizedRefName = EventsManager.normalizeName(childName);
-        const normalizedEventName = EventsManager.normalizeName(event.type);
+        const normalizedRefName = normalizeName(childName);
+        const normalizedEventName = normalizeName(event.type);
         const method = `on${normalizedRefName}${normalizedEventName}`;
         const args = Array.isArray(event.detail) ? event.detail : [];
         this.__base[method](...args, index, event);
       }
     });
-    Object.defineProperties(this, {
-      __rootElement: {
-        enumerable: false,
-        writable: false,
-        value: rootElement
-      },
-      __base: {
-        enumerable: false,
-        writable: false,
-        value: base
-      },
-      __methodsCache: {
-        enumerable: false,
-        writable: false,
-        value: this.__methodsCache
-      },
-      __rootElementHandler: {
-        enumerable: false,
-        writable: false,
-        value: this.__rootElementHandler
-      },
-      __refsHandler: {
-        enumerable: false,
-        writable: false,
-        value: this.__refsHandler
-      },
-      __childrenHandler: {
-        enumerable: false,
-        writable: false,
-        value: this.__childrenHandler
-      }
-    });
-  }
-  __manageRef(name, elements, mode = "add") {
-    const action = `${mode}EventListener`;
-    const methods = this.__getEventMethodsByName(name);
-    methods.forEach((method) => {
-      const event = this.__getEventNameByMethod(method, name);
-      elements.forEach((element) => element[action](event, this.__refsHandler));
-    });
+    this.__hideProperties([
+      "__methodsCache",
+      "__rootElementHandler",
+      "__refsHandler",
+      "__childrenHandler"
+    ]);
   }
   bindRef(name, elements) {
-    this.__manageRef(name, elements);
+    __manageRef(this, name, elements);
   }
   unbindRef(name, elements) {
-    this.__manageRef(name, elements, "remove");
-  }
-  __manageChild(name, instance, mode = "add") {
-    const action = mode === "add" ? "$on" : "$off";
-    const methods = this.__getEventMethodsByName(name);
-    methods.forEach((method) => {
-      const event = this.__getEventNameByMethod(method, name);
-      instance[action](event, this.__childrenHandler);
-    });
+    __manageRef(this, name, elements, "remove");
   }
   bindChild(name, instance) {
-    this.__manageChild(name, instance);
+    __manageChild(this, name, instance);
   }
   unbindChild(name, instance) {
-    this.__manageChild(name, instance, "remove");
-  }
-  __manageRootElement(mode = "add") {
-    const modeMethod = `${mode}EventListener`;
-    const methods = this.__getEventMethodsByName();
-    const { emits = [] } = this.__base.__config;
-    methods.forEach((method) => {
-      const event = this.__getEventNameByMethod(method);
-      const target = emits.includes(event) ? this.__base : this.__rootElement;
-      target[modeMethod](event, this.__rootElementHandler);
-    });
+    __manageChild(this, name, instance, "remove");
   }
   bindRootElement() {
-    this.__manageRootElement();
+    __manageRootElement(this);
   }
   unbindRootElement() {
-    this.__manageRootElement("remove");
-  }
-  __getEventNameByMethod(method, name = "") {
-    const normalizedName = EventsManager.normalizeName(name);
-    const regex = new RegExp(`^on${normalizedName}([A-Z].*)$`);
-    const [, event] = method.match(regex);
-    return EventsManager.normalizeEventName(event);
-  }
-  __getEventMethodsByName(name = "") {
-    const normalizedName = EventsManager.normalizeName(name);
-    const regex = new RegExp(`^on${normalizedName}[A-Z].*$`);
-    const key = regex.toString();
-    let methods = this.__methodsCache.get(key);
-    if (!methods) {
-      methods = Array.from((0, import_getAllProperties.default)(this.__base, [], (method) => regex.test(method)).reduce((set, [method]) => set.add(method), /* @__PURE__ */ new Set()));
-      this.__methodsCache.set(key, methods);
-    }
-    return methods;
-  }
-  static normalizeName(name) {
-    return name.replace(/[A-Z]([A-Z].*)/g, (c) => c.toLowerCase()).replace(/[^a-zA-Z\d\s:]/g, " ").replace(/(^\w|\s+\w)/g, (c) => c.trim().toUpperCase()).trim();
-  }
-  static normalizeEventName(name) {
-    return name.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`).replace(/^-/, "");
+    __manageRootElement(this, "remove");
   }
 };
 if (module.exports.default) module.exports = module.exports.default;

package/Base/managers/EventsManager.d.ts

@@ -2,62 +2,44 @@
  * @typedef {import('../index.js').default} Base
  * @typedef {import('./ChildrenManager.js').default} ChildrenManager
  */
+/**
+ * Normalize the given name to PascalCase, such as:
+ *
+ * ```
+ * sentence case          => SentenceCase
+ * lowercase              => Lowercase
+ * UPPERCASE              => Uppercase
+ * kebab-case             => KebabCase
+ * snake_case             => SnakeCase
+ * camelCase              => CamelCase
+ * PascalCase             => PascalCase
+ * .class-selector        => ClassSelector
+ * .bem__selector         => BemSelector
+ * __id-selector          => IdSelector
+ * .complex[class^ ="__"] => ComplexClass
+ * ```
+ *
+ * @param {string} name
+ * @returns {string}
+ */
+export function normalizeName(name: string): string;
+/**
+ * Normalize the event names from PascalCase to kebab-case.
+ *
+ * @param {string} name
+ * @returns {string}
+ */
+export function normalizeEventName(name: string): string;
 /**
  * Event management class.
  * @todo Prevent binding of `onChildOrRefEvent` to the root element
  * @todo Use event delegation?
  */
-export default class EventsManager {
-    /**
-     * Normalize the given name to PascalCase, such as:
-     *
-     * ```
-     * sentence case          => SentenceCase
-     * lowercase              => Lowercase
-     * UPPERCASE              => Uppercase
-     * kebab-case             => KebabCase
-     * snake_case             => SnakeCase
-     * camelCase              => CamelCase
-     * PascalCase             => PascalCase
-     * .class-selector        => ClassSelector
-     * .bem__selector         => BemSelector
-     * __id-selector          => IdSelector
-     * .complex[class^ ="__"] => ComplexClass
-     * ```
-     *
-     * @param {string} name
-     * @return {string}
-     */
-    static normalizeName(name: string): string;
-    /**
-     * Normalize the event names from PascalCase to kebab-case.
-     *
-     * @param {string} name
-     * @return {string}
-     */
-    static normalizeEventName(name: string): string;
-    /**
-     * Class constructor.
-     *
-     * @param {HTMLElement} rootElement
-     * @param {Base} base
-     */
-    constructor(rootElement: HTMLElement, base: Base);
-    /**
-     * @type {HTMLElement}
-     * @private
-     */
-    private __rootElement;
-    /**
-     * @type {Base}
-     * @private
-     */
-    private __base;
+export default class EventsManager extends AbstractManager {
     /**
      * @type {WeakMap}
-     * @private
      */
-    private __methodsCache;
+    __methodsCache: WeakMap<any, any>;
     /**
      * Event listener object for the root element.
      *
@@ -76,20 +58,6 @@ export default class EventsManager {
      * @type {EventListenerObject}
      */
     __childrenHandler: EventListenerObject;
-    /**
-     * Manage a ref event methods.
-     *
-     * @param  {string} name
-     *   The name of the ref.
-     * @param  {HTMLElement[]} elements
-     *   The elements of the ref.
-     * @param  {'add'|'remove'} [mode]
-     *   The action to perform: add or remove the event listeners.
-     *
-     * @return {void}
-     * @private
-     */
-    private __manageRef;
     /**
      * Bind event methods to the given ref elements.
      *
@@ -97,8 +65,7 @@ export default class EventsManager {
      *   The name of the ref.
      * @param {HTMLElement[]} elements
      *   The elements of the ref.
-     *
-     * @return {void}
+     * @returns {void}
      */
     bindRef(name: string, elements: HTMLElement[]): void;
     /**
@@ -108,24 +75,9 @@ export default class EventsManager {
      *   The name of the ref.
      * @param {HTMLElement[]} elements
      *   The elements of the ref.
-     *
-     * @return {void}
+     * @returns {void}
      */
     unbindRef(name: string, elements: HTMLElement[]): void;
-    /**
-     * Manage event methods to the given child instance.
-     *
-     * @param {string} name
-     *   The name of the ref.
-     * @param {Base} instance
-     *   A base instance.
-     * @param {'add'|'remove'} [mode]
-     *   The action to perform: add or remove the event listeners.
-     *
-     * @return {void}
-     * @private
-     */
-    private __manageChild;
     /**
      * Bind event methods to the given child instance.
      *
@@ -133,8 +85,7 @@ export default class EventsManager {
      *   The name of the ref.
      * @param {Base} instance
      *   A base instance.
-     *
-     * @return {void}
+     * @returns {void}
      */
     bindChild(name: string, instance: Base): void;
     /**
@@ -144,49 +95,22 @@ export default class EventsManager {
      *   The name of the ref.
      * @param {Base} instance
      *   A base instance.
-     *
-     * @return {void}
+     * @returns {void}
      */
     unbindChild(name: string, instance: Base): void;
-    /**
-     * Manage event methods on the root element.
-     *
-     * @param {'add'|'remove'} [mode]
-     *   The action to perform: add or remove the event listeners, defaults to 'add'.
-     *
-     * @return {void}
-     * @private
-     */
-    private __manageRootElement;
     /**
      * Bind event methods on the root element.
      *
-     * @return {void}
+     * @returns {void}
      */
     bindRootElement(): void;
     /**
      * Unbind event method from the root element.
      *
-     * @return {void}
+     * @returns {void}
      */
     unbindRootElement(): void;
-    /**
-     * Get the event name from the given method and its tied ref or children name.
-     *
-     * @param {string} method
-     * @param {string} name
-     * @return {string}
-     * @private
-     */
-    private __getEventNameByMethod;
-    /**
-     * Get the base instance methods matching the `onSomething` pattern.
-     *
-     * @param {string} [name]
-     * @return {string[]}
-     * @private
-     */
-    private __getEventMethodsByName;
 }
 export type Base = import('../index.js').default;
 export type ChildrenManager = import('./ChildrenManager.js').default;
+import AbstractManager from "./AbstractManager.js";

package/Base/managers/EventsManager.js

@@ -5,15 +5,64 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 import getAllProperties from "../../utils/object/getAllProperties.js";
-import RefsManager from "./RefsManager.js";
-class EventsManager {
-  constructor(rootElement, base) {
-    __publicField(this, "__rootElement");
-    __publicField(this, "__base");
+import AbstractManager from "./AbstractManager.js";
+import { normalizeRefName } from "./RefsManager.js";
+function normalizeName(name) {
+  return name.replace(/[A-Z]([A-Z].*)/g, (c) => c.toLowerCase()).replace(/[^a-zA-Z\d\s:]/g, " ").replace(/(^\w|\s+\w)/g, (c) => c.trim().toUpperCase()).trim();
+}
+function normalizeEventName(name) {
+  return name.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`).replace(/^-/, "");
+}
+function __getEventNameByMethod(that, method, name = "") {
+  const normalizedName = normalizeName(name);
+  const regex = new RegExp(`^on${normalizedName}([A-Z].*)$`);
+  const [, event] = method.match(regex);
+  return normalizeEventName(event);
+}
+function __getEventMethodsByName(that, name = "") {
+  const normalizedName = normalizeName(name);
+  const regex = new RegExp(`^on${normalizedName}[A-Z].*$`);
+  const key = regex.toString();
+  let methods = that.__methodsCache.get(key);
+  if (!methods) {
+    methods = Array.from(getAllProperties(that.__base, [], (method) => regex.test(method)).reduce((set, [method]) => set.add(method), /* @__PURE__ */ new Set()));
+    that.__methodsCache.set(key, methods);
+  }
+  return methods;
+}
+function __manageRef(that, name, elements, mode = "add") {
+  const action = `${mode}EventListener`;
+  const methods = __getEventMethodsByName(that, name);
+  methods.forEach((method) => {
+    const event = __getEventNameByMethod(that, method, name);
+    elements.forEach((element) => element[action](event, that.__refsHandler));
+  });
+}
+function __manageChild(that, name, instance, mode = "add") {
+  const action = mode === "add" ? "$on" : "$off";
+  const methods = __getEventMethodsByName(that, name);
+  methods.forEach((method) => {
+    const event = __getEventNameByMethod(that, method, name);
+    instance[action](event, that.__childrenHandler);
+  });
+}
+function __manageRootElement(that, mode = "add") {
+  const modeMethod = `${mode}EventListener`;
+  const methods = __getEventMethodsByName(that);
+  const { emits = [] } = that.__base.__config;
+  methods.forEach((method) => {
+    const event = __getEventNameByMethod(that, method);
+    const target = emits.includes(event) ? that.__base : that.__element;
+    target[modeMethod](event, that.__rootElementHandler);
+  });
+}
+class EventsManager extends AbstractManager {
+  constructor(base) {
+    super(base);
     __publicField(this, "__methodsCache", /* @__PURE__ */ new Map());
     __publicField(this, "__rootElementHandler", {
       handleEvent: (event) => {
-        const normalizedEventName = EventsManager.normalizeName(event.type);
+        const normalizedEventName = normalizeName(event.type);
         const method = `on${normalizedEventName}`;
         this.__base[method](event);
       }
@@ -21,9 +70,9 @@ class EventsManager {
     __publicField(this, "__refsHandler", {
       handleEvent: (event) => {
         const ref = event.currentTarget;
-        const refName = RefsManager.normalizeRefName(ref.dataset.ref);
-        const normalizedRefName = EventsManager.normalizeName(refName);
-        const normalizedEventName = EventsManager.normalizeName(event.type);
+        const refName = normalizeRefName(ref.dataset.ref);
+        const normalizedRefName = normalizeName(refName);
+        const normalizedEventName = normalizeName(event.type);
         const method = `on${normalizedRefName}${normalizedEventName}`;
         let index = 0;
         if (Array.isArray(this.__base.$refs[refName])) {
@@ -46,114 +95,41 @@ class EventsManager {
           }
           return false;
         });
-        const normalizedRefName = EventsManager.normalizeName(childName);
-        const normalizedEventName = EventsManager.normalizeName(event.type);
+        const normalizedRefName = normalizeName(childName);
+        const normalizedEventName = normalizeName(event.type);
         const method = `on${normalizedRefName}${normalizedEventName}`;
         const args = Array.isArray(event.detail) ? event.detail : [];
         this.__base[method](...args, index, event);
       }
     });
-    Object.defineProperties(this, {
-      __rootElement: {
-        enumerable: false,
-        writable: false,
-        value: rootElement
-      },
-      __base: {
-        enumerable: false,
-        writable: false,
-        value: base
-      },
-      __methodsCache: {
-        enumerable: false,
-        writable: false,
-        value: this.__methodsCache
-      },
-      __rootElementHandler: {
-        enumerable: false,
-        writable: false,
-        value: this.__rootElementHandler
-      },
-      __refsHandler: {
-        enumerable: false,
-        writable: false,
-        value: this.__refsHandler
-      },
-      __childrenHandler: {
-        enumerable: false,
-        writable: false,
-        value: this.__childrenHandler
-      }
-    });
-  }
-  __manageRef(name, elements, mode = "add") {
-    const action = `${mode}EventListener`;
-    const methods = this.__getEventMethodsByName(name);
-    methods.forEach((method) => {
-      const event = this.__getEventNameByMethod(method, name);
-      elements.forEach((element) => element[action](event, this.__refsHandler));
-    });
+    this.__hideProperties([
+      "__methodsCache",
+      "__rootElementHandler",
+      "__refsHandler",
+      "__childrenHandler"
+    ]);
   }
   bindRef(name, elements) {
-    this.__manageRef(name, elements);
+    __manageRef(this, name, elements);
   }
   unbindRef(name, elements) {
-    this.__manageRef(name, elements, "remove");
-  }
-  __manageChild(name, instance, mode = "add") {
-    const action = mode === "add" ? "$on" : "$off";
-    const methods = this.__getEventMethodsByName(name);
-    methods.forEach((method) => {
-      const event = this.__getEventNameByMethod(method, name);
-      instance[action](event, this.__childrenHandler);
-    });
+    __manageRef(this, name, elements, "remove");
   }
   bindChild(name, instance) {
-    this.__manageChild(name, instance);
+    __manageChild(this, name, instance);
   }
   unbindChild(name, instance) {
-    this.__manageChild(name, instance, "remove");
-  }
-  __manageRootElement(mode = "add") {
-    const modeMethod = `${mode}EventListener`;
-    const methods = this.__getEventMethodsByName();
-    const { emits = [] } = this.__base.__config;
-    methods.forEach((method) => {
-      const event = this.__getEventNameByMethod(method);
-      const target = emits.includes(event) ? this.__base : this.__rootElement;
-      target[modeMethod](event, this.__rootElementHandler);
-    });
+    __manageChild(this, name, instance, "remove");
   }
   bindRootElement() {
-    this.__manageRootElement();
+    __manageRootElement(this);
   }
   unbindRootElement() {
-    this.__manageRootElement("remove");
-  }
-  __getEventNameByMethod(method, name = "") {
-    const normalizedName = EventsManager.normalizeName(name);
-    const regex = new RegExp(`^on${normalizedName}([A-Z].*)$`);
-    const [, event] = method.match(regex);
-    return EventsManager.normalizeEventName(event);
-  }
-  __getEventMethodsByName(name = "") {
-    const normalizedName = EventsManager.normalizeName(name);
-    const regex = new RegExp(`^on${normalizedName}[A-Z].*$`);
-    const key = regex.toString();
-    let methods = this.__methodsCache.get(key);
-    if (!methods) {
-      methods = Array.from(getAllProperties(this.__base, [], (method) => regex.test(method)).reduce((set, [method]) => set.add(method), /* @__PURE__ */ new Set()));
-      this.__methodsCache.set(key, methods);
-    }
-    return methods;
-  }
-  static normalizeName(name) {
-    return name.replace(/[A-Z]([A-Z].*)/g, (c) => c.toLowerCase()).replace(/[^a-zA-Z\d\s:]/g, " ").replace(/(^\w|\s+\w)/g, (c) => c.trim().toUpperCase()).trim();
-  }
-  static normalizeEventName(name) {
-    return name.replace(/[A-Z]/g, (c) => `-${c.toLowerCase()}`).replace(/^-/, "");
+    __manageRootElement(this, "remove");
   }
 }
 export {
-  EventsManager as default
+  EventsManager as default,
+  normalizeEventName,
+  normalizeName
 };