[popover] More forgiving hover traversal across a small gap
Is there a supported way to make pointer traversal across a small gap more forgiving when a hover trigger is wider than its popup?
Desired interaction
For a wide button or row that reveals a narrower popup, we'd like users to be able to move slowly or briefly pause within the small gap without losing the popup.
One possible approach is to let the protected rectangular bridge across the gap span the wider element, while keeping the visible layout unchanged.
I understand why this might be undesirable as a default. Floating UI #2321 describes the opposite problem with a much larger gap.
Example
https://codesandbox.io/p/sandbox/dfp2jg
- Hover near the right edge of the trigger.
- Move slowly down into the gap, then left toward the popup.
- Compare with moving straight down from the trigger's center.
Existing options
Increasing closeDelay gives users more time, but also delays dismissal after they move away.
An invisible CSS bridge could cover the gap, but its hit area may intercept hover or clicks intended for underlying elements.
Source: mui/base-ui