Skip to content

Commit

Permalink
[Unified Search][Lens] Focus selectable search inputs in dropdowns (e…
Browse files Browse the repository at this point in the history
…lastic#191213)

## Summary

Adds `autoFocus` search input in dropdown for the global **Data view**
selector and the **Lens chart switch**. Now clicking on either dropdown,
the focus will automatically be on the input for the user to start
typing to filter selectable items. This does not change the tab indexing
of the surrounding elements.

### Data view picker

![Zight Recording 2024-08-23 at 09 11 47
AM](https://github.com/user-attachments/assets/c5cf9981-4e79-4216-b1ae-0ef5da8fe62a)

### Lens chart switch

![Zight Recording 2024-08-23 at 09 14 09
AM](https://github.com/user-attachments/assets/7fb117b5-0bb7-4204-a606-264ce12a1f6d)

closes elastic#189686

### Checklist

- [ ] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios
- [x] Any UI touched in this PR is usable by keyboard only (learn more
about [keyboard accessibility](https://webaim.org/techniques/keyboard/))
- [x] Any UI touched in this PR does not create any new axe failures
(run axe in browser:
[FF](https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/),
[Chrome](https://chrome.google.com/webstore/detail/axe-web-accessibility-tes/lhdoppojpmngadmnindnejefpokejbdd?hl=en-US))
- [x] This was checked for [cross-browser
compatibility](https://www.elastic.co/support/matrix#matrix_browsers)

---------

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
Co-authored-by: Marta Bondyra <4283304+mbondyra@users.noreply.github.com>
  • Loading branch information
3 people authored Aug 26, 2024
1 parent d07ffe2 commit 64f1ae6
Showing 1 changed file with 1 addition and 0 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -149,6 +149,7 @@ export function DataViewsList({
searchProps={{
id: searchListInputId,
compressed: true,
autoFocus: true,
placeholder: strings.editorAndPopover.search.getSearchPlaceholder(),
'data-test-subj': 'indexPattern-switcher--input',
...(selectableProps ? selectableProps.searchProps : undefined),
Expand Down

0 comments on commit 64f1ae6

Please sign in to comment.