@hero-design/rn 8.12.4 → 8.12.5-alpha.0

package/src/components/Checkbox/__tests__/__snapshots__/index.spec.tsx.snap

@@ -154,7 +154,6 @@ exports[`Checkbox renders correctly when disabled is false, withBorder is false
   }
 >
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
@@ -239,7 +238,6 @@ exports[`Checkbox renders correctly when disabled is false, withBorder is true 1
   }
 >
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
@@ -320,7 +318,6 @@ exports[`Checkbox renders correctly when disabled is true, withBorder is false 1
   }
 >
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
@@ -405,7 +402,6 @@ exports[`Checkbox renders correctly when disabled is true, withBorder is true 1`
   }
 >
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {

package/src/components/ContentNavigator/__tests__/__snapshots__/StyledContentNavigator.spec.tsx.snap

@@ -2,7 +2,6 @@
 
 exports[`Value has correct style 1`] = `
 <Text
-  allowFontScaling={false}
   style={
     Array [
       Object {

package/src/components/ContentNavigator/__tests__/__snapshots__/index.spec.tsx.snap

@@ -52,7 +52,6 @@ exports[`rendering renders correctly 1`] = `
     />
   </View>
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
@@ -171,7 +170,6 @@ exports[`rendering renders correctly when icon buttons are disabled 1`] = `
     />
   </View>
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {

package/src/components/DatePicker/__tests__/__snapshots__/DatePickerAndroid.spec.tsx.snap

@@ -99,7 +99,6 @@ exports[`DatePickerAndroid renders correctly 1`] = `
           testID="label-container"
         >
           <Text
-            allowFontScaling={false}
             style={
               Array [
                 Object {
@@ -149,7 +148,6 @@ exports[`DatePickerAndroid renders correctly 1`] = `
                 "disabled": false,
               }
             }
-            allowFontScaling={false}
             editable={true}
             onBlur={[Function]}
             onChangeText={[Function]}

package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap

@@ -99,7 +99,6 @@ exports[`DatePickerIOS renders correctly 1`] = `
           testID="label-container"
         >
           <Text
-            allowFontScaling={false}
             style={
               Array [
                 Object {
@@ -149,7 +148,6 @@ exports[`DatePickerIOS renders correctly 1`] = `
                 "disabled": false,
               }
             }
-            allowFontScaling={false}
             editable={true}
             onBlur={[Function]}
             onChangeText={[Function]}
@@ -375,7 +373,6 @@ exports[`DatePickerIOS renders correctly 1`] = `
                     }
                   >
                     <Text
-                      allowFontScaling={false}
                       style={
                         Array [
                           Object {
@@ -515,7 +512,6 @@ exports[`DatePickerIOS renders correctly 1`] = `
                       }
                     >
                       <Text
-                        allowFontScaling={false}
                         disabled={false}
                         ellipsizeMode="tail"
                         numberOfLines={1}

package/src/components/Empty/StyledEmpty.tsx

@@ -1,6 +1,5 @@
-import { View } from 'react-native';
+import { View, Text } from 'react-native';
 import styled from '@emotion/native';
-import Typography from '../Typography';
 
 type ThemeVariant = 'light' | 'dark';
 
@@ -13,7 +12,7 @@ const StyledWrapper = styled(View)(({ theme }) => ({
   padding: theme.__hd__.empty.space.wrapperPadding,
 }));
 
-const StyledTitle = styled(Typography.Text)<{ themeVariant: ThemeVariant }>(
+const StyledTitle = styled(Text)<{ themeVariant: ThemeVariant }>(
   ({ theme, themeVariant }) => ({
     fontFamily: theme.__hd__.empty.fonts.title,
     fontSize: theme.__hd__.empty.fontSizes.title,
@@ -26,16 +25,16 @@ const StyledTitle = styled(Typography.Text)<{ themeVariant: ThemeVariant }>(
   })
 );
 
-const StyledDescription = styled(Typography.Text)<{
-  themeVariant: ThemeVariant;
-}>(({ theme, themeVariant }) => ({
-  fontFamily: theme.__hd__.empty.fonts.description,
-  fontSize: theme.__hd__.empty.fontSizes.description,
-  textAlign: 'center',
-  color:
-    themeVariant === 'dark'
-      ? theme.__hd__.empty.colors.invertedSubduedText
-      : theme.__hd__.empty.colors.subduedText,
-}));
+const StyledDescription = styled(Text)<{ themeVariant: ThemeVariant }>(
+  ({ theme, themeVariant }) => ({
+    fontFamily: theme.__hd__.empty.fonts.description,
+    fontSize: theme.__hd__.empty.fontSizes.description,
+    textAlign: 'center',
+    color:
+      themeVariant === 'dark'
+        ? theme.__hd__.empty.colors.invertedSubduedText
+        : theme.__hd__.empty.colors.subduedText,
+  })
+);
 
 export { StyledWrapper, StyledTitle, StyledDescription };

package/src/components/Empty/__tests__/__snapshots__/index.spec.tsx.snap

@@ -17,62 +17,34 @@ exports[`Empty renders empty state content correctly 1`] = `
   }
 >
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
           "color": "#001f23",
-          "fontFamily": "BeVietnamPro-Regular",
-          "fontSize": 14,
-          "letterSpacing": 0.42,
-          "lineHeight": 22,
+          "fontFamily": "RebondGrotesque-SemiBold",
+          "fontSize": 24,
+          "marginBottom": 16,
+          "textAlign": "center",
         },
-        Array [
-          Object {
-            "color": "#001f23",
-            "fontFamily": "RebondGrotesque-SemiBold",
-            "fontSize": 24,
-            "marginBottom": 16,
-            "textAlign": "center",
-          },
-          undefined,
-        ],
+        undefined,
       ]
     }
-    themeFontSize="medium"
-    themeFontWeight="regular"
-    themeIntent="body"
-    themeTypeface="neutral"
     themeVariant="light"
   >
     You have no notification at this time
   </Text>
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
-          "color": "#001f23",
-          "fontFamily": "BeVietnamPro-Regular",
-          "fontSize": 14,
-          "letterSpacing": 0.42,
-          "lineHeight": 22,
+          "color": "#4d6265",
+          "fontFamily": "RebondGrotesque",
+          "fontSize": 18,
+          "textAlign": "center",
         },
-        Array [
-          Object {
-            "color": "#4d6265",
-            "fontFamily": "RebondGrotesque",
-            "fontSize": 18,
-            "textAlign": "center",
-          },
-          undefined,
-        ],
+        undefined,
       ]
     }
-    themeFontSize="medium"
-    themeFontWeight="regular"
-    themeIntent="body"
-    themeTypeface="neutral"
     themeVariant="light"
   >
     We'll notify you later.
@@ -112,62 +84,34 @@ exports[`Empty renders empty state with image correctly 1`] = `
     }
   />
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
           "color": "#001f23",
-          "fontFamily": "BeVietnamPro-Regular",
-          "fontSize": 14,
-          "letterSpacing": 0.42,
-          "lineHeight": 22,
+          "fontFamily": "RebondGrotesque-SemiBold",
+          "fontSize": 24,
+          "marginBottom": 16,
+          "textAlign": "center",
         },
-        Array [
-          Object {
-            "color": "#001f23",
-            "fontFamily": "RebondGrotesque-SemiBold",
-            "fontSize": 24,
-            "marginBottom": 16,
-            "textAlign": "center",
-          },
-          undefined,
-        ],
+        undefined,
       ]
     }
-    themeFontSize="medium"
-    themeFontWeight="regular"
-    themeIntent="body"
-    themeTypeface="neutral"
     themeVariant="light"
   >
     You have no notification at this time
   </Text>
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
-          "color": "#001f23",
-          "fontFamily": "BeVietnamPro-Regular",
-          "fontSize": 14,
-          "letterSpacing": 0.42,
-          "lineHeight": 22,
+          "color": "#4d6265",
+          "fontFamily": "RebondGrotesque",
+          "fontSize": 18,
+          "textAlign": "center",
         },
-        Array [
-          Object {
-            "color": "#4d6265",
-            "fontFamily": "RebondGrotesque",
-            "fontSize": 18,
-            "textAlign": "center",
-          },
-          undefined,
-        ],
+        undefined,
       ]
     }
-    themeFontSize="medium"
-    themeFontWeight="regular"
-    themeIntent="body"
-    themeTypeface="neutral"
     themeVariant="light"
   >
     We'll notify you later.

package/src/components/FAB/ActionGroup/__tests__/__snapshots__/index.spec.tsx.snap

@@ -53,7 +53,6 @@ exports[`ActionGroup has active false 1`] = `
     testID="action-group"
   >
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {
@@ -137,7 +136,6 @@ exports[`ActionGroup has active false 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -218,7 +216,6 @@ exports[`ActionGroup has active false 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -299,7 +296,6 @@ exports[`ActionGroup has active false 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -380,7 +376,6 @@ exports[`ActionGroup has active false 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -461,7 +456,6 @@ exports[`ActionGroup has active false 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -552,34 +546,20 @@ exports[`ActionGroup has active false 1`] = `
       themeSize="xsmall"
     />
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {
-            "color": "#001f23",
-            "fontFamily": "BeVietnamPro-Regular",
-            "fontSize": 14,
-            "letterSpacing": 0.42,
-            "lineHeight": 22,
+            "color": "#ffffff",
+            "fontFamily": "BeVietnamPro-SemiBold",
+            "fontSize": 16,
+            "lineHeight": 24,
+            "marginHorizontal": 8,
+            "textAlign": "center",
+            "textAlignVertical": "center",
           },
-          Array [
-            Object {
-              "color": "#ffffff",
-              "fontFamily": "BeVietnamPro-SemiBold",
-              "fontSize": 16,
-              "lineHeight": 24,
-              "marginHorizontal": 8,
-              "textAlign": "center",
-              "textAlignVertical": "center",
-            },
-            undefined,
-          ],
+          undefined,
         ]
       }
-      themeFontSize="medium"
-      themeFontWeight="regular"
-      themeIntent="body"
-      themeTypeface="neutral"
     >
       Shout out
     </Text>
@@ -640,7 +620,6 @@ exports[`ActionGroup has active true 1`] = `
     testID="action-group"
   >
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {
@@ -724,7 +703,6 @@ exports[`ActionGroup has active true 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -805,7 +783,6 @@ exports[`ActionGroup has active true 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -886,7 +863,6 @@ exports[`ActionGroup has active true 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -967,7 +943,6 @@ exports[`ActionGroup has active true 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -1048,7 +1023,6 @@ exports[`ActionGroup has active true 1`] = `
           themeSize="medium"
         />
         <Text
-          allowFontScaling={false}
           style={
             Array [
               Object {
@@ -1139,34 +1113,20 @@ exports[`ActionGroup has active true 1`] = `
       themeSize="xsmall"
     />
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {
-            "color": "#001f23",
-            "fontFamily": "BeVietnamPro-Regular",
-            "fontSize": 14,
-            "letterSpacing": 0.42,
-            "lineHeight": 22,
+            "color": "#ffffff",
+            "fontFamily": "BeVietnamPro-SemiBold",
+            "fontSize": 16,
+            "lineHeight": 24,
+            "marginHorizontal": 8,
+            "textAlign": "center",
+            "textAlignVertical": "center",
           },
-          Array [
-            Object {
-              "color": "#ffffff",
-              "fontFamily": "BeVietnamPro-SemiBold",
-              "fontSize": 16,
-              "lineHeight": 24,
-              "marginHorizontal": 8,
-              "textAlign": "center",
-              "textAlignVertical": "center",
-            },
-            undefined,
-          ],
+          undefined,
         ]
       }
-      themeFontSize="medium"
-      themeFontWeight="regular"
-      themeIntent="body"
-      themeTypeface="neutral"
     >
       Shout out
     </Text>

package/src/components/FAB/StyledFAB.tsx

@@ -1,9 +1,8 @@
-import { TouchableHighlight } from 'react-native';
+import { Text, TouchableHighlight } from 'react-native';
 import styled from '@emotion/native';
 import type { TextProps, TouchableHighlightProps } from 'react-native';
 import Icon from '../Icon';
 import type { IconProps } from '../Icon';
-import Typography from '../Typography';
 
 const StyledFABContainer = styled(TouchableHighlight)<TouchableHighlightProps>(
   ({ theme }) => ({
@@ -26,7 +25,7 @@ const StyledFABIcon = styled(Icon)<IconProps>(({ theme }) => ({
   textAlign: 'center',
 }));
 
-const StyledFABText = styled(Typography.Text)<TextProps>(({ theme }) => ({
+const StyledFABText = styled(Text)<TextProps>(({ theme }) => ({
   fontFamily: theme.__hd__.fab.fonts.title,
   fontSize: theme.__hd__.fab.fontSizes.title,
   lineHeight: theme.__hd__.fab.lineHeights.title,

package/src/components/FAB/__tests__/__snapshots__/StyledFAB.spec.tsx.snap

@@ -29,7 +29,6 @@ exports[`StyledFABContainer renders correctly 1`] = `
   }
 >
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {

package/src/components/FAB/__tests__/__snapshots__/index.spec.tsx.snap

@@ -179,34 +179,20 @@ exports[`FAB when title has value renders correctly 1`] = `
     themeSize="xsmall"
   />
   <Text
-    allowFontScaling={false}
     style={
       Array [
         Object {
-          "color": "#001f23",
-          "fontFamily": "BeVietnamPro-Regular",
-          "fontSize": 14,
-          "letterSpacing": 0.42,
-          "lineHeight": 22,
+          "color": "#ffffff",
+          "fontFamily": "BeVietnamPro-SemiBold",
+          "fontSize": 16,
+          "lineHeight": 24,
+          "marginHorizontal": 8,
+          "textAlign": "center",
+          "textAlignVertical": "center",
         },
-        Array [
-          Object {
-            "color": "#ffffff",
-            "fontFamily": "BeVietnamPro-SemiBold",
-            "fontSize": 16,
-            "lineHeight": 24,
-            "marginHorizontal": 8,
-            "textAlign": "center",
-            "textAlignVertical": "center",
-          },
-          undefined,
-        ],
+        undefined,
       ]
     }
-    themeFontSize="medium"
-    themeFontWeight="regular"
-    themeIntent="body"
-    themeTypeface="neutral"
   >
     Shout out
   </Text>

package/src/components/List/__tests__/__snapshots__/BasicListItem.spec.tsx.snap

@@ -67,7 +67,6 @@ exports[`BasicListItem when suffix and prefix are icon name renders correctly 1`
     }
   >
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {
@@ -88,7 +87,6 @@ exports[`BasicListItem when suffix and prefix are icon name renders correctly 1`
       List item
     </Text>
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {
@@ -205,7 +203,6 @@ exports[`BasicListItem when suffix and prefix are react element renders correctl
     }
   >
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {
@@ -226,7 +223,6 @@ exports[`BasicListItem when suffix and prefix are react element renders correctl
       List item
     </Text>
     <Text
-      allowFontScaling={false}
       style={
         Array [
           Object {