[Feature] Integrate VADS and USWDS tokens

narin commented 5 months ago

Ticket #7425 and #119

Description of Change

Updates style-dictionary config to generate tokens from css-library's variables.json rather than our own copy of the color tokens
Replace base.json with uswds.json which contains USWDS colors missing from VADS.
- Note: Technically VADS is has these colors in their repo but is currently filtering them out. We originally made a PR to css-library that requests the addition of these missing colors, however VADS has a policy that any USWDS colors added also needs semantic names. See Slack thread. There is an outstanding ticket to create these semantic names, however we won't be getting to them in the immediate future as per @jessicawoodin. For now, we'll add them manually into uswds.json to unblock this work.
Adds some custom formatting and filtering functions to our style-dictionary build.js to clean up some token names, filter out colors, and handle the token exports explained more below
Updates the export of our color tokens into a single named Colors variable. This will allow us to import { Colors } from '@department-of-veterans-affairs/mobile-tokens' and reference them using Colors.BlueVivid60 instead of the previously more verbose DesignTokens.colorUswdsSystemColorBlueVivid60.
- Follow-up PR to update the components once we've published the new tokens version here
Updates the TypeScript declaration generated so that we can have autocomplete for each of the available color tokens
This ticket also closes #119 since we're pulling from from the latest colors in `@department-of-veterans-affairs/css-library@0.3.1

Testing Packages

N/A (tested in components package using local reference to tokens package)

Screenshots/Video

N/A

Testing

[x] Tested on iOS
[x] Tested on Android
[x] Tested on Web

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:

[x] Merge main into branch
[x] Merge branch to main
[x] Publish new version after merging

TimRoe commented 5 months ago

A few general PR comments/questions:

Added changelog tag
Was no testing done to validate the typing changes work as intended? Or was it done locally via the workspace?
For the AC: "Can the above be automated in GitHub Actions?" would that effectively be covered if/when we add dependabot if it was against the VADS css-library? Or was that just meaning the already existing build jobs for publishing/Figma?

Edit, knew I was forgetting one but couldn't remember until posting:

Did this resolve the other ticket in the sprint that you thought it would? If so, link that ticket to the PR also