MaibornWolff
Use Keyboard arrow-keys and enter-key to select a metric inside the metricChooser
Feature request
Description
When opening the metricChooser
and typing a search term
then I want to press Enter on the keyboard to select the first metric of the filtered list.
When opening the metricChooser
and typing a search term
then I want to press the Arrow-down and/or Arrow-up key on the keyboard to hover/preselect over the metrics of the filtered list
and then I want to press Enter on the keyboard to select the hovered/preselected metric.
Idea
- I would suggest to create a new service similar to the
mouseEvent.service, which includes all keyboard eventListeners and potentially calls other services to execute the requested task. - Because we use the arrow-keys to move the map, we have to disable that functionality inside the
threeViewerService.ts, when a metricChooser list is opened, and enable it again, when a metric is selected.
We just recognized that the keyboard feature is already working. The only problem we have to consider is the focused search field when you click the metric chooser. That prevents the user from selecting metrics using keyboard arrows. If you press tab, the focus disappears and the navigation with the keyboard works just fine.
Is that behavior for our use case okay? As an alternative we could prevent the search-bar from being focused when pushing the metric chooser button.
@jannikr The corresponding metric search bar should be focused when the metric chooser is clicked. No matter if a search term is present or not, it should be possible that the first metric in the list will be selected on arrow down. If no metrics left, the metric search bar should still be focused.
This also applies to the "on enter" behavior. On enter, the first metric in the list should be selected and activated. If no metric is present, the input field still should be focused.