As you can see keyboard and mouse interactions are different. Mouse actually hovers, but keyboard movement selects. There is no way to change this behaviour by passing in an external function.
Issue in detail:
If you use mouse to navigate, it'll show the highlighted menu item and won't trigger the on-click function until it is clicked.
But if we use keyboard, it triggers the click event and doesn't behave like mouse click (ideally the event should be fired on pressing "enter" key). Two different pointers in one dropdown is a bad user experience and they should actually be one interaction.
As you can see keyboard and mouse interactions are different. Mouse actually hovers, but keyboard movement selects. There is no way to change this behaviour by passing in an external function.
Issue in detail: If you use mouse to navigate, it'll show the highlighted menu item and won't trigger the on-click function until it is clicked. But if we use keyboard, it triggers the click event and doesn't behave like mouse click (ideally the event should be fired on pressing "enter" key). Two different pointers in one dropdown is a bad user experience and they should actually be one interaction.