@trackunit/react-components 0.1.152-alpha-05cf9fe826.0 → 0.1.153

package/index.cjs.js

@@ -36585,6 +36585,69 @@ const useClickOutside = (el, options = {}, onClick) => {
     });
 };
 
+/**
+ * Hook for managing timeouts.
+ *
+ * @param {object} options - Options for the useTimeout hook.
+ * @param {Function} options.onTimeout - Callback function to execute on timeout.
+ * @param {number} options.duration - Duration of the timeout in milliseconds.
+ * @returns {object} An object containing functions to start and stop the timeout.
+ */
+const useTimeout = ({ onTimeout, duration }) => {
+    const ready = React.useRef(false);
+    const timeout = React.useRef();
+    const callback = React.useRef(onTimeout);
+    const startTimeout = React.useCallback(() => {
+        ready.current = false;
+        timeout.current && clearTimeout(timeout.current);
+        timeout.current = setTimeout(() => {
+            ready.current = true;
+            callback.current();
+        }, duration);
+    }, [duration]);
+    const stopTimeout = React.useCallback(() => {
+        ready.current = null;
+        timeout.current && clearTimeout(timeout.current);
+    }, []);
+    React.useEffect(() => {
+        callback.current = onTimeout;
+    }, [onTimeout]);
+    React.useEffect(() => {
+        // Cleanup function to clear the timeout when component unmounts
+        return () => {
+            timeout.current && clearTimeout(timeout.current);
+        };
+    }, []);
+    return { startTimeout, stopTimeout };
+};
+
+/**
+ * Hook for continuous retries with a timeout mechanism.
+ *
+ * @param {object} options - Options for the useContinuousTimeout hook.
+ * @param {Function} options.onTimeout - Callback function to execute on each timeout.
+ * @param {number} options.duration - Duration of the timeout in milliseconds.
+ * @param {number} options.maxRetries - Maximum number of retry attempts.
+ * @returns {object} An object containing functions to start and stop the timeout.
+ */
+const useContinuousTimeout = ({ onTimeout, duration, maxRetries }) => {
+    const retries = React.useRef(0);
+    const { startTimeout, stopTimeout } = useTimeout({
+        duration,
+        onTimeout: () => {
+            onTimeout();
+            if (retries.current < maxRetries) {
+                startTimeout();
+                retries.current++;
+            }
+            else {
+                retries.current = 0;
+            }
+        },
+    });
+    return { startTimeout, stopTimeout, retries: retries.current };
+};
+
 /**
  * The useDebounce hook works like useState, but adds a delay where previous values will be ignored.
  *
@@ -36739,38 +36802,6 @@ const getWindowSize = () => {
     }
 };
 
-/**
- * @param {UseTimeoutProps} props The props
- * @returns {{ startTimeout: () => void; stopTimeout: () => void;}} return
- */
-const useTimeout = ({ onTimeout, duration }) => {
-    const ready = React.useRef(false);
-    const timeout = React.useRef();
-    const callback = React.useRef(onTimeout);
-    const startTimeout = React.useCallback(() => {
-        ready.current = false;
-        timeout.current && clearTimeout(timeout.current);
-        timeout.current = setTimeout(() => {
-            ready.current = true;
-            callback.current();
-        }, duration);
-    }, [duration]);
-    const stopTimeout = React.useCallback(() => {
-        ready.current = null;
-        timeout.current && clearTimeout(timeout.current);
-    }, []);
-    React.useEffect(() => {
-        callback.current = onTimeout;
-    }, [onTimeout]);
-    React.useEffect(() => {
-        // Cleanup function to clear the timeout when component unmounts
-        return () => {
-            timeout.current && clearTimeout(timeout.current);
-        };
-    }, []);
-    return [startTimeout, stopTimeout];
-};
-
 /**
  * Returns a callback that will be called when the visibility state of the document changes.
  */
@@ -39125,6 +39156,7 @@ exports.getValueBarColorByValue = getValueBarColorByValue;
 exports.setLocalStorage = setLocalStorage;
 exports.useClickOutside = useClickOutside;
 exports.useContainerProps = useContainerProps;
+exports.useContinuousTimeout = useContinuousTimeout;
 exports.useDebounce = useDebounce;
 exports.useDevicePixelRatio = useDevicePixelRatio;
 exports.useHover = useHover;

package/index.esm.js

@@ -36558,6 +36558,69 @@ const useClickOutside = (el, options = {}, onClick) => {
     });
 };
 
+/**
+ * Hook for managing timeouts.
+ *
+ * @param {object} options - Options for the useTimeout hook.
+ * @param {Function} options.onTimeout - Callback function to execute on timeout.
+ * @param {number} options.duration - Duration of the timeout in milliseconds.
+ * @returns {object} An object containing functions to start and stop the timeout.
+ */
+const useTimeout = ({ onTimeout, duration }) => {
+    const ready = useRef(false);
+    const timeout = useRef();
+    const callback = useRef(onTimeout);
+    const startTimeout = useCallback(() => {
+        ready.current = false;
+        timeout.current && clearTimeout(timeout.current);
+        timeout.current = setTimeout(() => {
+            ready.current = true;
+            callback.current();
+        }, duration);
+    }, [duration]);
+    const stopTimeout = useCallback(() => {
+        ready.current = null;
+        timeout.current && clearTimeout(timeout.current);
+    }, []);
+    useEffect(() => {
+        callback.current = onTimeout;
+    }, [onTimeout]);
+    useEffect(() => {
+        // Cleanup function to clear the timeout when component unmounts
+        return () => {
+            timeout.current && clearTimeout(timeout.current);
+        };
+    }, []);
+    return { startTimeout, stopTimeout };
+};
+
+/**
+ * Hook for continuous retries with a timeout mechanism.
+ *
+ * @param {object} options - Options for the useContinuousTimeout hook.
+ * @param {Function} options.onTimeout - Callback function to execute on each timeout.
+ * @param {number} options.duration - Duration of the timeout in milliseconds.
+ * @param {number} options.maxRetries - Maximum number of retry attempts.
+ * @returns {object} An object containing functions to start and stop the timeout.
+ */
+const useContinuousTimeout = ({ onTimeout, duration, maxRetries }) => {
+    const retries = useRef(0);
+    const { startTimeout, stopTimeout } = useTimeout({
+        duration,
+        onTimeout: () => {
+            onTimeout();
+            if (retries.current < maxRetries) {
+                startTimeout();
+                retries.current++;
+            }
+            else {
+                retries.current = 0;
+            }
+        },
+    });
+    return { startTimeout, stopTimeout, retries: retries.current };
+};
+
 /**
  * The useDebounce hook works like useState, but adds a delay where previous values will be ignored.
  *
@@ -36712,38 +36775,6 @@ const getWindowSize = () => {
     }
 };
 
-/**
- * @param {UseTimeoutProps} props The props
- * @returns {{ startTimeout: () => void; stopTimeout: () => void;}} return
- */
-const useTimeout = ({ onTimeout, duration }) => {
-    const ready = useRef(false);
-    const timeout = useRef();
-    const callback = useRef(onTimeout);
-    const startTimeout = useCallback(() => {
-        ready.current = false;
-        timeout.current && clearTimeout(timeout.current);
-        timeout.current = setTimeout(() => {
-            ready.current = true;
-            callback.current();
-        }, duration);
-    }, [duration]);
-    const stopTimeout = useCallback(() => {
-        ready.current = null;
-        timeout.current && clearTimeout(timeout.current);
-    }, []);
-    useEffect(() => {
-        callback.current = onTimeout;
-    }, [onTimeout]);
-    useEffect(() => {
-        // Cleanup function to clear the timeout when component unmounts
-        return () => {
-            timeout.current && clearTimeout(timeout.current);
-        };
-    }, []);
-    return [startTimeout, stopTimeout];
-};
-
 /**
  * Returns a callback that will be called when the visibility state of the document changes.
  */
@@ -39033,4 +39064,4 @@ const cvaClickable = cvaMerge([
     },
 });
 
-export { Alert, Badge, Button$1 as Button, Card, CardBody, CardFooter, CardHeader, Collapse, CopyableText, DayPicker, DayPickerPopover, DayRangePicker, DensityContainer, Drawer, EmptyState, ExternalLink, Heading, Icon, IconButton, Indicator, MenuItem, MenuList, Modal, ModalBackdrop, MoreMenu, PageHeader, Pagination, Popover, PopoverContent, PopoverTitle, PopoverTrigger, Prompt, ROLE_CARD, SectionHeader, Sidebar, SkeletonLines, Spacer, Spinner, StarButton, Tag, Text, Timeline, TimelineElement, Tip, Tooltip, ValueBar, cvaButton, cvaButtonSpinner, cvaClickable, cvaIconButtonContainer, cvaIndicator, cvaIndicatorIcon, cvaIndicatorIconBackground, cvaIndicatorLabel, cvaIndicatorPing, cvaMenuItem, cvaMenuItemLabel, cvaMenuItemPrefix, cvaMenuItemSuffix, docs, getDevicePixelRatio, getValueBarColorByValue, setLocalStorage, useClickOutside, useContainerProps, useDebounce, useDevicePixelRatio, useHover, useIsFirstRender, useLocalStorage, useLocalStorageReducer, useModal, usePopoverContext, usePrompt, useResize, useTimeout, useVisibilityChange };
+export { Alert, Badge, Button$1 as Button, Card, CardBody, CardFooter, CardHeader, Collapse, CopyableText, DayPicker, DayPickerPopover, DayRangePicker, DensityContainer, Drawer, EmptyState, ExternalLink, Heading, Icon, IconButton, Indicator, MenuItem, MenuList, Modal, ModalBackdrop, MoreMenu, PageHeader, Pagination, Popover, PopoverContent, PopoverTitle, PopoverTrigger, Prompt, ROLE_CARD, SectionHeader, Sidebar, SkeletonLines, Spacer, Spinner, StarButton, Tag, Text, Timeline, TimelineElement, Tip, Tooltip, ValueBar, cvaButton, cvaButtonSpinner, cvaClickable, cvaIconButtonContainer, cvaIndicator, cvaIndicatorIcon, cvaIndicatorIconBackground, cvaIndicatorLabel, cvaIndicatorPing, cvaMenuItem, cvaMenuItemLabel, cvaMenuItemPrefix, cvaMenuItemSuffix, docs, getDevicePixelRatio, getValueBarColorByValue, setLocalStorage, useClickOutside, useContainerProps, useContinuousTimeout, useDebounce, useDevicePixelRatio, useHover, useIsFirstRender, useLocalStorage, useLocalStorageReducer, useModal, usePopoverContext, usePrompt, useResize, useTimeout, useVisibilityChange };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-components",
-  "version": "0.1.152-alpha-05cf9fe826.0",
+  "version": "0.1.153",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -8,10 +8,10 @@
   },
   "dependencies": {
     "@floating-ui/react": "0.22.2",
-    "@trackunit/css-class-variance-utilities": "0.0.13-alpha-05cf9fe826.0",
-    "@trackunit/css-core": "0.0.94-alpha-05cf9fe826.0",
-    "@trackunit/ui-design-tokens": "0.0.76-alpha-05cf9fe826.0",
-    "@trackunit/ui-icons": "0.0.74-alpha-05cf9fe826.0",
+    "@trackunit/css-class-variance-utilities": "0.0.12",
+    "@trackunit/css-core": "0.0.93",
+    "@trackunit/ui-design-tokens": "0.0.75",
+    "@trackunit/ui-icons": "0.0.73",
     "date-fns": "2.29.3",
     "lodash": "4.17.21",
     "react": "18.2.0",

package/src/hooks/index.d.ts

@@ -2,6 +2,7 @@ export * from "./localStorage/setLocalStorage";
 export * from "./localStorage/useLocalStorage";
 export * from "./localStorage/useLocalStorageReducer";
 export * from "./useClickOutside";
+export * from "./useContinuousTimeout";
 export * from "./useDebounce";
 export * from "./useDevicePixelRatio";
 export * from "./useHover";

package/src/hooks/useContinuousTimeout.d.ts

@@ -0,0 +1,19 @@
+import { UseTimeoutProps } from "./useTimeout";
+interface UseContinuousTimeoutProps extends UseTimeoutProps {
+    maxRetries: number;
+}
+/**
+ * Hook for continuous retries with a timeout mechanism.
+ *
+ * @param {object} options - Options for the useContinuousTimeout hook.
+ * @param {Function} options.onTimeout - Callback function to execute on each timeout.
+ * @param {number} options.duration - Duration of the timeout in milliseconds.
+ * @param {number} options.maxRetries - Maximum number of retry attempts.
+ * @returns {object} An object containing functions to start and stop the timeout.
+ */
+export declare const useContinuousTimeout: ({ onTimeout, duration, maxRetries }: UseContinuousTimeoutProps) => {
+    startTimeout: () => void;
+    stopTimeout: () => void;
+    retries: number;
+};
+export {};

package/src/hooks/useTimeout.d.ts

@@ -1,12 +1,16 @@
-type Callback = () => void;
-export type UseTimeoutReturn = [Callback, Callback];
-interface UseTimeoutProps {
+export interface UseTimeoutProps {
     onTimeout: () => void;
     duration: number;
 }
 /**
- * @param {UseTimeoutProps} props The props
- * @returns {{ startTimeout: () => void; stopTimeout: () => void;}} return
+ * Hook for managing timeouts.
+ *
+ * @param {object} options - Options for the useTimeout hook.
+ * @param {Function} options.onTimeout - Callback function to execute on timeout.
+ * @param {number} options.duration - Duration of the timeout in milliseconds.
+ * @returns {object} An object containing functions to start and stop the timeout.
  */
-export declare const useTimeout: ({ onTimeout, duration }: UseTimeoutProps) => UseTimeoutReturn;
-export {};
+export declare const useTimeout: ({ onTimeout, duration }: UseTimeoutProps) => {
+    startTimeout: () => void;
+    stopTimeout: () => void;
+};