mark-nicepants / figma2flutter

Converts design token json files to flutter
Apache License 2.0
17 stars 16 forks source link

[BUG] Alpha modifier/transformer not working #14

Open LegendAF opened 7 months ago

LegendAF commented 7 months ago

:information_source: Info

Version: figma2flutter: ^0.2.0-alpha

:speech_balloon: Description

While attempting to use the alpha modifier, the hex output always seems to be the same. However when I use lighten, the end hex value always changes.

:scroll: tokens file you tried to import

          "low2": {
            "value": "#000000",
            "type": "color",
            "$extensions": {
              "studio.tokens": {
                "modify": {
                  "type": "alpha",
                  "value": "0.5",
                  "space": "srgb"
                }
              }
            }
          },

vs

          "low2": {
            "value": "#000000",
            "type": "color",
            "$extensions": {
              "studio.tokens": {
                "modify": {
                  "type": "alpha",
                  "value": "1",
                  "space": "srgb"
                }
              }
            }
          },

The output is always the same. Is it user error?

freemansoft commented 1 month ago

I wrote a unit test that shows this doesn't work.

It looks like the only modification type currently supported are lighten, darken, mix if I'm reading color_transformer.dart correctly

` @override String transform(Token token) { final value = token.value;

ColorValue? colorValue = ColorValue.maybeParse(value);
if (colorValue == null) {
  throw Exception('Invalid color value: $value');
}

if (token.hasExtensions) {
  final modify = token.extensions?['studio.tokens']?['modify'];
  if (modify != null) {
    final type = modify['type'];
    final value = double.tryParse(modify['value'] as String? ?? '0');
    final color = modify['color'] as String?;

    if (value != null && value != 0) {
      if (type == 'lighten') {
        colorValue = colorValue.lighten(value / 2);
      } else if (type == 'darken') {
        colorValue = colorValue.darken(value / 2);
      } else if (color != null && type == 'mix' && color.startsWith('#')) {
        colorValue = colorValue.mix(color, value);
      }
    }
  }
}

return colorValue.declaration();

}

`

freemansoft commented 2 weeks ago

This is fixed on main and in the next release whenever that is.