AlaskaAirlines / AuroDesignTokens

Abstract UI atomic values to support the Auro Design System.

Home Page:https://auro.alaskaair.com/getting-started/developers/design-tokens

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Change Auro prefix to "ds"

blackfalcon opened this issue · comments

Is your feature request related to a problem? Please describe.

Currently, the Auro Design Tokens are all exported with "prefix": "auro", as a config setting. This prefix is then set to all output tokens, e.g. var(--auro-color-base-black)

This presents an issue when creating additional token libraries for individual themes. E.g. it's just weird if the Jetstream design tokens all have the auro prefix.

Describe the solution you'd like

A recommended solution is to remove the auro prefix and replace it with something more generic like ds to clearly represent the CSS, Sass or JS variable as being exported from a 'design system'.

Describe alternatives you've considered

Another option is to use dst for 'design system token'.

Lastly, removing the prefix was discussed, but that felt like it would add confusion to our users as they cannot quickly tell the difference between an internal token and one coming from an external library.

Also, just removing the name can create a scenario of naming clashes. E.g. if we change var(--auro-color-base-black) to var(--color-base-black) we have no way of knowing if the consuming project also has a CSS variable for var(--color-base-black) and that would cause a UI issue for that team.

Additional context

This update SHOULD be addressed before the step of copying all the design token repo content to the new ITS repo.

https://github.com/Alaska-ITS/JetstreamDesignTokens

Exit criteria

This issue will be completed once all the prefix values in the config.json file have been updated from auro to ds.

This work will constitute a BREAKING CHANGE. Please note this in the commit comment body.