minor keyboard nav improvements

This commit is contained in:
Matt Dunn-Rankin 2020-04-25 20:27:04 -07:00
parent a3cc035821
commit 7d23ca656b

View file

@ -15,7 +15,14 @@ function SearchPanel({
onMoveFocusUpToQuery, onMoveFocusUpToQuery,
}) { }) {
return ( return (
<Box color="green.800"> <Box
color="green.800"
onKeyDown={(e) => {
if (e.key === "Escape") {
onMoveFocusUpToQuery(e);
}
}}
>
<Heading1 mb="4">Searching for "{query}"</Heading1> <Heading1 mb="4">Searching for "{query}"</Heading1>
<SearchResults <SearchResults
query={query} query={query}
@ -210,12 +217,12 @@ function SearchResults({
ref={index === 0 ? firstSearchResultRef : null} ref={index === 0 ? firstSearchResultRef : null}
onChange={onChange} onChange={onChange}
onKeyDown={(e) => { onKeyDown={(e) => {
if (e.key === "ArrowUp") { if (e.key === "Enter") {
e.target.click();
} else if (e.key === "ArrowUp") {
goToPrevItem(e); goToPrevItem(e);
} else if (e.key === "ArrowDown") { } else if (e.key === "ArrowDown") {
goToNextItem(e); goToNextItem(e);
} else if (e.key === "Escape") {
onMoveFocusUpToQuery(e);
} }
}} }}
/> />