Fix ComboBox re-opening after selection (#5354)

Author: devongovett

packages/@react-stately/combobox/src/useComboBoxState.ts

@@ -165,10 +165,10 @@ export function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T
     }
   }, [triggerState, filteredCollection]);
 
-  let lastValue = useRef(inputValue);
+  let [lastValue, setLastValue] = useState(inputValue);
   let resetInputValue = () => {
     let itemText = collection.getItem(selectedKey)?.textValue ?? '';
-    lastValue.current = itemText;
+    setLastValue(itemText);
     setInputValue(itemText);
   };
 
@@ -183,7 +183,7 @@ export function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T
       isFocused &&
       (filteredCollection.size > 0 || allowsEmptyCollection) &&
       !triggerState.isOpen &&
-      inputValue !== lastValue.current &&
+      inputValue !== lastValue &&
       menuTrigger !== 'manual'
     ) {
       open(null, 'input');
@@ -209,7 +209,7 @@ export function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T
     }
 
     // Clear focused key when input value changes and display filtered collection again.
-    if (inputValue !== lastValue.current) {
+    if (inputValue !== lastValue) {
       selectionManager.setFocusedKey(null);
       setShowAllItems(false);
 
@@ -228,8 +228,8 @@ export function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T
       (props.inputValue === undefined || props.selectedKey === undefined)
     ) {
       resetInputValue();
-    } else {
-      lastValue.current = inputValue;
+    } else if (lastValue !== inputValue) {
+      setLastValue(inputValue);
     }
 
     // Update the inputValue if the selected item's text changes from its last tracked value.
@@ -239,7 +239,7 @@ export function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T
     let selectedItemText = collection.getItem(selectedKey)?.textValue ?? '';
     if (!isFocused && selectedKey != null && props.inputValue === undefined && selectedKey === lastSelectedKey.current) {
       if (lastSelectedKeyText.current !== selectedItemText) {
-        lastValue.current = selectedItemText;
+        setLastValue(selectedItemText);
         setInputValue(selectedItemText);
       }
     }
@@ -275,7 +275,7 @@ export function useComboBoxState<T extends object>(props: ComboBoxStateOptions<T
 
       // Stop menu from reopening from useEffect
       let itemText = collection.getItem(selectedKey)?.textValue ?? '';
-      lastValue.current = itemText;
+      setLastValue(itemText);
       closeMenu();
     } else {
       // If only a single aspect of combobox is controlled, reset input value and close menu for the user