Skip to content

[checkbox][radio][switch] Stop internal input clicks from reaching ancestors - #5176

Merged
atomiks merged 3 commits into
mui:masterfrom
atomiks:claude/objective-bardeen-298e8e
Jul 10, 2026
Merged

[checkbox][radio][switch] Stop internal input clicks from reaching ancestors#5176
atomiks merged 3 commits into
mui:masterfrom
atomiks:claude/objective-bardeen-298e8e

Conversation

@atomiks

@atomiks atomiks commented Jul 6, 2026

Copy link
Copy Markdown
Contributor

Closes #5175

Checkbox, Switch, and Radio re-dispatch a bubbling click on the hidden <input> so React's onChange fires there. That internal click also reached ancestors: stopPropagation() in onClick appeared to do nothing, and without it ancestors received two clicks per user click. Radio additionally leaked a click on arrow-key selection (input.click() in onFocus).

Fix: stop the internal click's propagation at the hidden input. Ancestors now receive exactly one click, targeting the root, with standard stopPropagation() semantics. The click still reaches the React root, so onChange keeps firing (which rules out a non-bubbling dispatch as in Radix's fix for the same bug).

@atomiks atomiks added component: checkbox Changes related to the checkbox component. component: switch Changes related to the switch component. component: radio group Changes related to the radio group component. type: bug It doesn't behave as expected. labels Jul 6, 2026
@pkg-pr-new

pkg-pr-new Bot commented Jul 6, 2026

Copy link
Copy Markdown

commit: 1015e44

@code-infra-dashboard

code-infra-dashboard Bot commented Jul 6, 2026

Copy link
Copy Markdown

Bundle size

Bundle Parsed size Gzip size
@base-ui/react 🔺+96B(+0.02%) 🔺+8B(+0.01%)

Details of bundle changes

Performance

Total duration: 1,372.30 ms -176.89 ms(-11.4%) | Renders: 78 (+0)

Test Duration Renders
Slider mount (300 instances) 156.33 ms ▼-45.48 ms(-22.5%) 3 (+0)
Checkbox mount (500 instances) 69.38 ms ▼-41.02 ms(-37.2%) 1 (+0)
Scroll Area mount (300 instances) 96.14 ms ▼-29.44 ms(-23.4%) 3 (+0)
Tooltip mount (300 contained roots) 51.37 ms ▼-19.00 ms(-27.0%) 1 (+0)

10 tests within noise — details


Check out the code infra dashboard for more information about this PR.

@netlify

netlify Bot commented Jul 6, 2026

Copy link
Copy Markdown

Deploy Preview for base-ui ready!

Name Link
🔨 Latest commit 1015e44
🔍 Latest deploy log https://app.netlify.com/projects/base-ui/deploys/6a4c99867ca3ed00089d5ce3
😎 Deploy Preview https://deploy-preview-5176--base-ui.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.
🤖 Make changes Run an agent on this branch

To edit notification comments on pull requests, go to your Netlify project configuration.

@atomiks
atomiks marked this pull request as ready for review July 7, 2026 06:19
@atomiks
atomiks merged commit ddc1a4a into mui:master Jul 10, 2026
23 checks passed
@atomiks
atomiks deleted the claude/objective-bardeen-298e8e branch July 10, 2026 08:06
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

component: checkbox Changes related to the checkbox component. component: radio group Changes related to the radio group component. component: switch Changes related to the switch component. type: bug It doesn't behave as expected.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[checkbox] onClick stopPropagation() not working inside Checkbox

1 participant