@fountain-ui/lab 2.0.0-beta.3 → 2.0.0-beta.30

package/build/typescript/Carousel/CarouselProps.d.ts

@@ -1,7 +1,8 @@
-import React, { RefObject } from 'react';
-import type { ListRenderItemInfo } from 'react-native';
+import type { RefObject } from 'react';
 import type { ComponentProps } from '@fountain-ui/core';
+import type { CarouselInstance, CreateItemStyle, CreateScrollAnimation, ItemHeight, OnIndexChange, RenderItem } from './types';
 export default interface CarouselProps<ItemT = any> extends ComponentProps<{
+    ref?: RefObject<CarouselInstance>;
     /**
      * If `true`, enable autoplay.
      * @default false
@@ -13,78 +14,62 @@ export default interface CarouselProps<ItemT = any> extends ComponentProps<{
      */
     autoplayInterval?: number;
     /**
-     * Padding for center slide. If specified, `slidesToScroll` and `slidesToShow` set to 1.
+     * The item style creator function.
+     * @default createDefaultItemStyle
      */
-    centerSlidePadding?: number;
+    createItemStyle?: CreateItemStyle;
     /**
-     * Delay in ms until navigating to the next item.
+     * The scroll animation creator function.
+     * @default createDefaultScrollAnimation
+     */
+    createScrollAnimation?: CreateScrollAnimation;
+    /**
+     * Data for render items.
      */
     data: ReadonlyArray<ItemT>;
     /**
-     * Value of the opacity effect applied to inactive slides.
-     * @default 0.7
+     * If `true`, carousel will detect its own viewability and control autoplay automatically.
+     * @default false
      */
-    inactiveSlideOpacity?: number;
+    disableSmartAutoplay?: boolean;
     /**
-     * Value of the 'scale' transform applied to inactive slides.
-     * @default 0.9
+     * Index of initial item that should be selected.
+     * @default 0
      */
-    inactiveSlideScale?: number;
+    initialIndex?: number;
     /**
-     * Web only. Value of the 'scale' transform applied to a active slide.
-     * @default 0.990
+     * The item height.
+     * For a performance reason, always consider to provide a number value.
      */
-    activeSlideScale?: number;
+    itemHeight: ItemHeight;
     /**
-     * A number representing the index of the active slide.
+     * The item width.
      */
-    index: number;
+    itemWidth: number;
     /**
      * Enable infinite loop mode.
      * @default false
      */
-    infinite?: boolean;
+    loop?: boolean;
     /**
      * Callback fired when an index is changed.
      */
-    onChange?: (newIndex: number) => void;
+    onIndexChange?: OnIndexChange;
     /**
      * Takes an item from data and renders it into the list.
      */
-    renderItem: (info: Omit<ListRenderItemInfo<ItemT>, 'separators'>) => React.ReactElement | null;
-    /**
-     * Web only. Number of slides to scroll at once.
-     * @default 1
-     */
-    slidesToScroll?: number;
-    /**
-     * Web only. Number of slides to display.
-     * @default 1
-     */
-    slidesToShow?: number;
+    renderItem: RenderItem<ItemT>;
     /**
-     * Web only. Enable items to display at the center.
+     * Whether to enable scroll gesture.
      * @default true
      */
-    centerMode?: boolean;
-    /**
-     * Web only. Enable arrows to display.
-     * @default true
-     */
-    arrows?: boolean;
-    /**
-     * Web only. Style of arrows
-     * @default true
-     */
-    arrowsStyle?: object;
-    /**
-     * Web only. Style of track
-     * @default object
-     */
-    trackStyle?: object;
+    scrollEnabled?: boolean;
     /**
-     * Only web. Refer slick object
+     * The maximum number of items that can respond to pan gesture events.
+     * Due to the nature of the `active` item, it accepts only odd number. (e.g. 1, 3, 5...)
+     * 0 means all items will respond to pan gesture events.
+     * @default 5
      */
-    ref?: RefObject<any>;
+    windowSize?: number;
 }> {
 }

package/build/typescript/Carousel/animation/animationUtils.d.ts

@@ -0,0 +1 @@
+export declare const itemInterpolationInputRange: number[];

package/build/typescript/Carousel/animation/createDefaultItemStyle.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("../types").CreateItemStyle;
+export default _default;

package/build/typescript/Carousel/animation/createDefaultScrollAnimation.d.ts

@@ -0,0 +1,2 @@
+import { Animated } from 'react-native';
+export default function createDefaultScrollAnimation(animatedValue: Animated.Value, toValue: number): Animated.CompositeAnimation;

package/build/typescript/Carousel/animation/index.d.ts

@@ -0,0 +1,4 @@
+export { default as createDefaultItemStyle } from './createDefaultItemStyle';
+export { default as createDefaultScrollAnimation } from './createDefaultScrollAnimation';
+export { default as normalItemStyleFactory } from './normalItemStyleFactory';
+export { default as parallaxItemStyleFactory } from './parallaxItemStyleFactory';

package/build/typescript/Carousel/animation/normalItemStyleFactory.d.ts

@@ -0,0 +1,2 @@
+import type { CreateItemStyle } from '../types';
+export default function normalItemStyleFactory(): CreateItemStyle;

package/build/typescript/Carousel/animation/parallaxItemStyleFactory.d.ts

@@ -0,0 +1,9 @@
+import type { CreateItemStyle } from '../types';
+export interface ParallaxAnimationConfig {
+    activeItemScale?: number;
+    activeItemOpacity?: number;
+    adjacentItemScale?: number;
+    adjacentItemOpacity?: number;
+    scrollingOffset?: number;
+}
+export default function parallaxItemStyleFactory(config?: ParallaxAnimationConfig): CreateItemStyle;

package/build/typescript/Carousel/components/InternalContext.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+import { Animated } from 'react-native';
+import type { CreateItemStyle, ItemHeight, ItemVisibilityStore } from '../types';
+export interface InternalContextValue<ItemT> {
+    createItemStyle: CreateItemStyle;
+    data: ReadonlyArray<ItemT>;
+    globalInterpolation: Animated.AnimatedInterpolation;
+    itemHeight: ItemHeight;
+    itemWidth: number;
+    itemVisibilityStore: ItemVisibilityStore;
+    loop: boolean;
+}
+declare const InternalContext: import("react").Context<InternalContextValue<any>>;
+export default InternalContext;

package/build/typescript/Carousel/components/ItemView.d.ts

@@ -0,0 +1,9 @@
+import type { ReactElement } from 'react';
+import type { ViewProps } from 'react-native';
+import { Animated } from 'react-native';
+export interface ItemViewProps {
+    children: (interpolation: Animated.AnimatedInterpolation) => ReactElement | null;
+    index: number;
+    onLayout?: ViewProps['onLayout'];
+}
+export default function ItemView(props: ItemViewProps): JSX.Element;

package/build/typescript/Carousel/components/RootView.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import type { View, ViewProps } from 'react-native';
+import type { ItemHeight, RenderItem } from '../types';
+export declare type RootViewProps<ItemT> = ViewProps & {
+    data: ReadonlyArray<ItemT>;
+    itemHeight: ItemHeight;
+    originalData: ReadonlyArray<ItemT>;
+    renderItem: RenderItem<ItemT>;
+};
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<ViewProps & {
+    data: readonly any[];
+    itemHeight: ItemHeight;
+    originalData: readonly any[];
+    renderItem: RenderItem<any>;
+} & React.RefAttributes<View>>>;
+export default _default;

package/build/typescript/Carousel/components/ScrollViewGesture.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from 'react';
+import { Animated } from 'react-native';
+import type { AutoplayController, StartPagingAnimation } from '../types';
+export interface ScrollViewGestureProps {
+    autoplayController: AutoplayController;
+    children: ReactNode;
+    gestureTranslationX: Animated.Value;
+    interruptAnimation: () => void;
+    scrollEnabled: boolean;
+    startPagingAnimation: StartPagingAnimation;
+}
+export default function ScrollViewGesture(props: ScrollViewGestureProps): JSX.Element;

package/build/typescript/Carousel/components/index.d.ts

@@ -0,0 +1,4 @@
+export { default as InternalContext } from './InternalContext';
+export { default as ItemView } from './ItemView';
+export { default as RootView } from './RootView';
+export { default as ScrollViewGesture } from './ScrollViewGesture';

package/build/typescript/Carousel/components/useItemInterpolation.d.ts

@@ -0,0 +1,2 @@
+import { Animated } from 'react-native';
+export default function useItemInterpolation(index: number): Animated.AnimatedInterpolation;

package/build/typescript/Carousel/hooks/index.d.ts

@@ -0,0 +1,5 @@
+export { default as useAutoplayController } from './useAutoplayController';
+export { default as useIndexController } from './useIndexController';
+export { default as useLoopedData } from './useLoopedData';
+export { default as usePagingAnimator } from './usePagingAnimator';
+export { default as useItemVisibilityStore } from './useItemVisibilityStore';

package/build/typescript/Carousel/hooks/useAutoplayController.d.ts

@@ -0,0 +1,7 @@
+import type { AutoplayController, StartPagingAnimation } from '../types';
+export interface AutoplayConfig {
+    enabled: boolean;
+    intervalMillis: number;
+    startPagingAnimation: StartPagingAnimation;
+}
+export default function useAutoplayController(config: AutoplayConfig): AutoplayController;

package/build/typescript/Carousel/hooks/useIndexController.d.ts

@@ -0,0 +1,10 @@
+import type { IndexController } from '../types';
+export interface UseIndexControllerParameters {
+    initialIndex: number;
+    itemWidth: number;
+    numberOfData: number;
+    numberOfOriginalData: number;
+    onIndexChange?: (itemIndex: number) => void;
+    onPositionChange?: (position: number) => void;
+}
+export default function useIndexController(params: UseIndexControllerParameters): IndexController;

package/build/typescript/Carousel/hooks/useItemVisibilityStore.d.ts

@@ -0,0 +1,7 @@
+import type { ItemVisibilityStore, OnPositionChange } from '../types';
+export interface Parameters {
+    initialIndex: number;
+    numberOfData: number;
+    windowSize: number;
+}
+export default function useItemVisibilityStore(params: Parameters): [ItemVisibilityStore, OnPositionChange];

package/build/typescript/Carousel/hooks/useLoopedData.d.ts

@@ -0,0 +1 @@
+export default function useLoopedData<ItemT>(originalData: ReadonlyArray<ItemT>, loop: boolean): ReadonlyArray<ItemT>;

package/build/typescript/Carousel/hooks/usePagingAnimator.d.ts

@@ -0,0 +1,17 @@
+import { Animated } from 'react-native';
+import type { CreateScrollAnimation, IndexController, StartPagingAnimation } from '../types';
+export interface PagingAnimatorConfig {
+    createScrollAnimation: CreateScrollAnimation;
+    itemWidth: number;
+    indexController: IndexController;
+    initialIndex: number;
+    loop: boolean;
+    numberOfData: number;
+}
+export interface PagingAnimator {
+    gestureTranslationX: Animated.Value;
+    globalInterpolation: Animated.AnimatedInterpolation;
+    interruptAnimation: () => void;
+    startPagingAnimation: StartPagingAnimation;
+}
+export default function usePagingAnimator(config: PagingAnimatorConfig): PagingAnimator;

package/build/typescript/Carousel/index.d.ts

@@ -1,2 +1,4 @@
-export { default } from './CarouselWeb';
+export { default } from './Carousel';
 export type { default as CarouselProps } from './CarouselProps';
+export type { CarouselInstance } from './types';
+export { normalItemStyleFactory, parallaxItemStyleFactory } from './animation';

package/build/typescript/Carousel/tick.d.ts

@@ -0,0 +1,2 @@
+declare const _default: (key: string, message?: string | undefined) => void;
+export default _default;

package/build/typescript/Carousel/types.d.ts

@@ -0,0 +1,91 @@
+import type { ReactElement } from 'react';
+import type { Animated, ViewProps } from 'react-native';
+declare const directions: readonly ["next", "prev", "stay"];
+export declare type PagingDirection = (typeof directions)[number];
+declare const scrollStates: readonly ["idle", "dragging", "interrupted"];
+export declare type ScrollState = (typeof scrollStates)[number];
+export declare type ItemHeight = number | 'auto';
+export interface RenderItem<T> {
+    (info: {
+        item: T;
+        index: number;
+        interpolation: Animated.AnimatedInterpolation;
+    }): ReactElement | null;
+}
+export interface CreateScrollAnimation {
+    (aValue: Animated.AnimatedValue, toValue: number): Animated.CompositeAnimation;
+}
+export interface CreateItemStyle {
+    (itemInterpolation: Animated.AnimatedInterpolation, itemWidth: number): Animated.AnimatedProps<ViewProps['style']>;
+}
+export interface GetCurrentIndex {
+    (): number;
+}
+export interface OnIndexChange {
+    (itemIndex: number): void;
+}
+export interface OnPositionChange {
+    (position: number): void;
+}
+export interface ScrollStateChangeEvent {
+    offset: number;
+    state: ScrollState;
+}
+export interface IndexController {
+    getCurrentIndex: GetCurrentIndex;
+    lastIndex: number;
+    notifyScrollStateHasChanged: (event: ScrollStateChangeEvent) => void;
+}
+export declare type PagingAnimationType = 'directional' | 'index';
+export interface BasePagingAnimationConfig {
+    animated?: boolean;
+    lastGestureTranslationX?: number;
+}
+export interface DirectionalPagingAnimationConfig extends BasePagingAnimationConfig {
+    direction: PagingDirection;
+    isOriginatedFromGesture?: boolean;
+}
+export interface IndexPagingAnimationConfig extends BasePagingAnimationConfig {
+    index: number;
+}
+export declare type PagingAnimationConfig = DirectionalPagingAnimationConfig | IndexPagingAnimationConfig;
+export interface StartPagingAnimation {
+    (type: PagingAnimationType, config: PagingAnimationConfig): void;
+}
+export declare type VisibleIndexRanges = Array<[number, number]>;
+export interface StoreSubscription {
+    (): void;
+}
+export interface ItemVisibilityStore {
+    dispatch: (ranges: VisibleIndexRanges) => void;
+    subscribe: (listener: (ranges: VisibleIndexRanges) => void) => StoreSubscription;
+    removeAllListeners: () => void;
+}
+export interface AutoplayController {
+    pause: () => void;
+    resume: () => void;
+}
+export interface ScrollToOption {
+    index: number;
+    animated?: boolean;
+}
+export interface CarouselInstance {
+    /**
+     * Get current visible item index.
+     */
+    getCurrentIndex: GetCurrentIndex;
+    /**
+     * Scroll to next visible item.
+     */
+    next: () => void;
+    /**
+     * Scroll to previous visible item.
+     */
+    prev: () => void;
+    /**
+     * Scroll to desired indexed item.
+     * Invalid index is ignored.
+     */
+    scrollTo: (option: ScrollToOption) => void;
+}
+export {};

package/build/typescript/ComicViewer/ComicViewer.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import { default as ComicViewerProps } from './ComicViewerProps';
 export default function ComicViewer<T>(props: ComicViewerProps<T>): JSX.Element;

package/build/typescript/ComicViewer/ComicViewerItemProps.d.ts

@@ -1,12 +1,23 @@
-import { ComicViewerItemData, ErrorInfo } from './ComicViewerProps';
+import { ComicViewerItemData, ErrorInfo, ComicViewerItemState } from './ComicViewerProps';
 declare type ComicViewerItemProps<T> = ComicViewerItemData<T> & {
     /**
      * FlatListItem is viewable in screen.
      */
     isViewable: boolean;
+    /**
+     * How many times retry onError when same item error occur
+     * @default 3
+     */
+    errorRetryCount?: number;
     /**
      * Error handler
      */
     onError?: (errorInfo: ErrorInfo) => void;
+    /**
+     * Load handler
+     */
+    onLoaded?: (sortKey: number) => void;
+    getNextPage?: (sortKey: number) => void;
+    itemState?: ComicViewerItemState;
 };
 export default ComicViewerItemProps;

package/build/typescript/ComicViewer/ComicViewerProps.d.ts

@@ -1,13 +1,36 @@
+import React from 'react';
 import { ComponentProps } from '@fountain-ui/core';
+import { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';
+export declare const STATE: {
+    readonly UNLOAD: "unload";
+    readonly LOADING: "loading";
+    readonly LOADED: "loaded";
+    readonly FAIL: "fail";
+};
+export declare type LoadingState = typeof STATE[keyof typeof STATE];
+export interface ComicViewerItemState {
+    /**
+     * Content's loading state.
+     */
+    state: LoadingState;
+    /***
+     * Content's error Info.
+     */
+    error?: ErrorInfo;
+}
 export interface ErrorInfo {
     /**
-     * ComicViewerItemData.id.
+     * ComicViewerItemData.sortKey.
      */
-    id: string;
+    sortKey: number;
     /**
      * Number of times an error occurred.
      */
     count: number;
+    /**
+     * Content is Expired: true
+     */
+    expired: boolean;
 }
 export declare type ComicViewerItemData<T = {}> = T & {
     /**
@@ -17,15 +40,23 @@ export declare type ComicViewerItemData<T = {}> = T & {
     /**
      * Unique value for identifying.
      */
-    id: string;
+    id: number | undefined;
     /**
      * Image sourceUrl for displaying.
      */
-    sourceUrl: string;
+    url: string;
     /**
      * Image width.
      */
     width: number;
+    /**
+     * SortKey
+     */
+    sortKey: number;
+    /**
+     * Image expire date.
+     */
+    expiresAt: string;
 };
 export default interface ComicViewerProps<T> extends ComponentProps<{
     /**
@@ -43,9 +74,9 @@ export default interface ComicViewerProps<T> extends ComponentProps<{
      */
     errorRetryCount?: number;
     /**
-    * How many items to render in the initial batch.
-    * @default 1
-    */
+     * How many items to render in the initial batch.
+     * @default 1
+     */
     initialNumToRender?: number;
     /**
      * Start at initialScrollPercentage.
@@ -58,11 +89,6 @@ export default interface ComicViewerProps<T> extends ComponentProps<{
      * @default 0
      */
     itemVisiblePercentThreshold?: number;
-    /**
-     * Handling all viewerItem errors at once.
-     * @param errors Array of ViewerItems errorInfo.
-     */
-    onError?: (errors: ErrorInfo[]) => void;
     /**
      * Comic viewer width.
      */
@@ -72,5 +98,28 @@ export default interface ComicViewerProps<T> extends ComponentProps<{
      * @default 3
      */
     windowSize?: number;
+    /**
+     * How many images in one page.
+     */
+    pageUnit: number;
+    /**
+     * Method for getting next page contents.
+     * @param sortKey
+     */
+    getNextPage?: (sortKey: number) => void;
+    /**
+     * Handling all viewerItem errors at once.
+     * @param errors Array of ViewerItems errorInfo.
+     */
+    onError?: (errors: ErrorInfo[]) => void;
+    /**
+     * Handle scroll event.
+     * @param event Scroll event.
+     */
+    onScroll?: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
+    /**
+     * Component for comic viewer footer.
+     */
+    ListFooterComponent?: React.ReactElement;
 }> {
 }

package/build/typescript/DateTimePicker/DateTimePicker.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type DateTimePickerProps from './DateTimePickerProps';
 export default function DateTimePicker(props: DateTimePickerProps): JSX.Element;

package/build/typescript/DateTimePicker/YearPicker.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="react" />
 interface YearPickerProps {
     date: Date;
     locale?: string;

package/build/typescript/FlipCard/FlipCard.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type FlipCardProps from './FlipCardProps';
 export default function FlipCard(props: FlipCardProps): JSX.Element;

package/build/typescript/StatusBarProvider/StatusBarProvider.d.ts

@@ -1,3 +1,2 @@
-/// <reference types="react" />
 import type StatusBarProviderProps from './StatusBarProviderProps';
 export default function StatusBarProvider(props: StatusBarProviderProps): JSX.Element;

package/build/typescript/ViewPager/FluxContext.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { MonoStore } from '@fountain-ui/core';
+export declare type FluxStore<S> = MonoStore<S>;
+declare const FluxContext: import("react").Context<FluxStore<any> | null>;
+export default FluxContext;

package/build/typescript/ViewPager/InternalContext.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import type { MonoStore } from '@fountain-ui/core';
+export interface InternalContextValue {
+    pageStore: MonoStore<number>;
+}
+declare const InternalContext: import("react").Context<InternalContextValue>;
+export default InternalContext;

package/build/typescript/ViewPager/PageStateContext.d.ts

@@ -0,0 +1,6 @@
+/// <reference types="react" />
+export interface PageState {
+    isActive: boolean;
+}
+declare const PageStateContext: import("react").Context<PageState>;
+export default PageStateContext;

package/build/typescript/ViewPager/ViewPager.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type ViewPagerProps from './ViewPagerProps';
+import type { ViewPagerInstance } from './types';
+declare const ViewPager: React.ForwardRefExoticComponent<Pick<ViewPagerProps, "style" | "children" | "onChange" | "scrollEnabled" | "keyboardDismissMode" | "initialPage" | "loading" | "offscreenPageRerenderLimit" | "pageForceRerenderKey" | "UNSTABLE_sharedPage"> & React.RefAttributes<ViewPagerInstance>>;
+export default ViewPager;

package/build/typescript/ViewPager/ViewPager.native.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import type ViewPagerProps from './ViewPagerProps';
+import type { ViewPagerInstance } from './types';
+declare const ViewPager: React.ForwardRefExoticComponent<Pick<ViewPagerProps, "style" | "children" | "onChange" | "scrollEnabled" | "keyboardDismissMode" | "initialPage" | "loading" | "offscreenPageRerenderLimit" | "pageForceRerenderKey" | "UNSTABLE_sharedPage"> & React.RefAttributes<ViewPagerInstance>>;
+export default ViewPager;