@trackunit/react-components 0.1.41 → 0.1.42

package/index.js

@@ -2928,35 +2928,36 @@ function tryParse(value) {
 }
 
 /**
- * The useTimeout hook.
- *
  * @param {UseTimeoutProps} props The props
- * @returns {{ startTimeout: () => void; stopTimeout: () => void; }} return
+ * @returns {{ startTimeout: () => void; stopTimeout: () => void; isReady: boolean | null}} return
  */
 const useTimeout = ({ onTimeout, duration }) => {
-    const [activated, setActivated] = useState(true);
-    const timeoutRef = useRef();
+    const ready = useRef(false);
+    const timeout = useRef();
+    const callback = useRef(onTimeout);
+    const isReady = useCallback(() => ready.current, []);
     const startTimeout = useCallback(() => {
-        setActivated(true);
-    }, []);
+        ready.current = false;
+        timeout.current && clearTimeout(timeout.current);
+        timeout.current = setTimeout(() => {
+            ready.current = true;
+            callback.current();
+        }, duration);
+    }, [duration]);
     const stopTimeout = useCallback(() => {
-        window.clearTimeout(timeoutRef.current);
-        setActivated(false);
+        ready.current = null;
+        timeout.current && clearTimeout(timeout.current);
     }, []);
+    // update ref when function changes
     useEffect(() => {
-        if (activated) {
-            timeoutRef.current = window.setTimeout(() => {
-                onTimeout();
-            }, duration);
-        }
-        return () => {
-            stopTimeout();
-        };
-    }, [onTimeout, activated, duration, stopTimeout]);
-    return {
-        startTimeout,
-        stopTimeout,
-    };
+        callback.current = onTimeout;
+    }, [onTimeout]);
+    // startTimeout on mount, stopTimeout on unmount
+    useEffect(() => {
+        startTimeout();
+        return stopTimeout;
+    }, [duration, startTimeout, stopTimeout]);
+    return [isReady, stopTimeout, startTimeout];
 };
 
 /**

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "0.1.41",
+  "version": "0.1.42",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "dependencies": {

package/src/hooks/useTimeout.d.ts

@@ -1,15 +1,11 @@
+export type UseTimeoutReturn = [() => boolean | null, () => void, () => void];
 interface UseTimeoutProps {
     onTimeout: () => void;
     duration: number;
 }
 /**
- * The useTimeout hook.
- *
  * @param {UseTimeoutProps} props The props
- * @returns {{ startTimeout: () => void; stopTimeout: () => void; }} return
+ * @returns {{ startTimeout: () => void; stopTimeout: () => void; isReady: boolean | null}} return
  */
-export declare const useTimeout: ({ onTimeout, duration }: UseTimeoutProps) => {
-    startTimeout: () => void;
-    stopTimeout: () => void;
-};
+export declare const useTimeout: ({ onTimeout, duration }: UseTimeoutProps) => UseTimeoutReturn;
 export {};