diff --git a/src/forms/FormAutocomplete.jsx b/src/forms/FormAutocomplete.jsx index 3aeef5a..2f735e0 100644 --- a/src/forms/FormAutocomplete.jsx +++ b/src/forms/FormAutocomplete.jsx @@ -81,6 +81,7 @@ export function FormAutocomplete({ const [ignoreBlur, setIgnoreBlur] = useState(false); const [isFocused, setFocus] = useState(false); const searchInputRef = useRef(null); + const openTimerRef = useRef(null); const registerRef = useCallback(register, [register]); const disabled = booleanOrFunction(_disabled, getFormData()); @@ -123,7 +124,7 @@ export function FormAutocomplete({ const onSearchInputFocus = useCallback(() => { if (openOnFocus) { - setTimeout(() => { + openTimerRef.current = setTimeout(() => { open(); }, 100); } @@ -169,6 +170,7 @@ export function FormAutocomplete({ const onSelectItem = useCallback( ({ value, label }) => { + clearTimeout(openTimerRef.current); setValue(value); setSearchValue(label); setSelectedItem({ value, label }); diff --git a/src/forms/FormAutocompleteTag.jsx b/src/forms/FormAutocompleteTag.jsx index ebee937..f831588 100644 --- a/src/forms/FormAutocompleteTag.jsx +++ b/src/forms/FormAutocompleteTag.jsx @@ -51,6 +51,7 @@ export function FormAutocompleteTag({ const [isFocused, setFocus] = useState(false); const searchInputRef = useRef(null); + const openTimerRef = useRef(null); const value = useMemo(() => getValue() || [], [getValue]); const options = useMemo(() => { @@ -168,7 +169,7 @@ export function FormAutocompleteTag({ const onSearchInputFocus = useCallback(() => { if (openOnFocus) { - setTimeout(() => { + openTimerRef.current = setTimeout(() => { open(); }, 100); } @@ -200,6 +201,7 @@ export function FormAutocompleteTag({ const onSelectItem = useCallback( ({ value }) => { + clearTimeout(openTimerRef.current); addTag(value); setSearchValue(''); setIgnoreBlur(false); diff --git a/src/uncontrolled-forms/UncontrolledFormAutocomplete.jsx b/src/uncontrolled-forms/UncontrolledFormAutocomplete.jsx index 3d287cd..24cff5d 100644 --- a/src/uncontrolled-forms/UncontrolledFormAutocomplete.jsx +++ b/src/uncontrolled-forms/UncontrolledFormAutocomplete.jsx @@ -80,6 +80,7 @@ export function UncontrolledFormAutocomplete({ const [ignoreBlur, setIgnoreBlur] = useState(false); const [isFocused, setFocus] = useState(false); const searchInputRef = useRef(null); + const openTimerRef = useRef(null); const disabled = booleanOrFunction(_disabled, getFormData()); const required = booleanOrFunction(_required, getFormData()); @@ -122,7 +123,7 @@ export function UncontrolledFormAutocomplete({ const onSearchInputFocus = useCallback(() => { if (openOnFocus) { - setTimeout(() => { + openTimerRef.current = setTimeout(() => { open(); }, 100); } @@ -168,6 +169,7 @@ export function UncontrolledFormAutocomplete({ const onSelectItem = useCallback( ({ value, label }) => { + clearTimeout(openTimerRef.current); setValue(value); setSearchValue(label); setSelectedItem({ value, label });