@momentum-design/components 0.129.36 → 0.129.38

package/dist/utils/controllers/Timers.d.ts

@@ -0,0 +1,49 @@
+import { ReactiveController, type ReactiveControllerHost } from 'lit';
+/**
+ * Handle setTimeout and setInterval timers for a host, automatically clearing them on disconnect.
+ */
+export declare class Timers implements ReactiveController {
+    private nameToIntervalId;
+    private nameToTimeoutId;
+    constructor(host: ReactiveControllerHost);
+    hostDisconnected(): void;
+    /**
+     * Wrapper around `window.setInterval` that tracks the interval ID for cleanup on disconnect.
+     * If an interval with the same name already exists, it is cleared before setting the new one.
+     *
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval}
+     * @param name - Name to identify the interval timer
+     * @param handler - Function that is called every `ms` milliseconds
+     * @param ms - Delay in milliseconds between each call to `handler`
+     * @param args - Additional arguments passed to `handler`
+     * @returns The interval ID returned by `window.setInterval`
+     */
+    setInterval<TArgs extends any[]>(name: string, handler: (...args: TArgs) => void, ms?: number, ...args: TArgs): number;
+    /**
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval}
+     * @param id - The name or ID of the interval to clear
+     */
+    clearInterval(id: string | number): void;
+    /**
+     * Wrapper around `window.setTimeout` that tracks the timeout ID for cleanup on disconnect.
+     * If a timeout with the same name already exists, it is cleared before setting the new one.
+     * When the timeout executes, it removes itself from the tracking map.
+     *
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout}
+     * @param name - Name to identify the timeout
+     * @param handler - Function that is called after `ms` milliseconds
+     * @param ms - Delay in milliseconds before calling `handler`
+     * @param args - Additional arguments passed to `handler`
+     * @returns The timeout id returned by `window.setTimeout`
+     */
+    setTimeout<TArgs extends any[]>(name: string, handler: (...args: TArgs) => void, ms?: number, ...args: TArgs): number;
+    /**
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearTimeout}
+     * @param id - The name or ID of the timeout to clear
+     */
+    clearTimeout(id: string | number): void;
+    /**
+     * @internal
+     */
+    private getNameAndIdFromIdentifier;
+}

package/dist/utils/controllers/Timers.js

@@ -0,0 +1,96 @@
+/**
+ * Handle setTimeout and setInterval timers for a host, automatically clearing them on disconnect.
+ */
+export class Timers {
+    constructor(host) {
+        this.nameToIntervalId = new Map();
+        this.nameToTimeoutId = new Map();
+        host.addController(this);
+    }
+    hostDisconnected() {
+        [...this.nameToIntervalId.values()].forEach(clearInterval);
+        this.nameToIntervalId.clear();
+        [...this.nameToTimeoutId.values()].forEach(clearTimeout);
+        this.nameToTimeoutId.clear();
+    }
+    /**
+     * Wrapper around `window.setInterval` that tracks the interval ID for cleanup on disconnect.
+     * If an interval with the same name already exists, it is cleared before setting the new one.
+     *
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setInterval}
+     * @param name - Name to identify the interval timer
+     * @param handler - Function that is called every `ms` milliseconds
+     * @param ms - Delay in milliseconds between each call to `handler`
+     * @param args - Additional arguments passed to `handler`
+     * @returns The interval ID returned by `window.setInterval`
+     */
+    setInterval(name, handler, ms, ...args) {
+        if (this.nameToIntervalId.has(name)) {
+            clearInterval(this.nameToIntervalId.get(name));
+        }
+        const id = window.setInterval(handler, ms, ...args);
+        this.nameToIntervalId.set(name, id);
+        return id;
+    }
+    /**
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearInterval}
+     * @param id - The name or ID of the interval to clear
+     */
+    clearInterval(id) {
+        const [intervalName, intervalId] = this.getNameAndIdFromIdentifier(this.nameToIntervalId, id);
+        if (intervalId !== undefined) {
+            clearInterval(intervalId);
+        }
+        if (intervalName) {
+            this.nameToIntervalId.delete(intervalName);
+        }
+    }
+    /**
+     * Wrapper around `window.setTimeout` that tracks the timeout ID for cleanup on disconnect.
+     * If a timeout with the same name already exists, it is cleared before setting the new one.
+     * When the timeout executes, it removes itself from the tracking map.
+     *
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout}
+     * @param name - Name to identify the timeout
+     * @param handler - Function that is called after `ms` milliseconds
+     * @param ms - Delay in milliseconds before calling `handler`
+     * @param args - Additional arguments passed to `handler`
+     * @returns The timeout id returned by `window.setTimeout`
+     */
+    setTimeout(name, handler, ms, ...args) {
+        if (this.nameToTimeoutId.has(name)) {
+            clearTimeout(this.nameToTimeoutId.get(name));
+        }
+        const id = window.setTimeout((...args) => {
+            handler(...args);
+            this.nameToTimeoutId.delete(name);
+        }, ms, ...args);
+        this.nameToTimeoutId.set(name, id);
+        return id;
+    }
+    /**
+     * @see {@link https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/clearTimeout}
+     * @param id - The name or ID of the timeout to clear
+     */
+    clearTimeout(id) {
+        const [timeoutName, timeoutId] = this.getNameAndIdFromIdentifier(this.nameToTimeoutId, id);
+        if (timeoutId !== undefined) {
+            window.clearTimeout(timeoutId);
+        }
+        if (timeoutName) {
+            this.nameToTimeoutId.delete(timeoutName);
+        }
+    }
+    /**
+     * @internal
+     */
+    getNameAndIdFromIdentifier(map, id) {
+        var _a;
+        if (typeof id === 'number') {
+            const timerId = id;
+            const timerName = (_a = [...map.entries()].find(([, value]) => value === id)) === null || _a === void 0 ? void 0 : _a[0];
+            return [timerName, timerId];
+        }
+        return [id, map.get(id)];
+    }
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@momentum-design/components",
   "packageManager": "yarn@3.2.4",
-  "version": "0.129.36",
+  "version": "0.129.38",
   "engines": {
     "node": ">=20.0.0",
     "npm": ">=8.0.0"