Variant types from RecipeVariants doesn't work

[gabrieloureiro]

I've this occurrence when i call this property inside the component. This is an issue?

1. styles:
   

2. component:
   

[askoufis]

Your TextVariantSize type isn't what you think it is. It's an object containing a property size that can accept all your size variants xxs, xs, etc., rather than just a union of all your size variants.

I think to fix this you'll want to extract the variants from the recipe type:

type TextVariantSize = Required<NonNullable<RecipeVariants<typeof textStyles>>>['size'];

Alternatively, you could construct your TextProps type in a different way:

Atoms & { as?: AllowedHtmlTags } & RecipeVariants<typeof textStyles>

[gabrieloureiro]

Thank you @askoufis. All typed and working as well.

[askoufis]

Great! Glad I could help.