@hero-design/rn 8.10.0 → 8.11.1

package/src/types.ts

@@ -14,6 +14,7 @@ import type {
 } from './components/Select/types';
 import { SwipeableProps } from './components/Swipeable';
 import { TextProps } from './components/Typography/Text';
+import { CardCarouselHandles } from './components/Carousel/CardCarousel';
 
 export type {
   BottomNavigationTabType,
@@ -30,4 +31,5 @@ export type {
   TextProps,
   TextInputHandles,
   Theme,
+  CardCarouselHandles,
 };

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

@@ -1,6 +1,6 @@
 import type { ReactNode } from 'react';
 import type { StyleProp, ViewProps, ViewStyle } from 'react-native';
-interface CardProps extends ViewProps {
+export interface CardProps extends ViewProps {
     /**
      * Card's content.
      */

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

@@ -0,0 +1,40 @@
+import React from 'react';
+import { StyleProp, ViewStyle } from 'react-native';
+export declare type CardCarouselHandles = {
+    snapToIndex: (index: number) => void;
+};
+export interface CardCarouselProps {
+    /**
+     * Whether to scroll automatically.
+     */
+    autoPlay?: boolean;
+    /**
+     * Set interval of each slide.
+     */
+    autoPlayInterval?: number;
+    /**
+     * onItemIndexChange event handler receiving index of selected Item.
+     */
+    onItemIndexChange?: (index: number) => void;
+    /**
+     * Carousel data.
+     */
+    items: any[];
+    /**
+     * Indicates hide or show page control.
+     */
+    hidePageControl?: boolean;
+    /**
+     * Additional styles
+     */
+    style?: StyleProp<ViewStyle>;
+    /**
+     * Testing id of the component.
+     */
+    testID?: string;
+    /**
+     * Component ref.
+     */
+    ref?: React.Ref<CardCarouselHandles>;
+}
+export declare const CardCarousel: React.ForwardRefExoticComponent<Pick<CardCarouselProps, "style" | "testID" | "items" | "onItemIndexChange" | "hidePageControl" | "autoPlay" | "autoPlayInterval"> & React.RefAttributes<CardCarouselHandles>>;

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

@@ -0,0 +1,31 @@
+/// <reference types="react" />
+import { View, ViewProps } from 'react-native';
+import { CardProps } from '../Card';
+import { PageControlProps } from '../PageControl';
+declare const StyledPageControl: import("@emotion/native").StyledComponent<PageControlProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {}>;
+declare const StyledWrapper: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledCard: import("@emotion/native").StyledComponent<CardProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {}>;
+declare const StyledShadow: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+declare const StyledItemWrapper: import("@emotion/native").StyledComponent<ViewProps & {
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, {}, {
+    ref?: import("react").Ref<View> | undefined;
+}>;
+export { StyledCard, StyledShadow, StyledItemWrapper, StyledWrapper, StyledPageControl, };

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

@@ -0,0 +1,2 @@
+export declare const ITEM_WIDTH_RATE = 0.85;
+export declare const VIEW_POSITION_CENTER = 0.5;

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

@@ -1,4 +1,4 @@
-import { Dispatch, SetStateAction } from 'react';
+import React, { Dispatch, SetStateAction } from 'react';
 import { StyleProp, ViewProps, ViewStyle } from 'react-native';
 import { CarouselData } from './types';
 interface CarouselProps extends ViewProps {
@@ -32,5 +32,7 @@ interface CarouselProps extends ViewProps {
     selectedItemIndex?: number;
 }
 export declare function useStateFromProp<T>(initialValue: T): [T, Dispatch<SetStateAction<T>>];
-declare const Carousel: ({ items, onItemIndexChange, renderActions, selectedItemIndex, style, shouldShowPagination, ...nativeProps }: CarouselProps) => JSX.Element;
-export default Carousel;
+declare const _default: (({ items, onItemIndexChange, renderActions, selectedItemIndex, style, shouldShowPagination, ...nativeProps }: CarouselProps) => JSX.Element) & {
+    Card: React.ForwardRefExoticComponent<Pick<import("./CardCarousel").CardCarouselProps, "style" | "testID" | "items" | "onItemIndexChange" | "hidePageControl" | "autoPlay" | "autoPlayInterval"> & React.RefAttributes<import("./CardCarousel").CardCarouselHandles>>;
+};
+export default _default;

package/types/theme/components/cardCarousel.d.ts

@@ -0,0 +1,25 @@
+import type { GlobalTheme } from '../global';
+declare const getCardCarouselTheme: (theme: GlobalTheme) => {
+    shadows: {
+        offset: {
+            width: number;
+            height: number;
+        };
+        opacity: number;
+        radius: number;
+        elevation: number;
+    };
+    colors: {
+        shadow: string;
+        carouselItemBackground: string;
+    };
+    space: {
+        pageControlMarginTop: number;
+        carouselItemSpacing: number;
+        contentContainerPaddingHorizontal: number;
+    };
+    radii: {
+        card: number;
+    };
+};
+export default getCardCarouselTheme;

package/types/theme/components/textInput.d.ts

@@ -52,6 +52,7 @@ declare const getTextInputTheme: (theme: GlobalTheme) => {
         maxLengthLabelMarginLeft: number;
         errorAndHelpTextContainerPaddingLeft: number;
         containerMarginTop: number;
+        labelInsideTextInputMarginTop: number;
     };
     fontSizes: {
         text: number;
@@ -69,10 +70,6 @@ declare const getTextInputTheme: (theme: GlobalTheme) => {
     radii: {
         container: number;
     };
-    lineHeights: {
-        text: number;
-        labelInsideTextInput: number;
-    };
     sizes: {
         errorAndHelpTextContainerHeight: number;
     };

package/types/theme/getTheme.d.ts

@@ -9,6 +9,7 @@ import getButtonTheme from './components/button';
 import getCalendarTheme from './components/calendar';
 import getCardTheme from './components/card';
 import getCarouselTheme from './components/carousel';
+import getCardCarouselTheme from './components/cardCarousel';
 import getCheckboxTheme from './components/checkbox';
 import getContentNavigatorTheme from './components/contentNavigator';
 import getDatePickerTheme from './components/datePicker';
@@ -52,6 +53,7 @@ declare type Theme = GlobalTheme & {
         calendar: ReturnType<typeof getCalendarTheme>;
         card: ReturnType<typeof getCardTheme>;
         carousel: ReturnType<typeof getCarouselTheme>;
+        cardCarousel: ReturnType<typeof getCardCarouselTheme>;
         checkbox: ReturnType<typeof getCheckboxTheme>;
         contentNavigator: ReturnType<typeof getContentNavigatorTheme>;
         datePicker: ReturnType<typeof getDatePickerTheme>;

package/types/types.d.ts

@@ -8,4 +8,5 @@ import type { Theme } from './theme';
 import type { ListRenderOptionInfo, SectionListRenderOptionInfo } from './components/Select/types';
 import { SwipeableProps } from './components/Swipeable';
 import { TextProps } from './components/Typography/Text';
-export type { BottomNavigationTabType, IconName, SingleSelectProps, MultiSelectProps, ListRenderOptionInfo, SectionListRenderOptionInfo, SwipeableProps, RichTextEditorProps, RichTextEditorRef, TabType, TextInputProps, TextProps, TextInputHandles, Theme, };
+import { CardCarouselHandles } from './components/Carousel/CardCarousel';
+export type { BottomNavigationTabType, IconName, SingleSelectProps, MultiSelectProps, ListRenderOptionInfo, SectionListRenderOptionInfo, SwipeableProps, RichTextEditorProps, RichTextEditorRef, TabType, TextInputProps, TextProps, TextInputHandles, Theme, CardCarouselHandles, };