number values don't work with outputReferences

[mduenias]

Hi,

I found out that outputReferences does not work when the value is a number that has not gone through a transform. This is because the value needs to be a string for outputReferences to work. During a transform, the number is turned into a string, so it works for values that go through transforms.

Therefore my workaround was to use my number values as strings:

"typography": {
    "font": {
      "weight": {
        "normal": { "value": "400" },
        "bold": { "value": "700" }
      }
    }
  }

My question is, is this expected behaviour and I should use my number values as strings? Transforms work well when the numbers are strings, so maybe is just a good practice to write all values as strings.

Or am I doing something wrong?

Thanks

[dbanksdesign]

Generally, it is much easier to work with strings especially when doing references. Numbers do work now (as of 3.7.1, thanks to a bug fix: #825) if they are the ones being referenced. The line you linked is checking if the value it is trying to output the references on is a string, but it could be a string that references numbers. Just make sure you are on the latest, we just fixed this bug like a week ago. Here is a quick example:

https://stackblitz.com/edit/style-dictionary-example-jteuff?file=build/_variables.css

[mduenias]

Hi, sorry for my late reply. Thanks for your suggestion, I have updated to the latest version.

By reading my previous comment I noticed is a bit hard to understand so I updated the example to show what I meant. I was able to replicate with the current version.

Hope this example makes sense :D
https://stackblitz.com/edit/style-dictionary-example-5kqizf?file=build/_variables.css

I don't know if this is an issue, but to circumvent the problem, I use my numbers as strings when I will be referencing them from other tokens. Feel free to close this issue if you consider is not a bug, but the expected behaviour.

Thanks

[jorenbroekema]

This was fixed in SD v4 and also in v3 I believe: https://github.com/amzn/style-dictionary/commit/8021ec0c914d904333cdcc063a4e34c49d2db418