Expose semantic color tokens to the component library to be used on vets-website as utility classes

[josephrlee]

Bug Report

• [X] I’ve searched for any related issues and avoided creating a duplicate issue.

What happened

Trying to use a semantic color token vads-u-color--warning-dark to apply to an icon using what's available in the DST documentation, but it doesn't seem to be available via the component library.

Here is the slack thread for the background convo.

What I expected to happen

I expect to be able to use the vads-u-color--warning-dark as a class like this like I can with the rest of the Foundation colors:

<!-- TODO: Change to va-icon in production -->
<i aria-hidden="true" class="fas fa-exclamation-triangle fa-md vads-u-margin-right--0p5 vads-u-color--warning-dark"></i>

I'd like to have all the semantic colors added to the utilities so that I can use them as utility classes to style a component.

Reproducing

• Formation version:
• Device: (e.g. iPhone 8, Macbook)
• Browser: (e.g. Firefox, IE 11)

Steps to reproduce:

1. Try to apply a semantic color class as a utility class to style a component.

Urgency

How urgent is this request? Please select the appropriate option below and/or provide details

• [ ] This bug is blocking work currently in progress
• [x] This bug is affecting work currently in progress but we have a workaround
• [ ] This bug is blocking work planned within the next few sprints
• [ ] This bug is not blocking any work
• [ ] Other

Details

[caw310]

Hey team! Please add your planning poker estimate with Zenhub @Andrew565 @ataker @harshil1793 @it-harrison @jamigibbs @micahchiang @nickjg231 @powellkerry @rmessina1010 @rsmithadhoc

[micahchiang]

This ticket is really about adding a new map to this file where names are semantic and values are existing scss variables