fix: correct issues with useDebouncedValue

src/__tests__/useDebouncedValue.test.tsx

@@ -24,6 +24,18 @@ test("should update the value after the delay", async () => {
   expect(result.current[0]).toBe("world");
 });
 
+test("should handle initial value as method", async () => {
+  const initialValue = vi.fn();
+  initialValue.mockReturnValue("hello");
+  const { result, rerender } = renderHook(() =>
+    useDebouncedValue(initialValue, 500),
+  );
+
+  expect(result.current[0]).toBe("hello");
+  rerender();
+  expect(initialValue).toHaveBeenCalledTimes(1);
+});
+
 test("should skip old value", async () => {
   const initialValue = "hello";
   const { result } = renderHook(() => useDebouncedValue(initialValue, 500));
@@ -44,20 +56,14 @@ test("should skip old value", async () => {
   expect(result.current[0]).toBe("world");
 });
 
-test("should update if 'initial value' is changed", async () => {
+test("should not update if 'initial value' is changed", async () => {
   const { result, rerender } = renderHook((initialValue = "hello") =>
     useDebouncedValue(initialValue, 500),
   );
   expect(result.current[0]).toBe("hello");
   rerender("world");
-
-  act(() => {
-    // Should have triggered the update, when the value changes
-    expect(vi.getTimerCount()).toBe(1);
-    vi.runAllTimers();
-  });
-
-  expect(result.current[0]).toBe("world");
+  expect(result.current[1].isPending()).toBe(false);
+  expect(result.current[0]).toBe("hello");
 });
 
 test("should update the value immediately if leading is true", async () => {

src/hooks/useDebouncedCallback.ts

@@ -107,7 +107,7 @@ export function useDebouncedCallback<
         timeout.current = null;
 
         if (options.trailing) {
-          cb.current(...currentArgs);
+          cb.current(...(currentArgs ?? []));
         }
       }
     };

src/hooks/useDebouncedValue.ts

@@ -1,4 +1,4 @@
-import { useEffect, useMemo, useRef, useState } from "react";
+import { useState } from "react";
 import { useDebouncedCallback } from "./useDebouncedCallback";
 
 type DebounceOptions = {
@@ -28,24 +28,17 @@ type DebounceOptions = {
  *  ```
  */
 export function useDebouncedValue<T>(
-  initialValue: T,
+  initialValue: T | (() => T),
   wait: number,
   options: DebounceOptions = { trailing: true },
 ) {
   const [debouncedValue, setDebouncedValue] = useState<T>(initialValue);
-  const previousValueRef = useRef<T | undefined>(initialValue);
 
   const updateDebouncedValue = useDebouncedCallback(
     setDebouncedValue,
     wait,
     options,
   );
 
-  // Update the debounced value if the initial value changes
-  if (previousValueRef.current !== initialValue) {
-    updateDebouncedValue(initialValue);
-    previousValueRef.current = initialValue;
-  }
-
   return [debouncedValue, updateDebouncedValue] as const;
 }