The VADS team changed the way they structure their color tokens with css-library 0.5.1 (PR here), adding an additional level of nesting for their semantic colors in variables.json. This PR contains updates to support the new format, clean up figma and JS output, and prepare for semantic token work:
Updates the transform group to use cti in order to support the change in format
Updates filtering and name clean up for JS output
Note: Previously we were filtering out the system name (e.g. Vads or Uswds) and removing other words such as "Color" and "System". Undoing this so that we stay consistent with naming with figma and are able to tell the origin of the token. We will need to update the colors in the components accordingly after we've completed semantic tokens
Fixes figma output with proper typing and aliases (referencing)
Adds sample for semantic and component tokens for @jessicawoodin
Adds new filters for dark and light tokens
Sorts output by key alphabetically
Testing Packages
N/A
Screenshots/Video
N/A
Testing
N/A
PR Checklist
Code reviewer validation:
General
[x] PR is linked to ticket(s)
[x] PR has changelog label applied if it's to be included in the changelog
[x] Acceptance criteria:
All satisfied or
Documented reason for not being performed or
Split to separate ticket and ticket is linked by relevant AC(s)
[x] Above PR sections adequately filled out
[x] If any breaking changes, in accordance with the pre-1.0.0 versioning guidelines: a CU ticket has been created for the VA Mobile App detailing necessary adjustments with the package version that will be published by this ticket
Code
[x] Tests are included if appropriate (or split to separate ticket)
[x] New functions have proper TSDoc annotations
Publish
If changes warrant a new version per the versioning guidelines and the PR is approved and ready to merge:
The tokens will not be published until we've finished the semantic tokens:
Description of Change
The VADS team changed the way they structure their color tokens with css-library 0.5.1 (PR here), adding an additional level of nesting for their semantic colors in
variables.json. This PR contains updates to support the new format, clean up figma and JS output, and prepare for semantic token work:ctiin order to support the change in formatTesting Packages
N/A
Screenshots/Video
N/A
Testing
N/A
PR Checklist
Code reviewer validation:
changeloglabel applied if it's to be included in the changelogPublish
If changes warrant a new version per the versioning guidelines and the PR is approved and ready to merge: The tokens will not be published until we've finished the semantic tokens:
179
270
271
272
178