Keyboard Navigation

The keyboard navigation of the DropDownButton is always available.

The DropDownButton supports the following keyboard shortcuts:

Enter & SpaceOpens the popup, or activates the highlighted item and closes the popup.
Alt+Down ArrowOpens the popup.
Alt+Up ArrowCloses the popup.
EscCloses the popup.
Up Arrow & Left ArrowSets the focus on the previously available item.
Down Arrow & Right ArrowSets the focus on the next available item.
class App extends React.Component {
    render() {
        return (
                <DropDownButton text="Edit">
                    <DropDownButtonItem text="Undo" icon="undo" />
                    <DropDownButtonItem text="Redo" icon="redo" disabled={true} />
                    <DropDownButtonItem text="Cut" icon="cut" />
                    <DropDownButtonItem text="Copy" icon="copy" />
                    <DropDownButtonItem text="Paste" icon="paste" />
    <App />,