Using a theme file generated from styled-dictionary with vanilla-extract

[hayawata3626]

I am uncertain about whether to use @vanilla-extract/css for the following scenario.

Currently, we are distributing design tokens using style-dictionary, which generates outputs like CSS variables and theme.ts. Below is a portion of the theme.ts file.

When attempting to use the generated theme by passing it as an argument to createGlobalTheme, I encounter the following type error:

Argument of type '{ readonly font: { readonly title: { readonly l: { readonly fontSize: 32; readonly textDecoration: "none"; readonly fontFamily: "Noto Sans JP"; readonly fontWeight: 400; readonly fontStyle: "normal"; readonly fontStretch: "normal"; ... 4 more ...; readonly textCase: "none"; }; readonly m: { ...; }; readonly s: { ......' is not assignable to parameter of type 'Tokens'.

Error at the relevant line:

export const vars = createGlobalTheme(':root', theme);

What is the reason createGlobalTheme does not accept number types, etc.?

[hayawata3626]

This may be same with #1040
So I will close this discussion.

[ancashoria]

Hey, did you manage to solve this?