mui / mui/base-ui

[drawer] Default <Radio.Root> span gets ignored within <Drawer>

Open Beginner friendly
#5,286 2 comments 0 reactions 0 assignees View on GitHub
component: drawer has workaround type: bug
Dominant language
TypeScript
Stars
10.9k
Forks
543
Avg merge
1d 20h
Merged PRs (30d)
101

Description

# Docs feedback

## How can we improve Base UI documentation?

I ran into a scenario where I'm using the Radio component inside of a Drawer and I couldn't click on the radio buttons. A good number of tokens later and my agents realized it was related to the swipe behavior of the Drawer not ignoring the default `` elements used. Swapping the default rendering element to a button fixed it.

```ts
// useSwipeDismiss.ts

const DEFAULT_IGNORE_SELECTOR = 'button,a,input,select,textarea,label,[role="button"]';
```

I'm probably dumb and just didn't think to check there first, but might be worthwhile to call this out somewhere perhaps

Contributor guide

Open the contributing guide

Research direction

Start by reading useSwipeDismiss.ts, especially DEFAULT_IGNORE_SELECTOR, and confirm why the default span rendered by Radio.Root is not ignored during Drawer swipe handling. Add a Drawer documentation note describing the interaction and the button-rendering workaround, then verify that the guidance clearly explains how to make the radio buttons clickable.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
documentation
Issue type
Documentation
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
68/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.