diff --git a/src/components/AutocompleteSelectMenu/AutocompleteSelectMenu.tsx b/src/components/AutocompleteSelectMenu/AutocompleteSelectMenu.tsx index 7457243a0..9cab93c2e 100644 --- a/src/components/AutocompleteSelectMenu/AutocompleteSelectMenu.tsx +++ b/src/components/AutocompleteSelectMenu/AutocompleteSelectMenu.tsx @@ -80,7 +80,10 @@ const AutocompleteSelectMenu: React.FC = props => { } = props; const classes = useStyles(props); + const [isFocused, setIsFocused] = React.useState(false); + const [inputValue, setInputValue] = React.useState(displayValue || ""); + const [menuPath, setMenuPath] = React.useState([]); const handleChange = (value: string) => @@ -118,18 +121,24 @@ const AutocompleteSelectMenu: React.FC = props => { > , + endAdornment: isFocused && loading && ( + + ), id: undefined, - onBlur: () => { + onBlur() { + setIsFocused(false); closeMenu(); setMenuPath([]); - setInputValue(displayValue); + setInputValue(displayValue || ""); }, onChange: event => { debounceFn(event.target.value); setInputValue(event.target.value); }, - onFocus: () => openMenu(), + onFocus: () => { + openMenu(); + setIsFocused(true); + }, placeholder }} disabled={disabled} diff --git a/src/storybook/__snapshots__/Stories.test.ts.snap b/src/storybook/__snapshots__/Stories.test.ts.snap index 4496742dd..f7dc0b389 100644 --- a/src/storybook/__snapshots__/Stories.test.ts.snap +++ b/src/storybook/__snapshots__/Stories.test.ts.snap @@ -4205,34 +4205,15 @@ exports[`Storyshots Generics / Autocomplete Menu loading 1`] = ` Autocomplete Menu
-
- - - -