@hero-design/rn 8.25.0 → 8.25.1

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

@@ -88,7 +88,7 @@ exports[`TimePickerIOS renders correct with hide suffix 1`] = `
                 "left": 16,
                 "paddingHorizontal": 4,
                 "position": "absolute",
-                "top": -10,
+                "top": -5,
                 "zIndex": 1,
               },
               Object {
@@ -105,13 +105,15 @@ exports[`TimePickerIOS renders correct with hide suffix 1`] = `
                 Object {
                   "color": "#001f23",
                   "fontFamily": "BeVietnamPro-Regular",
-                  "fontSize": 12,
-                  "letterSpacing": 0.36,
-                  "lineHeight": 20,
+                  "fontSize": 14,
+                  "letterSpacing": 0.42,
+                  "lineHeight": 22,
                 },
                 Array [
                   Object {
                     "color": "#001f23",
+                    "fontSize": 12,
+                    "lineHeight": 12,
                   },
                   Object {
                     "backgroundColor": "#ffffff",
@@ -120,7 +122,7 @@ exports[`TimePickerIOS renders correct with hide suffix 1`] = `
               ]
             }
             testID="input-label"
-            themeFontSize="small"
+            themeFontSize="medium"
             themeFontWeight="regular"
             themeIntent="body"
             themeState="filled"
@@ -323,7 +325,7 @@ exports[`TimePickerIOS renders correctly 1`] = `
                 "left": 16,
                 "paddingHorizontal": 4,
                 "position": "absolute",
-                "top": -10,
+                "top": -5,
                 "zIndex": 1,
               },
               Object {
@@ -340,13 +342,15 @@ exports[`TimePickerIOS renders correctly 1`] = `
                 Object {
                   "color": "#001f23",
                   "fontFamily": "BeVietnamPro-Regular",
-                  "fontSize": 12,
-                  "letterSpacing": 0.36,
-                  "lineHeight": 20,
+                  "fontSize": 14,
+                  "letterSpacing": 0.42,
+                  "lineHeight": 22,
                 },
                 Array [
                   Object {
                     "color": "#001f23",
+                    "fontSize": 12,
+                    "lineHeight": 12,
                   },
                   Object {
                     "backgroundColor": "#ffffff",
@@ -355,7 +359,7 @@ exports[`TimePickerIOS renders correctly 1`] = `
               ]
             }
             testID="input-label"
-            themeFontSize="small"
+            themeFontSize="medium"
             themeFontWeight="regular"
             themeIntent="body"
             themeState="filled"

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

@@ -984,10 +984,14 @@ Object {
         "labelInsideTextInput": 16,
         "maxLength": 12,
         "text": 16,
+        "topLabel": 12,
       },
       "fonts": Object {
         "text": "BeVietnamPro-Regular",
       },
+      "lineHeights": Object {
+        "topLabel": 12,
+      },
       "radii": Object {
         "container": 8,
       },
@@ -1007,7 +1011,7 @@ Object {
         "labelInsideTextInputMarginTop": -2,
         "labelLeft": 16,
         "labelPaddingBottom": 8,
-        "labelTop": -10,
+        "labelTop": -5,
         "maxLengthLabelMarginLeft": 4,
       },
     },

package/src/theme/components/textInput.ts

@@ -46,7 +46,7 @@ const getTextInputTheme = (theme: GlobalTheme) => {
   const space = {
     containerPadding: theme.space.medium,
     labelLeft: theme.space.medium,
-    labelTop: theme.lineHeights.small / -2,
+    labelTop: theme.lineHeights.small / -4,
     labelPaddingBottom: theme.space.small,
     labelHorizontalPadding: theme.space.xsmall,
     inputHorizontalMargin: theme.space.small,
@@ -68,6 +68,7 @@ const getTextInputTheme = (theme: GlobalTheme) => {
     error: theme.fontSizes.small,
     maxLength: theme.fontSizes.small,
     asteriskLabel: theme.fontSizes.large,
+    topLabel: theme.fontSizes.small,
   };
 
   const borderWidths = {
@@ -87,7 +88,20 @@ const getTextInputTheme = (theme: GlobalTheme) => {
     textInputMaxHeight: theme.sizes['15xlarge'],
   };
 
-  return { colors, space, fonts, fontSizes, borderWidths, radii, sizes };
+  const lineHeights = {
+    topLabel: theme.lineHeights.large / 2,
+  };
+
+  return {
+    colors,
+    space,
+    fonts,
+    fontSizes,
+    borderWidths,
+    radii,
+    sizes,
+    lineHeights,
+  };
 };
 
 export default getTextInputTheme;

package/types/components/Collapse/index.d.ts

@@ -1,5 +1,5 @@
-import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
 import type { ReactNode } from 'react';
+import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
 export interface CollapseProps extends ViewProps {
     children: ReactNode;
     /**

package/types/theme/components/textInput.d.ts

@@ -64,6 +64,7 @@ declare const getTextInputTheme: (theme: GlobalTheme) => {
         error: number;
         maxLength: number;
         asteriskLabel: number;
+        topLabel: number;
     };
     borderWidths: {
         container: {
@@ -79,5 +80,8 @@ declare const getTextInputTheme: (theme: GlobalTheme) => {
         textareaHeight: number;
         textInputMaxHeight: number;
     };
+    lineHeights: {
+        topLabel: number;
+    };
 };
 export default getTextInputTheme;