-
-
Notifications
You must be signed in to change notification settings - Fork 32.7k
Description
First off, thanks for your hard work on this project, it's really incredible.
Keyboard behavior differs between DropDownMenu and IconMenu.
In IconMenu, we can tab to an IconMenu in the DOM. Then by hitting spacebar the menu opens and we are able to move through the indices there. Then, upon hitting ESC the menu closes and we are returned to the TabIndex of the menu icon in the page.
In DropDownMenu, we can't select the menu by tabbing through the page nor can we close the menu by hitting escape. In addition, we can't create a custom label for the DropDownMenu emitting button that is not one of the options in the menu. This common use case is shown in the Material Design spec here (second one down): https://www.google.com/design/spec/components/menus.html# . I worked around this by making the first MenuItem disabled as setting that and the default option.
I'd like to request that we make the behavior of DropDownMenu the same as IconMenu. What would be even better is if we could choose to turn off or change this behavior through the use of a prop. Since devs don't have access to open and close these menus programmatically, it would be yugely useful to provide an interface via props. It may be as simple as saying "<DropDownMenu closeOnEsc={ false } />". If not that, providing a way to programmatically open and close the menu using a ref would be useful.
DropDownMenu getting keyboard focus has been requested before here: #714 (comment)
"When tabbing through a form or page and the tab order shifts onto a Drop Down menu it should get focus"
This was said to be fixed here: #846 but does not provide that functionality.
DropDownMenu is not selectable by tabbing and can't be closed by hitting ESC. It is not a feature to be able to use a dropdown with a custom label for the menu emitting button as specified in the Material Design spec.
http://www.material-ui.com/#/components/dropdown-menu
IconMenu is selectable by tabbing and can be closed by hitting ESC: http://www.material-ui.com/#/components/icon-menu
Thank you.