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

package/types/components/BottomNavigation/StyledBottomNavigation.d.ts

@@ -0,0 +1,51 @@
+import { View } from 'react-native';
+declare const BottomNavigationTab: 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;
+} & {
+    themeVisibility?: boolean | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const BottomNavigationContainer: 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 ContentWrapper: 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 BottomBarWrapper: 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;
+} & {
+    themeInsets: {
+        top: number;
+        right: number;
+        bottom: number;
+        left: number;
+    };
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const BottomBar: 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 BottomBarItem: 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 StyledBottomBarText: import("@emotion/native").StyledComponent<import("../Typography/Caption").CaptionProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+export { BottomBar, BottomBarItem, BottomNavigationTab, BottomNavigationContainer, BottomBarWrapper, ContentWrapper, StyledBottomBarText, };

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

@@ -0,0 +1,45 @@
+import type { ReactNode } from 'react';
+import type { StyleProp, ViewStyle, ViewProps } from 'react-native';
+import type { IconName } from '../Icon';
+export declare type BottomNavigationTabType = {
+    key: string;
+    title?: string;
+    icon: IconName;
+    component: ReactNode;
+    testID?: string;
+};
+interface BottomNavigationProps extends ViewProps {
+    /**
+     * Callback which is called on tab press, receiving key of upcoming active Tab.
+     */
+    onTabPress: (key: string) => void;
+    /**
+     * Whether inactive tabs should be removed and unmounted in React.
+     * Defaults to `false`.
+     */
+    renderActiveTabOnly?: boolean;
+    /**
+     * Current selected tab key.
+     */
+    selectedTabKey: string;
+    /**
+     * List of Tabs to be rendered. Each Tab must have an unique key.
+     */
+    tabs: {
+        key: string;
+        title?: string;
+        icon: IconName;
+        component: ReactNode;
+        testID?: string;
+    }[];
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+}
+declare const BottomNavigation: ({ onTabPress, renderActiveTabOnly, selectedTabKey, tabs, ...nativeProps }: BottomNavigationProps) => JSX.Element;
+export default BottomNavigation;

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

@@ -0,0 +1,5 @@
+export declare type BottomSheetContextType = {
+    setInternalShowDivider: (value: boolean) => void;
+};
+declare const BottomSheetContext: import("react").Context<BottomSheetContextType>;
+export default BottomSheetContext;

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

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

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

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

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

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

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

@@ -0,0 +1,61 @@
+import type { ViewProps } from 'react-native';
+import { Animated, KeyboardAvoidingView, KeyboardAvoidingViewProps, SafeAreaView, TouchableOpacity, View } from 'react-native';
+declare const StyledWrapper: 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 StyledKeyboardAvoidingView: import("@emotion/native").StyledComponent<KeyboardAvoidingViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {
+    ref?: import("react").Ref<KeyboardAvoidingView> | undefined;
+}>;
+declare const StyledFloatingWrapper: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<SafeAreaView>> & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {}>;
+declare const StyledFloatingBottomSheet: 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 StyledBottomSheet: import("@emotion/native").StyledComponent<Animated.AnimatedProps<ViewProps & import("react").RefAttributes<SafeAreaView>> & {
+    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;
+}, {}, {}>;
+declare const StyledHeaderWrapper: 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 StyledHeader: 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 StyledFooter: 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 StyledIconWrapper: 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 StyledFloatingHeaderWrapper: import("@emotion/native").StyledComponent<import("react-native").TouchableOpacityProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {
+    ref?: import("react").Ref<TouchableOpacity> | undefined;
+}>;
+export { StyledBackdrop, StyledBottomSheet, StyledFloatingBottomSheet, StyledFloatingHeaderWrapper, StyledFloatingWrapper, StyledFooter, StyledHeader, StyledHeaderWrapper, StyledIconWrapper, StyledKeyboardAvoidingView, StyledWrapper, };

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

@@ -0,0 +1,74 @@
+import type { ReactElement, ReactNode } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import { KeyboardAvoidingViewProps } from 'react-native';
+export interface BottomSheetProps {
+    /**
+     * Bottom sheet open state.
+     */
+    open: boolean;
+    /**
+     * Bottom sheet's header.
+     */
+    header?: string | ReactElement;
+    /**
+     * Bottom sheet's footer.
+     */
+    footer?: ReactNode;
+    /**
+     * Bottom sheet's content.
+     */
+    children?: ReactNode;
+    /**
+     * Callback is called when the Bottom Sheet finishes running animation.
+     */
+    onAnimationEnd?: () => void;
+    /**
+     * Callback is called when the Bottom Sheet is opened.
+     */
+    onOpen?: () => void;
+    /**
+     * Callback is called when the user taps the back button on Android or when the bottom sheet
+     * is being dismiss by interacting outside of the bottom sheet.
+     */
+    onRequestClose?: () => void;
+    /**
+     * Callback that is called once the bottom sheet has been dismissed.
+     */
+    onDismiss?: () => void;
+    /**
+     * Displays an X button on bottom sheet header that will invoke onRequestClose callback on press.
+     */
+    showCloseButton?: boolean;
+    /**
+     * Enable the bottom sheet's backdrop.
+     */
+    hasBackdrop?: boolean;
+    /**
+     * Displays dividers between header, footer and body.
+     */
+    showDivider?: boolean;
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * keyboardAvoidingView's props
+     * */
+    keyboardAvoidingViewProps?: KeyboardAvoidingViewProps;
+    /**
+     * Supported orientations for the BottomSheet modal, iOS only.
+     */
+    supportedOrientations?: ('portrait' | 'landscape')[];
+    /**
+     * Variant of the bottom sheet.
+     */
+    variant?: 'fixed' | 'floating';
+}
+declare const _default: (({ open, header, footer, children, onAnimationEnd, onOpen, onRequestClose, onDismiss, showCloseButton, hasBackdrop, showDivider, style, testID, keyboardAvoidingViewProps, supportedOrientations, variant, }: BottomSheetProps) => JSX.Element) & {
+    ScrollView: ({ scrollEventThrottle, ...props }: import("react-native").ScrollViewProps) => JSX.Element;
+};
+export default _default;

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

@@ -0,0 +1,15 @@
+import { Theme } from '@emotion/react';
+import { View } from 'react-native';
+import { FlexStyleProps, StyleProps } from './types';
+export declare const getThemeValue: (theme: Theme, key: keyof StyleProps, props: StyleProps) => {
+    [x: string]: string | undefined;
+} | {
+    [x: string]: number;
+} | undefined;
+declare const StyledBox: import("@emotion/native").StyledComponent<import("react-native").ViewProps & {
+    theme?: Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & StyleProps & FlexStyleProps, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export { StyledBox };

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

@@ -0,0 +1,170 @@
+declare const config: {
+    readonly borderWidth: {
+        readonly property: "borderWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderBottomWidth: {
+        readonly property: "borderBottomWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderTopWidth: {
+        readonly property: "borderTopWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderLeftWidth: {
+        readonly property: "borderLeftWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderRightWidth: {
+        readonly property: "borderRightWidth";
+        readonly scale: "borderWidths";
+    };
+    readonly borderBottomEndRadius: {
+        readonly property: "borderBottomEndRadius";
+        readonly scale: "radii";
+    };
+    readonly borderBottomLeftRadius: {
+        readonly property: "borderBottomLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderBottomRightRadius: {
+        readonly property: "borderBottomRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderBottomStartRadius: {
+        readonly property: "borderBottomStartRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopEndRadius: {
+        readonly property: "borderTopEndRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopLeftRadius: {
+        readonly property: "borderTopLeftRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopRightRadius: {
+        readonly property: "borderTopRightRadius";
+        readonly scale: "radii";
+    };
+    readonly borderTopStartRadius: {
+        readonly property: "borderTopStartRadius";
+        readonly scale: "radii";
+    };
+    readonly borderRadius: {
+        readonly property: "borderRadius";
+        readonly scale: "radii";
+    };
+    readonly margin: {
+        readonly property: "margin";
+        readonly scale: "space";
+    };
+    readonly marginBottom: {
+        readonly property: "marginBottom";
+        readonly scale: "space";
+    };
+    readonly marginEnd: {
+        readonly property: "marginEnd";
+        readonly scale: "space";
+    };
+    readonly marginHorizontal: {
+        readonly property: "marginHorizontal";
+        readonly scale: "space";
+    };
+    readonly marginLeft: {
+        readonly property: "marginLeft";
+        readonly scale: "space";
+    };
+    readonly marginRight: {
+        readonly property: "marginRight";
+        readonly scale: "space";
+    };
+    readonly marginStart: {
+        readonly property: "marginStart";
+        readonly scale: "space";
+    };
+    readonly marginTop: {
+        readonly property: "marginTop";
+        readonly scale: "space";
+    };
+    readonly marginVertical: {
+        readonly property: "marginVertical";
+        readonly scale: "space";
+    };
+    readonly padding: {
+        readonly property: "padding";
+        readonly scale: "space";
+    };
+    readonly paddingBottom: {
+        readonly property: "paddingBottom";
+        readonly scale: "space";
+    };
+    readonly paddingEnd: {
+        readonly property: "paddingEnd";
+        readonly scale: "space";
+    };
+    readonly paddingHorizontal: {
+        readonly property: "paddingHorizontal";
+        readonly scale: "space";
+    };
+    readonly paddingLeft: {
+        readonly property: "paddingLeft";
+        readonly scale: "space";
+    };
+    readonly paddingRight: {
+        readonly property: "paddingRight";
+        readonly scale: "space";
+    };
+    readonly paddingStart: {
+        readonly property: "paddingStart";
+        readonly scale: "space";
+    };
+    readonly paddingTop: {
+        readonly property: "paddingTop";
+        readonly scale: "space";
+    };
+    readonly paddingVertical: {
+        readonly property: "paddingVertical";
+        readonly scale: "space";
+    };
+    readonly backgroundColor: {
+        readonly property: "backgroundColor";
+        readonly scale: "colors";
+    };
+    readonly bgColor: {
+        readonly property: "backgroundColor";
+        readonly scale: "colors";
+    };
+    readonly borderColor: {
+        readonly property: "borderColor";
+        readonly scale: "colors";
+    };
+    readonly borderTopColor: {
+        readonly property: "borderTopColor";
+        readonly scale: "colors";
+    };
+    readonly borderBottomColor: {
+        readonly property: "borderBottomColor";
+        readonly scale: "colors";
+    };
+    readonly borderStartColor: {
+        readonly property: "borderStartColor";
+        readonly scale: "colors";
+    };
+    readonly borderEndColor: {
+        readonly property: "borderEndColor";
+        readonly scale: "colors";
+    };
+    readonly borderLeftColor: {
+        readonly property: "borderLeftColor";
+        readonly scale: "colors";
+    };
+    readonly borderRightColor: {
+        readonly property: "borderRightColor";
+        readonly scale: "colors";
+    };
+};
+export declare const flexPropsKey: readonly ["alignContent", "alignItems", "alignSelf", "display", "flex", "flexBasis", "flexDirection", "flexGrow", "flexShrink", "flexWrap", "justifyContent"];
+export declare type ConfigType = typeof config;
+export declare type FlexPropsKeyType = typeof flexPropsKey[number];
+export default config;

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

@@ -0,0 +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) => React.JSX.Element;
+export default Box;

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

@@ -0,0 +1,31 @@
+import { StyleProp, ViewStyle, ViewProps } from 'react-native';
+import { SystemPalette } from '../../theme/global';
+import { BorderWidths, Radii } from '../../theme/global/borders';
+import { Space } from '../../theme/global/space';
+import { ConfigType, FlexPropsKeyType } from './config';
+export interface ThemeScale {
+    colors: keyof SystemPalette;
+    space: keyof Space;
+    radii: keyof Radii;
+    borderWidths: keyof BorderWidths;
+}
+declare type ConfigKeyType = keyof ConfigType;
+export declare type StyleProps = {
+    [key in ConfigKeyType]?: ThemeScale[ConfigType[key]['scale']];
+};
+export declare type FlexStyleProps = Pick<Omit<ViewStyle, keyof StyleProps>, FlexPropsKeyType>;
+export interface BoxViewProps extends ViewProps {
+    /**
+     * Box's content.
+     */
+    children?: React.ReactNode;
+    /**
+     * Addtional styles.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+}
+export {};

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

@@ -0,0 +1,57 @@
+import { ReactChild, ReactNode } from 'react';
+import type { StyleProp, ViewStyle } from 'react-native';
+import type { IconName } from '../Icon';
+import type { Intent, ThemeVariant } from './StyledButton';
+export interface ButtonProps {
+    /**
+     * Helps users understand what will happen when they perform an action on the accessibility element when that result is not clear from the accessibility label.
+     */
+    accessibilityHint?: string;
+    /**
+     * A succinct label in a localized string that identifies the accessibility element
+     */
+    accessibilityLabel?: string;
+    /**
+     * Disable state of button.
+     */
+    disabled?: boolean;
+    /**
+     * Places an icon within the button, before the button's text
+     */
+    icon?: IconName | ReactNode;
+    /**
+     * Visual intent color to apply to button. It is required for `filled`, `outlined` and `text` variants.
+     */
+    intent?: 'primary' | 'secondary' | 'danger';
+    /**
+     * Loading state of button.
+     */
+    loading?: boolean;
+    /**
+     * Set the handler to handle press event.
+     */
+    onPress: () => void;
+    /**
+     * Places an icon within the button, after the button's text
+     */
+    rightIcon?: IconName | ReactNode;
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * Button label.
+     */
+    text: ReactChild;
+    /**
+     * Button type.
+     */
+    variant?: 'filled' | 'outlined' | 'text' | 'inline-text';
+}
+export declare const getThemeVariant: (variant: 'filled' | 'outlined' | 'text', intent: Intent) => ThemeVariant;
+declare const Button: ({ accessibilityHint, accessibilityLabel, disabled, icon, intent, loading, onPress, rightIcon, style, testID, text, variant, }: ButtonProps) => JSX.Element;
+export default Button;

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

@@ -0,0 +1,39 @@
+import React from 'react';
+import type { StyleProp, ViewStyle, TouchableOpacityProps } from 'react-native';
+import type { IconProps, IconName } from '../Icon';
+export interface IconButtonProps {
+    /**
+     * Set how far you can touch from the button.
+     */
+    hitSlop?: TouchableOpacityProps['hitSlop'];
+    /**
+     * Name of the Icon.
+     */
+    icon: IconName;
+    /**
+     * Disable state of button.
+     */
+    disabled?: boolean;
+    /**
+     * Intent of the Icon.
+     */
+    intent?: IconProps['intent'];
+    /**
+     * Set the handler to handle press event.
+     */
+    onPress?: () => void;
+    /**
+     * Size of the Icon.
+     */
+    size?: IconProps['size'];
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of component.
+     */
+    testID?: string;
+}
+declare const IconButton: ({ hitSlop, onPress, icon, disabled, testID, style, size, intent, }: IconButtonProps) => React.JSX.Element;
+export default IconButton;

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

@@ -0,0 +1,20 @@
+import type { Theme } from '@emotion/react';
+import type { ViewProps } from 'react-native';
+import { View } from 'react-native';
+declare type ThemeVariant = 'basic-transparent' | 'filled-primary' | 'filled-secondary' | 'filled-danger' | 'outlined-primary' | 'outlined-secondary' | 'outlined-danger' | 'text-primary' | 'text-secondary' | 'text-danger';
+declare const StyledLoadingIndicatorWrapper: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledLoadingDot: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: Theme | undefined;
+    as?: import("react").ElementType<any, keyof import("react").JSX.IntrinsicElements> | undefined;
+} & {
+    size?: number | undefined;
+    themeVariant: ThemeVariant;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export { StyledLoadingDot, StyledLoadingIndicatorWrapper };

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

@@ -0,0 +1,27 @@
+import React from 'react';
+import type { StyleProp, ViewStyle, ViewProps } from 'react-native';
+declare 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 {
+    /**
+     * Size of the loading dot.
+     */
+    count?: number;
+    /**
+     * Size of the loading dot.
+     */
+    size?: number;
+    /**
+     * Additional style.
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * Testing id of the component.
+     */
+    themeVariant: ThemeVariant;
+}
+declare const LoadingIndicator: ({ count, size, testID, themeVariant, ...nativeProps }: LoadingIndicatorProps) => React.JSX.Element;
+export default LoadingIndicator;