Environment

Developement/Production OS: Windows 10 19043.1110
Node version: 16.0.0
Package manager: [email protected]
Reka UI version: 2.0.0
Vue version: 3.0.0
Nuxt version: 3.0.0
Nuxt mode: universal
Nuxt target: server
CSS framework: [email protected]
Client OS: Windows 10 19043.1110
Browser: Chrome 90.0.4430.212

Link to minimal reproduction

https://codesandbox.io/p/devbox/hardcore-neumann-3tpf3d

Steps to reproduce

1. Click on the "+ New" menu

2. Click on "Focus immediately"

3. Click on the "+ New" menu

4. Click on "Focus with timeout" and twitch your cursor immediately afterwards

Describe the bug

The input isn't focused in either scenario.

Expected behavior

The input is focused in either scenario.

Context & Screenshots (if applicable)

Menu items are focused on the pointermove event. Users are likely to slightly move their cursor just after selecting a menu item. The dropdown menu uses the presence component so items aren't unmounted until the animation or transition has ended. Therefore, it's probable that the menuitem that was selected will remain focused even if the select action focuses an element elsewhere on the page.

It's possible to workaround this problem by listening to the animationend or transitionend event or by using a timeout longer than the transition but perhaps it's possible for Reka to check whether the dropdown menu is open before focusing inside the pointer move event?