[Question] How to inherit parent style?

[horstleung]

Let's say we have a Text component and a Card component

<Card>
     <Text variant="body"/> 
<Card />

The body variant has a color: 'black' style.

What is the restyle way to do if we want to have a inverted card variant?

<Card variant="inverted">
     <Text variant="body"/> 
<Card />


// theme
cardVariants: {
    defaults: {
      backgroundColor: 'cardPrimaryBackground',
    },
    inverted: {
      backgroundColor: 'mainForeground',
      color: 'white' // <-- how to make the children text follow this color?
    }
  },

[edez1t]

Hi, this is unrelated to shopify/restyle, this is about how react-native works, see https://reactnative.dev/docs/text#limited-style-inheritance

[horstleung]

Hi, this is unrelated to shopify/restyle, this is about how react-native works, see https://reactnative.dev/docs/text#limited-style-inheritance

Thx for your reply. So, that means I need to do a switch to get new props for the Text component, right?
Is there a smarter way to map it?

[quememo]

Inheritance works for Nested ReactNative Text components, but not when using the component from createText from Restyle. Would be great to see it supported