Creates debounced version of the given function
The use-debounced-callback hook creates a debounced version of the given function, delaying its execution until a specified time has elapsed since the last invocation.
By default, the callback is not fired when the component unmounts. If you want to execute the pending callback before the component unmounts, set flushOnUnmount: true :
Set leading: true to execute the callback immediately on the first call, then ignore subsequent calls within the delay window:
Use maxWait to guarantee the callback is executed at least once within the given time window, even if calls keep arriving. This is useful for scenarios like search-as-you-type where you want intermediate results during continuous input:
You can call the flush method to execute the debounced callback immediately, or cancel to discard the pending call:
The UseDebouncedCallbackOptions and UseDebouncedCallbackReturnValue types are exported from the @mantine/hooks package; you can import them in your application: