Searcher UX: Handle arrow keys
with-heart opened this issue · comments
Right now the searcher can only be navigated using tab, which feels unexpected for that type of interaction. Most sites with an Alogolia UI or similar support arrow keys.
Obviously not the highest priority, but it's a nice bit of polish that would make search feel extra special. Plus this would probably add enough unique functionality to make the searcher machine a good one to include in the catalogue itself, while also driving the search experience. That's my kind of dogfooding!
| Key | Cond | Action |
|---|---|---|
| Down Arrow | Final item is focused | Move focus to first item |
| Down Arrow | - | Move focus to next item |
| Up Arrow | First item is focused | Move focus to last item |
| Up Arrow | - | Move focus to previous item |
👍 . The right way to do this would be to use a combobox primitive I think (so that it's as accessible as can be), e.g. https://reach.tech/combobox or https://www.downshift-js.com/use-combobox. Or as you say, dog-food the upcoming combobox state machine!
Yeah! Once the combobox state machine is written we can practice what we preach.