Skip to content

Add keyboard navigation to search #134

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: stackable
Choose a base branch
from

Conversation

xeniape
Copy link
Member

@xeniape xeniape commented Jun 26, 2025

Part of stackabletech/documentation#616

This PR adds the following navigation shortcuts to the search:

  • When focus on search input field and Enter is pressed -> Focus first search result
  • Navigation through search results with Up and Down arrow keys when search result in focus (the focus is basically on the link within the search result)
  • Default implementation of link handling with keyboard shortcuts in browser already present
    • Press Enter to open link in same tab
    • Press Shift + Enter to open link in a new window
    • Press Strg + Enter to open link in a new tab of the same window
  • Press / to get the search input field into focus again

Not an Javascript expert, so would be nice if someone could test the implementation and give some feedback if needed. Wrote a short Nuclino article on how I developed locally and how it can be tested: https://app.nuclino.com/Stackable/Engineering/Developing-with-Search-locally-bb51c5c1-d0e5-478f-8c3c-d6d64fd8d895

@xeniape xeniape self-assigned this Jun 26, 2025
@xeniape xeniape moved this to Development: Waiting for Review in Stackable Engineering Jun 26, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
Status: Development: Waiting for Review
Development

Successfully merging this pull request may close these issues.

1 participant