Buttons inside Drawer not clickable when tapping directly on text (iOS Safari)

Description

On iOS Safari, tapping a <button> inside Drawer.Content does not fire its onClick when the tap lands directly on the button's text. Tapping the same button on a non-text area (padding/icon) fires the click normally. Desktop and Android Chrome are unaffected.

Environment

• vaul: 1.1.2
• Browser: Safari on iOS — reproduced across multiple devices / iOS versions (this does not appear to be tied to a specific iOS release; see Suspected cause)
• React 18, Next.js

Reproduction

<Drawer open={open} onOpenChange={setOpen}>
  <DrawerTrigger asChild><button>Open</button></DrawerTrigger>
  <DrawerContent>
    <button onClick={() => alert('clicked')}>
      <span>Tap exactly on this text</span>
    </button>
  </DrawerContent>
</Drawer>

1. Open on a real iPhone (Safari).
2. Tap precisely on the glyphs of the text → nothing happens.
3. Tap the button's padding (outside the text) → onClick fires.

Expected

Tapping anywhere within the button (including its text) fires onClick.

Suspected cause

The injected CSS scopes user-select: none to non-touch pointers only:

@media (hover:hover) and (pointer:fine){ [data-vaul-drawer]{ user-select:none } }

On iOS this media query never matches — touch screens report pointer: coarse with no hover — so the rule is structurally excluded on every iOS Safari version (not gated by CSS feature support; hover/pointer media features have been supported since iOS 9). Drawer text therefore stays selectable on iOS regardless of version.

Combined with [data-vaul-drawer]{ touch-action: none } and the pointer-event listeners on Drawer.Content, a tap that lands on selectable text appears to be consumed by Safari's text-selection path, so the synthetic click is never dispatched to the button. Because the trigger is the media-query exclusion (not a version-gated feature), the bug is reproducible across iOS versions rather than on one specific release.

Keeping text selectable on mobile looks intentional (re: #346 / #295), but the unclickable-button side effect seems unintended.

Secondary note: the rule uses the unprefixed user-select, which Safari only supports since 17.4 — -webkit-user-select is still needed for older Safari. This is separate from the media-query issue above.

Workaround

Adding -webkit-user-select: none; user-select: none; to Drawer.Content (e.g. Tailwind select-none) restores text taps firing onClick, at the cost of disabling text selection inside the drawer.