Skip to content
This repository has been archived by the owner on Mar 1, 2023. It is now read-only.

Searcher UX: Handle arrow keys #26

Open
with-heart opened this issue Apr 7, 2021 · 2 comments
Open

Searcher UX: Handle arrow keys #26

with-heart opened this issue Apr 7, 2021 · 2 comments

Comments

@with-heart
Copy link
Contributor

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
@hmaurer
Copy link
Contributor

hmaurer commented Apr 7, 2021

👍 . 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!

@mattpocock
Copy link
Owner

Yeah! Once the combobox state machine is written we can practice what we preach.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants