@hero-design/rn 8.82.0-alpha.0 → 8.82.0

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

@@ -0,0 +1,23 @@
+import { Animated, View } from 'react-native';
+declare const StyledWrapper: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").ViewProps & import("react").RefAttributes<View>> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+/**
+ * Height need to be high enough to cover most scenario
+ * This container's purpose is only to help get correct children height and returns it
+ * to use with Animated.timing
+ */
+declare const StyledHiddenWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    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 StyledChildWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export { StyledWrapper, StyledHiddenWrapper, StyledChildWrapper };

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

@@ -0,0 +1,20 @@
+import type { ReactNode } from 'react';
+import React from 'react';
+import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
+export interface CollapseProps extends ViewProps {
+    children: ReactNode;
+    /**
+     * Whether the component is open or closed.
+     */
+    open?: boolean;
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+}
+declare const Collapse: ({ open, children, testID, style, onLayout, }: CollapseProps) => React.JSX.Element;
+export default Collapse;

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

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

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

@@ -0,0 +1,43 @@
+import React from 'react';
+import type { ReactElement } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+interface ContentNavigatorProps {
+    /**
+     * The navigator's content value.
+     */
+    value: number | string | ReactElement;
+    /**
+     * Handler to handle press event of previous icon.
+     */
+    onPreviousPress: () => void;
+    /**
+     * Handler to handle press event of next icon.
+     */
+    onNextPress: () => void;
+    /**
+     * Handler to handle press event of content navigator value.
+     */
+    onPress?: () => void;
+    /**
+     * Whether the previous icon is disabled.
+     */
+    previousDisabled?: boolean;
+    /**
+     * Whether the next icon is disabled.
+     */
+    nextDisabled?: boolean;
+    /**
+     * Content font size.
+     */
+    fontSize?: 'medium' | 'large';
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+}
+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

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

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

@@ -0,0 +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, supportedOrientations, }: Omit<DatePickerProps, 'variant'>) => React.JSX.Element;
+export default DatePickerCalendar;

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

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

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

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

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

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

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

@@ -0,0 +1,79 @@
+import type { StyleProp, ViewStyle } from 'react-native';
+export interface DatePickerProps {
+    /**
+     * Date picker input label.
+     */
+    label: string;
+    /**
+     * Current date value. Must be in correct default format or format provided via format prop.
+     */
+    value?: Date;
+    /**
+     * Datepicker variants.
+     *  - default: is default UI of Android or iOS
+     *  - calendar: calendar UI
+     *  - month-year: month and year UI
+     */
+    variant?: 'default' | 'calendar' | 'month-year';
+    /**
+     * Mininum date. Restrict the range of possible date values.
+     */
+    minDate?: Date;
+    /**
+     * Maximum date. Restrict the range of possible date values.
+     */
+    maxDate?: Date;
+    /**
+     * Input placeholder. Date format will be used as placeholder if not specified.
+     */
+    placeholder?: string;
+    /**
+     * Callback that is called when new value is selected.
+     */
+    onChange: (value: Date) => void;
+    /**
+     * Confirm label text. iOS only.
+     */
+    confirmLabel: string;
+    /**
+     * Date format. Default format is dd/MM/yyyy.
+     * Following date-fns's format (https://date-fns.org/v2.16.1/docs/format).
+     */
+    displayFormat?: string;
+    /**
+     * Whether the Date picker is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Error message to display.
+     */
+    error?: string;
+    /**
+     *  Whether the value is required, if true, an asterisk will be appended to the label.
+     */
+    required?: boolean;
+    /**
+     * The helper text to display.
+     */
+    helpText?: string;
+    /**
+     * Addtional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * Calendar variant prop. Label for the confirm button of the month picker, Android only.
+     */
+    monthPickerConfirmLabel?: string;
+    /**
+     * Calendar variant prop. Label for the cancel button of the month picker, Android only.
+     */
+    monthPickerCancelLabel?: string;
+    /**
+     * Supported orientations for the DatePicker modal, iOS only.
+     */
+    supportedOrientations?: ('portrait' | 'landscape')[];
+}

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

@@ -0,0 +1,4 @@
+import { DatePickerProps } from './types';
+export declare const getDateValue: (value: Date, minDate?: Date | undefined, maxDate?: Date | undefined) => Date;
+declare const useCalculateDate: ({ maxDate, minDate, onChange, value, }: Pick<DatePickerProps, 'maxDate' | 'minDate' | 'onChange' | 'value'>) => void;
+export default useCalculateDate;

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

@@ -0,0 +1,12 @@
+import { View } from 'react-native';
+declare type MarginSize = 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+declare const StyledDivider: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    themeMarginHorizontal?: MarginSize | undefined;
+    themeMarginVertical?: MarginSize | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export { StyledDivider };

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

@@ -0,0 +1,22 @@
+import React from 'react';
+import type { StyleProp, ViewStyle, ViewProps } from 'react-native';
+interface DividerProps extends ViewProps {
+    /**
+     * Horizontal margin size. There is no margin by default.
+     */
+    marginHorizontal?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+    /**
+     * Vertical margin size. There is no margin by default.
+     */
+    marginVertical?: 'xsmall' | 'small' | 'medium' | 'large' | 'xlarge';
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+}
+declare const Divider: ({ marginHorizontal, marginVertical, style, testID, ...nativeProps }: DividerProps) => React.JSX.Element;
+export default Divider;

package/types/components/Drawer/DragableDrawer/helpers.d.ts

@@ -0,0 +1,8 @@
+export declare const getOffset: (height: number, percentage: number) => number;
+export declare type SnapPointsData = {
+    list: number[];
+    minHeightOffset: number;
+    maxHeightOffset: number;
+};
+export declare const calculateSnapPointsData: (minimumHeight: number, height: number, snapPoints: number[]) => SnapPointsData;
+export declare const calculateAnimatedToValue: (position: number, heightSnapPoints: number[]) => number;

package/types/components/Drawer/DragableDrawer/index.d.ts

@@ -0,0 +1,33 @@
+import type { ReactNode } from 'react';
+export interface DragableDrawerProps {
+    /**
+     * Drawer's content.
+     */
+    children?: ReactNode;
+    /**
+     * Initial visible height percentage of the drawer. Can be used to programmatically control the drawer height. Range: [0,100].
+     */
+    initialHeightPercentage?: number;
+    /**
+     * Mininum visible height percentage of the drawer. This will be the lowest point in snap points list. Range: [0,100].
+     */
+    minimumHeightPercentage?: number;
+    /**
+     * Callback function is called when the drawer expand to max position.
+     */
+    onExpanded?: () => void;
+    /**
+     * Callback function is called when the drawer collapsed to min position.
+     */
+    onCollapsed?: () => void;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * Nearest height snap points that the drawer will attach to on release gesture. Range: [0,100]
+     */
+    snapPoints?: number[];
+}
+declare const DragableDrawer: ({ children, initialHeightPercentage, minimumHeightPercentage, snapPoints, onExpanded, onCollapsed, testID, }: DragableDrawerProps) => JSX.Element;
+export default DragableDrawer;

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

@@ -0,0 +1,49 @@
+import { Animated, View } from 'react-native';
+import type { ViewProps } from 'react-native';
+declare const StyledContainer: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    enableShadow: boolean;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledDragableContainer: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    enableShadow: boolean;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledBackdrop: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").PressableProps & import("react").RefAttributes<View>> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledDrawerContainer: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<View>> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    enableShadow: boolean;
+}, {}, {}>;
+declare const StyledDragableDrawerContainer: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<View>> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    enableShadow: boolean;
+}, {}, {}>;
+declare const StyledHandlerContainer: import("@emotion/native").StyledComponent<ViewProps & {
+    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 StyledHandler: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    active?: boolean | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export { StyledBackdrop, StyledContainer, StyledDrawerContainer, StyledHandlerContainer, StyledHandler, StyledDragableContainer, StyledDragableDrawerContainer, };

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

@@ -0,0 +1,27 @@
+import type { ReactNode } from 'react';
+interface DrawerProps {
+    /**
+     * Drawer's visibility.
+     */
+    visible: boolean;
+    /**
+     * Drawer's content.
+     */
+    children?: ReactNode;
+    /**
+     * Enable the drawer's backdrop.
+     */
+    hasBackdrop?: boolean;
+    /**
+     * Callback when the drawer is dismissed by interacting outside of the drawer.
+     */
+    onDismiss?: () => void;
+    /**
+     * Testing id of the component.
+     * */
+    testID?: string;
+}
+declare const _default: (({ visible, children, hasBackdrop, onDismiss, testID, }: DrawerProps) => JSX.Element) & {
+    Dragable: ({ children, initialHeightPercentage, minimumHeightPercentage, snapPoints, onExpanded, onCollapsed, testID, }: import("./DragableDrawer").DragableDrawerProps) => JSX.Element;
+};
+export default _default;

package/types/components/Empty/StyledEmpty.d.ts

@@ -0,0 +1,21 @@
+import { View } from 'react-native';
+declare type ThemeVariant = 'light' | 'dark';
+declare const StyledWrapper: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    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 StyledTitle: import("@emotion/native").StyledComponent<import("../Typography/Title").TitleProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    themeVariant: ThemeVariant;
+}, {}, {}>;
+declare const StyledDescription: import("@emotion/native").StyledComponent<import("../Typography/Body").BodyProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    themeVariant: ThemeVariant;
+}, {}, {}>;
+export { StyledWrapper, StyledTitle, StyledDescription };

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

@@ -0,0 +1,31 @@
+import type { ReactElement } from 'react';
+import type { StyleProp, ViewStyle, ImageProps as RNImageProps } from 'react-native';
+import { ImageProps } from '../Image';
+interface EmptyProps {
+    /**
+     * Image to be displayed.
+     */
+    image?: ReactElement<ImageProps | RNImageProps>;
+    /**
+     * Empty's title.
+     */
+    title: string;
+    /**
+     * Empty's description.
+     */
+    description?: string;
+    /**
+     * Empty's variant.
+     */
+    variant?: 'light' | 'dark';
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+}
+declare const Empty: ({ image, title, description, style, testID, variant, }: EmptyProps) => JSX.Element;
+export default Empty;

package/types/components/Error/StyledError.d.ts

@@ -0,0 +1,53 @@
+import { View } from 'react-native';
+declare type ErrorVariant = 'full-screen' | 'in-page';
+declare const StyledErrorModal: import("@emotion/native").StyledComponent<import("../Modal").ModalProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledErrorContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    themeVariant: ErrorVariant;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledErrorContent: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    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 StyledErrorButtonContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    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 StyledErrorButtonPrimary: import("@emotion/native").StyledComponent<import("../Button/Button").ButtonProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledErrorButtonSecondary: import("@emotion/native").StyledComponent<import("../Button/Button").ButtonProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledErrorImageContainer: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    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 StyledErrorImage: import("@emotion/native").StyledComponent<import("../Image").ImageProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledErrorTitle: import("@emotion/native").StyledComponent<import("../Typography/Title").TitleProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledErrorDescription: import("@emotion/native").StyledComponent<import("../Typography/Body").BodyProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+export { ErrorVariant, StyledErrorModal, StyledErrorImage, StyledErrorContainer, StyledErrorButtonContainer, StyledErrorButtonPrimary, StyledErrorButtonSecondary, StyledErrorContent, StyledErrorTitle, StyledErrorDescription, StyledErrorImageContainer, };

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

@@ -0,0 +1,56 @@
+import { ReactElement } from 'react';
+import type { ImageSourcePropType, ViewProps, ImageProps as RNImageProps } from 'react-native';
+import { ErrorVariant } from './StyledError';
+import { ImageProps } from '../Image/index';
+interface ErrorProps extends ViewProps {
+    /**
+     * @deprecated use conditional rendering instead
+     *
+     * Visibility of the error
+     */
+    visible?: boolean;
+    /**
+     * Variant of the error
+     */
+    variant?: ErrorVariant;
+    /**
+     * Title of the error
+     */
+    title: string;
+    /**
+     * Description of the error
+     */
+    description?: string;
+    /**
+     * Image of the error
+     */
+    image?: ReactElement<ImageProps | RNImageProps> | ImageSourcePropType | string;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * Action button text
+     */
+    ctaText?: string;
+    /**
+     * Callback when the action button is pressed.
+     */
+    onCtaPress?: () => void;
+    /**
+     * Secondary button text
+     */
+    secondaryCtaText?: string;
+    /**
+     * Callback when the secondary button is pressed.
+     */
+    onSecondaryCtaPress?: () => void;
+}
+/**
+ * Renders error page
+ *
+ * @param {ErrorProps}
+ * @return {*}  {ReactElement}
+ */
+declare const ErrorComponent: ({ visible, variant, title, description, image, testID, ctaText, onCtaPress, secondaryCtaText, onSecondaryCtaPress, ...nativeProps }: ErrorProps) => ReactElement;
+export default ErrorComponent;

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

@@ -0,0 +1,18 @@
+import React from 'react';
+import type { ComponentProps } from 'react';
+import { type StyleProp, type ViewStyle } from 'react-native';
+import Icon from '../../Icon';
+export interface ActionItemProps {
+    testID?: string;
+    title: string;
+    icon: ComponentProps<typeof Icon>['icon'];
+    onPress?: () => void;
+    style?: StyleProp<ViewStyle>;
+    key?: string;
+}
+interface AnimatedActionItemProps extends ActionItemProps {
+    index: number;
+    active?: boolean;
+}
+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

@@ -0,0 +1,27 @@
+import { Animated, View } from 'react-native';
+import type { ViewProps } from 'react-native';
+declare const StyledContainer: import("@emotion/native").StyledComponent<ViewProps & {
+    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 StyledContainerInModal: import("@emotion/native").StyledComponent<ViewProps & {
+    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 StyledActionGroupContainer: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<View>> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledFAB: import("@emotion/native").StyledComponent<import("../FAB").FABProps & import("react").RefAttributes<import("../FAB").FABHandles> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledBackdrop: import("@emotion/native").StyledComponent<Animated.AnimatedProps<import("react-native").PressableProps & import("react").RefAttributes<View>> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+export { StyledActionGroupContainer, StyledBackdrop, StyledContainer, StyledContainerInModal, StyledFAB, };

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

@@ -0,0 +1,18 @@
+import { TouchableOpacity } from 'react-native';
+import type { TouchableOpacityProps } from 'react-native';
+import type { IconProps } from '../../Icon';
+declare const StyledActionItem: import("@emotion/native").StyledComponent<TouchableOpacityProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {
+    ref?: import("react").Ref<TouchableOpacity> | undefined;
+}>;
+declare const StyledActionItemText: import("@emotion/native").StyledComponent<import("../../Typography/Body").BodyProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & TouchableOpacityProps, {}, {}>;
+declare const StyledIcon: import("@emotion/native").StyledComponent<IconProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+export { StyledIcon, StyledActionItem, StyledActionItemText };