@hero-design/rn 8.43.0 → 8.43.1

package/src/components/Toolbar/__tests__/__snapshots__/ToolbarItem.spec.tsx.snap

@@ -4,7 +4,19 @@ exports[`ToolbarItems renders correctly when disabled 1`] = `
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": true,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}
@@ -92,7 +104,19 @@ exports[`ToolbarItems renders correctly when intent is danger, icon is undefined
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": false,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}
@@ -144,7 +168,19 @@ exports[`ToolbarItems renders correctly when intent is info, icon is undefined,
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": false,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}
@@ -196,7 +232,19 @@ exports[`ToolbarItems renders correctly when intent is primary, icon is ai-outli
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": false,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}
@@ -284,7 +332,19 @@ exports[`ToolbarItems renders correctly when intent is primary, icon is ai-outli
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": true,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}
@@ -372,7 +432,19 @@ exports[`ToolbarItems renders correctly when intent is primary, icon is ai-outli
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": false,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}
@@ -434,7 +506,19 @@ exports[`ToolbarItems renders correctly when intent is success, icon is undefine
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": false,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}
@@ -486,7 +570,19 @@ exports[`ToolbarItems renders correctly when intent is warning, icon is undefine
 <View
   accessibilityState={
     {
+      "busy": undefined,
+      "checked": undefined,
       "disabled": false,
+      "expanded": undefined,
+      "selected": undefined,
+    }
+  }
+  accessibilityValue={
+    {
+      "max": undefined,
+      "min": undefined,
+      "now": undefined,
+      "text": undefined,
     }
   }
   accessible={true}

package/tsconfig.json

@@ -11,7 +11,10 @@
     "strict": true,
     "strictNullChecks": true,
     "target": "esnext",
-    "types": ["jest"]
+    "types": ["jest"],
+    "paths": {
+      "react": ["./node_modules/@types/react"]
+    }
   },
   "include": ["src"]
 }

package/types/components/Accordion/AccordionItem.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactElement } from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 import type { Variant } from './StyledAccordion';
@@ -10,5 +11,5 @@ export type AccordionItemProps = {
     style?: StyleProp<ViewStyle>;
     testID?: string;
 };
-declare const AccordionItem: ({ header, content, open, onPress, variant, style, testID, }: AccordionItemProps) => JSX.Element;
+declare const AccordionItem: ({ header, content, open, onPress, variant, style, testID, }: AccordionItemProps) => React.JSX.Element;
 export default AccordionItem;

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

@@ -35,5 +35,5 @@ export interface AccordionProps<K extends Key> {
      */
     testID?: string;
 }
-declare const Accordion: <K extends React.Key>({ items, activeItemKey, onItemPress, variant, style, testID, }: AccordionProps<K>) => JSX.Element;
+declare const Accordion: <K extends React.Key>({ items, activeItemKey, onItemPress, variant, style, testID, }: AccordionProps<K>) => React.JSX.Element;
 export default Accordion;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactElement } from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 import { IconProps } from '../Icon';
@@ -33,5 +34,5 @@ interface AttachmentProps {
      */
     testID?: string;
 }
-declare const Attachment: ({ filename, previewElement, onRemove, onDownload, backgroundHighlighted, style, testID, }: AttachmentProps) => JSX.Element;
+declare const Attachment: ({ filename, previewElement, onRemove, onDownload, backgroundHighlighted, style, testID, }: AttachmentProps) => React.JSX.Element;
 export default Attachment;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ImageSourcePropType, StyleProp, ViewProps, ViewStyle } from 'react-native';
 export interface AvatarProps extends ViewProps {
     /**
@@ -29,5 +30,5 @@ export interface AvatarProps extends ViewProps {
      */
     testID?: string;
 }
-declare const Avatar: ({ onPress, source, testID, style, title, size, intent, }: AvatarProps) => JSX.Element | null;
+declare const Avatar: ({ onPress, source, testID, style, title, size, intent, }: AvatarProps) => React.JSX.Element | null;
 export default Avatar;

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

@@ -1,4 +1,4 @@
-import { ReactElement } from 'react';
+import React, { ReactElement } from 'react';
 import { StyleProp, ViewStyle } from 'react-native';
 import { AvatarProps } from '../Avatar';
 export interface AvatarStackProps extends Pick<AvatarProps, 'size'> {
@@ -19,5 +19,5 @@ export interface AvatarStackProps extends Pick<AvatarProps, 'size'> {
      */
     testID?: string;
 }
-declare const AvatarStack: ({ children, max, size, style, testID, }: AvatarStackProps) => JSX.Element;
+declare const AvatarStack: ({ children, max, size, style, testID, }: AvatarStackProps) => React.JSX.Element;
 export default AvatarStack;

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

@@ -1,6 +1,7 @@
+/// <reference types="react" />
 import { useAvatarColors } from './AvatarStack/utils';
-declare const _default: (({ onPress, source, testID, style, title, size, intent, }: import("./Avatar").AvatarProps) => JSX.Element | null) & {
-    Stack: ({ children, max, size, style, testID, }: import("./AvatarStack").AvatarStackProps) => JSX.Element;
+declare const _default: (({ onPress, source, testID, style, title, size, intent, }: import("./Avatar").AvatarProps) => import("react").JSX.Element | null) & {
+    Stack: ({ children, max, size, style, testID, }: import("./AvatarStack").AvatarStackProps) => import("react").JSX.Element;
 };
 export default _default;
 export { useAvatarColors };

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

@@ -3,8 +3,6 @@ import { Animated } from 'react-native';
 type ThemeIntent = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'archived';
 type ThemePadding = 'narrowContent' | 'wideContent';
 declare const StyledView: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
@@ -16,8 +14,6 @@ declare const StyledText: import("@emotion/native").StyledComponent<import("../T
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledStatus: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<import("react-native").View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {

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

@@ -1,6 +1,7 @@
+import React from 'react';
 import type { ReactNode } from 'react';
 declare const Footer: ({ children, showDivider, }: {
     children: ReactNode;
     showDivider: boolean;
-}) => JSX.Element;
+}) => React.JSX.Element;
 export default Footer;

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

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

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { ScrollViewProps } from 'react-native';
 declare const BottomSheetScrollView: ({ scrollEventThrottle, ...props }: ScrollViewProps) => JSX.Element;
 export default BottomSheetScrollView;

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

@@ -14,14 +14,10 @@ declare const StyledKeyboardAvoidingView: import("@emotion/native").StyledCompon
     ref?: import("react").Ref<KeyboardAvoidingView> | undefined;
 }>;
 declare const StyledBottomSheet: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<SafeAreaView>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledBackdrop: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").PressableProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;

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

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

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { StyleProp, ViewStyle, TouchableOpacityProps } from 'react-native';
 import type { IconProps, IconName } from '../Icon';
 export interface IconButtonProps {
@@ -34,5 +35,5 @@ export interface IconButtonProps {
      */
     testID?: string;
 }
-declare const IconButton: ({ hitSlop, onPress, icon, disabled, testID, style, size, intent, }: IconButtonProps) => JSX.Element;
+declare const IconButton: ({ hitSlop, onPress, icon, disabled, testID, style, size, intent, }: IconButtonProps) => React.JSX.Element;
 export default IconButton;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { StyleProp, ViewStyle, ViewProps } from 'react-native';
 type ThemeVariant = 'basic-transparent' | 'filled-primary' | 'filled-secondary' | 'filled-danger' | 'outlined-primary' | 'outlined-secondary' | 'outlined-danger' | 'text-primary' | 'text-secondary' | 'text-danger';
 interface LoadingIndicatorProps extends ViewProps {
@@ -22,5 +23,5 @@ interface LoadingIndicatorProps extends ViewProps {
      */
     themeVariant: ThemeVariant;
 }
-declare const LoadingIndicator: ({ count, size, testID, themeVariant, ...nativeProps }: LoadingIndicatorProps) => JSX.Element;
+declare const LoadingIndicator: ({ count, size, testID, themeVariant, ...nativeProps }: LoadingIndicatorProps) => React.JSX.Element;
 export default LoadingIndicator;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactChild } from 'react';
 import type { ViewProps } from 'react-native';
 import type { IconName } from '../../Icon';
@@ -19,5 +20,5 @@ export interface UtilityButtonProps extends ViewProps {
      */
     intent?: 'primary' | 'text';
 }
-declare const UtilityButton: ({ icon, onPress, text, testID, intent, style, hitSlop, }: UtilityButtonProps) => JSX.Element;
+declare const UtilityButton: ({ icon, onPress, text, testID, intent, style, hitSlop, }: UtilityButtonProps) => React.JSX.Element;
 export default UtilityButton;

package/types/components/Calendar/CalendarRowItem.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 export interface CalendarRowItemProps {
     date?: Date;
     onPress?: () => void;
@@ -6,5 +7,5 @@ export interface CalendarRowItemProps {
     textIntent?: 'body' | 'subdued';
     marked?: boolean;
 }
-declare const CalendarRowItem: ({ date, onPress, isCurrent, isSelected, textIntent, marked, }: CalendarRowItemProps) => JSX.Element;
+declare const CalendarRowItem: ({ date, onPress, isCurrent, isSelected, textIntent, marked, }: CalendarRowItemProps) => React.JSX.Element;
 export default CalendarRowItem;

package/types/components/Calendar/StyledCalendar.d.ts

@@ -23,7 +23,7 @@ declare const StyledCalendarCell: import("@emotion/native").StyledComponent<impo
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 } & {
-    variant?: "selected" | "default" | "current" | undefined;
+    variant?: "default" | "selected" | "current" | undefined;
 }, {}, {
     ref?: import("react").Ref<TouchableOpacity> | undefined;
 }>;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 export interface CalendarProps {
     /**
      * Selected date value.
@@ -53,5 +54,5 @@ export interface CalendarProps {
      */
     monthPickerCancelLabel?: string;
 }
-declare const Calendar: ({ value, visibleDate, onChange, onPreviousPress, onNextPress, onTitlePress, minDate, maxDate, markedDates, testID, onMonthChange, onToggleMonthPicker, monthPickerConfirmLabel, monthPickerCancelLabel, }: CalendarProps) => JSX.Element;
+declare const Calendar: ({ value, visibleDate, onChange, onPreviousPress, onNextPress, onTitlePress, minDate, maxDate, markedDates, testID, onMonthChange, onToggleMonthPicker, monthPickerConfirmLabel, monthPickerCancelLabel, }: CalendarProps) => React.JSX.Element;
 export default Calendar;

package/types/components/Carousel/CardCarousel.d.ts

@@ -38,4 +38,4 @@ export interface CardCarouselProps {
     ref?: React.Ref<CardCarouselHandles>;
     onLayout?: (event: LayoutChangeEvent) => void;
 }
-export declare const CardCarousel: React.ForwardRefExoticComponent<Pick<CardCarouselProps, "style" | "onLayout" | "testID" | "items" | "onItemIndexChange" | "hidePageControl" | "autoPlay" | "autoPlayInterval"> & React.RefAttributes<CardCarouselHandles>>;
+export declare const CardCarousel: React.ForwardRefExoticComponent<Omit<CardCarouselProps, "ref"> & React.RefAttributes<CardCarouselHandles>>;

package/types/components/Carousel/CarouselItem.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 import { CarouselData } from './types';
 interface CarouselItemProps extends Omit<CarouselData, 'background'> {
     width: number;
 }
-declare const CarouselItem: ({ width, image, content, heading, body, }: CarouselItemProps) => JSX.Element;
+declare const CarouselItem: ({ width, image, content, heading, body, }: CarouselItemProps) => React.JSX.Element;
 export default CarouselItem;

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

@@ -38,7 +38,7 @@ interface CarouselProps extends ViewProps {
     pageControlPosition?: 'top' | 'bottom';
 }
 export declare function useStateFromProp<T>(initialValue: T): [T, Dispatch<SetStateAction<T>>];
-declare const _default: (({ items, onItemIndexChange, renderActions, selectedItemIndex, style, shouldShowPagination, testID, pageControlPosition, ...nativeProps }: CarouselProps) => JSX.Element) & {
-    Card: React.ForwardRefExoticComponent<Pick<import("./CardCarousel").CardCarouselProps, "style" | "onLayout" | "testID" | "items" | "onItemIndexChange" | "hidePageControl" | "autoPlay" | "autoPlayInterval"> & React.RefAttributes<import("./CardCarousel").CardCarouselHandles>>;
+declare const _default: (({ items, onItemIndexChange, renderActions, selectedItemIndex, style, shouldShowPagination, testID, pageControlPosition, ...nativeProps }: CarouselProps) => React.JSX.Element) & {
+    Card: React.ForwardRefExoticComponent<Omit<import("./CardCarousel").CardCarouselProps, "ref"> & React.RefAttributes<import("./CardCarousel").CardCarouselHandles>>;
 };
 export default _default;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 export interface CheckboxProps {
     /**
@@ -39,5 +40,5 @@ type getStateType = {
     readonly: boolean;
 };
 export declare const getThemeState: ({ disabled, readonly }: getStateType) => "default" | "disabled" | "readonly";
-declare const Checkbox: ({ checked, description, withBorder, disabled, onPress, style, testID, readonly, }: CheckboxProps) => JSX.Element;
+declare const Checkbox: ({ checked, description, withBorder, disabled, onPress, style, testID, readonly, }: CheckboxProps) => React.JSX.Element;
 export default Checkbox;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ViewProps } from 'react-native';
 import { IconName } from '../Icon';
 export interface ChipProps extends ViewProps {
@@ -22,5 +23,5 @@ export interface ChipProps extends ViewProps {
      */
     onPress?: () => void;
 }
-declare const Chip: ({ label, variant, selected, icon, onPress, ...otherProps }: ChipProps) => JSX.Element;
+declare const Chip: ({ label, variant, selected, icon, onPress, ...otherProps }: ChipProps) => React.JSX.Element;
 export default Chip;

package/types/components/Collapse/StyledCollapse.d.ts

@@ -1,8 +1,6 @@
 /// <reference types="react" />
 import { Animated, View } from 'react-native';
 declare const StyledWrapper: 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/Collapse/index.d.ts

@@ -1,4 +1,5 @@
 import type { ReactNode } from 'react';
+import React from 'react';
 import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
 export interface CollapseProps extends ViewProps {
     children: ReactNode;
@@ -15,5 +16,5 @@ export interface CollapseProps extends ViewProps {
      */
     testID?: string;
 }
-declare const Collapse: ({ open, children, testID, style, onLayout, }: CollapseProps) => JSX.Element;
+declare const Collapse: ({ open, children, testID, style, onLayout, }: CollapseProps) => React.JSX.Element;
 export default Collapse;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ReactElement } from 'react';
 import type { StyleProp, ViewStyle } from 'react-native';
 interface ContentNavigatorProps {
@@ -38,5 +39,5 @@ interface ContentNavigatorProps {
      */
     testID?: string;
 }
-declare function ContentNavigator({ onPreviousPress, onNextPress, onPress, value, previousDisabled, nextDisabled, fontSize, testID, style, }: ContentNavigatorProps): JSX.Element;
+declare function ContentNavigator({ onPreviousPress, onNextPress, onPress, value, previousDisabled, nextDisabled, fontSize, testID, style, }: ContentNavigatorProps): React.JSX.Element;
 export default ContentNavigator;

package/types/components/DatePicker/DatePickerAndroid.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { DatePickerProps } from './types';
-declare const DatePickerAndroid: ({ value, minDate, maxDate, label, placeholder, onChange, displayFormat, disabled, required, error, helpText, style, testID, }: Omit<DatePickerProps, 'variant' | 'monthPickerConfirmLabel' | 'monthPickerCancelLabel'>) => JSX.Element;
+declare const DatePickerAndroid: ({ value, minDate, maxDate, label, placeholder, onChange, displayFormat, disabled, required, error, helpText, style, testID, }: Omit<DatePickerProps, 'variant' | 'monthPickerConfirmLabel' | 'monthPickerCancelLabel'>) => React.JSX.Element;
 export default DatePickerAndroid;

package/types/components/DatePicker/DatePickerCalendar.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { DatePickerProps } from './types';
-declare const DatePickerCalendar: ({ value, minDate, maxDate, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, monthPickerConfirmLabel, monthPickerCancelLabel, }: Omit<DatePickerProps, 'variant'>) => JSX.Element;
+declare const DatePickerCalendar: ({ value, minDate, maxDate, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, monthPickerConfirmLabel, monthPickerCancelLabel, }: Omit<DatePickerProps, 'variant'>) => React.JSX.Element;
 export default DatePickerCalendar;

package/types/components/DatePicker/DatePickerIOS.d.ts

@@ -1,4 +1,5 @@
+import React from 'react';
 import type { DatePickerProps } from './types';
 export declare const getInitialDateValue: (value: Date, minDate?: Date | undefined, maxDate?: Date | undefined) => Date;
-declare const DatePickerIOS: ({ value, minDate, maxDate, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, }: Omit<DatePickerProps, 'variant' | 'monthPickerConfirmLabel' | 'monthPickerCancelLabel'>) => JSX.Element;
+declare const DatePickerIOS: ({ value, minDate, maxDate, label, placeholder, onChange, confirmLabel, displayFormat, disabled, required, error, helpText, style, testID, }: Omit<DatePickerProps, 'variant' | 'monthPickerConfirmLabel' | 'monthPickerCancelLabel'>) => React.JSX.Element;
 export default DatePickerIOS;

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

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

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { StyleProp, ViewStyle, ViewProps } from 'react-native';
 interface DividerProps extends ViewProps {
     /**
@@ -17,5 +18,5 @@ interface DividerProps extends ViewProps {
      */
     testID?: string;
 }
-declare const Divider: ({ marginHorizontal, marginVertical, style, testID, ...nativeProps }: DividerProps) => JSX.Element;
+declare const Divider: ({ marginHorizontal, marginVertical, style, testID, ...nativeProps }: DividerProps) => React.JSX.Element;
 export default Divider;

package/types/components/Drawer/StyledDrawer.d.ts

@@ -18,22 +18,16 @@ declare const StyledDragableContainer: import("@emotion/native").StyledComponent
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledBackdrop: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").PressableProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledDrawerContainer: 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;
 } & {
     enableShadow: boolean;
 }, {}, {}>;
 declare const StyledDragableDrawerContainer: 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/Error/StyledError.d.ts

@@ -26,14 +26,10 @@ declare const StyledErrorButtonContainer: import("@emotion/native").StyledCompon
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledErrorButtonPrimary: import("@emotion/native").StyledComponent<import("../Button/Button").ButtonProps & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledErrorButtonSecondary: 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/FAB/ActionGroup/ActionItem.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import type { ComponentProps } from 'react';
 import { type StyleProp, type ViewStyle } from 'react-native';
 import Icon from '../../Icon';
@@ -13,5 +14,5 @@ interface AnimatedActionItemProps extends ActionItemProps {
     index: number;
     active?: boolean;
 }
-declare const ActionItem: ({ icon, title, onPress, style, testID, index, active, }: AnimatedActionItemProps) => JSX.Element;
+declare const ActionItem: ({ icon, title, onPress, style, testID, index, active, }: AnimatedActionItemProps) => React.JSX.Element;
 export default ActionItem;

package/types/components/FAB/ActionGroup/StyledActionGroup.d.ts

@@ -14,8 +14,6 @@ declare const StyledContainerInModal: import("@emotion/native").StyledComponent<
     ref?: import("react").Ref<View> | undefined;
 }>;
 declare const StyledActionGroupContainer: 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;
 }, {}, {}>;
@@ -24,8 +22,6 @@ declare const StyledFAB: import("@emotion/native").StyledComponent<import("../FA
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;
 declare const StyledBackdrop: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").PressableProps & import("react").RefAttributes<View>> & {
-    children?: import("react").ReactNode;
-} & {
     theme?: import("@emotion/react").Theme | undefined;
     as?: import("react").ElementType<any> | undefined;
 }, {}, {}>;

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

@@ -1,6 +1,7 @@
+import React from 'react';
 import type { IconProps } from '../Icon';
 type Props = {
     active?: boolean;
 } & IconProps;
-declare const AnimatedFABIcon: ({ active, ...iconProps }: Props) => JSX.Element;
+declare const AnimatedFABIcon: ({ active, ...iconProps }: Props) => React.JSX.Element;
 export { AnimatedFABIcon };

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

@@ -1,3 +1,4 @@
+import React from 'react';
 import { ThemeProviderProps } from '../../theme/ThemeProvider';
-declare const HeroDesignProvider: ({ theme, children }: ThemeProviderProps) => JSX.Element;
+declare const HeroDesignProvider: ({ theme, children }: ThemeProviderProps) => React.JSX.Element;
 export default HeroDesignProvider;

package/types/components/Icon/AnimatedIcon.d.ts

@@ -1,5 +1,6 @@
+import React from 'react';
 import type { ComponentProps } from 'react';
 import StyledHeroIcon from './HeroIcon';
 type AnimatedIconProps = ComponentProps<typeof StyledHeroIcon>;
-declare const AnimatedIcon: ({ style, ...otherProps }: AnimatedIconProps) => JSX.Element;
+declare const AnimatedIcon: ({ style, ...otherProps }: AnimatedIconProps) => React.JSX.Element;
 export default AnimatedIcon;