fix: Button dark mode, decouple from Constants, add stories#6917
Draft
talissoncosta wants to merge 1 commit intochore/design-system-tokensfrom
Draft
fix: Button dark mode, decouple from Constants, add stories#6917talissoncosta wants to merge 1 commit intochore/design-system-tokensfrom
talissoncosta wants to merge 1 commit intochore/design-system-tokensfrom
Conversation
Replace Constants.colours lookup with inline iconColours map that references semantic CSS custom properties (--color-brand-default, --color-text-on-fill) with hex fallbacks. This removes Button's dependency on common/constants, unblocking Storybook story rendering. Add Button stories covering all themes, sizes, icons, states, and link variants. Refs #6892 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
42b4c1e to
87a4eae
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Thanks for submitting a PR! Please check the boxes below:
docs/if required so people know about the feature.Changes
Contributes to #6892
Button decoupled from Constants
import Constants from 'common/constants'fromButton.tsxConstants.colourslookup with inlineiconColoursmap using semantic CSS custom properties (--color-brand-default,--color-text-on-fill) with hex fallbackscommon/project.jsandcommon/data/base/_data.js(CJS files that break in Storybook 10's ESM environment)Storybook stories
Button.stories.tsxwith stories: All themes, All sizes, Theme x Size matrix, With icons, States, As link (href)<Button>component (not raw HTML replicas)Still TODO (on this branch)
_buttons.scssto use semantic tokens instead of raw SCSS variablesbtn-tertiary,btn-danger,btn--transparentdark mode gapsHow did you test this code?
npm run storybook— all Button stories render in both light and dark modenpx eslint --fix— no lint errorsiconLeftColour='white',iconLeftColour='white',iconRightColour='primary') are type-safe and unchanged in behaviour🤖 Generated with Claude Code