oddvernes
commented
4 months ago Findings so far:
When selecting an item in singleselect, the dropdown closes. When you re-open the dropdown, highlightedIndex provided by downshift is 0. But then if you close the dropdown and open it again, highlightedIndex is correctly the index of the selected item ( but it is not scrolled into view due to the virtualizer scrollToIndex function being called too early, this can be fixed by putting it in a setTimeout). I do not know why highlightedIndex is set to 0 after re-opening the dropdown after making a selection but that is what needs to be fixed for this behaviour to work
Is your feature request related to a problem? Please describe.
In situations where users need to check multiple options in a list one by one, using EDS
<Autocomplete>causes some frustration since they always need to start from the top of the list before selecting the next item.In a native HTML
<select>element, the selected option is always the starting point when opening the dropdown or using the arrow keys to change option. This makes it a lot easier to skip through the list, especially when using arrow keys.Describe the solution you'd like
When an option is selected in a single-select
<Autocomplete>:Additional context
Example A
The user is forced to start from the top every time they want to skip to the next item in the list using the arrow keys.
https://github.com/equinor/design-system/assets/73646636/da41bac9-8f4e-4039-9ef6-8ae77245bbc1
Example B
Basic HTML select example showing how the scroll position in the options list always visible when opening the dropdown, and always the starting point when using arrow keys to navigate up and down in the list.
https://github.com/equinor/design-system/assets/73646636/e4089b11-2efe-437a-beb0-33dbe0913d9d