You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Similar to #333 ,
When composing components via styled(Component, {...}), the variants don't seem to extend or be passed to the original styled component. In the code sandbox (https://codesandbox.io/s/hardcore-chatterjee-lktnos?file=/src/components/Button.tsx)
For Button, we're passing all the props to the styled Button component, and then composing it in StyledButton. Unfortunately, it appears that the align variant isn't being passed to Button IF variants is declared in StyledButton.
So essentially, if a composed element has the same variant name, it just doesn't pass it down to the original component.
A clear and concise description of what the bug is.
To Reproduce
Steps to reproduce the behavior, please provide code snippets or a repository:
Look at how the props in Button aren't passing variants.
Comment out the variants in StyledButton.
See how the props are now passing the align variant in Button.tsx
Expected behavior
We'd like for the extended variant to pass onto the original styled component. In the example above, Button.tsx should have been passed the align prop even when it's declared in StyledButton.tsx and it should have extended the styles in StyledButton.
System information
OS: macOS
Browser: chrome
Version of Stitches: 1.2.8 (latest)
Version of Node.js: v18
Additional context
System information may not be as relevant since it's reproducible in the code sandbox.
The text was updated successfully, but these errors were encountered:
Bug report
Describe the bug
Similar to #333 ,
When composing components via
styled(Component, {...})
, the variants don't seem to extend or be passed to the original styled component. In the code sandbox (https://codesandbox.io/s/hardcore-chatterjee-lktnos?file=/src/components/Button.tsx)For Button, we're passing all the props to the styled Button component, and then composing it in
StyledButton
. Unfortunately, it appears that thealign
variant isn't being passed toButton
IFvariants
is declared inStyledButton
.So essentially, if a composed element has the same variant name, it just doesn't pass it down to the original component.
A clear and concise description of what the bug is.
To Reproduce
Steps to reproduce the behavior, please provide code snippets or a repository:
Button
aren't passingvariants
.variants
inStyledButton
.Button.tsx
Expected behavior
We'd like for the extended variant to pass onto the original styled component. In the example above,
Button.tsx
should have been passed thealign
prop even when it's declared inStyledButton.tsx
and it should have extended the styles inStyledButton
.System information
Additional context
System information may not be as relevant since it's reproducible in the code sandbox.
The text was updated successfully, but these errors were encountered: