Skip to content

fix(CheckboxInput): hardening — swarm findings - #769

Merged
josephfarina merged 2 commits into
mainfrom
navi/hardening/checkboxinput
Mar 24, 2026
Merged

fix(CheckboxInput): hardening — swarm findings#769
josephfarina merged 2 commits into
mainfrom
navi/hardening/checkboxinput

Conversation

@josephfarina

@josephfarina josephfarina commented Mar 20, 2026

Copy link
Copy Markdown
Contributor

Hardening fixes for CheckboxInput based on CC review.

Changes

  • Fix token imports: typeScaleVarstextSizeVars, add lineHeight and fontWeight to description style
  • Sync native input.indeterminate DOM property via callback ref (screen readers like NVDA/JAWS read the native property, not just aria-checked)
  • Fix hover style leak on disabled checkboxes (border/background hover variants were not overridden in disabled state)
  • Remove redundant checked/disabled state classes from xdsClassName (CSS can target :checked/:disabled pseudo-classes directly)
  • Add tests for indeterminate state and error status

Screenshots

State Preview
Default default
Checked checked
Indeterminate indeterminate
Disabled disabled
Disabled Checked disabled-checked
Status Variations status
Size Comparison sizes
All Variations all

@meta-cla meta-cla Bot added the CLA Signed This label is managed by the Meta Open Source bot. label Mar 20, 2026
@josephfarina

This comment was marked as resolved.

- Extend XDSBaseProps (adds xstyle, className, style)
- Wire up mergeProps on root div and visual checkbox
- Add xdsClassName('checkbox') on visual checkbox for theme targeting
- Guard onChange when isBusy (prevents double-action during async)
- Add prefers-reduced-motion on checkbox transition (0.01s)
- Add lineHeight and fontWeight to description style
- Center checkbox with label+description (alignItems center, remove marginTop nudges)
- Remove dead labelWrapperSizeStyles
- Fix ref JSDoc
- Update docs: add 10 missing props, fix sibling->ancestor selector note,
  add features for async/status/sizes, update all three doc exports

Hardening: #718
@josephfarina
josephfarina force-pushed the navi/hardening/checkboxinput branch from f2f56f2 to 33bcebc Compare March 23, 2026 23:05
@github-actions

github-actions Bot commented Mar 23, 2026

Copy link
Copy Markdown
Contributor

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

Modified Components

CheckboxInput · View in Storybook
Metric Before After Delta
Bundle Size (ESM) N/A 504B N/A
Lines of Code N/A 390 -
Complexity N/A Very High (36) -

Bundle Size Summary

Package Size (ESM) Size (CJS) Gzipped
@xds/core 11.0KB 17.6KB 2.7KB

Accessibility Audit

Status: No accessibility violations detected.


Generated by PR Enrichment workflow | Storybook | Sandbox | View full report

@josephfarina
josephfarina force-pushed the navi/hardening/checkboxinput branch 5 times, most recently from 3788afe to cd85012 Compare March 23, 2026 23:27
@josephfarina
josephfarina force-pushed the navi/hardening/checkboxinput branch from cd85012 to 3624bb9 Compare March 23, 2026 23:37
@josephfarina
josephfarina marked this pull request as ready for review March 23, 2026 23:40
@josephfarina
josephfarina requested a review from cixzhang as a code owner March 23, 2026 23:40
@josephfarina
josephfarina merged commit 66a958e into main Mar 24, 2026
13 checks passed
@cixzhang
cixzhang deleted the navi/hardening/checkboxinput branch April 9, 2026 14:33
cixzhang pushed a commit that referenced this pull request Apr 26, 2026
* fix(CheckboxInput): hardening — swarm findings

- Extend XDSBaseProps (adds xstyle, className, style)
- Wire up mergeProps on root div and visual checkbox
- Add xdsClassName('checkbox') on visual checkbox for theme targeting
- Guard onChange when isBusy (prevents double-action during async)
- Add prefers-reduced-motion on checkbox transition (0.01s)
- Add lineHeight and fontWeight to description style
- Center checkbox with label+description (alignItems center, remove marginTop nudges)
- Remove dead labelWrapperSizeStyles
- Fix ref JSDoc
- Update docs: add 10 missing props, fix sibling->ancestor selector note,
  add features for async/status/sizes, update all three doc exports

Hardening: #718

* use 0s instead of 0.01s for reduced-motion duration
cixzhang pushed a commit that referenced this pull request Jun 21, 2026
* fix(CheckboxInput): hardening — swarm findings

- Extend XDSBaseProps (adds xstyle, className, style)
- Wire up mergeProps on root div and visual checkbox
- Add xdsClassName('checkbox') on visual checkbox for theme targeting
- Guard onChange when isBusy (prevents double-action during async)
- Add prefers-reduced-motion on checkbox transition (0.01s)
- Add lineHeight and fontWeight to description style
- Center checkbox with label+description (alignItems center, remove marginTop nudges)
- Remove dead labelWrapperSizeStyles
- Fix ref JSDoc
- Update docs: add 10 missing props, fix sibling->ancestor selector note,
  add features for async/status/sizes, update all three doc exports

Hardening: #718

* use 0s instead of 0.01s for reduced-motion duration
cixzhang pushed a commit that referenced this pull request Jun 21, 2026
* fix(CheckboxInput): hardening — swarm findings

- Extend XDSBaseProps (adds xstyle, className, style)
- Wire up mergeProps on root div and visual checkbox
- Add xdsClassName('checkbox') on visual checkbox for theme targeting
- Guard onChange when isBusy (prevents double-action during async)
- Add prefers-reduced-motion on checkbox transition (0.01s)
- Add lineHeight and fontWeight to description style
- Center checkbox with label+description (alignItems center, remove marginTop nudges)
- Remove dead labelWrapperSizeStyles
- Fix ref JSDoc
- Update docs: add 10 missing props, fix sibling->ancestor selector note,
  add features for async/status/sizes, update all three doc exports

Hardening: #718

* use 0s instead of 0.01s for reduced-motion duration
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

CLA Signed This label is managed by the Meta Open Source bot.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant