Skip to content

Dropdown does not close on mouse leave when menu is focused #1871

@pecasha

Description

@pecasha

Summary

When using the Dropdown component with trigger="hover", if any menu item gains focus, the Dropdown does not automatically close when the mouse leaves the Dropdown area. This behavior is caused by the current Popper implementation. It would be helpful to provide an option (such as closeOnMouseLeave) to allow the Dropdown to always close on mouse leave, even if any menu item is still focused.

Basic example

<Dropdown trigger="hover" closeOnMouseLeave={true}>
  <DropdownItem>Item 1</DropdownItem>
  <DropdownItem>Item 2</DropdownItem>
</Dropdown>

With closeOnMouseLeave enabled, the Dropdown will close immediately when the mouse leaves, regardless of whether a child item is focused.

Motivation

there are valid UI/UX scenarios where the dropdown should always close immediately on mouseleave, regardless of focus state especially in designs where hover interaction is purely visual and transient.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions