@sohanemon/utils 5.1.8 → 5.2.0

package/dist/functions/schedule.d.ts

@@ -1,7 +1,8 @@
-type Task = () => Promise<void> | void;
-interface ScheduleOpts {
+export type Task = () => Promise<void> | void;
+export interface ScheduleOpts {
     retry?: number;
     delay?: number;
+    timeout?: number;
 }
 /**
  * Runs a function asynchronously in the background.
@@ -9,4 +10,3 @@ interface ScheduleOpts {
  * Logs total time taken.
  */
 export declare function schedule(task: Task, options?: ScheduleOpts): void;
-export {};

package/dist/hooks/schedule.d.ts

@@ -0,0 +1,36 @@
+import * as React from 'react';
+import { ScheduleOpts } from '../functions';
+import { Task } from '../functions/schedule';
+/**
+ * useSchedule — run non-urgent work later, without blocking UI.
+ */
+export declare function useSchedule(options?: ScheduleOpts): (task: Task) => void;
+/**
+ * useScheduledEffect — Runs a non-urgent task in a React component without blocking UI rendering.
+ *
+ * This hook is like `useEffect`, but the provided task is executed
+ * with low priority using `requestIdleCallback` (if available)
+ * or a fallback scheduler. Useful for heavy computations, logging,
+ * analytics, or background work that doesn't need to block render.
+ *
+ * @param {Task} task - The function to run later. Can be synchronous or return a Promise.
+ * @param {React.DependencyList[]} deps - Dependency array; task will re-run whenever these change.
+ * @param {ScheduleOpts} [options] - Optional scheduling options.
+ * @param {number} [options.timeout] - Max time (ms) to wait before executing the task. Defaults to 10000.
+ *
+ * @example
+ * ```tsx
+ * import React from 'react';
+ * import { useScheduledEffect } from './hooks/useScheduledEffect';
+ *
+ * function MyComponent({ userId }: { userId: string }) {
+ *   useScheduledEffect(() => {
+ *     // non-blocking analytics or heavy work
+ *     console.log('Sending analytics for user:', userId);
+ *   }, [userId], { timeout: 5000 });
+ *
+ *   return <div>Component loaded. Task will run later 😎</div>;
+ * }
+ * ```
+ */
+export declare function useScheduledEffect(task: Task, deps?: React.DependencyList, options?: ScheduleOpts): void;

package/dist/hooks/schedule.js

@@ -0,0 +1,61 @@
+import * as React from 'react';
+import { schedule as _schedule } from '../functions/schedule';
+/**
+ * useSchedule — run non-urgent work later, without blocking UI.
+ */
+export function useSchedule(options = {}) {
+    const { timeout = 10000 } = options;
+    const schedule = React.useCallback((task) => {
+        const exec = () => {
+            try {
+                React.startTransition(() => {
+                    task();
+                });
+            }
+            catch (err) {
+                console.log('⚡[schedule.tsx] Failed: ', err);
+            }
+        };
+        if ('requestIdleCallback' in window) {
+            requestIdleCallback(exec, { timeout });
+        }
+        else {
+            _schedule(exec);
+        }
+    }, [timeout]);
+    return schedule;
+}
+/**
+ * useScheduledEffect — Runs a non-urgent task in a React component without blocking UI rendering.
+ *
+ * This hook is like `useEffect`, but the provided task is executed
+ * with low priority using `requestIdleCallback` (if available)
+ * or a fallback scheduler. Useful for heavy computations, logging,
+ * analytics, or background work that doesn't need to block render.
+ *
+ * @param {Task} task - The function to run later. Can be synchronous or return a Promise.
+ * @param {React.DependencyList[]} deps - Dependency array; task will re-run whenever these change.
+ * @param {ScheduleOpts} [options] - Optional scheduling options.
+ * @param {number} [options.timeout] - Max time (ms) to wait before executing the task. Defaults to 10000.
+ *
+ * @example
+ * ```tsx
+ * import React from 'react';
+ * import { useScheduledEffect } from './hooks/useScheduledEffect';
+ *
+ * function MyComponent({ userId }: { userId: string }) {
+ *   useScheduledEffect(() => {
+ *     // non-blocking analytics or heavy work
+ *     console.log('Sending analytics for user:', userId);
+ *   }, [userId], { timeout: 5000 });
+ *
+ *   return <div>Component loaded. Task will run later 😎</div>;
+ * }
+ * ```
+ */
+export function useScheduledEffect(task, deps = [], options = {}) {
+    const schedule = useSchedule(options);
+    React.useEffect(() => {
+        schedule(task);
+    }, [schedule, ...deps]);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sohanemon/utils",
-  "version": "5.1.8",
+  "version": "5.2.0",
   "author": "Sohan Emon <sohanemon@outlook.com>",
   "description": "",
   "type": "module",
@@ -44,14 +44,14 @@
   ],
   "license": "ISC",
   "devDependencies": {
-    "@types/node": "^24.0.3",
-    "@types/react": "^19.1.8",
-    "typescript": "^5.8.3"
+    "@types/node": "^24.10.0",
+    "@types/react": "^19.2.2",
+    "typescript": "^5.9.3"
   },
   "dependencies": {
-    "@iconify/react": "^6.0.0",
+    "@iconify/react": "^6.0.2",
     "clsx": "^2.1.1",
-    "react": "^19.1.0",
+    "react": "^19.2.0",
     "tailwind-merge": "^3.3.1"
   },
   "packageManager": "pnpm@10.11.0+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977"