fix: nested text styling not inheriting from parent

src/components/Typography/Text.tsx

@@ -6,6 +6,7 @@ import {
   Text as NativeText,
   TextStyle,
 } from 'react-native';
+import type { TextProps } from 'react-native';
 
 import AnimatedText from './AnimatedText';
 import type { VariantProp } from './types';
@@ -14,6 +15,8 @@ import { useInternalTheme } from '../../core/theming';
 import type { ThemeProp } from '../../types';
 import { forwardRef } from '../../utils/forwardRef';
 
+const TextContext = React.createContext<TextProps | null>(null);
+
 export type Props<T> = React.ComponentProps<typeof NativeText> & {
   /**
    * @supported Available in v5.x with theme version 3
@@ -81,13 +84,14 @@ export type TextRef = React.ForwardedRef<{
  * @extends Text props https://reactnative.dev/docs/text#props
  */
 const Text = (
-  { style, variant, theme: initialTheme, ...rest }: Props<string>,
+  { style, variant, theme: initialTheme, children, ...rest }: Props<string>,
   ref: TextRef
 ) => {
   const root = React.useRef<NativeText | null>(null);
   // FIXME: destructure it in TS 4.6+
   const theme = useInternalTheme(initialTheme);
   const writingDirection = I18nManager.getConstants().isRTL ? 'rtl' : 'ltr';
+  const parentTextContext = React.useContext(TextContext);
 
   React.useImperativeHandle(ref, () => ({
     setNativeProps: (args: Object) => root.current?.setNativeProps(args),
@@ -98,10 +102,10 @@ const Text = (
     let textStyle = [font, style];
 
     if (
-      React.isValidElement(rest.children) &&
-      (rest.children.type === Component ||
-        rest.children.type === AnimatedText ||
-        rest.children.type === StyledText)
+      React.isValidElement(children) &&
+      (children.type === Component ||
+        children.type === AnimatedText ||
+        children.type === StyledText)
     ) {
       const { props } = rest.children as {
         props: { variant?: string; style?: StyleProp<TextStyle> };
@@ -119,7 +123,7 @@ const Text = (
       //            specified in a parent in favor of children's variant:
       if (props.variant) {
         font = theme.fonts[props.variant as VariantProp<typeof props.variant>];
-        textStyle = [style, font];
+        textStyle = [style, props.style, font];
       }
 
       // Case two:  Nested `Text` has specified `styles` which intefere
@@ -150,21 +154,37 @@ const Text = (
           { writingDirection, color: theme.colors.onSurface },
           textStyle,
         ]}
-        {...rest}
-      />
+        {...
+}
+      >
+        {children}
+      </NativeText>
     );
   } else {
     const font = theme.isV3 ? theme.fonts.default : theme.fonts?.regular;
     const textStyle = {
       ...font,
       color: theme.isV3 ? theme.colors?.onSurface : theme.colors.text,
     };
+
+    if (parentTextContext) {
+      Object.assign(textStyle, StyleSheet.flatten(parentTextContext.style));
+    }
+
     return (
-      <NativeText
-        {...rest}
-        ref={root}
-        style={[styles.text, textStyle, { writingDirection }, style]}
-      />
+      <TextContext.Provider
+        value={{
+          style: [styles.text, textStyle, { writingDirection }, style],
+        }}
+      >
+        <NativeText
+          {...rest}
+          ref={root}
+          style={[styles.text, textStyle, { writingDirection }, style]}
+        >
+          {children}
+        </NativeText>
+      </TextContext.Provider>
     );
   }
 };