Merged in fix/LOY-245-close-dropdown-selected (pull request #2271)

fix(LOY-245): close dropdown when selecting value

Approved-by: Michael Zetterberg

packages/design-system/lib/components/Select/SelectFilter.tsx

@@ -45,7 +45,7 @@ function ComboBoxInner({
   // Get the state for the ComboBox from RAC
   const comboBoxState = useContext(ComboBoxStateContext)
 
-  const { isFocused, selectedKey, inputValue } = comboBoxState ?? {}
+  const { isFocused, inputValue, selectedItem } = comboBoxState ?? {}
 
   // Act after render
   useEffect(() => {
@@ -54,7 +54,7 @@ function ComboBoxInner({
     // We only want to act on focused field which has rerendered due to
     // changes to its input value. Selecting a value will also rerender, but
     // that we want to ignore as that is not a change to its input value.
-    if (isFocused && selectedKey !== inputValue) {
+    if (isFocused && selectedItem?.textValue !== inputValue) {
       // The simlulated event has to originate from the input field.
       if (inputRef.current) {
         // Simulate a press on down arrow key.
@@ -76,7 +76,7 @@ function ComboBoxInner({
         clearTimeout(timeout)
       }
     }
-  }, [inputRef, inputValue, isFocused, selectedKey])
+  }, [inputRef, inputValue, isFocused, selectedItem?.textValue])
 
   return children
 }