Wrong keyboard arrow opens Submenu in vertical-right mode

Firstly, thank you for the awesome library! I love using it.

Problem

My app supports RTL, and I use vertical-right mode on the Menu component and alter the CSS in order to get the arrow on a SubMenu on the left. I also support keyboard navigation. It is generally intuitive to press the arrow direction that is shown on a submenu item to open the corresponding submenu.

Expected Behaviour

I expect the left arrow to open the submenu and right arrow to close it when in vertical-right mode.

Reproducible example

I've created a sample codesandbox here to emulate how the Menu looks in RTL in my app. Notice that you need to use right arrow key to open and left arrow key to close, and it's actually confusing.

Proposed solution

I've gone through the code and I think the fix is as easy as swapping these two if conditions in vertical-right mode

https://github.com/react-component/menu/blob/fe3a4755b33d617689ff052dc8981296e75df4d8/src/SubMenu.jsx#L152

https://github.com/react-component/menu/blob/fe3a4755b33d617689ff052dc8981296e75df4d8/src/SubMenu.jsx#L162

If you think this is valid, I'll propose a PR with tests. Also, I've found many more issues with keyboard support. If you're willing, I'd like to report and fix them with your help. Thanks!

Start in src/SubMenu.jsx at the referenced lines 152 and 162, then reproduce the behavior using the linked CodeSandbox in vertical-right mode. Verify that the expected arrow keys open and close the submenu, and add tests for the corrected keyboard behavior as proposed in the issue.