design-tokens
design-tokens copied to clipboard
lukasoppermann
Doesn't preserve camel casing in export
I have, for instance, a figma token called brandPrimary, but when it gets exported out to the file, it saves as brandprimary, lowercasing the P. I messed with the casing option and it doesn't do it correctly in any case.
Hey @SteveAtKlover,
can you give me more details?
So you are using the "standard" token format? And you have set the name conversion option to camelCase but still get the converted version, correct?
@lukasoppermann yeah, i use the standard format, and tried default as well as camel case.
when the file spits out, a figma token that is brandPrimary gets exported as brandprimary.
Hey, you are right and this is a bug.
Currently the code just lowercases everything and merges words where you have spaces and uppercases the first letter. This does remove already existing camelCase names.
Another issue I ran across is that emojis like 😅 produce an error when camelCasing which breaks the plugin.
Would you be able to send a PR to address the issues?
Awesome, reach out any time if you have questions.
The conversion happens here: https://github.com/lukasoppermann/design-tokens/blob/main/src/utilities/transformName.ts
The module is than used here: https://github.com/lukasoppermann/design-tokens/blob/main/src/utilities/groupByName.ts
I think there are two things:
- Fixing the camelCase: https://github.com/lukasoppermann/design-tokens/blob/main/src/utilities/transformName.ts#L10-L20
- Changing the guard: https://github.com/lukasoppermann/design-tokens/blob/main/src/utilities/transformName.ts#L1-L8 here it would probably be better to try to convert, if it fails we should try to return the original and only throw if this fails as well, what do you think?
Any update on this issue? Existing camelCase just needs to be passed through
