@hero-design/rn 8.12.3 → 8.12.4

package/src/theme/components/pinInput.ts

@@ -22,6 +22,10 @@ const getPinInputTheme = (theme: GlobalTheme) => {
     cellText: theme.fontSizes.xxxxlarge,
     errorMessage: theme.fontSizes.small,
   };
+  const lineHeights = {
+    cellText: theme.lineHeights.xxxxlarge,
+    errorMessage: theme.fontSizes.small,
+  };
 
   const sizes = {
     cellWidth: theme.sizes.xxlarge,
@@ -39,7 +43,16 @@ const getPinInputTheme = (theme: GlobalTheme) => {
     mask: theme.radii.rounded,
   };
 
-  return { borderWidths, colors, fonts, fontSizes, sizes, space, radii };
+  return {
+    borderWidths,
+    lineHeights,
+    colors,
+    fonts,
+    fontSizes,
+    sizes,
+    space,
+    radii,
+  };
 };
 
 export default getPinInputTheme;

package/types/components/Avatar/StyledAvatar.d.ts

@@ -1,5 +1,6 @@
 /// <reference types="react" />
-import { View, Image, TouchableOpacity, Text } from 'react-native';
+import { View, Image, TouchableOpacity } from 'react-native';
+import { TextProps } from '../Typography/Text';
 declare type ThemeSize = 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge' | 'xxxxlarge' | 'xxxxxlarge';
 declare type ThemeIntent = 'primary' | 'info' | 'danger' | 'success' | 'warning';
 declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
@@ -17,14 +18,12 @@ declare const StyledTextWrapper: import("@emotion/native").StyledComponent<impor
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
-declare const StyledText: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
+declare const StyledText: import("@emotion/native").StyledComponent<TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
     themeSize: ThemeSize;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
+}, {}, {}>;
 declare const StyledImage: import("@emotion/native").StyledComponent<import("react-native").ImageProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;

package/types/components/Badge/StyledBadge.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { Animated, Text } from 'react-native';
+import { Animated } from 'react-native';
 declare type ThemeIntent = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'archived';
 declare type ThemePadding = 'narrowContent' | 'wideContent';
 declare const StyledView: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").View>> & {
@@ -11,12 +11,10 @@ declare const StyledView: import("@emotion/native").StyledComponent<Animated.Ani
     themeIntent: ThemeIntent;
     themePadding: ThemePadding;
 }, {}, {}>;
-declare const StyledText: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
+declare const StyledText: import("@emotion/native").StyledComponent<import("../..").TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
+}, {}, {}>;
 declare const StyledStatus: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").View>> & {
     children?: import("react").ReactNode;
 } & {

package/types/components/Empty/StyledEmpty.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { View, Text } from 'react-native';
+import { View } from 'react-native';
 declare type ThemeVariant = 'light' | 'dark';
 declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
     theme?: import("@emotion/react").Theme | undefined;
@@ -7,20 +7,16 @@ declare const StyledWrapper: import("@emotion/native").StyledComponent<import("r
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
-declare const StyledTitle: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
+declare const StyledTitle: import("@emotion/native").StyledComponent<import("../..").TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: ThemeVariant;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
-declare const StyledDescription: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
+}, {}, {}>;
+declare const StyledDescription: import("@emotion/native").StyledComponent<import("../..").TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: ThemeVariant;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
+}, {}, {}>;
 export { StyledWrapper, StyledTitle, StyledDescription };

package/types/components/FAB/StyledFAB.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { Text, TouchableHighlight } from 'react-native';
+import { TouchableHighlight } from 'react-native';
 import type { TextProps, TouchableHighlightProps } from 'react-native';
 import type { IconProps } from '../Icon';
 declare const StyledFABContainer: import("@emotion/native").StyledComponent<TouchableHighlightProps & {
@@ -12,10 +12,8 @@ declare const StyledFABIcon: import("@emotion/native").StyledComponent<IconProps
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
-declare const StyledFABText: import("@emotion/native").StyledComponent<TextProps & {
+declare const StyledFABText: import("@emotion/native").StyledComponent<import("../..").TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
+} & TextProps, {}, {}>;
 export { StyledFABContainer, StyledFABIcon, StyledFABText };

package/types/components/PinInput/StyledPinInput.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { Text, TextInput, View } from 'react-native';
+import { TextInput, View } from 'react-native';
 export declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
@@ -22,14 +22,12 @@ export declare const StyledCell: import("@emotion/native").StyledComponent<impor
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
-export declare const StyledCellText: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
+export declare const StyledCellText: import("@emotion/native").StyledComponent<import("../..").TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
     themeState: State;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
+}, {}, {}>;
 export declare const StyledSpacer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
@@ -66,9 +64,7 @@ export declare const StyledErrorContainer: import("@emotion/native").StyledCompo
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
-export declare const StyledErrorMessage: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
+export declare const StyledErrorMessage: import("@emotion/native").StyledComponent<import("../..").TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
+}, {}, {}>;

package/types/components/Tag/StyledTag.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { View, Text } from 'react-native';
+import { View } from 'react-native';
 declare type ThemeIntent = 'primary' | 'info' | 'success' | 'warning' | 'danger' | 'archived';
 declare type ThemeVariant = 'filled' | 'outlined';
 declare const StyledView: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
@@ -11,13 +11,11 @@ declare const StyledView: import("@emotion/native").StyledComponent<import("reac
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
-declare const StyledText: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
+declare const StyledText: import("@emotion/native").StyledComponent<import("../..").TextProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
     themeIntent: ThemeIntent;
     themeVariant: ThemeVariant;
-}, {}, {
-    ref?: import("react").Ref<Text> | undefined;
-}>;
+}, {}, {}>;
 export { StyledView, StyledText };

package/types/components/Typography/Text/index.d.ts

@@ -32,5 +32,5 @@ export interface TextProps extends NativeTextProps {
      */
     typeface?: 'neutral' | 'playful';
 }
-declare const Text: ({ children, fontSize, fontWeight, intent, typeface, ...nativeProps }: TextProps) => JSX.Element;
+declare const Text: ({ children, fontSize, fontWeight, intent, typeface, allowFontScaling, ...nativeProps }: TextProps) => JSX.Element;
 export default Text;

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

@@ -34,5 +34,15 @@ declare const getAvatarTheme: (theme: GlobalTheme) => {
         xxxxlarge: number;
         xxxxxlarge: number;
     };
+    lineHeights: {
+        small: number;
+        medium: number;
+        large: number;
+        xlarge: number;
+        xxlarge: number;
+        xxxlarge: number;
+        xxxxlarge: number;
+        xxxxxlarge: number;
+    };
 };
 export default getAvatarTheme;

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

@@ -26,5 +26,8 @@ declare const getBadgeTheme: (theme: GlobalTheme) => {
         statusPositionTop: number;
         statusPositionRight: number;
     };
+    lineHeights: {
+        default: number;
+    };
 };
 export default getBadgeTheme;

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

@@ -4,6 +4,10 @@ declare const getPinInputTheme: (theme: GlobalTheme) => {
         default: number;
         focused: number;
     };
+    lineHeights: {
+        cellText: number;
+        errorMessage: number;
+    };
     colors: {
         default: string;
         mask: string;