WidgetCoreWidgetCore Documentation

Keyboard shortcuts

Every keyboard interaction in the WidgetCore widgets and in this documentation site — search field, results list, pagination, the FAQ accordion and the docs shortcuts.

Every widget can be used entirely from the keyboard. This page lists every binding, in the widget and on this documentation site, plus the test patterns we recommend.

Live Search widget

When focus is on the field

KeyBehaviour
Typing (2 or more characters)Sends a debounced request (250 ms) and opens the results panel
ArrowDownHighlights the first result, or the next one
ArrowUpHighlights the previous result, or the last one when at the top
EnterOpens the highlighted result; with nothing highlighted, submits the form
EscapeCloses the results panel and clears the highlighted item

The highlighted result is tracked with aria-activedescendant on the field, so a screen reader announces the option as you move through the list without moving DOM focus.

When focus is inside the results

KeyBehaviour
TabMoves through the focusable elements of each result (links)
EnterActivates the focused link
EscapeCloses the panel and returns focus to the field

In List mode the panel closes when focus leaves the widget entirely; in Page mode results stay visible because there is no panel to close.

Pagination

KeyBehaviour
TabMoves through the page buttons in order
Enter / SpaceActivates the focused page button
After activationFocus returns to the button that was pressed

Returning focus to the pressed button (instead of the top of the page) keeps keyboard users oriented after the results are replaced.

FAQ widget

KeyBehaviour
Enter or SpaceOpens or closes the focused question
ArrowDownNext question
ArrowUpPrevious question
HomeFirst question
EndLast question
TabMoves into the open answer, then to the next question

Navigation wraps around: ArrowDown on the last question moves to the first, and ArrowUp on the first moves to the last. Closed answers are skipped by Tab because they use visibility: hidden.

This documentation site

KeyBehaviour
Ctrl + K (or Cmd + K)Opens the search dialog
/Opens the search dialog (when no field has focus)
EscapeCloses the search dialog or an open menu
ArrowDown / ArrowUpMoves through the search results
EnterOpens the highlighted search result
TSwitches between the light and dark theme
TabMoves through the navigation, the sidebar groups and the table of contents

Inside the search dialog focus is trapped: Tab cycles only through the dialog's controls until you close it, and focus returns to the element that opened the dialog.

  1. Field to result with the keyboard only

    Tab to the field, type two characters, press ArrowDown twice, then Enter. The second result should open.

  2. Escape closes everything

    With the panel open, press Escape: the panel closes and focus stays on the field.

  3. FAQ traversal

    Tab to a question, press Enter, then End — focus should be on the last question. Press ArrowDown to wrap to the first.

  4. Closed answers are not focusable

    With every FAQ item closed, press Tab repeatedly: focus should skip all answer content.

  5. Screen reader announcements

    Listen for the field name, the “N results found.” status and the expanded/collapsed state of each FAQ item.

  6. Reduced motion

    Enable the OS setting and confirm that focus indicators are still visible and nothing depends on animation.