fix: propagation with other event

This commit is contained in:
RadoslavDimchev 2023-09-01 16:27:53 +03:00
parent bd3963567e
commit d8953b1284
1 changed files with 13 additions and 4 deletions

View File

@ -37,17 +37,26 @@ const AutocompleteInput = ({ index }: AutocompleteInputProps) => {
} }
const handleSuggestionClick = (suggestion: string) => { const handleSuggestionClick = (suggestion: string) => {
setIsFocused(false)
dispatch(setWord({ index, word: suggestion })) dispatch(setWord({ index, word: suggestion }))
} }
const handleInputFocus = () => {
setIsFocused(true)
}
const handleInputBlur = () => {
setIsFocused(false)
}
return ( return (
<div> <div className="autocomplete-container">
<input <input
type="text" type="text"
value={word} value={word}
onChange={handleInputChange} onChange={handleInputChange}
onFocus={() => setIsFocused(true)} onFocus={handleInputFocus}
onBlur={() => setIsFocused(false)} onBlur={handleInputBlur}
/> />
{isFocused && ( {isFocused && (
<div className="suggestion-list"> <div className="suggestion-list">
@ -55,7 +64,7 @@ const AutocompleteInput = ({ index }: AutocompleteInputProps) => {
<div <div
key={suggestion} key={suggestion}
className="suggestion-item" className="suggestion-item"
onClick={() => handleSuggestionClick(suggestion)} onMouseDown={() => handleSuggestionClick(suggestion)}
> >
{suggestion} {suggestion}
</div> </div>