Shopify / restyle

A type-enforced system for building UI components in React Native with TypeScript.
https://shopify.github.io/restyle/
MIT License
2.95k stars 133 forks source link

Create text variant defaults is not working. #157

Open alphonse92 opened 2 years ago

alphonse92 commented 2 years ago

Restyle components do not use the default styles unless you specify itvariant="defaults" in the props.

My component looks like:


import {
  createRestyleComponent,
  createText,
  createVariant,
  color,
  spacing,
  typography,
  layout,
  createBox,
} from '@shopify/restyle';

export const Link = createRestyleComponent(
  [
    color,
    spacing,
    typography,
    layout,
    createVariant({themeKey: 'linkVariants'}),
  ],
  createText(),
);

The theme object variant looks like:

Screen Shot 2022-05-05 at 3 39 40 PM

Video showing the variant only working when I set variant="defaults"

https://user-images.githubusercontent.com/18203585/167021839-d6354be8-d115-45bd-97b5-bad0ebebf1a1.mov

Version

Screen Shot 2022-05-05 at 3 41 27 PM

More info:

I created a wraper component to inspect the style object passed down by the restyle wraper. As you can see the first two outputs are printed when variant is undefined but the next two outputs shows are printed when variant="defaults"

image

sbalay commented 2 years ago

Hey @alphonse92, could you try the following changes locally and see if they fix this issue? https://github.com/Shopify/restyle/pull/152/files

alexanderblackh commented 2 years ago

Hey @alphonse92, could you try the following changes locally and see if they fix this issue? https://github.com/Shopify/restyle/pull/152/files

I wasn't able to try your solution, however, I can confirm I had a similar issue as the above poster, and downgrading to 2.0.0 solved it for me. When I upgraded to 2.1.0, the app would immediately crash if any Text components were on screen. The error code I got was:

Error: Value 'defaults' does not exist in theme['textVariants']

ghost commented 2 years ago

I'm having the same issue. running restyle 2.1.0. Going to try to downgrade to 2.0.0

alexanderblackh commented 2 years ago

I'm having the same issue. running restyle 2.1.0. Going to try to downgrade to 2.0.0

Can confirm I'm still having the same issue and this suggestion worked then and still works now.

brijesh-aglowid commented 2 years ago

Hey @alphonse92, could you try the following changes locally and see if they fix this issue? https://github.com/Shopify/restyle/pull/152/files

@sbalay Yes it is working, can we have this fix in the release branch?

chj-damon commented 1 year ago

same here.

alexanderblackh commented 1 year ago

This is still broken, and in addition, #35 is now appearing in new apps as well, and both are resolved by downgrading to 2.0.0. It's a 50/50 of which of these issues appear in a new app I'm working on. At this point, I can only assume 2.1.0 is broken and has been for some time. Luckily 2.0.0 is fully stable, as I'm using this in 5 different apps and have been for a few months, so if anyone is using this library, make sure you yarn add @shopify/restyle@2.0.0

mattfrances commented 1 year ago

Hey @alphonse92 and @alexanderblackh, I'm unable to reproduce locally. Are you still seeing this issue?

BECkvalentine commented 1 year ago

I have run into this issue using version 2.4.2

rklf commented 1 year ago

I have run into this issue using version 2.4.2

Same. I get Error: Value 'defaults' does not exist in theme['textVariants'] regardless I've a defaults or not. Version 2.4.2

TarikOez commented 8 months ago

Also having that problem in 2.4.2

alexanderblackh commented 6 months ago

Hey y'all, sorry for ghosting on this thread, I gave up sometime ago and found downgrading for my prior project provided what I needed. However, on a new project this re-appeared again that used an old theme.ts that outright lacked a defaults under the textVariants block. So if y'all see this error again, double-check you have it and it's spelled correctly.