@hero-design/rn 8.82.2-alpha.1 → 8.83.0-test.0

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

@@ -1,53 +1,8 @@
-import React from 'react';
-import { StyleProp, ViewStyle } from 'react-native';
-export interface SliderProps {
-    /**
-     * Minimum value of the slider.
-     * Defaults to 0.
-     */
-    minimumValue?: number;
-    /**
-     * Maximum value of the slider.
-     * Defaults to 1.
-     */
-    maximumValue?: number;
-    /**
-     * Step value of the slider.
-     * The value should be between 0 and (maximumValue - minimumValue).
-     * Defaults to 0.
-     */
-    step?: number;
-    /**
-     * Value of the slider.
-     * Defaults to 0.
-     */
-    value?: number;
-    /**
-     * Callback continuously called while the user is dragging the slider.
-     */
-    onValueChange?: (value: number) => void;
-    /**
-     * Callback that is called when the user picks up the slider.
-     * The initial value is passed as an argument to the callback handler.
-     */
-    onSlidingStart?: (value: number) => void;
-    /**
-     * Callback that is called when the user releases the slider, regardless if the value has changed.
-     * The current value is passed as an argument to the callback handler.
-     */
-    onSlidingComplete?: (value: number) => void;
-    /**
-     * Whether the slider is disabled.
-     */
-    disabled?: boolean;
-    /**
-     * Additional style.
-     */
-    style?: StyleProp<ViewStyle>;
-    /**
-     * Testing id of the component.
-     */
-    testID?: string;
+import type { FunctionComponent } from 'react';
+import type { SingleSliderProps } from './Single';
+import Range from './Range';
+interface SliderProps extends FunctionComponent<SingleSliderProps> {
+    Range: typeof Range;
 }
-declare const Slider: ({ minimumValue, maximumValue, step, value, onValueChange, onSlidingStart, onSlidingComplete, disabled, style, testID, }: SliderProps) => React.JSX.Element;
+declare const Slider: SliderProps;
 export default Slider;

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

@@ -1,6 +1,6 @@
 import React from 'react';
 declare const AnimatedSpinner: ({ size, intent, }: {
-    size: "small" | "medium";
-    intent: "primary" | "inverted";
+    size: 'small' | 'medium';
+    intent: 'primary' | 'inverted';
 }) => React.JSX.Element;
 export { AnimatedSpinner };

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

@@ -1,33 +1,33 @@
 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?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSpinnerContainer: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSpinnerRow: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
-    themePosition: "top" | "bottom";
-    themeSize: "small" | "medium";
+    themePosition: 'top' | 'bottom';
+    themeSize: 'small' | 'medium';
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSpinnerDot: import("@emotion/native").StyledComponent<ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
-    themePosition: "topLeft" | "topRight" | "bottomLeft" | "bottomRight";
-    themeSize: "small" | "medium";
-    themeIntent: "primary" | "inverted";
+    themePosition: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
+    themeSize: 'small' | 'medium';
+    themeIntent: 'primary' | 'inverted';
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;

package/types/components/Success/StyledSuccess.d.ts

@@ -1,49 +1,49 @@
 import { View } from 'react-native';
-type SuccessVariant = 'full-screen' | 'in-page';
+declare type SuccessVariant = 'full-screen' | 'in-page';
 declare const StyledSuccessContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeVariant: SuccessVariant;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSuccessImage: import("@emotion/native").StyledComponent<import("../Image").ImageProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {}>;
 declare const StyledSuccessContent: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSuccessImageContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSuccessTitle: import("@emotion/native").StyledComponent<import("../Typography/Title").TitleProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {}>;
 declare const StyledSuccessDescription: import("@emotion/native").StyledComponent<import("../Typography/Body").BodyProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {}>;
 declare const StyledSuccessButtonContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSuccessButtonPrimary: import("@emotion/native").StyledComponent<import("../Button/Button").ButtonProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {}>;
 declare const StyledSuccessModal: import("@emotion/native").StyledComponent<import("../Modal").ModalProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {}>;
 export { SuccessVariant, StyledSuccessImage, StyledSuccessContainer, StyledSuccessContent, StyledSuccessImageContainer, StyledSuccessTitle, StyledSuccessDescription, StyledSuccessButtonContainer, StyledSuccessButtonPrimary, StyledSuccessModal, };

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

@@ -1,8 +1,8 @@
 import { TouchableOpacity } from 'react-native';
-export type ActionIntent = 'primary' | 'success' | 'danger';
+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?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeIntent: ActionIntent;
 }, {}, {

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

@@ -1,7 +1,7 @@
 import React, { ComponentProps, ReactNode } from 'react';
 import { Swipeable as RnghSwipeable } from 'react-native-gesture-handler';
-type State = 'closed' | 'leftOpen' | 'rightOpen';
-type RnghSwipeableProps = ComponentProps<typeof RnghSwipeable>;
+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.

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

@@ -4,11 +4,13 @@ import { LayoutChangeEvent } from 'react-native';
 import type { BadgeConfigType, OptionType } from '.';
 export declare const OptionContent: ({ content, badge, }: {
     content: ReactElement;
-    badge?: BadgeConfigType;
+    badge?: {
+        type: "status";
+    } | undefined;
 }) => React.JSX.Element;
 declare const Option: <T>({ text, icon, badge, selected, onLayout, index, }: Pick<OptionType<T>, "text" | "icon" | "badge"> & {
     selected: boolean;
-    onLayout?: (e: LayoutChangeEvent) => void;
-    index?: number;
+    onLayout?: ((e: LayoutChangeEvent) => void) | undefined;
+    index?: number | undefined;
 }) => ReactElement;
 export default Option;

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

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

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

@@ -1,11 +1,11 @@
 import { ReactElement } from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 import type { IconName } from '../../Icon';
-type StatusBadgeType = {
+declare type StatusBadgeType = {
     type: 'status';
 };
-export type BadgeConfigType = StatusBadgeType;
-export type OptionType<T> = {
+export declare type BadgeConfigType = StatusBadgeType;
+export declare type OptionType<T> = {
     value: T;
     text: string;
     icon: IconName;

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

@@ -1,15 +1,15 @@
 import { Animated, View } from 'react-native';
-export type Variant = 'checked' | 'unchecked' | 'disabled-checked' | 'disabled-unchecked';
+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?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeVariant: Variant;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledKnot: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {}>;
 export { StyledWrapper, StyledKnot };

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

@@ -1,4 +1,4 @@
-import type { ReactElement } from 'react';
+import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 export interface SwitchProps {
     /**
@@ -22,7 +22,7 @@ export interface SwitchProps {
      */
     testID?: string;
 }
-declare const _default: (({ disabled, checked, onPress, style, testID, }: SwitchProps) => ReactElement) & {
-    Selector: <T>({ options, value, onPress, style, testID, }: import("./SelectorSwitch").SelectorSwitchProps<T>) => ReactElement;
+declare const _default: (({ disabled, checked, onPress, style, testID, }: SwitchProps) => React.ReactElement<any, string | React.JSXElementConstructor<any>>) & {
+    Selector: <T>({ options, value, onPress, style, testID, }: import("./SelectorSwitch").SelectorSwitchProps<T>) => React.ReactElement<any, string | React.JSXElementConstructor<any>>;
 };
 export default _default;

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

@@ -3,8 +3,8 @@ declare const SceneView: ({ lazy, lazyPreloadDistance, children, index, selected
     children: React.ReactNode;
     index: number;
     selectedIndex: number;
-    lazy?: boolean;
-    lazyPreloadDistance?: number;
-    testID?: string;
+    lazy?: boolean | undefined;
+    lazyPreloadDistance?: number | undefined;
+    testID?: string | undefined;
 }) => React.JSX.Element;
 export default SceneView;

package/types/components/Tabs/ScrollableTabsHeader/hooks/useInitHighlightedAnimation.d.ts

@@ -1,8 +1,8 @@
 import { Animated } from 'react-native';
 declare const useInitHighlightedAnimation: ({ selectedIndex, tabsLength, variant, }: {
-    selectedIndex?: number;
+    selectedIndex?: number | undefined;
     tabsLength: number;
-    variant: "underlined" | "highlighted";
+    variant: 'underlined' | 'highlighted';
 }) => {
     tabsAnims: Animated.Value[];
 };

package/types/components/Tabs/ScrollableTabsHeader/hooks/useInitUnderlinedAnimation.d.ts

@@ -1,8 +1,8 @@
 import { Animated } from 'react-native';
 declare const useInitUnderlinedAnimation: ({ tabsLength, selectedIndex, variant, }: {
     tabsLength: number;
-    selectedIndex?: number;
-    variant: "underlined" | "highlighted";
+    selectedIndex?: number | undefined;
+    variant: 'underlined' | 'highlighted';
 }) => {
     underlinedTranslateX: Animated.AnimatedInterpolation<string | number>[];
     underlinedOpacity: Animated.AnimatedInterpolation<string | number>[];

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

@@ -0,0 +1,35 @@
+import { StyleProp, ViewStyle, ViewProps } from 'react-native';
+import type { TabType } from '.';
+export interface ScrollableTabHeaderProps extends ViewProps {
+    /**
+     * Callback which is called on tab press, receiving key of upcoming active Tab.
+     */
+    onTabPress: (key: string) => void;
+    /**
+     * Current selected tab key.
+     */
+    selectedIndex?: number;
+    /**
+     * List of Tabs to be rendered. Each Tab must have an unique key.
+     */
+    tabs: TabType[];
+    /**
+     * Style for the tab navigation bar.
+     */
+    barStyle?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * component insets
+     */
+    insets?: {
+        top: number;
+        bottom: number;
+        right: number;
+        left: number;
+    };
+}
+declare const ScrollableTabHeader: ({ onTabPress, selectedIndex, tabs, barStyle, testID, insets, }: ScrollableTabHeaderProps) => JSX.Element;
+export default ScrollableTabHeader;

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

@@ -1,19 +1,19 @@
 import { Animated, View } from 'react-native';
 declare const TabScreen: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const TabContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeInsets: {
         top: number;
@@ -25,31 +25,31 @@ declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabItem: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
-    isFirstItem?: boolean;
+    isFirstItem?: boolean | undefined;
 }, {}, {}>;
 declare const HeaderTabItemOutlineWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabItemOutline: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeActive: boolean;
 }, {}, {}>;
 declare const HeaderTabItemWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabItemIndicator: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {}>;
 export { HeaderTabItem, TabScreen, TabContainer, HeaderTabWrapper, HeaderTabItemOutlineWrapper, HeaderTabItemOutline, HeaderTabItemWrapper, HeaderTabItemIndicator, };

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

@@ -1,13 +1,13 @@
 import { Animated, View } from 'react-native';
 declare const TabContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeInsets: {
         top: number;
@@ -19,32 +19,32 @@ declare const HeaderTabWrapper: import("@emotion/native").StyledComponent<import
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTab: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const HeaderTabItem: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const TabScreen: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledIndicator: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeWidth: number;
 }, {}, {}>;
 declare const StyledBadgeWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;

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

@@ -1,13 +1,13 @@
 import React, { ReactNode } from 'react';
-export type StatusBadgeType = {
+export declare type StatusBadgeType = {
     type: 'status';
 };
-export type CounterBadgeType = {
+export declare type CounterBadgeType = {
     type: 'counter';
     value: number;
     max?: number;
 };
-export type BadgeConfigType = StatusBadgeType | CounterBadgeType;
+export declare type BadgeConfigType = StatusBadgeType | CounterBadgeType;
 interface TabWithBadgeProps {
     config?: BadgeConfigType;
     tabItem: ReactNode;

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

@@ -3,10 +3,10 @@ import React from 'react';
 import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
 import { IconName } from '../Icon';
 import type { BadgeConfigType } from './TabWithBadge';
-export type ItemType = string | IconName | ((props: {
+export declare type ItemType = string | IconName | ((props: {
     color: string;
 }) => ReactNode);
-export type TabType = {
+export declare type TabType = {
     key: string;
     activeItem: ItemType;
     inactiveItem?: ItemType;

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

@@ -1,7 +1,7 @@
 import { NativeSyntheticEvent } from 'react-native';
 declare const useHandlePageScroll: () => {
     onPageScrollStateChanged: (e: NativeSyntheticEvent<Readonly<{
-        pageScrollState: "idle" | "dragging" | "settling";
+        pageScrollState: 'idle' | 'dragging' | 'settling';
     }>>) => void;
     hasScrolled: import("react").MutableRefObject<boolean>;
 };

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

@@ -1,16 +1,16 @@
 import { View } from 'react-native';
-type ThemeIntent = 'primary' | 'info' | 'success' | 'warning' | 'danger' | 'archived';
+declare type ThemeIntent = 'primary' | 'info' | 'success' | 'warning' | 'danger' | 'archived';
 declare const StyledView: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeIntent: ThemeIntent;
 }, {}, {
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledText: import("@emotion/native").StyledComponent<import("../Typography/Caption").CaptionProps & {
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
 } & {
     themeIntent: ThemeIntent;
 }, {}, {}>;