tiny-essentials 1.21.9 → 1.22.0

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

@@ -3,6 +3,37 @@ export default TinyHtml;
  * Represents a TinyHtml instance with any constructor element values.
  */
 export type TinyHtmlAny = TinyHtml<ConstructorElValues>;
+/**
+ * Callback function used for hover events.
+ */
+export type HoverEventCallback = (ev: MouseEvent) => void;
+/**
+ * Represents a collection of active style-based animations.
+ *
+ * Each HTMLElement is associated with an array of its currently running
+ * `Animation` objects (from the Web Animations API).
+ */
+export type StyleFxResult = Map<HTMLElement, Animation | null>;
+/**
+ * Represents a collection of animation keyframe data mapped by CSS property.
+ *
+ * - The **key** is the CSS property name (e.g. `"height"`, `"opacity"`).
+ * - The **value** is an array of values representing the start and end
+ *   states of the property during the animation.
+ */
+export type AnimationSfxData = Record<string, (string | number)[]>;
+/**
+ * Function signature for style effects repeat detectors.
+ */
+export type StyleEffectsRdFn = (effects: AnimationSfxData) => boolean;
+/**
+ * Function signature for style effect property handlers.
+ */
+export type StyleEffectsFn = (el: HTMLElement, keyframes: AnimationSfxData, prop: string, style: CSSStyleDeclaration) => void;
+/**
+ * A collection of style effect property handlers.
+ */
+export type StyleEffectsProps = Record<string, StyleEffectsFn>;
 /**
  * Callback invoked on each animation frame with the current scroll position,
  * normalized animation time (`0` to `1`), and a completion flag.
@@ -122,6 +153,11 @@ export type EventRegistryList = Record<string, EventRegistryItem[]>;
  * Keys are strings, and values can be of any type.
  */
 export type ElementDataStore = Record<string, any>;
+/**
+ * Mapping of animation shortcuts to their effect definitions.
+ * Similar to jQuery's predefined effects (slideDown, fadeIn, etc.).
+ */
+export type StyleEffects = Record<string, string | (string | number)[]>;
 /**
  * Possible directions from which a collision was detected and locked.
  */
@@ -264,6 +300,31 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
             y: number;
         };
     };
+    /**
+     * Parse inline styles into an object.
+     * @param {string} styleText
+     * @returns {Record<string,string>}
+     */
+    static parseStyle(styleText: string): Record<string, string>;
+    /**
+     * Flag to determine if element observer should start automatically.
+     * @type {boolean}
+     */
+    static "__#8@#autoStartElemObserver": boolean;
+    /**
+     * Set the auto-start flag for the observer.
+     * @param {boolean} value
+     */
+    static set autoStartElemObserver(value: boolean);
+    /**
+     * Get the auto-start flag for the observer.
+     * @returns {boolean}
+     */
+    static get autoStartElemObserver(): boolean;
+    /** @type {TinyElementObserver} */
+    static "__#8@#tinyObserver": TinyElementObserver;
+    /** @returns {TinyElementObserver} */
+    static get tinyObserver(): TinyElementObserver;
     /**
      * Fetches an HTML file from the given URL, parses it to JSON.
      *
@@ -1026,7 +1087,7 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      *
      * @type {Record<string | symbol, string>}
      */
-    static "__#7@#cssPropAliases": Record<string | symbol, string>;
+    static "__#8@#cssPropAliases": Record<string | symbol, string>;
     /**
      * Public proxy to manage camelCase ➝ kebab-case CSS property aliasing.
      *
@@ -1272,16 +1333,371 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @returns {number}
      */
     static outerWidth(el: TinyElementAndWinAndDoc, includeMargin?: boolean): number;
+    /**
+     * Retrieves stored animation data for a given element and key.
+     * If no data exists yet, initializes storage for that element.
+     *
+     * @param {HTMLElement} el - The element whose data should be retrieved.
+     * @param {string} where - The key to read (e.g., "origHeight").
+     * @returns {string|number|undefined} - The stored value, or undefined.
+     */
+    static getAnimateData(el: HTMLElement, where: string): string | number | undefined;
+    /**
+     * Stores animation data for a given element and key.
+     * Used to cache original size/values for animations.
+     *
+     * @param {HTMLElement} el - The element whose data should be set.
+     * @param {string} where - The key to store under (e.g., "origHeight").
+     * @param {string|number} value - The value to store.
+     */
+    static setAnimateData(el: HTMLElement, where: string, value: string | number): void;
+    /**
+     * Global configuration flag controlling whether old style-based animations
+     * are cancelled before a new one starts. Defaults to true.
+     *
+     * @type {boolean}
+     */
+    static "__#8@#cancelOldStyleFx": boolean;
+    /**
+     * Updates the global setting that determines whether old style-based animations
+     * are cancelled before new ones start.
+     *
+     * @param {boolean} value - True to cancel old animations by default, false to keep them running.
+     * @throws {TypeError} If the value is not a boolean.
+     */
+    static set cancelOldStyleFx(value: boolean);
+    /**
+     * Returns the current global setting for cancelling old style-based animations.
+     *
+     * @returns {boolean} True if old animations are cancelled by default, false otherwise.
+     */
+    static get cancelOldStyleFx(): boolean;
+    /**
+     * Predefined animation speed options, inspired by jQuery.fx.speeds.
+     * Each entry can be either a number (duration in ms) or a KeyframeAnimationOptions object.
+     *
+     * Usage example:
+     *   TinyHtml.animate(el, keyframes, TinyHtml.#fxSpeeds.fast);
+     *   TinyHtml.slideDown(el, TinyHtml.#fxSpeeds.slow);
+     *
+     * @type {Record<string, number | KeyframeAnimationOptions>}
+     */
+    static "__#8@#styleFxSpeeds": Record<string, number | KeyframeAnimationOptions>;
+    /**
+     * Replace the predefined animation speeds.
+     * @param {Record<string, number | KeyframeAnimationOptions>} speeds
+     * @throws {TypeError} If input is not a valid object of speed definitions.
+     */
+    static set styleFxSpeeds(speeds: Record<string, number | KeyframeAnimationOptions>);
+    /**
+     * Get a cloned copy of predefined animation speeds.
+     * @returns {Record<string, number | KeyframeAnimationOptions>}
+     */
+    static get styleFxSpeeds(): Record<string, number | KeyframeAnimationOptions>;
+    /**
+     * Get a predefined animation speed by name.
+     *
+     * @param {string} name - The name of the speed entry.
+     * @returns {number | KeyframeAnimationOptions | undefined} A cloned value of the speed entry, or undefined if not found.
+     */
+    static getStyleFxSpeed(name: string): number | KeyframeAnimationOptions | undefined;
+    /**
+     * Set or overwrite a predefined animation speed.
+     *
+     * @param {string} name - The name of the speed entry.
+     * @param {number | KeyframeAnimationOptions} value - The value to store.
+     * @throws {TypeError} If value is not a number or KeyframeAnimationOptions object.
+     */
+    static setStyleFxSpeed(name: string, value: number | KeyframeAnimationOptions): void;
+    /**
+     * Delete a predefined animation speed by name.
+     *
+     * @param {string} name - The name of the speed entry to delete.
+     * @returns {boolean} True if the property was deleted, false otherwise.
+     */
+    static deleteStyleFxSpeed(name: string): boolean;
+    /**
+     * Check if a predefined animation speed exists.
+     *
+     * @param {string} name - The name of the speed entry to check.
+     * @returns {boolean} True if the speed entry exists, false otherwise.
+     */
+    static hasStyleFxSpeed(name: string): boolean;
+    /**
+     * CSS expansion shorthand used by genStyleFx to include margin/padding values.
+     * @typedef {['Top', 'Right', 'Bottom', 'Left']}
+     */
+    static "__#8@#cssExpand": string[];
+    /**
+     * Generate shortcuts
+     * @type {Record<string, StyleEffects>}
+     */
+    static "__#8@#styleEffects": Record<string, StyleEffects>;
+    /**
+     * Replace the entire styleEffects map with a new one.
+     *
+     * @param {Record<string, StyleEffects>} value
+     */
+    static set styleEffects(value: Record<string, StyleEffects>);
+    /**
+     * Returns a deep-cloned copy of the registered style effects.
+     *
+     * @returns {Record<string, StyleEffects>}
+     */
+    static get styleEffects(): Record<string, StyleEffects>;
+    /**
+     * Get a deep-cloned style effect by name.
+     * @param {string} name
+     * @returns {StyleEffects|undefined}
+     */
+    static getStyleEffect(name: string): StyleEffects | undefined;
+    /**
+     * Set or replace a style effect.
+     * @param {string} name
+     * @param {StyleEffects} value
+     */
+    static setStyleEffect(name: string, value: StyleEffects): void;
+    /**
+     * Delete a style effect.
+     * @param {string} name
+     * @returns {boolean} True if deleted.
+     */
+    static deleteStyleEffect(name: string): boolean;
+    /**
+     * Check if a style effect exists.
+     * @param {string} name
+     * @returns {boolean}
+     */
+    static hasStyleEffect(name: string): boolean;
+    /**
+     * Style Effect Inverse Values
+     * @type {Record<string, string>}
+     */
+    static "__#8@#styleEffectInverse": Record<string, string>;
+    /**
+     * Replace the style inverse values.
+     * @param {Record<string, string>} values
+     * @throws {TypeError} If not a valid object with functions as values.
+     */
+    static set styleEffectInverse(values: Record<string, string>);
+    /**
+     * Get a cloned copy of style inverse values.
+     * @returns {Record<string, string>}
+     */
+    static get styleEffectInverse(): Record<string, string>;
+    /**
+     * Get a registered inverse values.
+     *
+     * @param {string} name - The detector name.
+     * @returns {string | null} The value if found, otherwise undefined.
+     */
+    static getStyleEffectInverse(name: string): string | null;
+    /**
+     * Register or overwrite a inverse value.
+     *
+     * @param {string} name - The detector name.
+     * @param {string} value - The inverse value.
+     * @throws {TypeError} If fn is not a string.
+     */
+    static setStyleEffectInverse(name: string, value: string): void;
+    /**
+     * Delete a inverse value by name.
+     *
+     * @param {string} name - The inverse value name to delete.
+     * @returns {boolean} True if deleted, false otherwise.
+     */
+    static deleteStyleEffectInverse(name: string): boolean;
+    /**
+     * Check if a inverse value is registered.
+     *
+     * @param {string} name - The inverse value name to check.
+     * @returns {boolean} True if registered, false otherwise.
+     */
+    static hasStyleEffectInverse(name: string): boolean;
+    /**
+     * Style Effect Repeat Detector
+     * @type {Record<string, StyleEffectsRdFn>}
+     */
+    static "__#8@#styleEffectsRd": Record<string, StyleEffectsRdFn>;
+    /**
+     * Replace the style effects repeat detectors.
+     * @param {Record<string, StyleEffectsRdFn>} detectors
+     * @throws {TypeError} If not a valid object with functions as values.
+     */
+    static set styleEffectsRd(detectors: Record<string, StyleEffectsRdFn>);
+    /**
+     * Get a cloned copy of style effects repeat detectors.
+     * @returns {Record<string, StyleEffectsRdFn>}
+     */
+    static get styleEffectsRd(): Record<string, StyleEffectsRdFn>;
+    /**
+     * Get a registered repeat detector function by name.
+     *
+     * @param {string} name - The detector name.
+     * @returns {StyleEffectsRdFn | null} The function if found, otherwise undefined.
+     */
+    static getStyleEffectRd(name: string): StyleEffectsRdFn | null;
+    /**
+     * Register or overwrite a repeat detector function.
+     *
+     * @param {string} name - The detector name.
+     * @param {StyleEffectsRdFn} fn - The detector function.
+     * @throws {TypeError} If fn is not a function.
+     */
+    static setStyleEffectRd(name: string, fn: StyleEffectsRdFn): void;
+    /**
+     * Delete a repeat detector function by name.
+     *
+     * @param {string} name - The detector name to delete.
+     * @returns {boolean} True if deleted, false otherwise.
+     */
+    static deleteStyleEffectRd(name: string): boolean;
+    /**
+     * Check if a repeat detector function is registered.
+     *
+     * @param {string} name - The detector name to check.
+     * @returns {boolean} True if registered, false otherwise.
+     */
+    static hasStyleEffectRd(name: string): boolean;
+    /**
+     * Effect property handlers for show, hide, and toggle.
+     * Each function builds keyframes depending on the property being animated.
+     *
+     * @type {StyleEffectsProps}
+     */
+    static "__#8@#styleEffectsProps": StyleEffectsProps;
+    /**
+     * Replace the entire styleEffectsProps map with a new one.
+     *
+     * @param {StyleEffectsProps} value
+     */
+    static set styleEffectsProps(value: StyleEffectsProps);
+    /**
+     * Returns a shallow-cloned copy of the property effect handlers.
+     *
+     * @returns {StyleEffectsProps}
+     */
+    static get styleEffectsProps(): StyleEffectsProps;
+    /**
+     * Get a style effect property handler by name.
+     *
+     * @param {string} name - The property handler name.
+     * @returns {StyleEffectsFn | null} The handler function, or undefined if not found.
+     */
+    static getStyleEffectProp(name: string): StyleEffectsFn | null;
+    /**
+     * Register or overwrite a style effect property handler.
+     *
+     * @param {string} name - The property handler name.
+     * @param {StyleEffectsFn} fn - The handler function.
+     * @throws {TypeError} If fn is not a function.
+     */
+    static setStyleEffectProp(name: string, fn: StyleEffectsFn): void;
+    /**
+     * Delete a style effect property handler by name.
+     *
+     * @param {string} name - The property handler name to delete.
+     * @returns {boolean} True if deleted, false otherwise.
+     */
+    static deleteStyleEffectProp(name: string): boolean;
+    /**
+     * Check if a style effect property handler exists.
+     *
+     * @param {string} name - The property handler name to check.
+     * @returns {boolean} True if the handler exists, false otherwise.
+     */
+    static hasStyleEffectProp(name: string): boolean;
+    /**
+     * Generates effect parameters to create standard animations.
+     *
+     * @param {string} type - The effect type.
+     * @param {boolean} [includeWidth=false] - Whether width (and opacity) should be included.
+     * @returns {Record<string, string>} - A mapping of CSS properties to effect type.
+     */
+    static genStyleFx(type: string, includeWidth?: boolean): Record<string, string>;
+    /**
+     * Applies style-based effects (slide, fade) to one or more elements.
+     * Converts abstract effect definitions (e.g., `{ height: "show" }`)
+     * into concrete Web Animations API keyframes.
+     *
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el - A single element or an array of elements.
+     * @param {string} id - The style effect id.
+     * @param {StyleEffects} props - The style effect definition.
+     * @param {number | KeyframeAnimationOptions | string} [ops] - Timing options.
+     * @returns {StyleFxResult}
+     */
+    static applyStyleFx(el: TinyHtmlElement | TinyHtmlElement[], id: string, props: StyleEffects, ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Get the current animation entry for a given element.
+     * @param {HTMLElement} el - The target element.
+     * @returns {string|null|undefined} Returns string or null to animation.
+     */
+    static getCurrentAnimationId(el: HTMLElement): string | null | undefined;
     /**
      * Applies an animation to one or multiple TinyElement instances.
      *
-     * @template {TinyElement|TinyElement[]} T
-     * @param {T} el - A single TinyElement or an array of TinyElements to animate.
-     * @param {Keyframe[] | PropertyIndexedKeyframes | null} keyframes - The keyframes used to define the animation.
-     * @param {number | KeyframeAnimationOptions} [ops] - Timing or configuration options for the animation.
-     * @returns {T}
+     * If `cancelOldAnim` is true, any currently running animation on the same element
+     * will be cancelled before the new one starts.
+     *
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el - A single TinyElement or an array of TinyElements to animate.
+     * @param {Keyframe[] | PropertyIndexedKeyframes | null} keyframes - Keyframes that define the animation.
+     * @param {number | KeyframeAnimationOptions | string} [ops] - Timing or configuration options for the animation.
+     * @param {string|null} [id] - The style effect id.
+     * @param {boolean} [cancelOldAnim=TinyHtml.cancelOldStyleFx] - Whether to cancel previous animations on the same element.
+     * @returns {Animation[]}
+     */
+    static animate(el: TinyHtmlElement | TinyHtmlElement[], keyframes: Keyframe[] | PropertyIndexedKeyframes | null, ops?: number | KeyframeAnimationOptions | string, id?: string | null, cancelOldAnim?: boolean): Animation[];
+    /**
+     * Stops the current animation(s) on one or multiple TinyElement instances.
+     *
+     * If an animation is running on the element(s), it will be cancelled immediately.
+     *
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el - A single TinyElement or an array of TinyElements.
+     * @returns {boolean[]} The same element(s) provided as input, for chaining.
+     */
+    static stop(el: TinyHtmlElement | TinyHtmlElement[]): boolean[];
+    /**
+     * Show animation (slideDown).
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    static slideDown(el: TinyHtmlElement | TinyHtmlElement[], ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Hide animation (slideUp).
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    static slideUp(el: TinyHtmlElement | TinyHtmlElement[], ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Toggle slide animation.
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
      */
-    static animate<T extends TinyElement | TinyElement[]>(el: T, keyframes: Keyframe[] | PropertyIndexedKeyframes | null, ops?: number | KeyframeAnimationOptions): T;
+    static slideToggle(el: TinyHtmlElement | TinyHtmlElement[], ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Fade in animation.
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    static fadeIn(el: TinyHtmlElement | TinyHtmlElement[], ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Fade out animation.
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    static fadeOut(el: TinyHtmlElement | TinyHtmlElement[], ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Fade toggle animation.
+     * @param {TinyHtmlElement|TinyHtmlElement[]} el
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    static fadeToggle(el: TinyHtmlElement | TinyHtmlElement[], ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
     /**
      * Gets the offset of the element relative to the document.
      * @param {TinyElement} el - Target element.
@@ -1794,6 +2210,20 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @returns {boolean}
      */
     static hasExactEventListener(el: TinyEventTarget, event: string, handler: EventListenerOrEventListenerObject): boolean;
+    /**
+     * Hover event shortcut.
+     *
+     * Adds `mouseenter` and `mouseleave` event listeners to the target.
+     *
+     * @template {TinyEventTarget|TinyEventTarget[]} T
+     * @param {T} el - The target element(s) to attach the hover handlers.
+     * @param {HoverEventCallback} fnOver - Callback executed when the mouse enters the target.
+     * @param {HoverEventCallback|null} [fnOut] - Optional callback executed when the mouse leaves
+     * the target. If not provided, `fnOver` will be used for both events.
+     * @param {EventRegistryOptions} [options] - Optional event listener options.
+     * @returns {T}
+     */
+    static hover<T extends TinyEventTarget | TinyEventTarget[]>(el: T, fnOver: HoverEventCallback, fnOut?: HoverEventCallback | null, options?: EventRegistryOptions): T;
     /**
      * Registers an event listener on the specified element.
      *
@@ -1866,7 +2296,7 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      *
      * @type {Record<string | symbol, string>}
      */
-    static "__#7@#propFix": Record<string | symbol, string>;
+    static "__#8@#propFix": Record<string | symbol, string>;
     /**
      * Public proxy for normalized DOM property names.
      *
@@ -1911,14 +2341,14 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      */
     static attr(el: TinyElement, name: string): string | null;
     /**
-     * Set an attribute on an element.
+     * Set one or multiple attributes on an element.
      * @template {TinyElement|TinyElement[]} T
-     * @param {T} el
-     * @param {string} name
-     * @param {string|null} [value=null]
+     * @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).
      * @returns {T}
      */
-    static setAttr<T extends TinyElement | TinyElement[]>(el: T, name: string, value?: string | null): T;
+    static setAttr<T extends TinyElement | TinyElement[]>(el: T, name: string | Record<string, string | null>, value?: string | null): T;
     /**
      * Remove attribute(s) from an element.
      * @template {TinyElement|TinyElement[]} T
@@ -1942,30 +2372,30 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      */
     static hasProp(el: TinyElement, name: string): boolean;
     /**
-     * Set a property on an element.
+     * Set one or multiple properties on an element.
      * @template {TinyElement|TinyElement[]} T
-     * @param {T} el
-     * @param {string} name
+     * @param {T} el - Target element(s).
+     * @param {...string} names - Property name(s).
      * @returns {T}
      */
-    static addProp<T extends TinyElement | TinyElement[]>(el: T, name: string): T;
+    static addProp<T extends TinyElement | TinyElement[]>(el: T, ...names: string[]): T;
     /**
-     * Remove a property from an element.
+     * Remove one or multiple properties from an element.
      * @template {TinyElement|TinyElement[]} T
-     * @param {T} el
-     * @param {string} name
+     * @param {T} el - Target element(s).
+     * @param {...string} names - Property name(s).
      * @returns {T}
      */
-    static removeProp<T extends TinyElement | TinyElement[]>(el: T, name: string): T;
+    static removeProp<T extends TinyElement | TinyElement[]>(el: T, ...names: string[]): T;
     /**
-     * Toggle a boolean property.
+     * Toggle one or multiple boolean properties.
      * @template {TinyElement|TinyElement[]} T
-     * @param {T} el
-     * @param {string} name
-     * @param {boolean} [force]
+     * @param {T} el - Target element(s).
+     * @param {string|string[]} name - Property name or a list of property names.
+     * @param {boolean} [force] - Force true/false instead of toggling.
      * @returns {T}
      */
-    static toggleProp<T extends TinyElement | TinyElement[]>(el: T, name: string, force?: boolean): T;
+    static toggleProp<T extends TinyElement | TinyElement[]>(el: T, name: string | string[], force?: boolean): T;
     /**
      * Removes an element from the DOM.
      * @template {TinyElement|TinyElement[]} T
@@ -2574,14 +3004,72 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @returns {number}
      */
     outerWidth(includeMargin?: boolean): number;
+    /**
+     * Applies style-based effects (slide, fade) to one or more elements.
+     * Converts abstract effect definitions (e.g., `{ height: "show" }`)
+     * into concrete Web Animations API keyframes.
+     *
+     * @param {string} id - The style effect id.
+     * @param {StyleEffects} props - The style effect definition.
+     * @param {number | KeyframeAnimationOptions} [ops] - Timing options.
+     * @returns {StyleFxResult}
+     */
+    applyStyleFx(id: string, props: StyleEffects, ops?: number | KeyframeAnimationOptions): StyleFxResult;
     /**
      * Applies an animation to one or multiple TinyElement instances.
      *
-     * @param {Keyframe[] | PropertyIndexedKeyframes | null} keyframes - The keyframes used to define the animation.
-     * @param {number | KeyframeAnimationOptions} [ops] - Timing or configuration options for the animation.
-     * @returns {this}
+     * If `cancelOldAnim` is true, any currently running animation on the same element
+     * will be cancelled before the new one starts.
+     *
+     * @param {Keyframe[] | PropertyIndexedKeyframes | null} keyframes - Keyframes that define the animation.
+     * @param {number | KeyframeAnimationOptions | string} [ops] - Timing or configuration options for the animation.
+     * @param {string|null} [id] - The style effect id.
+     * @param {boolean} [cancelOldAnim=TinyHtml.cancelOldStyleFx] - Whether to cancel previous animations on the same element.
+     * @returns {Animation[]}
+     */
+    animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, ops?: number | KeyframeAnimationOptions | string, id?: string | null, cancelOldAnim?: boolean): Animation[];
+    /**
+     * Stops the current animation(s) on this TinyElement instance.
+     *
+     * @returns {boolean[]}
+     */
+    stop(): boolean[];
+    /**
+     * Show animation (slideDown).
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    slideDown(ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Hide animation (slideUp).
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    slideUp(ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Toggle slide animation.
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    slideToggle(ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Fade in animation.
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    fadeIn(ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Fade out animation.
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
+     */
+    fadeOut(ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
+    /**
+     * Fade toggle animation.
+     * @param {number | KeyframeAnimationOptions | string} [ops]
+     * @returns {StyleFxResult}
      */
-    animate(keyframes: Keyframe[] | PropertyIndexedKeyframes | null, ops?: number | KeyframeAnimationOptions): this;
+    fadeToggle(ops?: number | KeyframeAnimationOptions | string): StyleFxResult;
     /**
      * Gets the offset of the element relative to the document.
      * @returns {{top: number, left: number}}
@@ -2929,6 +3417,18 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      * @returns {boolean}
      */
     hasExactEventListener(event: string, handler: EventListenerOrEventListenerObject): boolean;
+    /**
+     * Hover event shortcut.
+     *
+     * Adds `mouseenter` and `mouseleave` event listeners to the target.
+     *
+     * @param {HoverEventCallback} fnOver - Callback executed when the mouse enters the target.
+     * @param {HoverEventCallback|null} [fnOut] - Optional callback executed when the mouse leaves
+     * the target. If not provided, `fnOver` will be used for both events.
+     * @param {EventRegistryOptions} [options] - Optional event listener options.
+     * @returns {this}
+     */
+    hover(fnOver: HoverEventCallback, fnOut?: HoverEventCallback | null, options?: EventRegistryOptions): this;
     /**
      * Registers an event listener on the specified element.
      *
@@ -2986,12 +3486,12 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
      */
     attr(name: string): string | null;
     /**
-     * Set an attribute on an element.
-     * @param {string} name
-     * @param {string|null} [value=null]
+     * 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).
      * @returns {this}
      */
-    setAttr(name: string, value?: string | null): this;
+    setAttr(name: string | Record<string, string | null>, value?: string | null): this;
     /**
      * Remove attribute(s) from an element.
      * @param {string} name Space-separated list of attributes.
@@ -3012,23 +3512,23 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
     hasProp(name: string): boolean;
     /**
      * Set a property on an element.
-     * @param {string} name
+     * @param {...string} names - Property name(s).
      * @returns {this}
      */
-    addProp(name: string): this;
+    addProp(...names: string[]): this;
     /**
      * Remove a property from an element.
-     * @param {string} name
+     * @param {...string} names - Property name(s).
      * @returns {this}
      */
-    removeProp(name: string): this;
+    removeProp(...names: string[]): this;
     /**
-     * Toggle a boolean property.
-     * @param {string} name
-     * @param {boolean} [force]
+     * Toggle one or multiple boolean properties.
+     * @param {string|string[]} name - Property name or a list of property names.
+     * @param {boolean} [force] - Force true/false instead of toggling.
      * @returns {this}
      */
-    toggleProp(name: string, force?: boolean): this;
+    toggleProp(name: string | string[], force?: boolean): this;
     /**
      * Removes the element from the DOM.
      * @returns {this}
@@ -3131,4 +3631,5 @@ declare class TinyHtml<TinyHtmlT extends ConstructorElValues | ConstructorElValu
     #private;
 }
 import * as TinyCollision from '../basics/collision.mjs';
+import TinyElementObserver from './TinyElementObserver.mjs';
 //# sourceMappingURL=TinyHtml.d.mts.map