digdir / designsystemet

Designsystemet
https://designsystemet.no
MIT License
68 stars 34 forks source link

feat: add the @digir/create-tokens CLI tool #2126

Closed unekinn closed 6 days ago

unekinn commented 2 weeks ago

Resolves #2084

Example run

image

The output of that run can be found in this repository

unekinn commented 2 weeks ago

We'll probably move this in under cli and expose it as an init command (or/and @designsystemet/create-tokens)

Yes, I was thinking that this was probably a good idea, with a thin wrapper for use with npm init if you want it. The difference between npm init @digdir/tokens and npx @digdir/designsystemet create-tokens or whatever is pretty insignificant, both need to be discovered in documentation anyway, so the npm init wrapper isn't really necessary

I see we also have to find a good way to keep our template updated 🤔

Agreed! It would be nice to have a source of truth for the token structure (for the theme builder, this tool, and the template repo -- possibly other tools as well?). As a stopgap, you could conceivably regenerate the template repo using this tool 🤔 The output will be slighly different, as the themes will be named "Theme" and "Theme2". If you add some CLI parameters which skip interactive questions, it could be automated in a Github workflow.

mimarz commented 1 week ago

I see we also have to find a good way to keep our template updated 🤔

Agreed! It would be nice to have a source of truth for the token structure (for the theme builder, this tool, and the template repo -- possibly other tools as well?). As a stopgap, you could conceivably regenerate the template repo using this tool 🤔 The output will be slighly different, as the themes will be named "Theme" and "Theme2". If you add some CLI parameters which skip interactive questions, it could be automated in a Github workflow.

Yeah, we are still exploring this field. Them same goes for output in terms of transformed tokens to say css variables. Styled Dictionary came out with a new feature (exportPlatform) 2-3 weeks ago actually that will make the latter much easier for sharing the logic between tools!

unekinn commented 1 week ago

@mimarz I moved the code into packages/cli, adding an init command, while keeping packages/create-tokens. You can decide if you want to keep the latter or not :)

mimarz commented 1 week ago

@mimarz I moved the code into packages/cli, adding an init command, while keeping packages/create-tokens. You can decide if you want to keep the latter or not :)

Wicked, thanks! This will help a lot.

Yeah, I haven't had the time to look at it yet, since theres been a lot of new edge-cases to solve with multiple typography and "dimensions" support.

Not sure if we'll make it ready for tomorrows demo, but we can always save it for the next one! We have quite a lot of new stuff prepared for tomorrow :)