More control over keyboard menu item selection

[truk]

I was wondering if you would consider allowing more control over the keyboard interaction for selecting MenuItems. In our use case, we are building a filtering string as users type, but due to the way the MenuItem captures keydown events, if users type a space, it invokes the MenuItem selection.

https://github.com/szhsin/react-menu/blob/master/src/components/MenuItem.js#L69

We definitely want the Enter key to do this, but not the space key.

[szhsin]

Apologies for getting back late.

After some analysis, it seems there’s no workaround to stop the space key from triggering menu item selection. The only way to support this would be through an API change, such as adding a new prop. I was initially tempted to add this, but after checking other menu implementations (Material/Base UI, Mantine, Radix), none of them provide this customization, which made me question if it’s really a valid use case.

I’ll keep this open for now, as there’s a plan for a major rewrite of the library that will include a headless (hook-based) solution. This will give users more flexibility to customize event handlers, for example by overriding onKeyDown and filtering out the space key to achieve the behavior you’re looking for.