Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Streamline use of metadata/preview tokens #2920

Open
mimarz opened this issue Dec 19, 2024 · 0 comments
Open

Streamline use of metadata/preview tokens #2920

mimarz opened this issue Dec 19, 2024 · 0 comments
Labels
🖥️ storefront designsystemet.no 🎨 theme-builder Everything related to our theme builder $ tokens Everything related to tokens and Work related to @digdir/designsystemet-theme

Comments

@mimarz
Copy link
Collaborator

mimarz commented Dec 19, 2024

This needs to be done soonish as we have copied built tokens values and variable names. This is very brittle as if anything changes due to changes in naming, theme-builder breaks and we manually have to figure out where things are out of sync.

We need a common place or portable way to distribute metadata for our formatted tokens. Which variable name, value, grouping etc.

We currently have a separate build script for building "preview tokens" that outputs this in our Storefront but we also need this information in the theme-builder for preview theming purposes.

Suggested actions:

  • Review if use of https://v4.styledictionary.com/reference/api/#formatallplatforms can help instead of our custom format. If its to much work, save it for a separate issue. We should still be able to get this done using todays format.
  • Find a common place for metadata/preview tokens to live (the ts tokens output from --preview),
  • Search the theme-builder where metadata tokens should be used instead of copy-paste values.
    • apps/theme/components/BorderRadius/BorderRadius.tsx
    • apps/theme/utils/tokenMapping.ts
@mimarz mimarz added the $ tokens Everything related to tokens and Work related to @digdir/designsystemet-theme label Dec 19, 2024
@mimarz mimarz added this to the V1 - Must-have milestone Dec 19, 2024
@mimarz mimarz moved this to 🔵 Inbox in Team Design System Dec 19, 2024
@mimarz mimarz changed the title Update Theme builder to use formatted in js tokens Streamline use of metadata/preview tokens Dec 19, 2024
@mimarz mimarz added 🖥️ storefront designsystemet.no 🎨 theme-builder Everything related to our theme builder labels Dec 19, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🖥️ storefront designsystemet.no 🎨 theme-builder Everything related to our theme builder $ tokens Everything related to tokens and Work related to @digdir/designsystemet-theme
Projects
Status: 🔵 Inbox
Development

No branches or pull requests

1 participant