diff --git a/docs/src/docs/hooks/use-timeout.mdx b/docs/src/docs/hooks/use-timeout.mdx index 3d9bfd43c04..82cecf1c26e 100644 --- a/docs/src/docs/hooks/use-timeout.mdx +++ b/docs/src/docs/hooks/use-timeout.mdx @@ -38,13 +38,13 @@ Return object: ```tsx function useTimeout( - callback: () => void, + callback: (...callbackParams: any[]) => void, delay: number, options?: { autoInvoke: boolean; } ): { - start: () => void; + start: (...callbackParams: any[]) => void; clear: () => void; }; ``` diff --git a/src/mantine-hooks/src/use-timeout/use-timeout.test.ts b/src/mantine-hooks/src/use-timeout/use-timeout.test.ts index 2acc7a87869..2e6d76c091b 100644 --- a/src/mantine-hooks/src/use-timeout/use-timeout.test.ts +++ b/src/mantine-hooks/src/use-timeout/use-timeout.test.ts @@ -88,4 +88,19 @@ describe('@mantine/hooks/use-timeout', () => { expect(setTimeout).toHaveBeenCalled(); expect(clearTimeout).toHaveBeenCalled(); }); + + it('start function passes parameters to callback', () => { + const { timeout, advanceTimerToNextTick } = setupTimer(10); + const hook = renderHook(() => useTimeout(callback, timeout)); + + const MOCK_CALLBACK_VALUE = 'MOCK_CALLBACK_VALUE'; + act(() => { + hook.result.current.start(MOCK_CALLBACK_VALUE); + }); + + advanceTimerToNextTick(); + + expect(setTimeout).toHaveBeenCalled(); + expect(callback).toBeCalledWith([MOCK_CALLBACK_VALUE]); + }); }); diff --git a/src/mantine-hooks/src/use-timeout/use-timeout.ts b/src/mantine-hooks/src/use-timeout/use-timeout.ts index c5266c09ad7..79578520a69 100644 --- a/src/mantine-hooks/src/use-timeout/use-timeout.ts +++ b/src/mantine-hooks/src/use-timeout/use-timeout.ts @@ -1,16 +1,16 @@ import { useRef, useEffect } from 'react'; export function useTimeout( - fn: () => void, + callback: (...callbackParams: any[]) => void, delay: number, options: { autoInvoke: boolean } = { autoInvoke: false } ) { const timeoutRef = useRef(null); - const start = () => { + const start = (...callbackParams: any[]) => { if (!timeoutRef.current) { timeoutRef.current = window.setTimeout(() => { - fn(); + callback(callbackParams); timeoutRef.current = null; }, delay); }