Clear inputValue on the background to avoid suggestion flickering

WordPress · Sep 12, 2024 · 43158d2 · 43158d2
1 parent 2a62872
commit 43158d2
Showing 1 changed file with 6 additions and 2 deletions.
diff --git a/packages/components/src/combobox-control/index.tsx b/packages/components/src/combobox-control/index.tsx
@@ -150,6 +150,12 @@ function ComboboxControl( props: ComboboxControlProps ) {
 	const [ inputValue, setInputValue ] = useState( '' );
 	const inputContainer = useRef< HTMLInputElement >( null );
 
+	useEffect( () => {
+		if ( ! inputHasFocus ) {
+			setInputValue( '' );
+		}
+	}, [ inputHasFocus ] );
+
 	const matchingSuggestions = useMemo( () => {
 		const startsWithMatch: ComboboxControlOption[] = [];
 		const containsMatch: ComboboxControlOption[] = [];
@@ -238,8 +244,6 @@ function ComboboxControl( props: ComboboxControlProps ) {
 		if ( ! currentOption ) {
 			onFilterValueChange( '' );
 		}
-
-		setInputValue( '' );
 	};
 
 	const onFocus = () => {