@hero-design/rn 8.90.1 → 8.91.0-alpha.0

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

@@ -169,7 +169,26 @@ exports[`TextInput backgroundColor renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -493,7 +512,26 @@ exports[`TextInput defaultValue TextInput is idle renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -816,7 +854,26 @@ exports[`TextInput defaultValue default Value and Value renders correctly with 2
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -1125,7 +1182,26 @@ exports[`TextInput disabled renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -1397,7 +1473,26 @@ exports[`TextInput error renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -1696,7 +1791,26 @@ exports[`TextInput filled renders correctly 1`] = `
           themeTypeface="neutral"
           themeVariant="regular"
         >
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -1983,7 +2097,26 @@ exports[`TextInput helper text renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -2248,7 +2381,26 @@ exports[`TextInput idle renders correctly 1`] = `
           themeTypeface="neutral"
           themeVariant="regular"
         >
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -2534,7 +2686,26 @@ exports[`TextInput idle with suffix and prefix are React Element renders correct
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -3019,7 +3190,26 @@ exports[`TextInput max length renders correctly 1`] = `
           >
             *
           </Text>
-          Shout out
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Shout out
+          </Text>
         </Text>
       </View>
       <View
@@ -3364,7 +3554,26 @@ exports[`TextInput max length renders correctly with hide character count 1`] =
           >
             *
           </Text>
-          Shout out
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Shout out
+          </Text>
         </Text>
       </View>
       <View
@@ -3695,7 +3904,26 @@ exports[`TextInput placeholder TextInput is idle renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -3986,7 +4214,26 @@ exports[`TextInput readonly renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -4228,7 +4475,26 @@ exports[`TextInput ref ref methods work correctly 1`] = `
           themeTypeface="neutral"
           themeVariant="regular"
         >
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -4500,7 +4766,26 @@ exports[`TextInput required renders correctly 1`] = `
           >
             *
           </Text>
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View
@@ -4741,7 +5026,26 @@ exports[`TextInput variants renders textarea variant correctly 1`] = `
           themeTypeface="neutral"
           themeVariant="regular"
         >
-          Amount (AUD)
+          <Text
+            allowFontScaling={false}
+            style={
+              [
+                {
+                  "color": "#001f23",
+                  "fontFamily": "BeVietnamPro-Regular",
+                  "fontSize": 16,
+                  "letterSpacing": 0.48,
+                  "lineHeight": 24,
+                },
+                undefined,
+              ]
+            }
+            themeIntent="body"
+            themeTypeface="neutral"
+            themeVariant="regular"
+          >
+            Amount (AUD)
+          </Text>
         </Text>
       </View>
       <View

package/src/components/TextInput/index.tsx

@@ -40,6 +40,7 @@ import { useTheme } from '../../theme';
 import type { State } from './StyledTextInput';
 import type { IconName } from '../Icon';
 import { omit, pick } from '../../utils/helpers';
+import Typography from '../Typography';
 
 export type TextInputHandles = Pick<
   RNTextInput,
@@ -503,7 +504,7 @@ const TextInput = forwardRef<TextInputHandles, TextInputProps>(
                     *
                   </StyledAsteriskLabelInsideTextInput>
                 )}
-                {label}
+                <Typography.Body>{label}</Typography.Body>
               </StyledLabelInsideTextInput>
             )}
           </StyledLabelContainerInsideTextInput>

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

@@ -162,7 +162,26 @@ exports[`TimePickerAndroid renders correct with hide suffix 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Break time
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Break time
+              </Text>
             </Text>
           </View>
           <View
@@ -449,7 +468,26 @@ exports[`TimePickerAndroid renders correctly 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Break time
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Break time
+              </Text>
             </Text>
           </View>
           <View

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

@@ -162,7 +162,26 @@ exports[`TimePickerIOS renders correct with hide suffix 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Break time
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Break time
+              </Text>
             </Text>
           </View>
           <View
@@ -449,7 +468,26 @@ exports[`TimePickerIOS renders correctly 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Break time
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Break time
+              </Text>
             </Text>
           </View>
           <View

package/src/index.ts

@@ -10,6 +10,7 @@ import theme, {
   jobsSystemPalette,
   walletSystemPalette,
   eBensSystemPalette,
+  ehWorkDarkSystemPalette,
   ThemeSwitcher,
   withTheme,
 } from './theme';
@@ -90,6 +91,7 @@ export {
   jobsSystemPalette,
   walletSystemPalette,
   eBensSystemPalette,
+  ehWorkDarkSystemPalette,
   Accordion,
   Alert,
   AppCue,

package/src/theme/ThemeSwitcher.tsx

@@ -9,6 +9,7 @@ import {
   walletSystemPalette,
   eBensSystemPalette,
   swagDarkSystemPalette,
+  ehWorkDarkSystemPalette,
   swagLightSystemPalette,
 } from './global';
 import ThemeProvider from './ThemeProvider';
@@ -20,7 +21,8 @@ type ThemeName =
   | 'work'
   | 'jobs'
   | 'wallet'
-  | 'eBens';
+  | 'eBens'
+  | 'ehWorkDark';
 
 const ThemeSwitcher = ({
   name = 'swag',
@@ -45,6 +47,8 @@ const ThemeSwitcher = ({
         return getTheme(defaultScale, swagDarkSystemPalette);
       case 'swagLight':
         return getTheme(defaultScale, swagLightSystemPalette);
+      case 'ehWorkDark':
+        return getTheme(defaultScale, ehWorkDarkSystemPalette);
     }
   }, [name]);
   return <ThemeProvider theme={theme}>{children}</ThemeProvider>;

package/src/theme/__tests__/__snapshots__/index.spec.ts.snap

@@ -64,7 +64,7 @@ exports[`theme returns correct theme object 1`] = `
     },
     "attachment": {
       "colors": {
-        "highlightedBackground": "#ece8ef",
+        "highlightedBackground": undefined,
       },
       "radii": {
         "container": 8,
@@ -547,7 +547,7 @@ exports[`theme returns correct theme object 1`] = `
     "error": {
       "colors": {
         "description": "#4d6265",
-        "fullScreenBackground": "#ccd2d3",
+        "fullScreenBackground": "#ffffff",
         "inPageBackground": "#f6f6f7",
         "title": "#001f23",
       },
@@ -696,7 +696,7 @@ exports[`theme returns correct theme object 1`] = `
     },
     "list": {
       "colors": {
-        "checkedListItemContainerBackground": "#ece8ef",
+        "checkedListItemContainerBackground": undefined,
         "leadingStatus": {
           "archived": "#abacaf",
           "danger": "#f46363",
@@ -1106,7 +1106,7 @@ exports[`theme returns correct theme object 1`] = `
     "success": {
       "colors": {
         "description": "#4d6265",
-        "fullScreenBackground": "#ccd2d3",
+        "fullScreenBackground": "#ffffff",
         "inPageBackground": "#f6f6f7",
         "title": "#001f23",
       },
@@ -1393,9 +1393,8 @@ exports[`theme returns correct theme object 1`] = `
       "colors": {
         "background": "#ffffff",
         "border": "#e8e9ea",
-        "danger": "#ffbe71",
+        "danger": "#cb300a",
         "disabled": "#bfc1c5",
-        "error": "#f46363",
         "iconButtonBackground": "#ece8ef",
         "info": "#b5c3fd",
         "inputContainerBackground": "#f6f6f7",

package/src/theme/components/attachment.ts

@@ -2,7 +2,7 @@ import type { GlobalTheme } from '../global';
 
 const getAttachmentTheme = (theme: GlobalTheme) => {
   const colors = {
-    highlightedBackground: theme.colors.highlightedSurface,
+    highlightedBackground: theme.colors.decorativeSecondarySurface,
   };
 
   const sizes = {

package/src/theme/components/error.ts

@@ -20,7 +20,7 @@ const getErrorTheme = (theme: GlobalTheme) => {
   const colors = {
     title: theme.colors.onDefaultGlobalSurface,
     description: theme.colors.mutedOnDefaultGlobalSurface,
-    fullScreenBackground: theme.colors.decorativePrimarySurface,
+    fullScreenBackground: theme.colors.defaultGlobalSurface,
     inPageBackground: theme.colors.neutralGlobalSurface,
   };
 

package/src/theme/components/list.ts

@@ -2,7 +2,7 @@ import type { GlobalTheme } from '../global';
 
 const getListTheme = (theme: GlobalTheme) => {
   const colors = {
-    checkedListItemContainerBackground: theme.colors.highlightedSurface,
+    checkedListItemContainerBackground: theme.colors.decorativeSecondarySurface,
     listItemContainerBackground: theme.colors.defaultGlobalSurface,
     leadingStatus: {
       danger: theme.colors.error,