@hero-design/rn 7.19.0 → 7.20.1

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

@@ -20,7 +20,7 @@ interface AlertProps {
     /**
      * Visual intent color to apply to alert.
      */
-    intent?: 'success' | 'info' | 'warning' | 'error';
+    intent?: 'success' | 'info' | 'warning' | 'error' | 'notification';
     /**
      * Closing callback. When onClose is available, an X button will be rendered on the right side of alert. The callback will be called when user clicks on X button.
      */

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

@@ -1,45 +1,45 @@
 import { View, Image, TouchableOpacity, Text } from 'react-native';
-declare type ThemeSize = 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge' | 'xxxxlarge';
+declare type ThemeSize = 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge' | 'xxxxlarge' | 'xxxxxlarge';
 declare type ThemeIntent = 'primary' | 'info' | 'danger' | 'success' | 'warning';
 declare const StyledPressable: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themeSize: ThemeSize;
     themeIntent: ThemeIntent;
 }, {}, {
-    ref?: import("react").Ref<TouchableOpacity> | undefined;
+    ref?: import("react").Ref<TouchableOpacity>;
 }>;
 declare const StyledView: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themeSize: ThemeSize;
     themeIntent: ThemeIntent;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledTextWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledText: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themeSize: ThemeSize;
     themeIntent: ThemeIntent;
 }, {}, {
-    ref?: import("react").Ref<Text> | undefined;
+    ref?: import("react").Ref<Text>;
 }>;
 declare const StyledImage: import("@emotion/native").StyledComponent<import("react-native").ImageProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themeSize: ThemeSize;
 }, {}, {
-    ref?: import("react").Ref<Image> | undefined;
+    ref?: import("react").Ref<Image>;
 }>;
 export { StyledPressable, StyledView, StyledImage, StyledTextWrapper, StyledText, };

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

@@ -11,7 +11,7 @@ interface AvatarProps extends ViewProps {
      */
     intent?: 'primary' | 'info' | 'danger' | 'success' | 'warning';
     /** Size of the avatar. */
-    size?: 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge' | 'xxxxlarge';
+    size?: 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge' | 'xxxxlarge' | 'xxxxxlarge';
     /**
      * Additional style.
      */
@@ -21,5 +21,5 @@ interface AvatarProps extends ViewProps {
      */
     testID?: string;
 }
-declare const Avatar: ({ onPress, source, testID, style, title, size, intent, }: AvatarProps) => JSX.Element | null;
+declare const Avatar: ({ onPress, source, testID, style, title, size, intent, }: AvatarProps) => JSX.Element;
 export default Avatar;

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

@@ -4,23 +4,23 @@ 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>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themeIntent: ThemeIntent;
     themePadding: ThemePadding;
 }, {}, {}>;
 declare const StyledText: import("@emotion/native").StyledComponent<import("react-native").TextProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<Text> | undefined;
+    ref?: import("react").Ref<Text>;
 }>;
 declare const StyledStatus: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").View>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themeIntent: ThemeIntent;
 }, {}, {}>;

package/types/components/BottomNavigation/StyledBottomNavigation.d.ts

@@ -1,27 +1,27 @@
 import { View } from 'react-native';
 declare const BottomNavigationTab: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
-    themeVisibility?: boolean | undefined;
+    themeVisibility?: boolean;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const BottomNavigationContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const ContentWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const BottomBarWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themeInsets: {
         top: number;
@@ -30,22 +30,22 @@ declare const BottomBarWrapper: import("@emotion/native").StyledComponent<import
         left: number;
     };
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const BottomBar: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const BottomBarItem: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledBottomBarText: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {}>;
 export { BottomBar, BottomBarItem, BottomNavigationTab, BottomNavigationContainer, BottomBarWrapper, ContentWrapper, StyledBottomBarText, };

package/types/components/BottomSheet/Header.d.ts

@@ -2,7 +2,7 @@ import type { ReactElement } from 'react';
 declare const Header: ({ content, showDivider, onRequestClose, showCloseButton, }: {
     content: string | ReactElement;
     showDivider: boolean;
-    onRequestClose?: (() => void) | undefined;
+    onRequestClose?: () => void;
     showCloseButton: boolean;
 }) => JSX.Element;
 export default Header;

package/types/components/BottomSheet/StyledBottomSheet.d.ts

@@ -1,45 +1,45 @@
 import { Animated, SafeAreaView, View } from 'react-native';
 import type { ViewProps } from 'react-native';
 declare const StyledWrapper: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledBottomSheet: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<SafeAreaView>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {}>;
 declare const StyledBackdrop: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").PressableProps & import("react").RefAttributes<View>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {}>;
 declare const StyledHeaderWrapper: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledHeader: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledFooter: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledIconWrapper: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 export { StyledWrapper, StyledHeaderWrapper, StyledHeader, StyledFooter, StyledIconWrapper, StyledBottomSheet, StyledBackdrop, };

package/types/components/Box/StyledBox.d.ts

@@ -0,0 +1,15 @@
+import { Theme } from '@emotion/react';
+import { View } from 'react-native';
+import { StyleProps } from './types';
+export declare const getThemeValue: (theme: Theme, key: keyof StyleProps, props: StyleProps) => {
+    [x: string]: string;
+} | {
+    [x: string]: number;
+};
+declare const StyledBox: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: Theme;
+    as?: import("react").ElementType<any>;
+} & StyleProps, {}, {
+    ref?: import("react").Ref<View>;
+}>;
+export { StyledBox };

package/types/components/Box/__tests__/helpers.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/types/components/Box/__tests__/index.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/types/components/Box/config.d.ts

@@ -0,0 +1,170 @@
+declare const config: {
+    readonly borderWidth: {
+        readonly property: "borderWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderBottomWidth: {
+        readonly property: "borderBottomWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderTopWidth: {
+        readonly property: "borderTopWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderLeftWidth: {
+        readonly property: "borderLeftWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderRightWidth: {
+        readonly property: "borderRightWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderBottomEndRadius: {
+        readonly property: "borderBottomEndRadius";
+        readonly scale: "radii";
+    };
+    readonly borderBottomLeftRadius: {
+        readonly property: "borderBottomLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderBottomRightRadius: {
+        readonly property: "borderBottomRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderBottomStartRadius: {
+        readonly property: "borderBottomStartRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopEndRadius: {
+        readonly property: "borderTopEndRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopLeftRadius: {
+        readonly property: "borderTopLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopRightRadius: {
+        readonly property: "borderTopRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopStartRadius: {
+        readonly property: "borderTopStartRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadius: {
+        readonly property: "borderRadius";
+        readonly scale: "radii";
+    };
+    readonly margin: {
+        readonly property: "margin";
+        readonly scale: "space";
+    };
+    readonly marginBottom: {
+        readonly property: "marginBottom";
+        readonly scale: "space";
+    };
+    readonly marginEnd: {
+        readonly property: "marginEnd";
+        readonly scale: "space";
+    };
+    readonly marginHorizontal: {
+        readonly property: "marginHorizontal";
+        readonly scale: "space";
+    };
+    readonly marginLeft: {
+        readonly property: "marginLeft";
+        readonly scale: "space";
+    };
+    readonly marginRight: {
+        readonly property: "marginRight";
+        readonly scale: "space";
+    };
+    readonly marginStart: {
+        readonly property: "marginStart";
+        readonly scale: "space";
+    };
+    readonly marginTop: {
+        readonly property: "marginTop";
+        readonly scale: "space";
+    };
+    readonly marginVertical: {
+        readonly property: "marginVertical";
+        readonly scale: "space";
+    };
+    readonly padding: {
+        readonly property: "padding";
+        readonly scale: "space";
+    };
+    readonly paddingBottom: {
+        readonly property: "paddingBottom";
+        readonly scale: "space";
+    };
+    readonly paddingEnd: {
+        readonly property: "paddingEnd";
+        readonly scale: "space";
+    };
+    readonly paddingHorizontal: {
+        readonly property: "paddingHorizontal";
+        readonly scale: "space";
+    };
+    readonly paddingLeft: {
+        readonly property: "paddingLeft";
+        readonly scale: "space";
+    };
+    readonly paddingRight: {
+        readonly property: "paddingRight";
+        readonly scale: "space";
+    };
+    readonly paddingStart: {
+        readonly property: "paddingStart";
+        readonly scale: "space";
+    };
+    readonly paddingTop: {
+        readonly property: "paddingTop";
+        readonly scale: "space";
+    };
+    readonly paddingVertical: {
+        readonly property: "paddingVertical";
+        readonly scale: "space";
+    };
+    readonly backgroundColor: {
+        readonly property: "backgroundColor";
+        readonly scale: "colors";
+    };
+    readonly bgColor: {
+        readonly property: "backgroundColor";
+        readonly scale: "colors";
+    };
+    readonly borderColor: {
+        readonly property: "borderColor";
+        readonly scale: "colors";
+    };
+    readonly borderTopColor: {
+        readonly property: "borderTopColor";
+        readonly scale: "colors";
+    };
+    readonly borderBottomColor: {
+        readonly property: "borderBottomColor";
+        readonly scale: "colors";
+    };
+    readonly borderStartColor: {
+        readonly property: "borderStartColor";
+        readonly scale: "colors";
+    };
+    readonly borderEndColor: {
+        readonly property: "borderEndColor";
+        readonly scale: "colors";
+    };
+    readonly borderLeftColor: {
+        readonly property: "borderLeftColor";
+        readonly scale: "colors";
+    };
+    readonly borderRightColor: {
+        readonly property: "borderRightColor";
+        readonly scale: "colors";
+    };
+};
+export declare const flexPropsKey: readonly ["alignContent", "alignItems", "alignSelf", "display", "flex", "flexBasis", "flexDirection", "flexGrow", "flexShrink", "flexWrap", "justifyContent"];
+export declare type ConfigType = typeof config;
+export declare type FlexPropsKeyType = typeof flexPropsKey[number];
+export default config;

package/types/components/Box/helpers.d.ts

@@ -0,0 +1 @@
+export declare const pick: (keys: Array<string>, props: Record<string, any>) => {};

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

@@ -0,0 +1,5 @@
+import type { BoxViewProps, FlexStyleProps, StyleProps } from './types';
+export interface BoxProps extends StyleProps, FlexStyleProps, BoxViewProps {
+}
+declare const Box: ({ children, style, testID, ...otherProps }: BoxProps) => JSX.Element;
+export default Box;

package/types/components/Box/types.d.ts

@@ -0,0 +1,31 @@
+import { StyleProp, ViewStyle, ViewProps } from 'react-native';
+import { SystemPalette } from '../../theme/global';
+import { BorderWidths, Radii } from '../../theme/global/borders';
+import { Space } from '../../theme/global/space';
+import { ConfigType, FlexPropsKeyType } from './config';
+export interface ThemeScale {
+    colors: keyof SystemPalette;
+    space: keyof Space;
+    radii: keyof Radii;
+    borderWidths: keyof BorderWidths;
+}
+declare type ConfigKeyType = keyof ConfigType;
+export declare type StyleProps = {
+    [key in ConfigKeyType]?: ThemeScale[ConfigType[key]['scale']];
+};
+export declare type FlexStyleProps = Pick<Omit<ViewStyle, keyof StyleProps>, FlexPropsKeyType>;
+export interface BoxViewProps extends ViewProps {
+    /**
+     * Box's content.
+     */
+    children?: React.ReactNode;
+    /**
+     * Addtional styles.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+}
+export {};

package/types/components/Button/LoadingIndicator/StyledLoadingIndicator.d.ts

@@ -3,18 +3,18 @@ import type { ViewProps } from 'react-native';
 import type { Theme } from '@emotion/react';
 declare type ThemeVariant = 'basic-transparent' | 'filled-primary' | 'filled-secondary' | 'filled-danger' | 'outlined-primary' | 'outlined-secondary' | 'outlined-danger' | 'text-primary' | 'text-secondary' | 'text-danger';
 declare const StyledLoadingIndicatorWrapper: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledLoadingDot: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: Theme;
+    as?: import("react").ElementType<any>;
 } & {
-    size?: number | undefined;
+    size?: number;
     themeVariant: ThemeVariant;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 export { StyledLoadingIndicatorWrapper, StyledLoadingDot };

package/types/components/Button/StyledButton.d.ts

@@ -3,37 +3,37 @@ import type { Theme } from '@emotion/react';
 declare type Intent = 'primary' | 'secondary' | 'danger';
 declare type ThemeVariant = 'basic-transparent' | 'filled-primary' | 'filled-secondary' | 'filled-danger' | 'outlined-primary' | 'outlined-secondary' | 'outlined-danger' | 'text-primary' | 'text-secondary' | 'text-danger';
 declare const StyledButtonContainer: import("@emotion/native").StyledComponent<import("react-native").TouchableHighlightProps & {
-    theme?: Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: Theme;
+    as?: import("react").ElementType<any>;
 } & {
-    disabled?: boolean | undefined;
-    pressed?: boolean | undefined;
+    disabled?: boolean;
+    pressed?: boolean;
     themeVariant: ThemeVariant;
 }, {}, {
-    ref?: import("react").Ref<TouchableHighlight> | undefined;
+    ref?: import("react").Ref<TouchableHighlight>;
 }>;
 declare const StyledButtonText: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: Theme;
+    as?: import("react").ElementType<any>;
 } & {
-    disabled?: boolean | undefined;
-    pressed?: boolean | undefined;
+    disabled?: boolean;
+    pressed?: boolean;
     themeVariant: ThemeVariant;
 }, {}, {}>;
 declare const StyledButtonIconWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: Theme;
+    as?: import("react").ElementType<any>;
 } & {
     themePosition: 'left' | 'right';
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 declare const StyledButtonIcon: import("@emotion/native").StyledComponent<import("../Icon").IconProps & {
-    theme?: Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: Theme;
+    as?: import("react").ElementType<any>;
 } & {
-    disabled?: boolean | undefined;
-    pressed?: boolean | undefined;
+    disabled?: boolean;
+    pressed?: boolean;
     themeVariant: ThemeVariant;
 }, {}, {}>;
 export { StyledButtonContainer, StyledButtonText, StyledButtonIconWrapper, StyledButtonIcon, };

package/types/components/Button/UtilityButton/StyledUtilityButton.d.ts

@@ -1,17 +1,17 @@
 import { View, TouchableOpacity } from 'react-native';
 export declare const ButtonContainer: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<TouchableOpacity> | undefined;
+    ref?: import("react").Ref<TouchableOpacity>;
 }>;
 export declare const IconWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {
-    ref?: import("react").Ref<View> | undefined;
+    ref?: import("react").Ref<View>;
 }>;
 export declare const ButtonText: import("@emotion/native").StyledComponent<import("../../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme | undefined;
-    as?: import("react").ElementType<any> | undefined;
+    theme?: import("@emotion/react").Theme;
+    as?: import("react").ElementType<any>;
 }, {}, {}>;