Axon 911 Frontend DocsAxon 911 Frontend Docs
Axon 911 Frontend Docs
    Loading navigation…
U
User
Switch to light mode
  1. Components
  3. Menu
  5. Accessibility
  7. Keyboard Support

Menu

Keyboard Support

Accessible menus ensure all users can navigate, understand, and interact with menu options effectively. When using Menu and NavigableMenu, follow these best practices. Menus provide comprehensive keyboard navigation for efficient interaction.
Opening and Closing
Users can open and close menus using standard keyboard patterns.
  • Enter or Space: Opens the menu when trigger is focused
  • Escape: Closes the menu and returns focus to trigger
  • Tab: Moves focus away from the menu (closes it)
Navigation
Navigate menu items efficiently with arrow keys.
  • Arrow Down: Move focus to next item
  • Arrow Up: Move focus to previous item
  • Home: Move focus to first item
  • End: Move focus to last item
  • Enter or Space: Activate focused item
  • Type-ahead: Jump to the next item whose visible label starts with the typed character. MenuItemRadio description is announced via aria-describedby and is not part of type-ahead.
Search Navigation
In NavigableMenu with search enabled, keyboard navigation works seamlessly.
  • Arrow Down from search input: Move focus to first menu item
  • Arrow Up from first item: Return focus to search input
  • Escape: Clear search if search has value, otherwise close menu
  • Enter: Activate focused item or submit search
Submenu Navigation
Navigate submenus efficiently with keyboard.
  • Arrow Right: Enter submenu
  • Arrow Left: Navigate back to parent menu
  • Enter or Space: Activate submenu trigger to enter submenu
  • Breadcrumb back button: Navigate back using Enter or Space
Reordering items
When sortable is enabled on Menu or NavigableMenu, focus the drag handle (or the row when drag-from-row is allowed) and use:
  • Space or Enter: Grab the item for keyboard reorder; drop when finished
  • Arrow Up / Arrow Down: Move the grabbed item
  • Escape: Cancel reorder and restore the previous order
Live region announcements describe grab, move, drop, and cancel. Pointer drag shows a floating preview of the item while the source row stays in the list as a placeholder.
Previous
Accessibility / General
Next
Accessibility / ARIA Attributes
On this page
Opening and Closing
Navigation
Search Navigation
Submenu Navigation
Reordering items