tiny-essentials 1.22.2 → 1.22.4

package/dist/v1/libs/TinyEvents.mjs

@@ -28,6 +28,20 @@ class TinyEvents {
     #maxListeners = 10;
     /** @type {boolean} */
     #throwMaxListeners = false;
+    /**
+     * Normalizes the event parameter into an array of strings.
+     *
+     * @param {string|string[]} event
+     * @param {string} method
+     * @returns {string[]}
+     */
+    #normalizeEvents(event, method) {
+        if (typeof event === 'string')
+            return [event];
+        if (Array.isArray(event) && event.every((e) => typeof e === 'string'))
+            return event;
+        throw new TypeError(`${method}(event): event must be a string or string[]`);
+    }
     /**
      * Enables or disables throwing an error when the maximum number of listeners is exceeded.
      *
@@ -75,72 +89,76 @@ class TinyEvents {
     /**
      * Adds a listener to the beginning of the listeners array for the specified event.
      *
-     * @param {string} event - Event name.
+     * @param {string|string[]} event - Event name.
      * @param {handler} handler - The callback function.
      */
     prependListener(event, handler) {
-        if (typeof event !== 'string')
-            throw new TypeError('prepend(event, handler): event name must be a string');
+        const events = this.#normalizeEvents(event, 'prependListener');
         if (typeof handler !== 'function')
-            throw new TypeError('prepend(event, handler): handler must be a function');
-        this.#prepend(event, handler);
+            throw new TypeError('prependListener(event, handler): handler must be a function');
+        for (const ev of events)
+            this.#prepend(ev, handler);
     }
     /**
      * Adds a one-time listener to the beginning of the listeners array for the specified event.
      *
-     * @param {string} event - Event name.
+     * @param {string|string[]} event - Event name.
      * @param {handler} handler - The callback function.
-     * @returns {handler} - The wrapped handler used internally.
+     * @returns {handler[]} - The wrapped handler used internally.
      */
     prependListenerOnce(event, handler) {
-        if (typeof event !== 'string')
-            throw new TypeError('prependOnceListener(event, handler): event name must be a string');
+        const events = this.#normalizeEvents(event, 'prependListenerOnce');
         if (typeof handler !== 'function')
-            throw new TypeError('prependOnceListener(event, handler): handler must be a function');
-        /** @type {handler} */
-        const wrapped = (...args) => {
-            this.off(event, wrapped);
-            handler(...args);
-        };
-        this.#prepend(event, wrapped, { once: true });
-        return wrapped;
+            throw new TypeError('prependListenerOnce(event, handler): handler must be a function');
+        const wrappedHandlers = [];
+        for (const ev of events) {
+            /** @type {handler} */
+            const wrapped = (...args) => {
+                this.off(ev, wrapped);
+                handler(...args);
+            };
+            this.#prepend(ev, wrapped, { once: true });
+            wrappedHandlers.push(wrapped);
+        }
+        return wrappedHandlers;
     }
     ////////////////////////////////////////////////////////////
     /**
      * Adds a event listener.
      *
-     * @param {string} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
+     * @param {string|string[]} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
      * @param {handler} handler - Callback function to be called when event fires.
      * @param {Object} [settings={}] - Optional settings.
      * @param {boolean} [settings.once=false] - This is a once event.
      */
     #on(event, handler, { once = false } = {}) {
-        let eventData = this.#listeners.get(event);
-        if (!Array.isArray(eventData)) {
-            eventData = [];
-            this.#listeners.set(event, eventData);
-        }
-        eventData.push({ handler, config: { once } });
-        // Warn if listener count exceeds the max allowed
-        const max = this.#maxListeners;
-        if (max > 0 && eventData.length > max) {
-            const warnMessage = `Possible memory leak detected. ${eventData.length} "${event}" listeners added. ` +
-                `Use setMaxListeners() to increase limit.`;
-            if (!this.#throwMaxListeners)
-                console.warn(warnMessage);
-            else
-                throw new Error(warnMessage);
+        const events = this.#normalizeEvents(event, 'on');
+        for (const ev of events) {
+            let eventData = this.#listeners.get(ev);
+            if (!Array.isArray(eventData)) {
+                eventData = [];
+                this.#listeners.set(ev, eventData);
+            }
+            eventData.push({ handler, config: { once } });
+            // Warn if listener count exceeds the max allowed
+            const max = this.#maxListeners;
+            if (max > 0 && eventData.length > max) {
+                const warnMessage = `Possible memory leak detected. ${eventData.length} "${ev}" listeners added. ` +
+                    `Use setMaxListeners() to increase limit.`;
+                if (!this.#throwMaxListeners)
+                    console.warn(warnMessage);
+                else
+                    throw new Error(warnMessage);
+            }
         }
     }
     /**
      * Adds a event listener.
      *
-     * @param {string} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
+     * @param {string|string[]} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
      * @param {handler} handler - Callback function to be called when event fires.
      */
     on(event, handler) {
-        if (typeof event !== 'string')
-            throw new TypeError('on(event, handler): event name must be a string');
         if (typeof handler !== 'function')
             throw new TypeError('on(event, handler): handler must be a function');
         return this.#on(event, handler);
@@ -148,28 +166,30 @@ class TinyEvents {
     /**
      * Registers an event listener that runs only once, then is removed.
      *
-     * @param {string} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
+     * @param {string|string[]} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
      * @param {handler} handler - The callback function to run on event.
-     * @returns {handler} - The wrapped version of the handler.
+     * @returns {handler[]} - The wrapped version of the handler.
      */
     once(event, handler) {
-        if (typeof event !== 'string')
-            throw new TypeError('The event name must be a string.');
+        const events = this.#normalizeEvents(event, 'once');
         if (typeof handler !== 'function')
             throw new TypeError('once(event, handler): handler must be a function');
-        /** @type {handler} */
-        const wrapped = (e) => {
-            this.off(event, wrapped);
-            if (typeof handler === 'function')
-                handler(e);
-        };
-        this.#on(event, wrapped, { once: true });
-        return wrapped;
+        const wrappedHandlers = [];
+        for (const ev of events) {
+            /** @type {handler} */
+            const wrapped = (...args) => {
+                this.off(ev, wrapped);
+                handler(...args);
+            };
+            this.#on(ev, wrapped, { once: true });
+            wrappedHandlers.push(wrapped);
+        }
+        return wrappedHandlers;
     }
     /**
      * Adds a event listener.
      *
-     * @param {string} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
+     * @param {string|string[]} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
      * @param {handler} handler - Callback function to be called when event fires.
      */
     appendListener(event, handler) {
@@ -178,9 +198,9 @@ class TinyEvents {
     /**
      * Registers an event listener that runs only once, then is removed.
      *
-     * @param {string} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
+     * @param {string|string[]} event - Event name, such as 'onScrollBoundary' or 'onAutoScroll'.
      * @param {handler} handler - The callback function to run on event.
-     * @returns {handler} - The wrapped version of the handler.
+     * @returns {handler[]} - The wrapped version of the handler.
      */
     appendListenerOnce(event, handler) {
         return this.once(event, handler);
@@ -189,33 +209,34 @@ class TinyEvents {
     /**
      * Removes a previously registered event listener.
      *
-     * @param {string} event - The name of the event to remove the handler from.
+     * @param {string|string[]} event - The name of the event to remove the handler from.
      * @param {handler} handler - The specific callback function to remove.
      */
     off(event, handler) {
-        if (typeof event !== 'string')
-            throw new TypeError('off(event, handler): event name must be a string');
+        const events = this.#normalizeEvents(event, 'off');
         if (typeof handler !== 'function')
             throw new TypeError('off(event, handler): handler must be a function');
-        const listeners = this.#listeners.get(event);
-        if (!Array.isArray(listeners))
-            return;
-        const index = listeners.findIndex((listener) => listener.handler === handler);
-        if (index !== -1)
-            listeners.splice(index, 1);
-        // Optionally clean up empty arrays (optional)
-        if (listeners.length === 0)
-            this.#listeners.delete(event);
+        for (const ev of events) {
+            const listeners = this.#listeners.get(ev);
+            if (!Array.isArray(listeners))
+                continue;
+            const index = listeners.findIndex((listener) => listener.handler === handler);
+            if (index !== -1)
+                listeners.splice(index, 1);
+            // Optionally clean up empty arrays (optional)
+            if (listeners.length === 0)
+                this.#listeners.delete(ev);
+        }
     }
     /**
      * Removes all event listeners of a specific type from the element.
      *
-     * @param {string} event - The event type to remove (e.g. 'onScrollBoundary').
+     * @param {string|string[]} event - The event type to remove (e.g. 'onScrollBoundary').
      */
     offAll(event) {
-        if (typeof event !== 'string')
-            throw new TypeError('The event name must be a string.');
-        this.#listeners.delete(event);
+        const events = this.#normalizeEvents(event, 'offAll');
+        for (const ev of events)
+            this.#listeners.delete(ev);
     }
     /**
      * Removes all event listeners of all types from the element.
@@ -291,19 +312,24 @@ class TinyEvents {
     /**
      * Emits an event, triggering all registered handlers for that event.
      *
-     * @param {string} event - The event name to emit.
+     * @param {string|string[]} event - The event name to emit.
      * @param {...any} payload - Optional data to pass to each handler.
-     * @returns {boolean} True if any listeners were called, false otherwise.
+     * @returns {boolean[]} True if any listeners were called, false otherwise.
      */
     emit(event, ...payload) {
-        if (typeof event !== 'string')
-            throw new TypeError('emit(event, data): event name must be a string');
-        const listeners = this.#listeners.get(event);
-        if (!Array.isArray(listeners) || listeners.length === 0)
-            return false;
-        // Call all listeners with the provided data
-        listeners.forEach((listener) => listener.handler(...payload));
-        return true;
+        const events = this.#normalizeEvents(event, 'emit');
+        const called = [];
+        for (const ev of events) {
+            const listeners = this.#listeners.get(ev);
+            if (!Array.isArray(listeners) || listeners.length === 0) {
+                called.push(false);
+                continue;
+            }
+            // Call all listeners with the provided data
+            listeners.forEach((listener) => listener.handler(...payload));
+            called.push(true);
+        }
+        return called;
     }
     ///////////////////////////////////
     /**

package/dist/v1/libs/TinyHtml.cjs

@@ -663,7 +663,7 @@ class TinyHtml {
    * ```
    *
    * @param {string} tagName - The HTML tag name (e.g., 'div', 'span', 'button').
-   * @param {Record<string, string|null>} [attrs] - Optional key-value pairs representing HTML attributes.
+   * @param {Record<string, string|number|null>} [attrs] - Optional key-value pairs representing HTML attributes.
    *                                                If the value is `null`, the attribute will still be set with an empty value.
    * @returns {TinyHtml<HTMLElement>} - A new instance of TinyHtml representing the created element.
    * @throws {TypeError} - If `tagName` is not a string, or `attrs` is not a plain object when defined.
@@ -859,13 +859,22 @@ class TinyHtml {
 
   // TITLE: Element getter
 
+  /**
+   * Returns the current targets held by this instance.
+   *
+   * @returns {ConstructorElValues[]} - The instance's targets element.
+   */
+  get elements() {
+    return [...this.#el];
+  }
+
   /**
    * Iterates over all elements, executing the provided callback on each.
    * @param {(element: TinyHtmlAny, index: number, items: TinyHtmlAny[]) => void} callback - Function invoked for each element.
    * @returns {this} The current instance for chaining.
    */
   forEach(callback) {
-    const elems = this.getAll().map((el, index) => this.extract(index));
+    const elems = this.elements.map((el, index) => this.extract(index));
     for (const index in elems) callback(elems[index], Number(index), elems);
     return this;
   }
@@ -907,6 +916,7 @@ class TinyHtml {
   }
 
   /**
+   * @deprecated Use the getter {@link elements} instead.
    * Returns the current targets held by this instance.
    *
    * @returns {ConstructorElValues[]} - The instance's targets element.
@@ -6534,7 +6544,7 @@ class TinyHtml {
    * @template {TinyElement|TinyElement[]} T
    * @param {T} el - Target element(s).
    * @param {string|Record<string, string|null>} name - Attribute name or an object of attributes.
-   * @param {string|null} [value=null] - Attribute value (ignored if "name" is an object).
+   * @param {string|number|null} [value=null] - Attribute value (ignored if "name" is an object).
    * @returns {T}
    */
   static setAttr(el, name, value = null) {
@@ -6543,8 +6553,8 @@ class TinyHtml {
     // Multiple attributes at once
     if (typeof name === 'object' && name !== null) {
       Object.entries(name).forEach(([attr, val]) => {
-        if (val !== null && typeof val !== 'string')
-          throw new TypeError(`The value for "${attr}" must be a string or null.`);
+        if (val !== null && typeof val !== 'string' && typeof val !== 'number')
+          throw new TypeError(`The value for "${attr}" must be a string/number or null.`);
         elems.forEach((elem) => {
           if (val === null) elem.removeAttribute(TinyHtml.getAttrName(attr));
           else elem.setAttribute(TinyHtml.getAttrName(attr), val);
@@ -6569,7 +6579,7 @@ class TinyHtml {
   /**
    * Set one or multiple attributes on an element.
    * @param {string|Record<string, string|null>} name - Attribute name or an object of attributes.
-   * @param {string|null} [value=null] - Attribute value (ignored if "name" is an object).
+   * @param {string|number|null} [value=null] - Attribute value (ignored if "name" is an object).
    * @returns {this}
    */
   setAttr(name, value) {
@@ -6736,6 +6746,59 @@ class TinyHtml {
     return TinyHtml.toggleProp(this, name, force);
   }
 
+  /**
+   * Get properties on an element.
+   *
+   * @param {TinyHtmlElement} el - Target element.
+   * @param {string} name - Property name.
+   * @returns {any} - Property value if getting, otherwise `undefined`.
+   */
+  static prop(el, name) {
+    if (typeof name !== 'string')
+      throw new TypeError('Invalid arguments passed to prop(). Expected string for "name".');
+    const elem = TinyHtml._preElem(el, 'prop');
+    // @ts-ignore
+    return elem[name];
+  }
+
+  /**
+   * Get properties on an element.
+   *
+   * @param {string} name - Property name.
+   * @returns {any} - Property value if getting, otherwise `undefined`.
+   */
+  prop(name) {
+    return TinyHtml.prop(this, name);
+  }
+
+  /**
+   * Set a property on elements.
+   * @template {TinyElement|TinyElement[]} T
+   * @param {T} el - Target element(s).
+   * @param {string} name - Property name.
+   * @param {any} value - Value to set.
+   * @returns {T}
+   */
+  static setProp(el, name, value) {
+    if (typeof name !== 'string' || name.trim() === '')
+      throw new Error('Property name must be a non-empty string.');
+    TinyHtml._preElems(el, 'setProp').forEach((elem) => {
+      // @ts-ignore
+      elem[name] = value;
+    });
+    return el;
+  }
+
+  /**
+   * Set a property on this element.
+   * @param {string} name - Property name.
+   * @param {any} value - Value to set.
+   * @returns {this} The same element.
+   */
+  setProp(name, value) {
+    return TinyHtml.setProp(this, name, value);
+  }
+
   /////////////////////////////////////////////////////
 
   // TITLE: Remove Element

package/dist/v1/libs/TinyHtml.d.mts

@@ -401,12 +401,12 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * ```
      *
      * @param {string} tagName - The HTML tag name (e.g., 'div', 'span', 'button').
-     * @param {Record<string, string|null>} [attrs] - Optional key-value pairs representing HTML attributes.
+     * @param {Record<string, string|number|null>} [attrs] - Optional key-value pairs representing HTML attributes.
      *                                                If the value is `null`, the attribute will still be set with an empty value.
      * @returns {TinyHtml<HTMLElement>} - A new instance of TinyHtml representing the created element.
      * @throws {TypeError} - If `tagName` is not a string, or `attrs` is not a plain object when defined.
      */
-    static createFrom(tagName: string, attrs?: Record<string, string | null>): TinyHtml<HTMLElement>;
+    static createFrom(tagName: string, attrs?: Record<string, string | number | null>): TinyHtml<HTMLElement>;
     /**
      * Creates a new DOM element with the specified tag name and options, then wraps it in a TinyHtml instance.
      *
@@ -2358,10 +2358,10 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @template {TinyElement|TinyElement[]} T
      * @param {T} el - Target element(s).
      * @param {string|Record<string, string|null>} name - Attribute name or an object of attributes.
-     * @param {string|null} [value=null] - Attribute value (ignored if "name" is an object).
+     * @param {string|number|null} [value=null] - Attribute value (ignored if "name" is an object).
      * @returns {T}
      */
-    static setAttr<T extends TinyElement | TinyElement[]>(el: T, name: string | Record<string, string | null>, value?: string | null): T;
+    static setAttr<T extends TinyElement | TinyElement[]>(el: T, name: string | Record<string, string | null>, value?: string | number | null): T;
     /**
      * Remove attribute(s) from an element.
      * @template {TinyElement|TinyElement[]} T
@@ -2409,6 +2409,23 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @returns {T}
      */
     static toggleProp<T extends TinyElement | TinyElement[]>(el: T, name: string | string[], force?: boolean): T;
+    /**
+     * Get properties on an element.
+     *
+     * @param {TinyHtmlElement} el - Target element.
+     * @param {string} name - Property name.
+     * @returns {any} - Property value if getting, otherwise `undefined`.
+     */
+    static prop(el: TinyHtmlElement, name: string): any;
+    /**
+     * Set a property on elements.
+     * @template {TinyElement|TinyElement[]} T
+     * @param {T} el - Target element(s).
+     * @param {string} name - Property name.
+     * @param {any} value - Value to set.
+     * @returns {T}
+     */
+    static setProp<T extends TinyElement | TinyElement[]>(el: T, name: string, value: any): T;
     /**
      * Removes an element from the DOM.
      * @template {TinyElement|TinyElement[]} T
@@ -2583,6 +2600,12 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @returns {TinyHtml<HTMLCollectionOf<Element>>} An array of TinyHtml instances wrapping the found elements.
      */
     getElementsByTagNameNS(localName: string, namespaceURI?: string | null): TinyHtml<HTMLCollectionOf<Element>>;
+    /**
+     * Returns the current targets held by this instance.
+     *
+     * @returns {ConstructorElValues[]} - The instance's targets element.
+     */
+    get elements(): ConstructorElValues[];
     /**
      * Iterates over all elements, executing the provided callback on each.
      * @param {(element: TinyHtmlAny, index: number, items: TinyHtmlAny[]) => void} callback - Function invoked for each element.
@@ -2611,6 +2634,7 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      */
     exists(index: number): boolean;
     /**
+     * @deprecated Use the getter {@link elements} instead.
      * Returns the current targets held by this instance.
      *
      * @returns {ConstructorElValues[]} - The instance's targets element.
@@ -3513,10 +3537,10 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
     /**
      * Set one or multiple attributes on an element.
      * @param {string|Record<string, string|null>} name - Attribute name or an object of attributes.
-     * @param {string|null} [value=null] - Attribute value (ignored if "name" is an object).
+     * @param {string|number|null} [value=null] - Attribute value (ignored if "name" is an object).
      * @returns {this}
      */
-    setAttr(name: string | Record<string, string | null>, value?: string | null): this;
+    setAttr(name: string | Record<string, string | null>, value?: string | number | null): this;
     /**
      * Remove attribute(s) from an element.
      * @param {string} name Space-separated list of attributes.
@@ -3554,6 +3578,20 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @returns {this}
      */
     toggleProp(name: string | string[], force?: boolean): this;
+    /**
+     * Get properties on an element.
+     *
+     * @param {string} name - Property name.
+     * @returns {any} - Property value if getting, otherwise `undefined`.
+     */
+    prop(name: string): any;
+    /**
+     * Set a property on this element.
+     * @param {string} name - Property name.
+     * @param {any} value - Value to set.
+     * @returns {this} The same element.
+     */
+    setProp(name: string, value: any): this;
     /**
      * Removes the element from the DOM.
      * @returns {this}

package/dist/v1/libs/TinyHtml.mjs

@@ -558,7 +558,7 @@ class TinyHtml {
      * ```
      *
      * @param {string} tagName - The HTML tag name (e.g., 'div', 'span', 'button').
-     * @param {Record<string, string|null>} [attrs] - Optional key-value pairs representing HTML attributes.
+     * @param {Record<string, string|number|null>} [attrs] - Optional key-value pairs representing HTML attributes.
      *                                                If the value is `null`, the attribute will still be set with an empty value.
      * @returns {TinyHtml<HTMLElement>} - A new instance of TinyHtml representing the created element.
      * @throws {TypeError} - If `tagName` is not a string, or `attrs` is not a plain object when defined.
@@ -734,13 +734,21 @@ class TinyHtml {
     }
     //////////////////////////////////////////////////////////////////
     // TITLE: Element getter
+    /**
+     * Returns the current targets held by this instance.
+     *
+     * @returns {ConstructorElValues[]} - The instance's targets element.
+     */
+    get elements() {
+        return [...this.#el];
+    }
     /**
      * Iterates over all elements, executing the provided callback on each.
      * @param {(element: TinyHtmlAny, index: number, items: TinyHtmlAny[]) => void} callback - Function invoked for each element.
      * @returns {this} The current instance for chaining.
      */
     forEach(callback) {
-        const elems = this.getAll().map((el, index) => this.extract(index));
+        const elems = this.elements.map((el, index) => this.extract(index));
         for (const index in elems)
             callback(elems[index], Number(index), elems);
         return this;
@@ -785,6 +793,7 @@ class TinyHtml {
         return true;
     }
     /**
+     * @deprecated Use the getter {@link elements} instead.
      * Returns the current targets held by this instance.
      *
      * @returns {ConstructorElValues[]} - The instance's targets element.
@@ -5859,7 +5868,7 @@ class TinyHtml {
      * @template {TinyElement|TinyElement[]} T
      * @param {T} el - Target element(s).
      * @param {string|Record<string, string|null>} name - Attribute name or an object of attributes.
-     * @param {string|null} [value=null] - Attribute value (ignored if "name" is an object).
+     * @param {string|number|null} [value=null] - Attribute value (ignored if "name" is an object).
      * @returns {T}
      */
     static setAttr(el, name, value = null) {
@@ -5867,8 +5876,8 @@ class TinyHtml {
         // Multiple attributes at once
         if (typeof name === 'object' && name !== null) {
             Object.entries(name).forEach(([attr, val]) => {
-                if (val !== null && typeof val !== 'string')
-                    throw new TypeError(`The value for "${attr}" must be a string or null.`);
+                if (val !== null && typeof val !== 'string' && typeof val !== 'number')
+                    throw new TypeError(`The value for "${attr}" must be a string/number or null.`);
                 elems.forEach((elem) => {
                     if (val === null)
                         elem.removeAttribute(TinyHtml.getAttrName(attr));
@@ -5894,7 +5903,7 @@ class TinyHtml {
     /**
      * Set one or multiple attributes on an element.
      * @param {string|Record<string, string|null>} name - Attribute name or an object of attributes.
-     * @param {string|null} [value=null] - Attribute value (ignored if "name" is an object).
+     * @param {string|number|null} [value=null] - Attribute value (ignored if "name" is an object).
      * @returns {this}
      */
     setAttr(name, value) {
@@ -6051,6 +6060,55 @@ class TinyHtml {
     toggleProp(name, force) {
         return TinyHtml.toggleProp(this, name, force);
     }
+    /**
+     * Get properties on an element.
+     *
+     * @param {TinyHtmlElement} el - Target element.
+     * @param {string} name - Property name.
+     * @returns {any} - Property value if getting, otherwise `undefined`.
+     */
+    static prop(el, name) {
+        if (typeof name !== 'string')
+            throw new TypeError('Invalid arguments passed to prop(). Expected string for "name".');
+        const elem = TinyHtml._preElem(el, 'prop');
+        // @ts-ignore
+        return elem[name];
+    }
+    /**
+     * Get properties on an element.
+     *
+     * @param {string} name - Property name.
+     * @returns {any} - Property value if getting, otherwise `undefined`.
+     */
+    prop(name) {
+        return TinyHtml.prop(this, name);
+    }
+    /**
+     * Set a property on elements.
+     * @template {TinyElement|TinyElement[]} T
+     * @param {T} el - Target element(s).
+     * @param {string} name - Property name.
+     * @param {any} value - Value to set.
+     * @returns {T}
+     */
+    static setProp(el, name, value) {
+        if (typeof name !== 'string' || name.trim() === '')
+            throw new Error('Property name must be a non-empty string.');
+        TinyHtml._preElems(el, 'setProp').forEach((elem) => {
+            // @ts-ignore
+            elem[name] = value;
+        });
+        return el;
+    }
+    /**
+     * Set a property on this element.
+     * @param {string} name - Property name.
+     * @param {any} value - Value to set.
+     * @returns {this} The same element.
+     */
+    setProp(name, value) {
+        return TinyHtml.setProp(this, name, value);
+    }
     /////////////////////////////////////////////////////
     // TITLE: Remove Element
     /**