@hero-design/rn 7.25.0 → 7.26.0

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

@@ -82,6 +82,7 @@ exports[`TextInput defaultValue TextInput is idle renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="filled"
       >
         *
@@ -108,6 +109,7 @@ exports[`TextInput defaultValue TextInput is idle renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="filled"
       >
         Amount (AUD)
@@ -221,6 +223,7 @@ exports[`TextInput defaultValue TextInput is idle renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="filled"
       >
         4
@@ -249,6 +252,7 @@ exports[`TextInput defaultValue TextInput is idle renders correctly 1`] = `
       themeFontSize="medium"
       themeFontWeight="regular"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       This is helper text
     </Text>
@@ -338,6 +342,7 @@ exports[`TextInput defaultValue default Value and Value renders correctly with 2
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="filled"
       >
         *
@@ -364,6 +369,7 @@ exports[`TextInput defaultValue default Value and Value renders correctly with 2
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="filled"
       >
         Amount (AUD)
@@ -478,6 +484,7 @@ exports[`TextInput defaultValue default Value and Value renders correctly with 2
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="filled"
       >
         4
@@ -506,6 +513,7 @@ exports[`TextInput defaultValue default Value and Value renders correctly with 2
       themeFontSize="medium"
       themeFontWeight="regular"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       This is helper text
     </Text>
@@ -596,6 +604,7 @@ exports[`TextInput disabled renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="disabled"
       >
         *
@@ -622,6 +631,7 @@ exports[`TextInput disabled renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="disabled"
       >
         Amount (AUD)
@@ -809,6 +819,7 @@ exports[`TextInput error renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="error"
         >
           *
@@ -839,6 +850,7 @@ exports[`TextInput error renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="error"
         >
           Amount (AUD)
@@ -947,6 +959,7 @@ exports[`TextInput error renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
         >
           This field is required
         </Text>
@@ -1039,6 +1052,7 @@ exports[`TextInput filled renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="filled"
       >
         Amount (AUD)
@@ -1256,6 +1270,7 @@ exports[`TextInput helper text renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           *
@@ -1286,6 +1301,7 @@ exports[`TextInput helper text renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           Amount (AUD)
@@ -1362,6 +1378,7 @@ exports[`TextInput helper text renders correctly 1`] = `
       themeFontSize="medium"
       themeFontWeight="regular"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       This is helper text
     </Text>
@@ -1489,6 +1506,7 @@ exports[`TextInput idle renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           Amount (AUD)
@@ -1676,6 +1694,7 @@ exports[`TextInput idle with suffix and prefix are React Element renders correct
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           *
@@ -1706,6 +1725,7 @@ exports[`TextInput idle with suffix and prefix are React Element renders correct
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           Amount (AUD)
@@ -2021,6 +2041,7 @@ exports[`TextInput max length renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="error"
       >
         *
@@ -2047,6 +2068,7 @@ exports[`TextInput max length renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="error"
       >
         Shout out
@@ -2172,6 +2194,7 @@ exports[`TextInput max length renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
         >
           must not exceed character limit
         </Text>
@@ -2203,6 +2226,7 @@ exports[`TextInput max length renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="error"
       >
         18
@@ -2327,6 +2351,7 @@ exports[`TextInput placeholder TextInput is idle renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           *
@@ -2357,6 +2382,7 @@ exports[`TextInput placeholder TextInput is idle renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           Amount (AUD)
@@ -2433,6 +2459,7 @@ exports[`TextInput placeholder TextInput is idle renders correctly 1`] = `
       themeFontSize="medium"
       themeFontWeight="regular"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       This is helper text
     </Text>
@@ -2522,6 +2549,7 @@ exports[`TextInput readonly renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="readonly"
       >
         *
@@ -2548,6 +2576,7 @@ exports[`TextInput readonly renders correctly 1`] = `
         themeFontSize="small"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
         themeVariant="readonly"
       >
         Amount (AUD)
@@ -2765,6 +2794,7 @@ exports[`TextInput required renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           *
@@ -2795,6 +2825,7 @@ exports[`TextInput required renders correctly 1`] = `
           themeFontSize="medium"
           themeFontWeight="regular"
           themeIntent="body"
+          themeTypeface="neutral"
           themeVariant="default"
         >
           Amount (AUD)

package/src/components/TimePicker/__tests__/__snapshots__/TimePickerAndroid.spec.tsx.snap

@@ -103,6 +103,7 @@ exports[`TimePickerAndroid renders correctly 1`] = `
             themeFontSize="small"
             themeFontWeight="regular"
             themeIntent="body"
+            themeTypeface="neutral"
             themeVariant="filled"
           >
             Break time

package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap

@@ -103,6 +103,7 @@ exports[`TimePickerIOS renders correctly 1`] = `
             themeFontSize="small"
             themeFontWeight="regular"
             themeIntent="body"
+            themeTypeface="neutral"
             themeVariant="filled"
           >
             Break time
@@ -365,6 +366,7 @@ exports[`TimePickerIOS renders correctly 1`] = `
                       themeFontSize="large"
                       themeFontWeight="semi-bold"
                       themeIntent="body"
+                      themeTypeface="neutral"
                     >
                       Break time
                     </Text>
@@ -516,6 +518,7 @@ exports[`TimePickerIOS renders correctly 1`] = `
                         themeFontSize="large"
                         themeFontWeight="semi-bold"
                         themeIntent="primary"
+                        themeTypeface="neutral"
                       >
                         Confirm
                       </Text>

package/src/components/Toast/__tests__/__snapshots__/Toast.spec.tsx.snap

@@ -98,6 +98,7 @@ exports[`Toast Icon render custom icon correctly 1`] = `
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
       >
         Content
       </Text>
@@ -204,6 +205,7 @@ exports[`Toast renders correctly when intent is error 1`] = `
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
       >
         Toast Content
       </Text>
@@ -246,6 +248,7 @@ exports[`Toast renders correctly when intent is error 1`] = `
       themeFontSize="medium"
       themeFontWeight="semi-bold"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       Action
     </Text>
@@ -351,6 +354,7 @@ exports[`Toast renders correctly when intent is info 1`] = `
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
       >
         Toast Content
       </Text>
@@ -393,6 +397,7 @@ exports[`Toast renders correctly when intent is info 1`] = `
       themeFontSize="medium"
       themeFontWeight="semi-bold"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       Action
     </Text>
@@ -471,6 +476,7 @@ exports[`Toast renders correctly when intent is notification 1`] = `
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
       >
         Toast Content
       </Text>
@@ -513,6 +519,7 @@ exports[`Toast renders correctly when intent is notification 1`] = `
       themeFontSize="medium"
       themeFontWeight="semi-bold"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       Action
     </Text>
@@ -591,6 +598,7 @@ exports[`Toast renders correctly when intent is snackbar 1`] = `
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent="inverted"
+        themeTypeface="neutral"
       >
         Toast Content
       </Text>
@@ -633,6 +641,7 @@ exports[`Toast renders correctly when intent is snackbar 1`] = `
       themeFontSize="medium"
       themeFontWeight="semi-bold"
       themeIntent="inverted"
+      themeTypeface="neutral"
     >
       Action
     </Text>
@@ -738,6 +747,7 @@ exports[`Toast renders correctly when intent is success 1`] = `
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
       >
         Toast Content
       </Text>
@@ -780,6 +790,7 @@ exports[`Toast renders correctly when intent is success 1`] = `
       themeFontSize="medium"
       themeFontWeight="semi-bold"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       Action
     </Text>
@@ -885,6 +896,7 @@ exports[`Toast renders correctly when intent is warning 1`] = `
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
       >
         Toast Content
       </Text>
@@ -927,6 +939,7 @@ exports[`Toast renders correctly when intent is warning 1`] = `
       themeFontSize="medium"
       themeFontWeight="semi-bold"
       themeIntent="body"
+      themeTypeface="neutral"
     >
       Action
     </Text>

package/src/components/Toolbar/__tests__/__snapshots__/ToolbarGroup.spec.tsx.snap

@@ -67,6 +67,7 @@ exports[`ToolbarGroup renders correctly with when align is center 1`] = `
       themeFontSize="small"
       themeFontWeight="semi-bold"
       themeIntent="primary"
+      themeTypeface="neutral"
     >
       Discard
     </Text>
@@ -123,6 +124,7 @@ exports[`ToolbarGroup renders correctly with when align is center 1`] = `
       themeFontSize="small"
       themeFontWeight="semi-bold"
       themeIntent="primary"
+      themeTypeface="neutral"
     >
       Print
     </Text>
@@ -197,6 +199,7 @@ exports[`ToolbarGroup renders correctly with when align is left 1`] = `
       themeFontSize="small"
       themeFontWeight="semi-bold"
       themeIntent="primary"
+      themeTypeface="neutral"
     >
       Discard
     </Text>
@@ -253,6 +256,7 @@ exports[`ToolbarGroup renders correctly with when align is left 1`] = `
       themeFontSize="small"
       themeFontWeight="semi-bold"
       themeIntent="primary"
+      themeTypeface="neutral"
     >
       Print
     </Text>
@@ -327,6 +331,7 @@ exports[`ToolbarGroup renders correctly with when align is right 1`] = `
       themeFontSize="small"
       themeFontWeight="semi-bold"
       themeIntent="primary"
+      themeTypeface="neutral"
     >
       Discard
     </Text>
@@ -383,6 +388,7 @@ exports[`ToolbarGroup renders correctly with when align is right 1`] = `
       themeFontSize="small"
       themeFontWeight="semi-bold"
       themeIntent="primary"
+      themeTypeface="neutral"
     >
       Print
     </Text>

package/src/components/Toolbar/__tests__/__snapshots__/ToolbarItem.spec.tsx.snap

@@ -53,6 +53,7 @@ exports[`ToolbarItems renders correctly when disabled 1`] = `
     themeFontSize="small"
     themeFontWeight="semi-bold"
     themeIntent="subdued"
+    themeTypeface="neutral"
   >
     Action
   </Text>
@@ -112,6 +113,7 @@ exports[`ToolbarItems renders correctly when intent is danger 1`] = `
     themeFontSize="small"
     themeFontWeight="semi-bold"
     themeIntent="danger"
+    themeTypeface="neutral"
   >
     Action
   </Text>
@@ -171,6 +173,7 @@ exports[`ToolbarItems renders correctly when intent is info 1`] = `
     themeFontSize="small"
     themeFontWeight="semi-bold"
     themeIntent="info"
+    themeTypeface="neutral"
   >
     Action
   </Text>
@@ -230,6 +233,7 @@ exports[`ToolbarItems renders correctly when intent is primary 1`] = `
     themeFontSize="small"
     themeFontWeight="semi-bold"
     themeIntent="primary"
+    themeTypeface="neutral"
   >
     Action
   </Text>
@@ -289,6 +293,7 @@ exports[`ToolbarItems renders correctly when intent is success 1`] = `
     themeFontSize="small"
     themeFontWeight="semi-bold"
     themeIntent="success"
+    themeTypeface="neutral"
   >
     Action
   </Text>
@@ -348,6 +353,7 @@ exports[`ToolbarItems renders correctly when intent is warning 1`] = `
     themeFontSize="small"
     themeFontWeight="semi-bold"
     themeIntent="warning"
+    themeTypeface="neutral"
   >
     Action
   </Text>

package/src/components/Typography/Text/StyledText.tsx

@@ -26,7 +26,8 @@ const StyledText = styled(Text)<{
     | 'warning'
     | 'danger'
     | 'inverted';
-}>(({ themeFontSize, themeFontWeight, themeIntent, theme }) => {
+  themeTypeface: 'neutral' | 'playful';
+}>(({ themeFontSize, themeFontWeight, themeIntent, themeTypeface, theme }) => {
   const sizeStyles = {
     fontSize: theme.__hd__.typography.fontSizes[themeFontSize],
     lineHeight: theme.__hd__.typography.lineHeights[themeFontSize],
@@ -35,7 +36,10 @@ const StyledText = styled(Text)<{
 
   return {
     ...sizeStyles,
-    fontFamily: theme.__hd__.typography.fonts[FONTWEIGHT_MAP[themeFontWeight]],
+    fontFamily:
+      theme.__hd__.typography.fonts[themeTypeface][
+        FONTWEIGHT_MAP[themeFontWeight]
+      ],
     color: theme.__hd__.typography.colors[themeIntent],
   };
 });

package/src/components/Typography/Text/__tests__/StyledText.spec.tsx

@@ -17,6 +17,7 @@ describe('StyledText', () => {
         themeFontSize={fontSize}
         themeFontWeight="regular"
         themeIntent="body"
+        themeTypeface="neutral"
       >
         This is a test
       </StyledText>
@@ -36,6 +37,7 @@ describe('StyledText', () => {
         themeFontSize="medium"
         themeFontWeight={fontWeight}
         themeIntent="body"
+        themeTypeface="neutral"
       >
         This is a test
       </StyledText>
@@ -60,6 +62,26 @@ describe('StyledText', () => {
         themeFontSize="medium"
         themeFontWeight="regular"
         themeIntent={intent}
+        themeTypeface="neutral"
+      >
+        This is a test
+      </StyledText>
+    );
+
+    expect(toJSON()).toMatchSnapshot();
+  });
+
+  it.each`
+    typeface
+    ${'neutral'}
+    ${'playful'}
+  `('has $typeface typeface style', ({ typeface }) => {
+    const { toJSON } = renderWithTheme(
+      <StyledText
+        themeFontSize="medium"
+        themeFontWeight="regular"
+        themeIntent="body"
+        themeTypeface={typeface}
       >
         This is a test
       </StyledText>