jxom/bumbag-ui

Cannot use keyboard navigation in SelectMenu search

maxmorlocke opened this issue · 2 comments

Describe the bug

With hasSearch enabled, you can't use the arrow keys, etc. to escape the search box and select an item.

To Reproduce

  1. Open https://www.bumbag.style/docs/form/select-menu
  2. Ctrl+F for "hasSearch"
  3. Open the menu
  4. Start typing "a"
  5. Try to use keyboard up/down to get to the options and watch nothing happen...

Expected behavior

Keydown takes you to the first option. Keyup from the first option takes you back to the search text. Enter on an option selects it. Enter while in the search area gets you the first option selected. Scrolling via keyboard (e.g. keydown, tab) should invoke pagination if enabled.

I've added a tabindex={0} to the rendered options in my own environment as a somewhat janky workaround if anyone else encounters this before we get a fully working fix in.

Ignore, I did something stupid locally. Tab works out of the box to highlight the menu...