Token-Transformer: type=others

[AndySobol]

Hi all! I'm having a problem assigning the correct type to design tokens.

I have the following source code with tokens:

{
    "color": {
        "red":"hsla(360, 86%, 56%, 1)",
        "danger":"{color.red}",
        "error":"{color.danger}"
    }
}

I expect to see the following transformation:

{
  "red": {
    "value": "#ef2e2e",
    "type": "color"
  },
  "danger": {
    "value": "{color.red}",
    "type": "color"
  },
  "error": {
    "value": "{color.danger}",
    "type": "color"
  }
}

How it works in the figma token plugin itself

but unfortunately I get the following code:

{
  "red": {
    "value": "#ef2e2e",
    "type": "other"
  },
  "danger": {
    "value": "{color.red}",
    "type": "other",
    "failedToResolve": true
  },
  "error": {
    "value": "{color.danger}",
    "type": "other",
    "failedToResolve": true
  }
}

I don't quite understand what I'm doing wrong, please help

[six7]

I think you copied the json directly from the plugin, right?

Token-transformer expects the parent keys to be the first level. If you click Export you are able to export that json how you require it. Make sure to export a single file and check include parent keys.

[AndySobol]

Hello! No I am writing json tokens in code editor

1. I initially write my token json file in the VSCode editor

2. Next, I convert it to readable for figma token and for style -dictionary look.

Settings are used by default:

"new": "token-transformer tokens/color.json figma/output.json --resolveReferences: true"

Everything works as I need, except that tonen -transformer doesn't correctly assign type. I just expected this script to work the same as in the figma-token plugin. And it works, does mathematical calculations, takes into account variables, but does not apply the type I need

[AndySobol]

I will clarify.

I want to write design tokens in vscode, transform the file with token-transformer and style-dictionary into a working, clean json file.

This file will be synced on the github branch and uploaded to the figma -token

[AndySobol]

Filmed an additional video: https://youtu.be/Cr06kB5TclI

[six7]

Can you try adding "type": "color" to the group of tokens that are colors? That will then transform correctly.

[six7]

Closing this, I don't think this is relevant any longer.