Multiple `SubTrigger` active and `SubContent` not closing

[d3lm]

Bug report

Current Behavior

When using the DropdownMenu with multiple submenus I have noticed that multiple triggers can be active and the submenu is not closing until you move the mouse a little further.

CleanShot.2025-11-27.at.09.55.13.mp4

CleanShot.2025-11-27.at.09.58.12.mp4

Expected behavior

I expect only one trigger to be active on hover and not multiple. Also when entering another trigger then the submenu of the previously hovered trigger should close.

Reproducible example

https://stackblitz.com/edit/github-1yil4kxs?file=src%2FSettingsDropdown.tsx

Your environment

@radix-ui/react-dropdown-menu: 2.1.16

[danipalli]

I'm experiencing the same issue. I'd love to find a fix or workaround for that.

One thing I noticed is, that the bug only happens when moving the pointer downwards and hovering over a SubTrigger that's below. It doesn't happen when moving the pointer upwards.

[d3lm]

Yep I noticed that too actually.

[danipalli]

The temporary workaround for my project looks like this:

<DropdownMenu.Sub open={isOpen} onOpenChange={(open) => setOpen(open)}>
  <div
    onMouseEnter={() => setOpen(true)}
    onMouseLeave={() => setOpen(false)}
  >
    {children}
  </div>
</DropdownMenu.Sub>

[d3lm]

@danipalli That works for the submenu but still doesn't fix the hover state where 2 triggers are active.

[d3lm]

Any updates?

[d3lm]

I switched to @base-ui/react/menu for now.