Customizable useSelect input debounce wait

src/hooks/useSelect/index.js

@@ -40,6 +40,7 @@ function useSelect(userProps = {}) {
     itemToString,
     getA11ySelectionMessage,
     getA11yStatusMessage,
+    inputCleanupDebounceWait,
   } = props
   // Initial state depending on controlled props.
   const initialState = getInitialState(props)
@@ -108,27 +109,31 @@ function useSelect(userProps = {}) {
 
   // Sets cleanup for the keysSoFar callback, debounded after 500ms.
   useEffect(() => {
-    // init the clean function here as we need access to dispatch.
-    clearTimeoutRef.current = debounce(outerDispatch => {
-      outerDispatch({
-        type: stateChangeTypes.FunctionSetInputValue,
-        inputValue: '',
-      })
-    }, 500)
+    if (inputCleanupDebounceWait > 0) {
+      // init the clean function here as we need access to dispatch.
+      clearTimeoutRef.current = debounce(outerDispatch => {
+        outerDispatch({
+          type: stateChangeTypes.FunctionSetInputValue,
+          inputValue: '',
+        })
+      }, inputCleanupDebounceWait)
+    } else {
+      clearTimeoutRef.current = null;
+    }
 
     // Cancel any pending debounced calls on mount
     return () => {
-      clearTimeoutRef.current.cancel()
+      clearTimeoutRef?.current.cancel()
     }
-  }, [])
+  }, [inputCleanupDebounceWait])
 
   // Invokes the keysSoFar callback set up above.
   useEffect(() => {
     if (!inputValue) {
       return
     }
 
-    clearTimeoutRef.current(dispatch)
+    clearTimeoutRef.current?.(dispatch)
   }, [dispatch, inputValue])
 
   useControlPropsValidator({

src/hooks/useSelect/utils.ts

@@ -41,6 +41,7 @@ const propTypes = {
   items: PropTypes.array.isRequired,
   isItemDisabled: PropTypes.func,
   getA11ySelectionMessage: PropTypes.func,
+  inputCleanupDebounceWait: PropTypes.number,
 }
 
 /**
@@ -79,6 +80,7 @@ export const defaultProps = {
   isItemDisabled() {
     return false
   },
+  inputCleanupDebounceWait: 500,
 }
 
 // eslint-disable-next-line import/no-mutable-exports

typings/index.d.ts

@@ -366,6 +366,7 @@ export interface UseSelectProps<Item> {
   onHighlightedIndexChange?: (changes: UseSelectStateChange<Item>) => void
   onStateChange?: (changes: UseSelectStateChange<Item>) => void
   environment?: Environment
+  inputCleanupDebounceWait?: number;
 }
 
 export interface UseSelectStateChangeOptions<Item>