Skip to content

CSS Modules:migrate wonder-blocks-button#2959

Draft
jandrade wants to merge 1 commit intoexp-cssm-corefrom
exp-cssm-button
Draft

CSS Modules:migrate wonder-blocks-button#2959
jandrade wants to merge 1 commit intoexp-cssm-corefrom
exp-cssm-button

Conversation

@jandrade
Copy link
Copy Markdown
Member

Summary:

  • Replace Aphrodite StyleSheet.create with CSS Modules for Button, ButtonCore, ButtonUnstyled, and ActivityButton.
  • Use CSS custom properties for dynamic variant values (colors, borders per actionType/kind/size).

Co-Authored-By: Claude Opus 4.6 noreply@anthropic.com

Issue: WB-XXXX

Test plan:

Verify that the button components are styled correctly with the new CSS Modules
and CSS custom properties.

…utton

Replace Aphrodite StyleSheet.create with CSS Modules and CSS custom
properties for Button, ButtonCore, ButtonUnstyled, and ActivityButton.
Static structural styles are in .module.css files, dynamic variant
values (colors, borders per actionType/kind/size) are set as CSS
custom properties via getButtonVars/getActivityButtonVars utilities.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
@jandrade jandrade self-assigned this Feb 10, 2026
@changeset-bot
Copy link
Copy Markdown

changeset-bot bot commented Feb 10, 2026

⚠️ No Changeset found

Latest commit: b769784

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@github-actions
Copy link
Copy Markdown
Contributor

Size Change: +203 B (+0.17%)

Total Size: 118 kB

Filename Size Change
packages/wonder-blocks-button/dist/es/index.js 4.17 kB -80 B (-1.88%)
packages/wonder-blocks-dropdown/dist/es/index.js 20 kB +283 B (+1.44%)
ℹ️ View Unchanged
Filename Size
packages/wonder-blocks-accordion/dist/es/index.js 3 kB
packages/wonder-blocks-announcer/dist/es/index.js 1.74 kB
packages/wonder-blocks-badge/dist/es/index.js 2.02 kB
packages/wonder-blocks-banner/dist/es/index.js 2.01 kB
packages/wonder-blocks-birthday-picker/dist/es/index.js 1.91 kB
packages/wonder-blocks-breadcrumbs/dist/es/index.js 755 B
packages/wonder-blocks-card/dist/es/index.js 1.08 kB
packages/wonder-blocks-cell/dist/es/index.js 2.18 kB
packages/wonder-blocks-clickable/dist/es/index.js 2.6 kB
packages/wonder-blocks-core/dist/es/index.js 2.58 kB
packages/wonder-blocks-data/dist/es/index.js 5.48 kB
packages/wonder-blocks-date-picker/dist/es/index.js 6.38 kB
packages/wonder-blocks-form/dist/es/index.js 6.3 kB
packages/wonder-blocks-grid/dist/es/index.js 1.24 kB
packages/wonder-blocks-icon-button/dist/es/index.js 4 kB
packages/wonder-blocks-icon/dist/es/index.js 1.91 kB
packages/wonder-blocks-labeled-field/dist/es/index.js 3.47 kB
packages/wonder-blocks-layout/dist/es/index.js 1.63 kB
packages/wonder-blocks-link/dist/es/index.js 1.53 kB
packages/wonder-blocks-modal/dist/es/index.js 7.21 kB
packages/wonder-blocks-pill/dist/es/index.js 1.31 kB
packages/wonder-blocks-popover/dist/es/index.js 4.32 kB
packages/wonder-blocks-progress-spinner/dist/es/index.js 1.48 kB
packages/wonder-blocks-search-field/dist/es/index.js 1.1 kB
packages/wonder-blocks-styles/dist/es/index.js 464 B
packages/wonder-blocks-switch/dist/es/index.js 1.55 kB
packages/wonder-blocks-tabs/dist/es/index.js 5.57 kB
packages/wonder-blocks-testing-core/dist/es/index.js 3.25 kB
packages/wonder-blocks-testing/dist/es/index.js 978 B
packages/wonder-blocks-theming/dist/es/index.js 384 B
packages/wonder-blocks-timing/dist/es/index.js 1.37 kB
packages/wonder-blocks-tokens/dist/es/index.js 4.95 kB
packages/wonder-blocks-toolbar/dist/es/index.js 906 B
packages/wonder-blocks-tooltip/dist/es/index.js 6.02 kB
packages/wonder-blocks-typography/dist/es/index.js 1.57 kB

compressed-size-action

@github-actions
Copy link
Copy Markdown
Contributor

A new build was pushed to Chromatic! 🚀

https://5e1bf4b385e3fb0020b7073c-qqxoqbprbb.chromatic.com/

Chromatic results:

Metric Total
Captured snapshots 395
Tests with visual changes 0
Total stories 816
Inherited (not captured) snapshots [TurboSnap] 77
Tests on the build 472

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant