@bcgov/design-tokens@v3.0.0

npm

https://www.npmjs.com/package/@bcgov/design-tokens/v/3.0.0

Changelog

3.0.0

Changed

• (breaking) Many tokens have been renamed to bring the generated tokens in line with the intended token names from Figma
• (breaking) brand color tokens renamed to theme to differentiate from BC Visual Identity Program
• (breaking) gold color scale values reworked to be lighter
• (breaking) label font size changed from 0.875rem to 0.75rem
• (breaking) surface group tokens referring to colors now include component names (button, form, menu)
• (breaking) surface.border.light color renamed to surface.color.border.default
• (breaking) borderRadius moved from surface group to layout group
• (breaking) File names for JavaScript tokens are renamed from variables.js to index.js for shorter import statements
• Tokens in layout group use rem equivalent of previous px values where possible in Figma

Added

• primaryBlue (equal to blue100) and primaryGold (equal to gold100) dedicated color tokens added
• smallBody font size added at 0.875rem (the old label size)
• xxxdense line height added
• CommonJS variables are included in cjs and cjs-prefixed directories (with and without the bcds prefix) in addition to the existing ESM variables in js and js-prefixed directories
• TypeScript type definitions are shipped with the JavaScript tokens
• Heading level 6 typography group tokens added

Removed

• (breaking) Removed surface.size (legacy testing tokens)
• (breaking) Removed surface.borderRadius (these were duplicates from the layout group)