@hero-design/rn 7.24.0 → 7.25.1

package/types/components/SectionHeading/StyledHeading.d.ts

@@ -1,20 +1,20 @@
 import { View } from 'react-native';
 declare const StyledHeading: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledIconWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export { StyledHeading, StyledIconWrapper, StyledWrapper };

package/types/components/Select/MultiSelect/Option.d.ts

@@ -1,7 +1,7 @@
 import type { ReactElement } from 'react';
 declare const Option: ({ text, disabled, selected, onPress, }: {
     text: string | ReactElement;
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     selected: boolean;
     onPress: () => void;
 }) => JSX.Element;

package/types/components/Select/SingleSelect/Option.d.ts

@@ -1,7 +1,7 @@
 import type { ReactElement } from 'react';
 declare const Option: ({ text, disabled, selected, onPress, }: {
     text: string | ReactElement;
-    disabled?: boolean;
+    disabled?: boolean | undefined;
     selected: boolean;
     onPress: () => void;
 }) => JSX.Element;

package/types/components/Select/StyledSelect.d.ts

@@ -1,24 +1,24 @@
 import { View } from 'react-native';
 declare const SectionSpacer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const OptionSpacer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const FooterText: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledSearchBar: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export { SectionSpacer, OptionSpacer, FooterText, StyledSearchBar };

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

@@ -1,5 +1,5 @@
 import type { SectionData, CombinedOptionsType, OptionType } from './types';
-export declare const getKey: <V, T extends OptionType<V>>(option: T, index: number, keyExtractor?: (opt: T, i?: number) => string) => import("react").Key;
+export declare const getKey: <V, T extends OptionType<V>>(option: T, index: number, keyExtractor?: ((opt: T, i?: number | undefined) => string) | undefined) => import("react").Key;
 export declare const isSections: <V, T extends OptionType<V>>(options: CombinedOptionsType<V, T>) => options is SectionData<V, T>[];
 export declare const toSections: <V, T extends OptionType<V>>(options: CombinedOptionsType<V, T>) => SectionData<V, T>[];
 export declare const toFlatOptions: <V, T extends OptionType<V>>(options: CombinedOptionsType<V, T>) => OptionType<V>[];

package/types/components/Spinner/StyledSpinner.d.ts

@@ -1,34 +1,34 @@
 import { View } from 'react-native';
 import type { ViewProps } from 'react-native';
 declare const StyledView: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSpinnerContainer: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSpinnerRow: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themePosition: 'top' | 'bottom';
     themeSize: 'small' | 'medium';
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSpinnerDot: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themePosition: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
     themeSize: 'small' | 'medium';
     themeIntent: 'primary' | 'inverted';
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export { StyledView, StyledSpinnerContainer, StyledSpinnerRow, StyledSpinnerDot, };

package/types/components/Swipeable/StyledSwipeable.d.ts

@@ -1,10 +1,10 @@
 import { TouchableOpacity } from 'react-native';
 export declare type ActionIntent = 'primary' | 'success' | 'danger';
 export declare const StyledRectButton: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeIntent: ActionIntent;
 }, {}, {
-    ref?: import("react").Ref<TouchableOpacity>;
+    ref?: import("react").Ref<TouchableOpacity> | undefined;
 }>;

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

@@ -1,7 +1,7 @@
-import { ReactNode } from 'react';
-import type { SwipeableProps as RnghSwipeableProps } from 'react-native-gesture-handler/Swipeable';
-import { RectButton } from 'react-native-gesture-handler';
+import { ComponentProps, ReactNode } from 'react';
+import { Swipeable as RnghSwipeable, RectButton } from 'react-native-gesture-handler';
 declare type State = 'closed' | 'leftOpen' | 'rightOpen';
+declare type RnghSwipeableProps = ComponentProps<typeof RnghSwipeable>;
 export interface SwipeableProps extends Pick<RnghSwipeableProps, 'enableTrackpadTwoFingerGesture' | 'friction' | 'leftThreshold' | 'rightThreshold' | 'overshootLeft' | 'overshootRight' | 'overshootFriction' | 'useNativeAnimations' | 'containerStyle' | 'childrenContainerStyle'> {
     /**
      * React node that is swipeable.
@@ -33,6 +33,10 @@ export interface SwipeableProps extends Pick<RnghSwipeableProps, 'enableTrackpad
      * By default, it will take up the whole width of the device.
      */
     rightActionsWidth?: number;
+    /**
+     * Testing ID of the component
+     */
+    testID?: string;
 }
 declare const _default: (({ children, state, onStateChange, leftActions, leftActionsWidth, rightActions, rightActionsWidth, ...swipeableProps }: SwipeableProps) => JSX.Element) & {
     Action: ({ intent, onPress, style, children, testID, }: import("./SwipeableAction").SwipeableActionProps) => JSX.Element;

package/types/components/Switch/SelectorSwitch/Option.d.ts

@@ -2,7 +2,9 @@ import type { ReactElement } from 'react';
 import type { BadgeConfigType, OptionType } from '.';
 export declare const OptionContent: ({ content, badge, }: {
     content: ReactElement;
-    badge?: BadgeConfigType;
+    badge?: {
+        type: "status";
+    } | undefined;
 }) => JSX.Element;
 declare const Option: <T>({ text, icon, badge, selected, }: Pick<OptionType<T>, "text" | "icon" | "badge"> & {
     selected: boolean;

package/types/components/Switch/SelectorSwitch/StyledSelectorSwitch.d.ts

@@ -1,19 +1,19 @@
 import { View } from 'react-native';
 export declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export declare const StyledTextWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export declare const StyledIconWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;

package/types/components/Switch/StyledSwitch.d.ts

@@ -2,19 +2,19 @@ import { Animated, View } from 'react-native';
 declare type ThemeSize = 'small' | 'medium';
 export declare type Variant = 'checked' | 'unchecked' | 'disabled-checked' | 'disabled-unchecked';
 declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: Variant;
     themeSize: ThemeSize;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledKnot: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeSize: ThemeSize;
 }, {}, {}>;

package/types/components/Tabs/StyledScrollableTabs.d.ts

@@ -1,26 +1,26 @@
 import { Animated, View } from 'react-native';
 import PagerView from 'react-native-pager-view';
 declare const TabScreen: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const TabContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const ContentWrapper: import("@emotion/native").StyledComponent<import("react-native-pager-view").PagerViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<PagerView>;
+    ref?: import("react").Ref<PagerView> | undefined;
 }>;
 declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeInsets: {
         top: number;
@@ -29,34 +29,34 @@ declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import
         left: number;
     };
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabItem: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
-    isFirstItem?: boolean;
+    isFirstItem?: boolean | undefined;
 }, {}, {}>;
 declare const HeaderTabItemOutlineWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabItemOutline: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeActive: boolean;
 }, {}, {}>;
 declare const HeaderTabItemWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export { HeaderTabItem, TabScreen, TabContainer, HeaderTabWrapper, ContentWrapper, HeaderTabItemOutlineWrapper, HeaderTabItemOutline, HeaderTabItemWrapper, };

package/types/components/Tabs/StyledTabs.d.ts

@@ -1,14 +1,14 @@
 import { Animated, View } from 'react-native';
 import PagerView from 'react-native-pager-view';
 declare const TabContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeInsets: {
         top: number;
@@ -17,44 +17,44 @@ declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import
         left: number;
     };
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTab: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabItem: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const ContentWrapper: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native-pager-view").PagerViewProps & import("react").RefAttributes<PagerView>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const TabScreen: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledIndicator: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
     children?: import("react").ReactNode;
 } & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeWidth: number;
 }, {}, {}>;
 declare const StyledBadgeWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export { TabContainer, HeaderTabWrapper, HeaderTab, HeaderTabItem, ContentWrapper, TabScreen, StyledIndicator, StyledBadgeWrapper, };

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

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

package/types/components/TextInput/StyledTextInput.d.ts

@@ -1,104 +1,104 @@
 import { TextInput, View } from 'react-native';
 export declare type Variant = 'default' | 'filled' | 'disabled' | 'readonly' | 'error';
 declare const StyledContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledLabelContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledLabel: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: Variant;
 }, {}, {}>;
 declare const StyledAsteriskLabel: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: Variant;
 }, {}, {}>;
 declare const StyledLabelContainerInsideTextInput: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledLabelInsideTextInput: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: Variant;
 }, {}, {}>;
 declare const StyledAsteriskLabelInsideTextInput: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: Variant;
 }, {}, {}>;
 declare const StyledErrorContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledError: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledMaxLengthMessage: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: Variant;
 }, {}, {}>;
 declare const StyledHelperText: import("@emotion/native").StyledComponent<import("../Typography/Text").TextProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledTextInput: import("@emotion/native").StyledComponent<import("react-native").TextInputProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<TextInput>;
+    ref?: import("react").Ref<TextInput> | undefined;
 }>;
 declare const StyledBorderBackDrop: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 } & {
     themeVariant: Variant;
     themeFocused: boolean;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledTextInputContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledTextInputAndLabelContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledErrorAndHelpTextContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledErrorAndMaxLengthContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export { StyledTextInputContainer, StyledLabel, StyledLabelContainer, StyledAsteriskLabel, StyledAsteriskLabelInsideTextInput, StyledTextInput, StyledError, StyledMaxLengthMessage, StyledLabelInsideTextInput, StyledContainer, StyledErrorContainer, StyledHelperText, StyledTextInputAndLabelContainer, StyledLabelContainerInsideTextInput, StyledErrorAndHelpTextContainer, StyledBorderBackDrop, StyledErrorAndMaxLengthContainer, };

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

@@ -54,12 +54,12 @@ export interface TextInputProps extends NativeTextInputProps {
     renderInputValue?: (inputProps: NativeTextInputProps) => React.ReactNode;
 }
 export declare const getVariant: ({ disabled, error, editable, loading, isEmptyValue, }: {
-    disabled?: boolean;
-    error?: string;
-    editable?: boolean;
+    disabled?: boolean | undefined;
+    error?: string | undefined;
+    editable?: boolean | undefined;
     loading: boolean;
-    isFocused?: boolean;
-    isEmptyValue?: boolean;
+    isFocused?: boolean | undefined;
+    isEmptyValue?: boolean | undefined;
 }) => Variant;
 declare const TextInput: ({ label, prefix, suffix, style, textStyle, testID, accessibilityLabelledBy, error, required, editable, disabled, loading, maxLength, helpText, value, defaultValue, renderInputValue, ...nativeProps }: TextInputProps) => JSX.Element;
 export default TextInput;

package/types/components/TimePicker/StyledTimePicker.d.ts

@@ -1,9 +1,9 @@
 import { View } from 'react-native';
 import type { ViewProps } from 'react-native';
 declare const StyledPickerWrapper: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: import("react").ElementType<any>;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
 }, {}, {
-    ref?: import("react").Ref<View>;
+    ref?: import("react").Ref<View> | undefined;
 }>;
 export { StyledPickerWrapper };