Inconsistent support for alpha colors

[blackfalcon]

In my JSON I have the following

      "ui-opacity-20": {
        "value": "0074C833",
        "comment": "base UI color @ 20%"
      },

The purpose of this is to apply alpha transparency using an 8 character hex.

The CSS output looks like this

--color-ui-disabled-on-light: rgba(0, 116, 200, 0.2);

This is great. But, now I need to generate data to build documentation. When I output a JavaScript file, I get this

      "disabled": {
        "onLight": {
          "value": "#0074c8",

Here, instead of getting back the 8 character hex or the RGBA, I get a standard hex.

To make matters worse, if I try to use an RGBA value ...

      "ui-opacity-20": {
        "value": "rgba(0, 116, 200, 0.2)",
        "comment": "base UI color @ 20%"
      },

The data still comes back with a standard hex

      "disabled": {
        "onLight": {
          "value": "#0074c8",

[dbanksdesign]

I believe this has to do with different color transforms being applied, it looks like the javascript file is using the color/hex transform and the css file is using the color/css one. The color/hex one uses tinycolor's toHexString() method which looks to always return a 6-digit hex regardless of if the input color has transparency. The color/css does a bit of logic to see if the color has an transparency and uses different methods accordingly:

      var color = Color(prop.value);
      if (color.getAlpha() === 1) {
        return color.toHexString();
      } else {
        return color.toRgbString();
      }

There could be a few ways to fix this,

1. Update the 'js' transformGroup (and other transform groups that use color/hex) to use the color/hex8 transform instead of color/hex, then it will always return an 8-digit hex value. We could add a note that color/hex transform will always output a 6-digit hex regardless of transparency. The color/hex transform might still be useful for languages that don't understand 8-digit hex values
2. Update the color/hex transform to use the toHex8String() method and deprecate color/hex8 transform

Also, should we deprecate the color/css transform and just use color/hex8 if CSS understands 8-digit hex codes? That might make it easier all around.

[blackfalcon]

I went down the route of updating the transformGroup, but really wanted to point out that there is an issue with expected default behavior.

[chazzmoney]

@dbanksdesign lets clean this too