@dcl/hooks 1.0.0 → 1.0.1-20251223125619.commit-1446f8b

package/esm/hooks/useCounterTimer.d.ts

@@ -0,0 +1,36 @@
+type UseCounterTimerOptions = {
+    /** Interval in milliseconds between each tick. Default: 1000 */
+    interval?: number;
+    /** Target value to count towards. Default: 0 */
+    target?: number;
+    /** Callback when counter reaches target. Default: undefined */
+    onComplete?: () => void;
+};
+/**
+ * Counter hook that counts up or down towards a target value.
+ * Direction is automatically determined by comparing initial value to target.
+ *
+ * @param initialValue - Starting value for the counter
+ * @param options - Configuration options for the counter
+ * @param options.interval - Interval in milliseconds between each tick. Default: 1000
+ * @param options.target - Target value to count towards. Default: 0
+ * @param options.onComplete - Callback when counter reaches target
+ * @returns Object containing count (current value), start/stop/reset functions, and isActive state
+ *
+ * @example
+ * // Count down from 10 to 0
+ * const { count, start } = useCounterTimer(10);
+ *
+ * @example
+ * // Count up from 50 to 100
+ * const { count, start } = useCounterTimer(50, { target: 100 });
+ */
+declare const useCounterTimer: (initialValue?: number, options?: UseCounterTimerOptions) => {
+    count: number;
+    start: (value?: number) => void;
+    stop: () => void;
+    reset: (value?: number) => void;
+    isActive: boolean;
+};
+export { useCounterTimer };
+export type { UseCounterTimerOptions };

package/esm/hooks/useCounterTimer.js

@@ -0,0 +1,74 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+/**
+ * Counter hook that counts up or down towards a target value.
+ * Direction is automatically determined by comparing initial value to target.
+ *
+ * @param initialValue - Starting value for the counter
+ * @param options - Configuration options for the counter
+ * @param options.interval - Interval in milliseconds between each tick. Default: 1000
+ * @param options.target - Target value to count towards. Default: 0
+ * @param options.onComplete - Callback when counter reaches target
+ * @returns Object containing count (current value), start/stop/reset functions, and isActive state
+ *
+ * @example
+ * // Count down from 10 to 0
+ * const { count, start } = useCounterTimer(10);
+ *
+ * @example
+ * // Count up from 50 to 100
+ * const { count, start } = useCounterTimer(50, { target: 100 });
+ */
+const useCounterTimer = (initialValue = 0, options = {}) => {
+    const { interval = 1000, onComplete, target = 0 } = options;
+    const [count, setCount] = useState(initialValue);
+    const [isActive, setIsActive] = useState(false);
+    const onCompleteRef = useRef(onComplete);
+    const isCountingUp = initialValue < target;
+    const step = isCountingUp ? 1 : -1;
+    useEffect(() => {
+        onCompleteRef.current = onComplete;
+    }, [onComplete]);
+    const start = useCallback((value) => {
+        if (value !== undefined) {
+            setCount(value);
+        }
+        setIsActive(true);
+    }, []);
+    const stop = useCallback(() => {
+        setIsActive(false);
+    }, []);
+    const reset = useCallback((value = initialValue) => {
+        setCount(value);
+        setIsActive(false);
+    }, [initialValue]);
+    useEffect(() => {
+        if (!isActive)
+            return;
+        const intervalId = setInterval(() => {
+            setCount((value) => {
+                const newValue = value + step;
+                const hasReachedTarget = isCountingUp
+                    ? newValue >= target
+                    : newValue <= target;
+                if (hasReachedTarget) {
+                    setIsActive(false);
+                    onCompleteRef.current?.();
+                    return target;
+                }
+                return newValue;
+            });
+        }, interval);
+        return () => {
+            clearInterval(intervalId);
+        };
+    }, [isActive, interval, step, target, isCountingUp]);
+    return {
+        count,
+        start,
+        stop,
+        reset,
+        isActive,
+    };
+};
+export { useCounterTimer };
+//# sourceMappingURL=useCounterTimer.js.map

package/esm/hooks/useCounterTimer.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCounterTimer.js","sourceRoot":"","sources":["../../src/hooks/useCounterTimer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAWhE;;;;;;;;;;;;;;;;;;GAkBG;AACH,MAAM,eAAe,GAAG,CACtB,eAAuB,CAAC,EACxB,UAAkC,EAAE,EACpC,EAAE;IACF,MAAM,EAAE,QAAQ,GAAG,IAAI,EAAE,UAAU,EAAE,MAAM,GAAG,CAAC,EAAE,GAAG,OAAO,CAAA;IAC3D,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAA;IAChD,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAA;IAC/C,MAAM,aAAa,GAAG,MAAM,CAAC,UAAU,CAAC,CAAA;IAExC,MAAM,YAAY,GAAG,YAAY,GAAG,MAAM,CAAA;IAC1C,MAAM,IAAI,GAAG,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;IAElC,SAAS,CAAC,GAAG,EAAE;QACb,aAAa,CAAC,OAAO,GAAG,UAAU,CAAA;IACpC,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAA;IAEhB,MAAM,KAAK,GAAG,WAAW,CAAC,CAAC,KAAc,EAAE,EAAE;QAC3C,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;YACxB,QAAQ,CAAC,KAAK,CAAC,CAAA;QACjB,CAAC;QACD,WAAW,CAAC,IAAI,CAAC,CAAA;IACnB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,IAAI,GAAG,WAAW,CAAC,GAAG,EAAE;QAC5B,WAAW,CAAC,KAAK,CAAC,CAAA;IACpB,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,KAAK,GAAG,WAAW,CACvB,CAAC,QAAgB,YAAY,EAAE,EAAE;QAC/B,QAAQ,CAAC,KAAK,CAAC,CAAA;QACf,WAAW,CAAC,KAAK,CAAC,CAAA;IACpB,CAAC,EACD,CAAC,YAAY,CAAC,CACf,CAAA;IAED,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,QAAQ;YAAE,OAAM;QAErB,MAAM,UAAU,GAAG,WAAW,CAAC,GAAG,EAAE;YAClC,QAAQ,CAAC,CAAC,KAAK,EAAE,EAAE;gBACjB,MAAM,QAAQ,GAAG,KAAK,GAAG,IAAI,CAAA;gBAC7B,MAAM,gBAAgB,GAAG,YAAY;oBACnC,CAAC,CAAC,QAAQ,IAAI,MAAM;oBACpB,CAAC,CAAC,QAAQ,IAAI,MAAM,CAAA;gBAEtB,IAAI,gBAAgB,EAAE,CAAC;oBACrB,WAAW,CAAC,KAAK,CAAC,CAAA;oBAClB,aAAa,CAAC,OAAO,EAAE,EAAE,CAAA;oBACzB,OAAO,MAAM,CAAA;gBACf,CAAC;gBAED,OAAO,QAAQ,CAAA;YACjB,CAAC,CAAC,CAAA;QACJ,CAAC,EAAE,QAAQ,CAAC,CAAA;QAEZ,OAAO,GAAG,EAAE;YACV,aAAa,CAAC,UAAU,CAAC,CAAA;QAC3B,CAAC,CAAA;IACH,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC,CAAA;IAEpD,OAAO;QACL,KAAK;QACL,KAAK;QACL,IAAI;QACJ,KAAK;QACL,QAAQ;KACT,CAAA;AACH,CAAC,CAAA;AAED,OAAO,EAAE,eAAe,EAAE,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dcl/hooks",
-  "version": "1.0.0",
+  "version": "1.0.1-20251223125619.commit-1446f8b",
   "type": "module",
   "main": "esm/index.js",
   "module": "esm/index.js",
@@ -77,5 +77,5 @@
       "<rootDir>/test/setup.ts"
     ]
   },
-  "commit": "b80457eed09324aba7b7139148e685352f121722"
+  "commit": "1446f8b56b46bc5df904fb4755a45341bab801ff"
 }