ComboBox does not make the found item active

[laurynasr]

Code Sandbox

Easily reproducible on https://itwin.github.io/iTwinUI-react/?path=/story/core-combobox--basic

Steps to reproduce

1. Type something into ComboBox to find the matching item, for example, "lith" -- ComboBox displays the single entry "Lithuania"
2. Press Tab to switch focus to another input
3. [optional] Press arrow down to select the item
4. The ComboBox stays empty

Actual behavior

The ComboBox does not take the selection

Expected behavior

The ComboBox should set the single/first result as selection.

The only way I found to select the found item is to type the search text, then use arrow keys to find the item, and then press Enter. This is not how standard tag works, see example here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select

[mayank99]

Reclassifying this as a feature request. There are valid use cases for both patterns.

See examples from w3c aria apg patterns:

• Inline autocomplete: https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-autocomplete-both.html
• List autocomplete: https://www.w3.org/WAI/ARIA/apg/example-index/combobox/combobox-autocomplete-none.html

(we only seem to support "list autocomplete" currently)