mui / mui/base-ui

[popover] Popover.Trigger: expose `event` option for `useClick` to support `mousedown` opening

Open
#4,776 0 comments 0 reactions 0 assignees View on GitHub
component: popover type: enhancement
Dominant language
TypeScript
Stars
10.9k
Forks
543
Avg merge
1d 20h
Merged PRs (30d)
101

Description

# Feature Request

## Summary

Add a prop to `Popover.Trigger` (or `Popover.Root`) that controls whether the trigger opens on `mousedown` or `click`, mapping to Floating UI's `useClick` `event` option. `'mousedown'` should be a supported value.

## Examples in other libraries

Base UI's own `Menu.Trigger` already uses this internally — `MenuTrigger.js` passes `event: 'mousedown'` to `useClick`. The option exists in Floating UI; it just isn't surfaced on `PopoverTrigger`.

Radix UI's `DropdownMenu.Trigger` and `Popover.Trigger` both open on `pointerdown`. Headless UI's `Menu.Button` opens on `mousedown`.

## Motivation

When `Popover` and `Menu` are used alongside each other — toolbar buttons, action bars, nav items — users notice that menus open on press while popovers open on release. The ~100ms difference is subtle but perceptible, and it makes the two components feel inconsistent even when they're visually identical.

The current workaround is to call `handle.open()` imperatively on `pointerdown` and cancel the redundant `trigger-press` close in `onOpenChange`. This works but requires module-level mutable state coordinated across an async event boundary, and it breaks down if Base UI's internal event flow changes. It's an unreasonable amount of machinery for what is a one-line change inside `PopoverTrigger`.

The fix is straightforward: pass the prop value through to `useClick` the same way `MenuTrigger` already does.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.