compose: Add types to useDebounce

packages/compose/README.md

@@ -196,11 +196,13 @@ render in components in `useCallback`.
 
 _Parameters_
 
--   _args_ `...any`: Arguments passed to Lodash's `debounce`.
+-   _fn_ `TFunc`: 
+-   _wait_ `[number]`: 
+-   _options_ `[import('lodash').DebounceSettings]`: 
 
 _Returns_
 
--   `Function`: Debounced function.
+-   `TFunc & import('lodash').Cancelable`: Debounced function.
 
 <a name="useFocusOnMount" href="#useFocusOnMount">#</a> **useFocusOnMount**
 

packages/compose/src/hooks/use-debounce/index.js

@@ -9,18 +9,27 @@ import { useMemoOne } from 'use-memo-one';
  */
 import { useEffect } from '@wordpress/element';
 
+/* eslint-disable jsdoc/valid-types */
 /**
  * Debounces a function with Lodash's `debounce`. A new debounced function will
  * be returned and any scheduled calls cancelled if any of the arguments change,
  * including the function to debounce, so please wrap functions created on
  * render in components in `useCallback`.
  *
- * @param {...any} args Arguments passed to Lodash's `debounce`.
+ * @template {(...args: any[]) => void} TFunc
  *
- * @return {Function} Debounced function.
+ * @param {TFunc} fn
+ * @param {number} [wait]
+ * @param {import('lodash').DebounceSettings} [options]
+ * @return {TFunc & import('lodash').Cancelable} Debounced function.
  */
-export default function useDebounce( ...args ) {
-	const debounced = useMemoOne( () => debounce( ...args ), args );
+export default function useDebounce( fn, wait, options ) {
+	/* eslint-enable jsdoc/valid-types */
+	const debounced = useMemoOne( () => debounce( fn, wait, options ), [
+		fn,
+		wait,
+		options,
+	] );
 	useEffect( () => () => debounced.cancel(), [ debounced ] );
 	return debounced;
 }

packages/compose/tsconfig.json

@@ -16,6 +16,7 @@
 		"src/higher-order/with-instance-id/**/*",
 		"src/hooks/use-async-list/**/*",
 		"src/hooks/use-constrained-tabbing/**/*",
+		"src/hooks/use-debounce/**/*",
 		"src/hooks/use-instance-id/**/*",
 		"src/utils/**/*"
 	]