Theme Names as input for Tokens Transformer

[wavestyle]

Is your feature request related to a problem? Please describe. We are exploring the pro version. Currently we have to pass a list of sets as parameter to the transformer for each of our themes. To do this, we manually read the $themes.json file and pass the sets listed for each theme by hand as a parameter to the transformer. Since we plan to have 50+ themes, this will not scale at all.

Describe the solution you'd like Add a new command line parameter "theme" for token transformer. The theme name will be looked up automatically in $themes.json and the transformer retrieves the list of sets to transform from that file.

Describe alternatives you've considered Writing a script that reads the $themes.json file and runs the transformer for each theme with the right list of sets.

Additional context none

[wavestyle]

Instead of specifying the theme names on the command line: As a first step we could add a flag that automatically creates one json output file for each theme found in $themes.json. I assume that most of the time we need to transform all themes anyways.

[six7]

That is exactly how we were hoping that the $themes file will be used, adding this to token-transformer should be pretty straightforward.

When used in a single-file environment and the --theme flag is set, look up the $theme key and use the configuration stored there to create various outputs. I'd say we output to ${themename}.json

When used in a multi-file environment (and you pass it a folder as input) and the --theme flag is set, look for the $themes.json file in the root of the folder.

[forceofseth]

Hi @six7 as our team will need this feature really soon. I'd suggest that we can do the implementation and open a PR for it as soon as we are done.

[six7]

Hi @six7 as our team will need this feature really soon. I'd suggest that we can do the implementation and open a PR for it as soon as we are done.

That sounds great! If you need any pointers let me know, the token-transformer code lives in this repository in its own folder and consumes some of the plugin functions.

[thomasmattheussen]

Hi @forceofseth, just checking to see if this is something you're actively working on? :)

[forceofseth]

Hi @thomasmattheussen Yes I am. Will open a PR for this feature in the coming days.

[forceofseth]

That is exactly how we were hoping that the $themes file will be used, adding this to token-transformer should be pretty straightforward.

When used in a single-file environment and the --theme flag is set, look up the themekeyandusetheconfigurationstoredtheretocreatevariousoutputs.I′dsayweoutputto{themename}.json

When used in a multi-file environment (and you pass it a folder as input) and the --theme flag is set, look for the $themes.json file in the root of the folder.

@six7 can you elaborate the part with the single file environment? What do you mean by $theme key? An Environment var?

[wavestyle]

The plugin can either store all tokens in one single file or it can split it up into multiple files. In this case each set is a .json file. I only gave you multi-file examples so far, but I can point you to a single-file example so that you see the difference.

[Nikkelmann]

Until the PR is done, here is my quick implementation that we use in our gulp setup, in case someone else might need it:

function readJsonFile(file) {
    const fileContent = fs.readFileSync(file, { encoding: 'utf8', flag: 'r' });
    return JSON.parse(fileContent);
}

function getThemeTokenSets(themeName) {
    const themes = readJsonFile('$themes.json');
    const sets = Object.entries(themes.find(theme => theme.name === themeName).selectedTokenSets)
        .filter(set => set[1] !== 'disabled')
        .map(set => set[0]);

    return sets;
}

[forceofseth]

Opend a PR today.

[six7]

Closing this as we shipped the PR of @forceofseth a while ago but forgot to close this issue.