@hero-design/rn 8.42.4 → 8.43.1

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

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 export interface ModalProps {
     /**
      * Content of the modal.
@@ -33,5 +33,5 @@ export interface ModalProps {
      */
     onDismiss?: () => void;
 }
-declare const ModalWrapper: ({ visible, ...props }: ModalProps) => JSX.Element | null;
+declare const ModalWrapper: ({ visible, ...props }: ModalProps) => React.JSX.Element | null;
 export default ModalWrapper;

package/types/components/PageControl/StyledPageControl.d.ts

@@ -7,8 +7,6 @@ declare const StyledPageControl: import("@emotion/native").StyledComponent<impor
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledPageControlAnimatedView: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 export interface PageControlProps {
     /**
@@ -17,5 +18,5 @@ export interface PageControlProps {
      */
     testID?: string;
 }
-declare const PageControl: ({ numberOfPages, currentPage, testID, style, }: PageControlProps) => JSX.Element;
+declare const PageControl: ({ numberOfPages, currentPage, testID, style, }: PageControlProps) => React.JSX.Element;
 export default PageControl;

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

@@ -1,8 +1,9 @@
+import React from 'react';
 import type { State } from './StyledPinInput';
 declare function PinCell({ value, secure, focused, state, }: {
     value: string;
     secure?: boolean;
     focused?: boolean;
     state?: State;
-}): JSX.Element;
+}): React.JSX.Element;
 export default PinCell;

package/types/components/Portal/PortalHost.d.ts

@@ -2,4 +2,4 @@ import React from 'react';
 export interface PortalHostProps {
     name: string;
 }
-export declare const PortalHost: React.MemoExoticComponent<({ name }: PortalHostProps) => JSX.Element>;
+export declare const PortalHost: React.MemoExoticComponent<({ name }: PortalHostProps) => React.JSX.Element>;

package/types/components/Portal/PortalProvider.d.ts

@@ -4,4 +4,4 @@ export interface PortalProviderProps {
     rootHostName?: string;
     children: ReactNode | ReactNode[];
 }
-export declare const PortalProvider: React.MemoExoticComponent<({ rootHostName, children, }: PortalProviderProps) => JSX.Element>;
+export declare const PortalProvider: React.MemoExoticComponent<({ rootHostName, children, }: PortalProviderProps) => React.JSX.Element>;

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

@@ -12,7 +12,7 @@ export interface PortalProps {
 declare const _default: React.NamedExoticComponent<PortalProps> & {
     readonly type: ({ name, hostName, children, theme }: PortalProps) => null;
 } & {
-    Provider: React.MemoExoticComponent<({ rootHostName, children, }: import("./PortalProvider").PortalProviderProps) => JSX.Element>;
-    Host: React.MemoExoticComponent<({ name }: import("./PortalHost").PortalHostProps) => JSX.Element>;
+    Provider: React.MemoExoticComponent<({ rootHostName, children, }: import("./PortalProvider").PortalProviderProps) => React.JSX.Element>;
+    Host: React.MemoExoticComponent<({ name }: import("./PortalHost").PortalHostProps) => React.JSX.Element>;
 };
 export default _default;

package/types/components/Progress/ProgressBar.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { StyleProp, ViewStyle, ViewProps } from 'react-native';
 export interface ProgressBarProps extends ViewProps {
     /**

package/types/components/Progress/StyledProgressBar.d.ts

@@ -11,8 +11,6 @@ declare const StyledWrapper: import("@emotion/native").StyledComponent<ViewProps
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledInner: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 declare const Progress: {
     readonly Circle: ({ value, renderValue, intent, style, testID, ...nativeProps }: import("./ProgressCircle").ProgressCircleProps) => JSX.Element;
     readonly Bar: ({ value, intent, style, testID, ...nativeProps }: import("./ProgressBar").ProgressBarProps) => JSX.Element;

package/types/components/Rate/StyledRate.d.ts

@@ -5,8 +5,6 @@ declare const StyledWrapper: import("@emotion/native").StyledComponent<import(".
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledIconWrapper: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ViewProps } from 'react-native';
 export interface RateOption<T extends string | number> {
     value: T;
@@ -24,5 +25,5 @@ export interface RateProps<T extends string | number> extends ViewProps {
      */
     disabled?: boolean;
 }
-declare const Rate: <T extends string | number>({ options, value, onChange, readonly, disabled, ...otherProps }: RateProps<T>) => JSX.Element;
+declare const Rate: <T extends string | number>({ options, value, onChange, readonly, disabled, ...otherProps }: RateProps<T>) => React.JSX.Element;
 export default Rate;

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

@@ -1,4 +1,5 @@
+import React from 'react';
 import { RefreshControlProps as NativeRefreshControlProps } from 'react-native';
 export type RefreshControlProps = Omit<NativeRefreshControlProps, 'colors' | 'tintColor'>;
-declare const RefreshControl: ({ ...props }: RefreshControlProps) => JSX.Element;
+declare const RefreshControl: ({ ...props }: RefreshControlProps) => React.JSX.Element;
 export default RefreshControl;

package/types/components/RichTextEditor/EditorToolbar.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ToolbarButtonName } from './types';
 export interface EditorToolbarProps {
     /**
@@ -13,5 +14,5 @@ export interface EditorToolbarProps {
      */
     testID?: string;
 }
-declare const EditorToolbar: ({ name, buttons, testID, }: EditorToolbarProps) => JSX.Element | null;
+declare const EditorToolbar: ({ name, buttons, testID, }: EditorToolbarProps) => React.JSX.Element | null;
 export default EditorToolbar;

package/types/components/RichTextEditor/MentionList.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 interface OnSelectOptionsType<TMetaData> {
     highlighted: boolean;
     meta?: TMetaData;
@@ -12,5 +13,5 @@ export interface MentionListProps<TMetaData = unknown> {
      */
     render: (searchText: string, onSelect: (id: string, name: string, options?: OnSelectOptionsType<TMetaData>) => void) => JSX.Element;
 }
-declare const MentionList: <TMetaData>({ name: eventPrefix, render, }: MentionListProps<TMetaData>) => JSX.Element | null;
+declare const MentionList: <TMetaData>({ name: eventPrefix, render, }: MentionListProps<TMetaData>) => React.JSX.Element | null;
 export default MentionList;

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

@@ -2,7 +2,7 @@
 import type { RichTextEditorProps, RichTextEditorRef } from './RichTextEditor';
 export type { RichTextEditorProps, RichTextEditorRef };
 declare const _default: import("react").ForwardRefExoticComponent<Omit<RichTextEditorProps, "forwardedRef"> & import("react").RefAttributes<RichTextEditorRef>> & {
-    MentionList: <TMetaData>({ name: eventPrefix, render, }: import("./MentionList").MentionListProps<TMetaData>) => JSX.Element | null;
-    Toolbar: ({ name, buttons, testID, }: import("./EditorToolbar").EditorToolbarProps) => JSX.Element | null;
+    MentionList: <TMetaData>({ name: eventPrefix, render, }: import("./MentionList").MentionListProps<TMetaData>) => import("react").JSX.Element | null;
+    Toolbar: ({ name, buttons, testID, }: import("./EditorToolbar").EditorToolbarProps) => import("react").JSX.Element | null;
 };
 export default _default;

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

@@ -4,5 +4,5 @@ import type { OptionType, SelectProps, SectionType } from './types';
 export type BaseOptionListProps<V, T extends OptionType<V>> = Pick<SelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange'> & {
     sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
 } & SectionListProps<T, SectionType>;
-declare const BaseOptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onQueryChange, sections, renderItem, sectionListRef, ...rest }: BaseOptionListProps<V, T>) => JSX.Element;
+declare const BaseOptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onQueryChange, sections, renderItem, sectionListRef, ...rest }: BaseOptionListProps<V, T>) => React.JSX.Element;
 export default BaseOptionList;

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

@@ -1,5 +1,6 @@
+import React from 'react';
 declare const Footer: ({ label, onPress }: {
     label: string;
     onPress: () => void;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export default Footer;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactElement } from 'react';
 declare const Option: ({ text, disabled, selected, onPress, highlighted, }: {
     text: string | ReactElement;
@@ -5,5 +6,5 @@ declare const Option: ({ text, disabled, selected, onPress, highlighted, }: {
     selected: boolean;
     onPress: () => void;
     highlighted?: boolean | undefined;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export default Option;

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

@@ -1,8 +1,9 @@
+import React from 'react';
 import { BaseOptionListProps } from '../BaseOptionList';
 import type { MultiSelectProps } from '.';
 import type { OptionType } from '../types';
 type OptionListProps<V, T extends OptionType<V>> = Pick<MultiSelectProps<V, T>, 'keyExtractor' | 'loading' | 'onEndReached' | 'onQueryChange' | 'value' | 'renderOption'> & {
     onPress: (value: V[]) => void;
 } & BaseOptionListProps<V, T>;
-declare const OptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, sections, renderOption, value, sectionListRef, ...rest }: OptionListProps<V, T>) => JSX.Element;
+declare const OptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, sections, renderOption, value, sectionListRef, ...rest }: OptionListProps<V, T>) => React.JSX.Element;
 export default OptionList;

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

@@ -22,5 +22,5 @@ export interface MultiSelectProps<V, T extends OptionType<V> = OptionType<V>> ex
      */
     renderSelectedValue?: (selectedValue: V[], inputProps: NativeTextInputProps) => React.ReactNode;
 }
-declare function MultiSelect<V, T extends OptionType<V>>({ footerLabel, label, loading, inputProps, onConfirm, onDismiss, onEndReached, onQueryChange, options, renderOption, renderSelectedValue, query, error, editable, disabled, required, style, testID, value, }: MultiSelectProps<V, T>): JSX.Element;
+declare function MultiSelect<V, T extends OptionType<V>>({ footerLabel, label, loading, inputProps, onConfirm, onDismiss, onEndReached, onQueryChange, options, renderOption, renderSelectedValue, query, error, editable, disabled, required, style, testID, value, }: MultiSelectProps<V, T>): React.JSX.Element;
 export default MultiSelect;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactElement } from 'react';
 declare const Option: ({ text, disabled, selected, onPress, highlighted, }: {
     text: string | ReactElement;
@@ -5,5 +6,5 @@ declare const Option: ({ text, disabled, selected, onPress, highlighted, }: {
     selected: boolean;
     onPress: () => void;
     highlighted?: boolean | undefined;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export default Option;

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

@@ -7,5 +7,5 @@ type OptionListProps<V, T extends OptionType<V>> = Pick<SingleSelectProps<V, T>,
     onPress: (value: V | null) => void;
     sectionListRef?: React.RefObject<SectionList<T, SectionType>>;
 } & BaseOptionListProps<V, T>;
-declare const OptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, sections, renderOption, value, sectionListRef, ...rest }: OptionListProps<V, T>) => JSX.Element;
+declare const OptionList: <V, T extends OptionType<V>>({ keyExtractor, loading, onEndReached, onPress, onQueryChange, sections, renderOption, value, sectionListRef, ...rest }: OptionListProps<V, T>) => React.JSX.Element;
 export default OptionList;

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

@@ -1 +1,2 @@
-export declare const StyledOptionList: <V, T extends import("../types").OptionType<V>>({ keyExtractor, loading, onEndReached, onQueryChange, sections, renderItem, sectionListRef, ...rest }: import("../BaseOptionList").BaseOptionListProps<V, T>) => JSX.Element;
+/// <reference types="react" />
+export declare const StyledOptionList: <V, T extends import("../types").OptionType<V>>({ keyExtractor, loading, onEndReached, onQueryChange, sections, renderItem, sectionListRef, ...rest }: import("../BaseOptionList").BaseOptionListProps<V, T>) => import("react").JSX.Element;

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

@@ -15,5 +15,5 @@ export interface SingleSelectProps<V, T extends OptionType<V> = OptionType<V>> e
      */
     renderSelectedValue?: (selectedValue: V | null, inputProps: NativeTextInputProps) => React.ReactNode;
 }
-declare const SingleSelect: <V, T extends OptionType<V>>({ label, loading, inputProps, onConfirm, onDismiss, onEndReached, onQueryChange, options, renderOption, renderSelectedValue, query, error, editable, disabled, required, style, testID, value, }: SingleSelectProps<V, T>) => JSX.Element;
+declare const SingleSelect: <V, T extends OptionType<V>>({ label, loading, inputProps, onConfirm, onDismiss, onEndReached, onQueryChange, options, renderOption, renderSelectedValue, query, error, editable, disabled, required, style, testID, value, }: SingleSelectProps<V, T>) => React.JSX.Element;
 export default SingleSelect;

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

@@ -1,6 +1,5 @@
-/// <reference types="react" />
 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) | undefined) => import("react").Key;
+export declare const getKey: <V, T extends OptionType<V>>(option: T, index: number, keyExtractor?: ((opt: T, i?: number) => string) | undefined) => string | number;
 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/Select/index.d.ts

@@ -1,8 +1,9 @@
+/// <reference types="react" />
 import MultiSelect from './MultiSelect';
 import type { MultiSelectProps } from './MultiSelect';
 import type { SingleSelectProps } from './SingleSelect';
 export type { MultiSelectProps, SingleSelectProps };
-declare const _default: (<V, T extends import("./types").OptionType<V>>({ label, loading, inputProps, onConfirm, onDismiss, onEndReached, onQueryChange, options, renderOption, renderSelectedValue, query, error, editable, disabled, required, style, testID, value, }: SingleSelectProps<V, T>) => JSX.Element) & {
+declare const _default: (<V, T extends import("./types").OptionType<V>>({ label, loading, inputProps, onConfirm, onDismiss, onEndReached, onQueryChange, options, renderOption, renderSelectedValue, query, error, editable, disabled, required, style, testID, value, }: SingleSelectProps<V, T>) => import("react").JSX.Element) & {
     Multi: typeof MultiSelect;
 };
 export default _default;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ViewProps } from 'react-native';
 export interface SkeletonProps extends ViewProps {
     /**
@@ -9,5 +10,5 @@ export interface SkeletonProps extends ViewProps {
      */
     variant?: 'circular' | 'rectangular' | 'rounded';
 }
-declare const Skeleton: ({ intent, variant, style, onLayout, ...props }: SkeletonProps) => JSX.Element;
+declare const Skeleton: ({ intent, variant, style, onLayout, ...props }: SkeletonProps) => React.JSX.Element;
 export default Skeleton;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 export interface SliderProps {
     /**
@@ -48,5 +49,5 @@ export interface SliderProps {
      */
     testID?: string;
 }
-declare const Slider: ({ minimumValue, maximumValue, step, value, onValueChange, onSlidingStart, onSlidingComplete, disabled, style, testID, }: SliderProps) => JSX.Element;
+declare const Slider: ({ minimumValue, maximumValue, step, value, onValueChange, onSlidingStart, onSlidingComplete, disabled, style, testID, }: SliderProps) => React.JSX.Element;
 export default Slider;

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

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

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

@@ -40,8 +40,6 @@ declare const StyledSuccessButtonContainer: import("@emotion/native").StyledComp
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledSuccessButtonPrimary: import("@emotion/native").StyledComponent<import("../Button/Button").ButtonProps & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;

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

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 import { ActionIntent } from './StyledSwipeable';
 export interface SwipeableActionProps {
@@ -23,5 +23,5 @@ export interface SwipeableActionProps {
      */
     testID?: string;
 }
-declare const SwipeableAction: ({ intent, onPress, style, children, testID, }: SwipeableActionProps) => JSX.Element;
+declare const SwipeableAction: ({ intent, onPress, style, children, testID, }: SwipeableActionProps) => React.JSX.Element;
 export default SwipeableAction;

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

@@ -1,4 +1,4 @@
-import { ComponentProps, ReactNode } from 'react';
+import React, { ComponentProps, ReactNode } from 'react';
 import { RectButton, Swipeable as RnghSwipeable } from 'react-native-gesture-handler';
 type State = 'closed' | 'leftOpen' | 'rightOpen';
 type RnghSwipeableProps = ComponentProps<typeof RnghSwipeable>;
@@ -38,8 +38,8 @@ export interface SwipeableProps extends Pick<RnghSwipeableProps, 'enableTrackpad
      */
     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;
+declare const _default: (({ children, state, onStateChange, leftActions, leftActionsWidth, rightActions, rightActionsWidth, ...swipeableProps }: SwipeableProps) => React.JSX.Element) & {
+    Action: ({ intent, onPress, style, children, testID, }: import("./SwipeableAction").SwipeableActionProps) => React.JSX.Element;
     Content: typeof RectButton;
 };
 export default _default;

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

@@ -1,4 +1,5 @@
 import type { ReactElement } from 'react';
+import React from 'react';
 import { LayoutChangeEvent } from 'react-native';
 import type { BadgeConfigType, OptionType } from '.';
 export declare const OptionContent: ({ content, badge, }: {
@@ -6,7 +7,7 @@ export declare const OptionContent: ({ content, badge, }: {
     badge?: {
         type: "status";
     } | undefined;
-}) => JSX.Element;
+}) => 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) | undefined;

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

@@ -7,20 +7,14 @@ export declare const StyledWrapper: import("@emotion/native").StyledComponent<im
     ref?: import("react").Ref<View> | undefined;
 }>;
 export declare const StyledTextWrapper: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 export declare const StyledIconWrapper: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 export 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 | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;

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

@@ -10,8 +10,6 @@ declare const StyledWrapper: import("@emotion/native").StyledComponent<import("r
     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 | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;

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

@@ -1,8 +1,9 @@
+import React from 'react';
 import { Animated } from 'react-native';
 declare const ActiveTabIndicator: ({ scrollOffsetAnimatedValue, positionAnimatedValue, tabsLength, tabsWidth, }: {
     scrollOffsetAnimatedValue: Animated.Value;
     positionAnimatedValue: Animated.Value;
     tabsLength: number;
     tabsWidth: number;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export default ActiveTabIndicator;

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

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

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { TabsProps } from '.';
-declare const ScrollableTab: ({ onTabPress, selectedTabKey, tabs, containerStyle, barStyle, lazy, lazyPreloadDistance, swipeEnabled, testID: componentTestID, }: TabsProps) => JSX.Element;
+declare const ScrollableTab: ({ onTabPress, selectedTabKey, tabs, containerStyle, barStyle, lazy, lazyPreloadDistance, swipeEnabled, testID: componentTestID, }: TabsProps) => React.JSX.Element;
 export default ScrollableTab;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { StyleProp, ViewStyle, ViewProps } from 'react-native';
 import type { TabType } from '.';
 export interface ScrollableTabHeaderProps extends ViewProps {
@@ -31,5 +32,5 @@ export interface ScrollableTabHeaderProps extends ViewProps {
         left: number;
     };
 }
-declare const ScrollableTabHeader: ({ onTabPress, selectedIndex, tabs, barStyle, testID, insets, }: ScrollableTabHeaderProps) => JSX.Element;
+declare const ScrollableTabHeader: ({ onTabPress, selectedIndex, tabs, barStyle, testID, insets, }: ScrollableTabHeaderProps) => React.JSX.Element;
 export default ScrollableTabHeader;

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

@@ -33,8 +33,6 @@ 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>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
@@ -47,8 +45,6 @@ declare const HeaderTabItemOutlineWrapper: import("@emotion/native").StyledCompo
     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 | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {

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

@@ -33,8 +33,6 @@ declare const HeaderTabItem: import("@emotion/native").StyledComponent<import("r
     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 | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
@@ -45,8 +43,6 @@ declare const TabScreen: import("@emotion/native").StyledComponent<import("react
     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 | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {

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

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 export type StatusBadgeType = {
     type: 'status';
 };
@@ -12,5 +12,5 @@ interface TabWithBadgeProps {
     config?: BadgeConfigType;
     tabItem: ReactNode;
 }
-declare const TabWithBadge: ({ config, tabItem }: TabWithBadgeProps) => JSX.Element;
+declare const TabWithBadge: ({ config, tabItem }: TabWithBadgeProps) => React.JSX.Element;
 export default TabWithBadge;

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

@@ -1,4 +1,5 @@
 import type { ReactNode } from 'react';
+import React from 'react';
 import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
 import { IconName } from '../Icon';
 import type { BadgeConfigType } from './TabWithBadge';
@@ -55,7 +56,7 @@ export interface TabsProps extends ViewProps {
     testID?: string;
 }
 declare const _default: (({ onTabPress, selectedTabKey, tabs, containerStyle, barStyle, lazy, lazyPreloadDistance, swipeEnabled, testID: componentTestID, }: TabsProps) => JSX.Element) & {
-    Scroll: ({ onTabPress, selectedTabKey, tabs, containerStyle, barStyle, lazy, lazyPreloadDistance, swipeEnabled, testID: componentTestID, }: TabsProps) => JSX.Element;
+    Scroll: ({ onTabPress, selectedTabKey, tabs, containerStyle, barStyle, lazy, lazyPreloadDistance, swipeEnabled, testID: componentTestID, }: TabsProps) => React.JSX.Element;
     useIsFocused: () => boolean | undefined;
 };
 export default _default;

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

@@ -62,7 +62,7 @@ declare const StyledMaxLengthMessage: import("@emotion/native").StyledComponent<
 } & {
     themeState: State;
 }, {}, {}>;
-declare const StyledHelperText: ({ children, fontWeight, intent, allowFontScaling, ...nativeProps }: import("../Typography/Caption").CaptionProps) => JSX.Element;
+declare const StyledHelperText: ({ children, fontWeight, intent, allowFontScaling, ...nativeProps }: import("../Typography/Caption").CaptionProps) => import("react").JSX.Element;
 declare const StyledTextInput: import("@emotion/native").StyledComponent<import("react-native").TextInputProps & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;

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

@@ -91,5 +91,5 @@ export declare const getState: ({ disabled, error, editable, loading, isEmptyVal
     isFocused?: boolean | undefined;
     isEmptyValue?: boolean | undefined;
 }) => State;
-declare const TextInput: React.ForwardRefExoticComponent<Pick<TextInputProps, "children" | "label" | "style" | "hitSlop" | "onLayout" | "pointerEvents" | "removeClippedSubviews" | "testID" | "nativeID" | "collapsable" | "needsOffscreenAlphaCompositing" | "renderToHardwareTextureAndroid" | "focusable" | "shouldRasterizeIOS" | "isTVSelectable" | "hasTVPreferredFocus" | "tvParallaxProperties" | "tvParallaxShiftDistanceX" | "tvParallaxShiftDistanceY" | "tvParallaxTiltAngle" | "tvParallaxMagnification" | "onStartShouldSetResponder" | "onMoveShouldSetResponder" | "onResponderEnd" | "onResponderGrant" | "onResponderReject" | "onResponderMove" | "onResponderRelease" | "onResponderStart" | "onResponderTerminationRequest" | "onResponderTerminate" | "onStartShouldSetResponderCapture" | "onMoveShouldSetResponderCapture" | "onTouchStart" | "onTouchMove" | "onTouchEnd" | "onTouchCancel" | "onTouchEndCapture" | "accessible" | "accessibilityActions" | "accessibilityLabel" | "accessibilityRole" | "accessibilityState" | "accessibilityHint" | "accessibilityValue" | "onAccessibilityAction" | "accessibilityLiveRegion" | "importantForAccessibility" | "accessibilityElementsHidden" | "accessibilityViewIsModal" | "onAccessibilityEscape" | "onAccessibilityTap" | "onMagicTap" | "accessibilityIgnoresInvertColors" | "disabled" | "value" | "onBlur" | "onFocus" | "onPressIn" | "onPressOut" | "allowFontScaling" | "numberOfLines" | "maxFontSizeMultiplier" | "selectionColor" | "textBreakStrategy" | "variant" | "loading" | "accessibilityLabelledBy" | "textAlign" | "error" | "textAlignVertical" | "onContentSizeChange" | "onScroll" | "scrollEnabled" | "onChange" | "autoCapitalize" | "autoCorrect" | "autoFocus" | "blurOnSubmit" | "caretHidden" | "contextMenuHidden" | "defaultValue" | "editable" | "keyboardType" | "maxLength" | "multiline" | "onChangeText" | "onEndEditing" | "onSelectionChange" | "onSubmitEditing" | "onTextInput" | "onKeyPress" | "placeholder" | "placeholderTextColor" | "returnKeyType" | "secureTextEntry" | "selectTextOnFocus" | "selection" | "inputAccessoryViewID" | "clearButtonMode" | "clearTextOnFocus" | "dataDetectorTypes" | "enablesReturnKeyAutomatically" | "keyboardAppearance" | "passwordRules" | "rejectResponderTermination" | "selectionState" | "spellCheck" | "textContentType" | "autoComplete" | "importantForAutofill" | "disableFullscreenUI" | "inlineImageLeft" | "inlineImagePadding" | "returnKeyLabel" | "underlineColorAndroid" | "showSoftInputOnFocus" | "prefix" | "suffix" | "textStyle" | "required" | "hideCharacterCount" | "helpText" | "renderInputValue"> & React.RefAttributes<TextInputHandles>>;
+declare const TextInput: React.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & React.RefAttributes<TextInputHandles>>;
 export default TextInput;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { TimePickerProps } from './types';
-declare const TimePickerAndroid: ({ value, label, placeholder, onChange, displayFormat, disabled, required, error, helpText, style, testID, showSuffix, }: TimePickerProps) => JSX.Element;
+declare const TimePickerAndroid: ({ value, label, placeholder, onChange, displayFormat, disabled, required, error, helpText, style, testID, showSuffix, }: TimePickerProps) => React.JSX.Element;
 export default TimePickerAndroid;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { TimePickerProps } from './types';
-declare const TimePickerIOS: ({ value, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, showSuffix, }: TimePickerProps) => JSX.Element;
+declare const TimePickerIOS: ({ value, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, showSuffix, }: TimePickerProps) => React.JSX.Element;
 export default TimePickerIOS;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { TimePickerProps } from './types';
-declare const TimePicker: (props: TimePickerProps) => JSX.Element;
+declare const TimePicker: (props: TimePickerProps) => React.JSX.Element;
 export default TimePicker;

package/types/components/Toast/StyledToast.d.ts

@@ -11,8 +11,6 @@ declare const ToastContainerWrapper: import("@emotion/native").StyledComponent<V
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const Container: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {

package/types/components/Toast/Toast.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { ToastProps } from './types';
 declare const Toast: ({ content, icon, variant, intent, style, duration, autoDismiss, onAction, actionLabel, onDismiss, distance, }: ToastProps) => JSX.Element;
 export default Toast;

package/types/components/Toast/ToastProvider.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactNode } from 'react';
 import type { ToastContainerProps } from './types';
 type ToastProviderProps = {
@@ -6,5 +7,5 @@ type ToastProviderProps = {
      */
     children?: ReactNode;
 } & ToastContainerProps;
-declare const ToastProvider: ({ children, displayType, position: _position, }: ToastProviderProps) => JSX.Element;
+declare const ToastProvider: ({ children, displayType, position: _position, }: ToastProviderProps) => React.JSX.Element;
 export default ToastProvider;

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

@@ -2,7 +2,7 @@
 declare const Toast: {
     Provider: ({ children, displayType, position: _position, }: {
         children?: import("react").ReactNode;
-    } & import("./types").ToastContainerProps) => JSX.Element;
+    } & import("./types").ToastContainerProps) => import("react").JSX.Element;
     Container: import("react").ForwardRefExoticComponent<import("./types").ToastContainerProps & import("react").RefAttributes<import("./ToastContext").ToastControllerContextType>>;
     useToast: () => import("./ToastContext").ToastControllerContextType;
 };

package/types/components/Toolbar/ToolbarGroup.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ToolbarItemProps } from './ToolbarItem';
 export interface ToolbarGroupProps {
     /**
@@ -9,5 +10,5 @@ export interface ToolbarGroupProps {
      */
     align: 'left' | 'center' | 'right';
 }
-declare const ToolbarGroup: ({ align, items }: ToolbarGroupProps) => JSX.Element;
+declare const ToolbarGroup: ({ align, items }: ToolbarGroupProps) => React.JSX.Element;
 export default ToolbarGroup;