Skip to content

Menubar Dropdown keyboard navigation #2901

Open
@pmartin35

Description

@pmartin35

Apologies if this is written down in the docs, I did not manage to find it!

Currently, if I add something like the code below, the individual dropdowns are unaware of each other through keyboard navigation. If I am focused on an item within the first Dropdown menu and I hit the left/right arrow key, focus should be moved to the second dropdown. Does SLDS provide a wrapper component that handles this sort of keyboard navigation?

<nav>
    <SLDSDropdown><Trigger /></SLDSDropdown>
    <SLDSDropdown><Trigger /></SLDSDropdown>
</nav>

Here is an example of what I am looking for. Using a keyboard, I can focus on the "About" menu. Using the down arrow opens the menu and focuses the "Overview" item. If I then hit the right arrow key, the next dropdown in the menubar is focused.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions