fontWeight type error

[sillyleo]

Hi, thanks for the library! I came from vanilla-extract to macaron for the friendlier setup and variant API.

However, I encountered an issue with typing:

Do you have any idea why I can't assign numbers to the fontWeights? Thanks

[sillyleo]

BTW is there docs for styleVariants?

[p7gg]

I don't think so. But the styleVariants should work exactly like @vanilla-extract/css, so I guess their docs should help you:
https://vanilla-extract.style/documentation/api/style-variants/

[p7gg]

I mean, it doesn't work cuz that is not what the API is expecting, it expects something like this:

type Tokens = {
    [key: string]: string | Tokens;
};

You should just pass the values as strings and it'll work.

fontWeight: {
    normal: '400'
}

[sillyleo]

Thanks! Exactly what I did later.

I found it's by design like this: vanilla-extract-css/vanilla-extract#314 (possibly related?)

[p7gg]

Totally

[Mokshit06]

Hey @sillyleo, font weight should be a string as recommended by @p7gg

[sillyleo]

Hi @Mokshit06 thanks again. Would like to hear your suggestion on the best way to type a component.

Issue

https://github.com/sillyleo/nomimono/blob/main/src/Button/index.tsx

In my setup here, the vite plugin I used to generate/infer type doesn't work. (config)

The type does work in local env (I can get auto-completion and checking). However, the published package doesn't have that.

Is there a recommended setup? For example, import some type definition and extend the type with my own props like Stitches?

Thank!

[Mokshit06]

Hey, thanks for reporting this! macaron doesn't publish types for generated component, though I should add that. It'll get fixed today

[sillyleo]

Oh yes!!

[Mokshit06]

So I looked into this issue and it looks like it will require VE to update some of their internal types. If it gets fixed within a few days then I'll upstream it to macaron, or just reimplement that type for now