react-native-reanimated-carousel 4.0.0-alpha.0 → 4.0.0-alpha.1

package/src/types.ts

@@ -1,5 +1,5 @@
 import type { StyleProp, ViewStyle } from "react-native";
-import type { PanGestureHandlerProps } from "react-native-gesture-handler";
+import type { PanGesture } from "react-native-gesture-handler";
 import type {
   AnimatedStyleProp,
   SharedValue,
@@ -12,36 +12,36 @@ import type { TParallaxModeProps } from "./layouts/parallax";
 import type { TStackModeProps } from "./layouts/stack";
 
 export type IComputedDirectionTypes<T, VP = {}, HP = {}> =
-    | (T &
-    VP & {
-      /**
-               * Layout items vertically instead of horizontally
-               */
-      vertical: true
-      /**
-               * Layout items vertically instead of horizontally
-               */
-      /**
-               * Specified carousel container width.
-               */
-      width?: number
-      height: number
-    })
-    | (T &
-    HP & {
-      /**
-               * Layout items vertically instead of horizontally
-               */
-      vertical?: false
-      /**
-               * Layout items vertically instead of horizontally
-               */
-      /**
-               * Specified carousel container width.
-               */
-      width: number
-      height?: number
-    });
+   | (T &
+   VP & {
+     /**
+                  * Layout items vertically instead of horizontally
+                  */
+     vertical: true
+     /**
+                  * Layout items vertically instead of horizontally
+                  */
+     /**
+                  * Specified carousel container width.
+                  */
+     width?: number
+     height: number
+   })
+   | (T &
+   HP & {
+     /**
+                  * Layout items vertically instead of horizontally
+                  */
+     vertical?: false
+     /**
+                  * Layout items vertically instead of horizontally
+                  */
+     /**
+                  * Specified carousel container width.
+                  */
+     width: number
+     height?: number
+   });
 
 export interface CustomConfig {
   type?: "negative" | "positive"
@@ -63,132 +63,130 @@ export type WithAnimation = WithSpringAnimation | WithTimingAnimation;
 export type TCarouselProps<T = any> = {
   ref?: React.Ref<ICarouselInstance>
   /**
-     * The default animated value of the carousel.
-     */
+      * The default animated value of the carousel.
+      */
   defaultScrollOffsetValue?: SharedValue<number>
   /**
-     * Carousel loop playback.
-     * @default true
-     */
+      * Carousel loop playback.
+      * @default true
+      */
   loop?: boolean
   /**
-     * Carousel items data set.
-     */
+      * Carousel items data set.
+      */
   data: T[]
   /**
-     * Auto fill data array to allow loop playback when the loop props is true.
-     * @default true
-     * @example
-     * [1] => [1, 1, 1]
-     * [1, 2] => [1, 2, 1, 2]
-     */
+      * Auto fill data array to allow loop playback when the loop props is true.
+      * @default true
+      * @example
+      * [1] => [1, 1, 1]
+      * [1, 2] => [1, 2, 1, 2]
+      */
   autoFillData?: boolean
   /**
-     * Default index
-     * @default 0
-     */
+      * Default index
+      * @default 0
+      */
   defaultIndex?: number
   /**
-     * Auto play
-     */
+      * Auto play
+      */
   autoPlay?: boolean
   /**
-     * Auto play
-     * @description reverse playback
-     */
+      * Auto play
+      * @description reverse playback
+      */
   autoPlayReverse?: boolean
   /**
-     * Auto play
-     * @description playback interval
-     */
+      * Auto play
+      * @description playback interval
+      */
   autoPlayInterval?: number
   /**
-     * Time a scroll animation takes to finish
-     * @default 500 (ms)
-     */
+      * Time a scroll animation takes to finish
+      * @default 500 (ms)
+      */
   scrollAnimationDuration?: number
   /**
-     * Carousel container style
-     */
+      * Carousel container style
+      */
   style?: StyleProp<ViewStyle>
   /**
-     * PanGestureHandler props
-     */
-  panGestureHandlerProps?: Partial<
-  Omit<PanGestureHandlerProps, "onHandlerStateChange" | "enabled">
-  >
-  /**
-     * Determines the maximum number of items will respond to pan gesture events,
-     * windowSize={11} will active visible item plus up to 5 items above and 5 below the viewpor,
-     * Reducing this number will reduce the calculation of the animation value and may improve performance.
-     * @default 0 all items will respond to pan gesture events.
-     */
+      * PanGesture config
+      */
+  onConfigurePanGesture?: (panGesture: PanGesture) => void
+  /**
+      * Determines the maximum number of items will respond to pan gesture events,
+      * windowSize={11} will active visible item plus up to 5 items above and 5 below the viewpor,
+      * Reducing this number will reduce the calculation of the animation value and may improve performance.
+      * @default 0 all items will respond to pan gesture events.
+      */
   windowSize?: number
   /**
-     * When true, the scroll view stops on multiples of the scroll view's size when scrolling.
-     * @default true
-     */
+      * When true, the scroll view stops on multiples of the scroll view's size when scrolling.
+      * @default true
+      */
   pagingEnabled?: boolean
   /**
-     * If enabled, releasing the touch will scroll to the nearest item.
-     * valid when pagingEnabled=false
-     * @default true
-     */
+      * If enabled, releasing the touch will scroll to the nearest item.
+      * valid when pagingEnabled=false
+      * @default true
+      */
   snapEnabled?: boolean
   /**
-     * If enabled, items will scroll to the first placement when scrolling past the edge rather than closing to the last. (previous conditions: loop=false)
-     * @default true
-     */
+      * If enabled, items will scroll to the first placement when scrolling past the edge rather than closing to the last. (previous conditions: loop=false)
+      * @default true
+      */
   overscrollEnabled?: boolean
   /**
-     * If false, Carousel will not respond to any gestures.
-     * @default true
-     */
+      * If false, Carousel will not respond to any gestures.
+      * @default true
+      */
   enabled?: boolean
   /**
-     * Specifies the scrolling animation effect.
-     */
+      * Specifies the scrolling animation effect.
+      */
   withAnimation?: WithAnimation
   /**
-     * Used to locate this view in end-to-end tests.
-     */
+      * Used to locate this view in end-to-end tests.
+      */
   testID?: string
   /**
-    * Maximum offset value for once scroll.
-    * props.vertical = true => maxScrollDistancePerSwipeY
-    * props.vertical = false => maxScrollDistancePerSwipeX
-    * */
+     * Maximum offset value for once scroll.
+     * props.vertical = true => maxScrollDistancePerSwipeY
+     * props.vertical = false => maxScrollDistancePerSwipeX
+     * */
   maxScrollDistancePerSwipe?: number
   /**
-     * Custom carousel config.
-     */
+      * Custom carousel config.
+      */
   customConfig?: () => CustomConfig
   /**
-     * Custom animations.
-     * Must use `worklet`, Details: https://docs.swmansion.com/react-native-reanimated/docs/2.2.0/worklets/
-     */
+      * Custom animations.
+      * Must use `worklet`, Details: https://docs.swmansion.com/react-native-reanimated/docs/2.2.0/worklets/
+      */
   customAnimation?: (value: number) => AnimatedStyleProp<ViewStyle>
   /**
-     * Render carousel item.
-     */
+      * Render carousel item.
+      */
   renderItem: CarouselRenderItem<T>
   /**
-     * Callback fired when navigating to an item.
-     */
+      * Callback fired when navigating to an item.
+      */
   onSnapToItem?: (index: number) => void
   /**
-     * On scroll begin
-     */
+      * On scroll begin
+      */
   onScrollBegin?: () => void
   /**
-     * On scroll end
-     */
+      * On scroll end
+      */
   onScrollEnd?: (index: number) => void
   /**
-     * On progress change
-     * @param offsetProgress Total of offset distance (0 390 780 ...)
-     * @param absoluteProgress Convert to index (0 1 2 ...)
-     */
+      * On progress change
+      * @param offsetProgress Total of offset distance (0 390 780 ...)
+      * @param absoluteProgress Convert to index (0 1 2 ...)
+      */
   onProgressChange?: (
     offsetProgress: number,
     absoluteProgress: number
@@ -196,32 +194,32 @@ export type TCarouselProps<T = any> = {
 
   // ============================== deprecated props ==============================
   /**
-     * If enabled, releasing the touch will scroll to the nearest item.
-     * valid when pagingEnabled=false
-     * @deprecated please use snapEnabled instead
-     */
+      * If enabled, releasing the touch will scroll to the nearest item.
+      * valid when pagingEnabled=false
+      * @deprecated please use snapEnabled instead
+      */
   enableSnap?: boolean
 } & (TParallaxModeProps | TStackModeProps);
 
 export interface ICarouselInstance {
   /**
-     * Scroll to previous item, it takes one optional argument (count),
-     * which allows you to specify how many items to cross
-     */
+      * Scroll to previous item, it takes one optional argument (count),
+      * which allows you to specify how many items to cross
+      */
   prev: (opts?: Omit<TCarouselActionOptions, "index">) => void
   /**
-     * Scroll to next item, it takes one optional argument (count),
-     * which allows you to specify how many items to cross
-     */
+      * Scroll to next item, it takes one optional argument (count),
+      * which allows you to specify how many items to cross
+      */
   next: (opts?: Omit<TCarouselActionOptions, "index">) => void
   /**
-     * Get current item index
-     */
+      * Get current item index
+      */
   getCurrentIndex: () => number
   /**
-     * Use value to scroll to a position where relative to the current position,
-     * scrollTo(-2) is equivalent to prev(2), scrollTo(2) is equivalent to next(2)
-     */
+      * Use value to scroll to a position where relative to the current position,
+      * scrollTo(-2) is equivalent to prev(2), scrollTo(2) is equivalent to next(2)
+      */
   scrollTo: (opts?: TCarouselActionOptions) => void
 }
 

package/README.zh-CN.md

@@ -1,202 +0,0 @@
-[English](./README.md) | 简体中文
-
-# react-native-reanimated-carousel
-
-<img src="assets/home-banner-zh.png" width="100%"/>
-
-![Hacktober Badge](https://img.shields.io/badge/hacktoberfest-2022-blueviolet)
-![platforms](https://img.shields.io/badge/platforms-Android%20%7C%20iOS%20%7C%20Web-brightgreen.svg?style=flat-square&colorB=191A17)
-[![npm](https://img.shields.io/npm/v/react-native-reanimated-carousel.svg?style=flat-square)](https://www.npmjs.com/package/react-native-reanimated-carousel)
-[![npm](https://img.shields.io/npm/dm/react-native-reanimated-carousel.svg?style=flat-square&colorB=007ec6)](https://www.npmjs.com/package/react-native-reanimated-carousel)
-[![npm](https://img.shields.io/npm/dw/react-native-reanimated-carousel.svg?style=flat-square&colorB=007ec6)](https://www.npmjs.com/package/react-native-reanimated-carousel)
-[![github issues](https://img.shields.io/github/issues/dohooo/react-native-reanimated-carousel.svg?style=flat-square)](https://github.com/dohooo/react-native-reanimated-carousel/issues)
-[![github closed issues](https://img.shields.io/github/issues-closed/dohooo/react-native-reanimated-carousel.svg?style=flat-square&colorB=44cc11)](https://github.com/dohooo/react-native-reanimated-carousel/issues?q=is%3Aissue+is%3Aclosed)
-[![discord chat](https://img.shields.io/badge/chat-discord-blue?style=flat&logo=discord)](https://discord.gg/KsXRuDs43y)
-
-## ReactNative 社区最好用的轮播图组件! 🎉🎉🎉
-
--   **完全解决了`react-native-snap-carousel`的** [[问题]](https://github.com/meliorence/react-native-snap-carousel/issues/632)
--   **易用**、**无限滚动**、**完全使用 Reanimated2 实现**
-
-> v2 已经发布，希望大家喜欢!~ [[v1 文档]](https://github.com/dohooo/react-native-reanimated-carousel/tree/v1.x.x)
-
-> 支持 Web 端 [[示例]](https://dohooo.github.io/react-native-reanimated-carousel/)
-
-> 点击图片，查看代码 [[试一下]](https://snack.expo.dev/@zhaodonghao586/simple-carousel) 🍺
-
-|              <img src="assets/normal-horizontal.gif"/>               |                <img src="assets/normal-vertical.gif"/>                |              <img src="assets/parallax-horizontal.gif"/>               |
-| :------------------------------------------------------------------: | :-------------------------------------------------------------------: | :--------------------------------------------------------------------: |
-|  <a href="./exampleExpo/src/pages/normal/index.tsx">normal-horizontal</a>  |   <a href="./exampleExpo/src/pages/normal/index.tsx">normal-vertical</a>    | <a href="./exampleExpo/src/pages/parallax/index.tsx">parallax-horizontal</a> |
-|              <img src="assets/parallax-vertical.gif"/>               |             <img src="assets/stack-horizontal-left.gif"/>             |             <img src="assets/stack-horizontal-right.gif"/>             |
-| <a href="./exampleExpo/src/pages/parallax/index.tsx">parallax-vertical</a> | <a href="./exampleExpo/src/pages/stack/index.tsx">stack-horizontal-left</a> | <a href="./exampleExpo/src/pages/stack/index.tsx">stack-horizontal-right</a> |
-|             <img src="assets/stack-vertical-left.gif"/>              |             <img src="assets/stack-vertical-right.gif"/>              |             <img src="assets/stack-horizontal-right.gif"/>             |
-| <a href="./exampleExpo/src/pages/stack/index.tsx">stack-vertical-left</a>  | <a href="./exampleExpo/src/pages/stack/index.tsx">stack-vertical-right</a>  | <a href="./exampleExpo/src/pages/stack/index.tsx">stack-horizontal-right</a> |
-|                  <img src="assets/left-align.gif"/>                  |
-|   <a href="./exampleExpo/src/pages/left-align/index.tsx">left-align</a>    |
-
-> 现在你可以和我们一起来制作酷炫的动画了！ 非常简单! [[详情]](./docs/custom-animation.zh-CN.md)
-
-|                          <img src="assets/advanced-parallax.gif"/>                          |                      <img src="assets/pause-advanced-parallax.gif"/>                      |                   <img src="assets/scale-fade-in-out.gif"/>                   |
-| :-----------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------------------: | :---------------------------------------------------------------------------: |
-|        <a href="./exampleExpo/src/pages/advanced-parallax/index.tsx">advanced-parallax</a>        | <a href="./exampleExpo/src/pause-advanced-parallax/index.tsx">pause-advanced-parallax</a> | <a href="./exampleExpo/src/pages/scale-fade-in-out/index.tsx">scale-fade-in-out</a> |
-|                      <img src="assets/rotate-scale-fade-in-out.gif"/>                       |                           <img src="assets/rotate-in-out.gif"/>                           |                     <img src="assets/anim-tab-bar.gif"/>                      |
-| <a href="./exampleExpo/src/pages/rotate-scale-fade-in-out/index.tsx">rotate-scale-fade-in-out</a> |           <a href="./exampleExpo/src/pages/rotate-in-out/index.tsx">rotate-in-out</a>           |      <a href="./exampleExpo/src/pages/anim-tab-bar/index.tsx">anim-tab-bar</a>      |
-|                               <img src="assets/marquee.gif"/>                               |                             <img src="assets/multiple.gif"/>                              |                       <img src="assets/circular.gif"/>                        |
-|                  <a href="./exampleExpo/src/pages/marquee/index.tsx">marquee</a>                  |                <a href="./exampleExpo/src/pages/multiple/index.tsx">multiple</a>                |          <a href="./exampleExpo/src/pages/circular/index.tsx">circular</a>          |
-|                                <img src="assets/fold.gif"/>                                 |                               <img src="assets/tear.gif"/>                                |                      <img src="assets/press-swipe.gif"/>                      |
-|                     <a href="./exampleExpo/src/pages/fold/index.tsx">fold</a>                     |                    <a href="./exampleExpo/src/tear/index.tsx">tear</a>                    |       <a href="./exampleExpo/src/pages/press-swipe/index.tsx">press-swipe</a>       |
-|                               <img src="assets/cube-3d.gif"/>                               |                           <img src="assets/blur-parallax.gif"/>                           |                   <img src="assets/curve.gif"/>                               |
-|                  <a href="./exampleExpo/src/pages/cube-3d/index.tsx">cube-3d</a>                  |           <a href="./exampleExpo/src/pages/blur-parallax/index.tsx">blur-parallax</a>           |               <a href="./exampleExpo/src/pages/curve/index.tsx">curve</a>           |
-|                           <img src="assets/parallax-layers.gif"/>                           |                            <img src="assets/stack-cards.gif"/>                            |                         <img src="assets/flow.gif"/>                          |
-|          <a href="./exampleExpo/src/pages/parallax-layers/index.tsx">parallax-layers</a>          |             <a href="./exampleExpo/src/pages/stack-cards/index.tsx">stack-cards</a>             |              <a href="./exampleExpo/src/pages/flow/index.tsx">flow</a>              |
-|                           <img src="assets/blur-rotate.gif"/>                           |                               |  |
-|          <a href="./exampleExpo/src/pages/blur-rotate/index.tsx">blur-rotate</a>          |                          |                            |
-
-## 目录
-
-1. [安装](#安装)
-1. [使用](#使用)
-1. [Props](./docs/props.zh-CN.md)
-1. [提示](#提示)
-1. [原因](#原因)
-1. [示例](#示例)
-
----
-
-## 安装
-
-在项目根目录打开终端并且执行:
-
-```sh
-yarn add react-native-reanimated-carousel
-```
-
-如果你使用 npm:
-
-```sh
-npm install react-native-reanimated-carousel
-```
-
-并且我们需要安装 [`react-native-gesture-handler`](https://github.com/kmagiera/react-native-gesture-handler) 、[`react-native-reanimated`](https://github.com/kmagiera/react-native-reanimated)，安装步骤可参考各自文档。
-|                                        | react-native-reanimated | react-native-gesture-handler |
-| -------------------------------------- | ----------------------- | ---------------------------- |
-| react-native-reanimated-carousel v1、v2  | >=2.0 & <2.7.0                  | <2.9.0                           |
-| react-native-reanimated-carousel v3 | >=2.7.0 & < 3.x               | <2.9.0                          |
-| react-native-reanimated-carousel v4 | >=3.x                 | >=2.9.0                          |
-
-
-## 使用
-
-```tsx
-import * as React from "react";
-import { Dimensions, Text, View } from "react-native";
-import Carousel from "react-native-reanimated-carousel";
-
-function Index() {
-  const width = Dimensions.get("window").width;
-  return (
-    <View style={{ flex: 1 }}>
-      <Carousel
-        loop
-        width={width}
-        height={width / 2}
-        autoPlay={true}
-        data={[...new Array(6).keys()]}
-        scrollAnimationDuration={1000}
-        onSnapToItem={index => console.log("current index:", index)}
-        renderItem={({ index }) => (
-          <View
-            style={{
-              flex: 1,
-              borderWidth: 1,
-              justifyContent: "center",
-            }}
-          >
-            <Text style={{ textAlign: "center", fontSize: 30 }}>
-              {index}
-            </Text>
-          </View>
-        )}
-      />
-    </View>
-  );
-}
-
-export default Index;
-```
-
-## 提示
-
--   优化
-    -   当渲染大量元素时，可使用`windowSize`属性，来控制当前元素的两侧渲染数量，默认为全量渲染。经测试不加此属性，渲染 200 个空 view 时会出现掉帧情况，设置此属性后渲染 1000 个空 view 依旧流畅。（具体数量与测试的手机型号相关）
--   在`ScrollView/FlatList`中使用
-
-    -   **[#143](https://github.com/dohooo/react-native-reanimated-carousel/issues/143) - Carousel suppresses ScrollView/FlatList scroll gesture handler:** 当轮播图被放置在 ScrollView/FlatList 中时，轮播图的部分将无法控制列表滚动，解决办法是我们只允许手势系统识别某一方向，而不是所有方向，在下方例子中我们为了让列表可以向下滑动，所以我们使用[activeOffsetX](https://docs.swmansion.com/react-native-gesture-handler/docs/1.10.3/api/gesture-handlers/pan-gh/#activeoffsetx)属性来控制轮播图只识别横向手势:
-
-        ```tsx
-        <Carousel
-          {...}
-          panGestureHandlerProps={{
-            activeOffsetX: [-10, 10],
-          }}
-        />
-        ```
-
--   RTL
-    -   所有 layout 均完美支持 RTL 模式，并且无需再做任何配置。但在 RTL 模式下使用自动播放时，默认不会自动转换方向，需要结合 autoPlayReverse 来手动控制方向。
--   EXPO
-    -   如果你使用 EXPO 托管工作流，请确定你的 EXPO SDK 版本大于 41，因为旧的版本并不支持`Reanimated(v2)`。
--   工作原理
-    - [关于RNRC](./docs/about.zh-CN.md)
--  如何运行`exampleExpo`的测试
-    ```shell 
-    $ yarn prepare
-    $ yarn link --global
-    $ cd ./exampleExpo
-    $ yarn link react-native-reanimated-carousel --global
-    $ yarn test
-    ```
-
-## 原因
-
-<details>
-  <summary>常见的无限滚动轮播图，在快速滑动时会出现卡住的情况，这是因为实现方式而导致的问题。所以这个组件用了完全不同的方式来实现，并获得了最佳的性能也解决了这个问题，这就是创建这个库的原因。</summary>
-  <p align="center">
-  使用react-native-snap-carousel快速滑动，当到连接处时可以看清楚的看到卡顿。(gif 4.6mb)
-</p>
-<p align="center">
-  <img src="assets/react-native-snap-carousel.gif" width="50%"/>
-</p>
-
-<p align="center">
-  使用react-native-reanimated-carousel对比,每秒滚动十张依然顺畅链接，无限滚动。这里使用了gif无法很清晰的看出。
-</p>
-<p align="center">
-  <img src="assets/normal-fast.gif" width="50%"/>
-</p>
-</details>
-
-## 示例
-
-> `:pretty` 使用更好看的图片
-
-```shell
-yarn ios
-yarn ios:pretty
-
-yarn android
-yarn android:pretty
-
-yarn web
-yarn web:pretty
-```
-
-## 赞助商
-
-<p align="center">
-  <img src='https://github.com/dohooo/sponsors/blob/master/sponsors.png?raw=true'/>
-</p>
-
-## 许可
-
-MIT

package/lib/commonjs/Carousel.js

@@ -1,2 +0,0 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.default=void 0;var _react=_interopRequireDefault(require("react"));var _reactNative=require("react-native");var _reactNativeGestureHandler=require("react-native-gesture-handler");var _reactNativeReanimated=require("react-native-reanimated");var _useAutoPlay2=require("./hooks/useAutoPlay");var _useCarouselController=require("./hooks/useCarouselController");var _useCommonVariables=require("./hooks/useCommonVariables");var _useInitProps=require("./hooks/useInitProps");var _useLayoutConfig=require("./hooks/useLayoutConfig");var _useOnProgressChange=require("./hooks/useOnProgressChange");var _usePropsErrorBoundary=require("./hooks/usePropsErrorBoundary");var _useVisibleRanges=require("./hooks/useVisibleRanges");var _BaseLayout=require("./layouts/BaseLayout");var _ScrollViewGesture=require("./ScrollViewGesture");var _store=require("./store");var _computedWithAutoFillData=require("./utils/computedWithAutoFillData");var _jsxRuntime=require("react/jsx-runtime");var _this=this,_jsxFileName="/home/runner/work/react-native-reanimated-carousel/react-native-reanimated-carousel/src/Carousel.tsx";var _worklet_10125235996566_init_data={code:"function anonymous() {\n  const {\n    size,\n    dataLength,\n    handlerOffset,\n    loop\n  } = this._closure;\n  const totalSize = size * dataLength;\n  const x = handlerOffset.value % totalSize;\n  if (!loop) return handlerOffset.value;\n  return isNaN(x) ? 0 : x;\n}",location:"/home/runner/work/react-native-reanimated-carousel/react-native-reanimated-carousel/src/Carousel.tsx",sourceMap:"{\"version\":3,\"names\":[\"anonymous\",\"size\",\"dataLength\",\"handlerOffset\",\"loop\",\"_closure\",\"totalSize\",\"x\",\"value\",\"isNaN\"],\"sources\":[\"/home/runner/work/react-native-reanimated-carousel/react-native-reanimated-carousel/src/Carousel.tsx\"],\"mappings\":\"AA2DoC,SAAAA,SAAMA,CAAA;EAAA;IAAAC,IAAA;IAAAC,UAAA;IAAAC,aAAA;IAAAC;EAAA,SAAAC,QAAA;EACpC,MAAMC,SAAS,GAAGL,IAAI,GAAGC,UAAU;EACnC,MAAMK,CAAC,GAAGJ,aAAa,CAACK,KAAK,GAAGF,SAAS;EAEzC,IAAI,CAACF,IAAI,EACP,OAAOD,aAAa,CAACK,KAAK;EAE5B,OAAOC,KAAK,CAACF,CAAC,CAAC,GAAG,CAAC,GAAGA,CAAC;AACzB\"}"};var Carousel=_react.default.forwardRef(function(_props,ref){var props=(0,_useInitProps.useInitProps)(_props);var testID=props.testID,loop=props.loop,autoFillData=props.autoFillData,data=props.data,dataLength=props.dataLength,rawData=props.rawData,rawDataLength=props.rawDataLength,mode=props.mode,style=props.style,width=props.width,height=props.height,vertical=props.vertical,autoPlay=props.autoPlay,windowSize=props.windowSize,autoPlayReverse=props.autoPlayReverse,autoPlayInterval=props.autoPlayInterval,scrollAnimationDuration=props.scrollAnimationDuration,withAnimation=props.withAnimation,renderItem=props.renderItem,onScrollEnd=props.onScrollEnd,onSnapToItem=props.onSnapToItem,_onScrollBegin=props.onScrollBegin,onProgressChange=props.onProgressChange,customAnimation=props.customAnimation,defaultIndex=props.defaultIndex;var commonVariables=(0,_useCommonVariables.useCommonVariables)(props);var size=commonVariables.size,handlerOffset=commonVariables.handlerOffset;var offsetX=(0,_reactNativeReanimated.useDerivedValue)(function(){var _e=[new global.Error(),-5,-27];var _f=function _f(){var totalSize=size*dataLength;var x=handlerOffset.value%totalSize;if(!loop)return handlerOffset.value;return isNaN(x)?0:x;};_f._closure={size:size,dataLength:dataLength,handlerOffset:handlerOffset,loop:loop};_f.__initData=_worklet_10125235996566_init_data;_f.__workletHash=10125235996566;_f.__stackDetails=_e;_f.__version="3.3.0";return _f;}(),[loop,size,dataLength]);(0,_usePropsErrorBoundary.usePropsErrorBoundary)(Object.assign({},props,{dataLength:dataLength}));(0,_useOnProgressChange.useOnProgressChange)({autoFillData:autoFillData,loop:loop,size:size,offsetX:offsetX,rawDataLength:rawDataLength,onProgressChange:onProgressChange});var carouselController=(0,_useCarouselController.useCarouselController)({loop:loop,size:size,dataLength:dataLength,autoFillData:autoFillData,handlerOffset:handlerOffset,withAnimation:withAnimation,defaultIndex:defaultIndex,onScrollEnd:function onScrollEnd(){return(0,_reactNativeReanimated.runOnJS)(_onScrollEnd)();},onScrollBegin:function onScrollBegin(){return!!_onScrollBegin&&(0,_reactNativeReanimated.runOnJS)(_onScrollBegin)();},duration:scrollAnimationDuration});var next=carouselController.next,prev=carouselController.prev,scrollTo=carouselController.scrollTo,getSharedIndex=carouselController.getSharedIndex,getCurrentIndex=carouselController.getCurrentIndex;var _useAutoPlay=(0,_useAutoPlay2.useAutoPlay)({autoPlay:autoPlay,autoPlayInterval:autoPlayInterval,autoPlayReverse:autoPlayReverse,carouselController:carouselController}),startAutoPlay=_useAutoPlay.start,pauseAutoPlay=_useAutoPlay.pause;var _onScrollEnd=_react.default.useCallback(function(){var _sharedIndex=Math.round(getSharedIndex());var realIndex=(0,_computedWithAutoFillData.computedRealIndexWithAutoFillData)({index:_sharedIndex,dataLength:rawDataLength,loop:loop,autoFillData:autoFillData});if(onSnapToItem)onSnapToItem(realIndex);if(onScrollEnd)onScrollEnd(realIndex);},[loop,autoFillData,rawDataLength,getSharedIndex,onSnapToItem,onScrollEnd]);var scrollViewGestureOnScrollBegin=_react.default.useCallback(function(){pauseAutoPlay();_onScrollBegin==null?void 0:_onScrollBegin();},[_onScrollBegin,pauseAutoPlay]);var scrollViewGestureOnScrollEnd=_react.default.useCallback(function(){startAutoPlay();_onScrollEnd();},[_onScrollEnd,startAutoPlay]);var scrollViewGestureOnTouchBegin=_react.default.useCallback(pauseAutoPlay,[pauseAutoPlay]);var scrollViewGestureOnTouchEnd=_react.default.useCallback(startAutoPlay,[startAutoPlay]);_react.default.useImperativeHandle(ref,function(){return{next:next,prev:prev,getCurrentIndex:getCurrentIndex,scrollTo:scrollTo};},[getCurrentIndex,next,prev,scrollTo]);var visibleRanges=(0,_useVisibleRanges.useVisibleRanges)({total:dataLength,viewSize:size,translation:handlerOffset,windowSize:windowSize});var layoutConfig=(0,_useLayoutConfig.useLayoutConfig)(Object.assign({},props,{size:size}));var renderLayout=_react.default.useCallback(function(item,i){var realIndex=(0,_computedWithAutoFillData.computedRealIndexWithAutoFillData)({index:i,dataLength:rawDataLength,loop:loop,autoFillData:autoFillData});return(0,_jsxRuntime.jsx)(_BaseLayout.BaseLayout,{index:i,handlerOffset:offsetX,visibleRanges:visibleRanges,animationStyle:customAnimation||layoutConfig,children:function children(_ref){var animationValue=_ref.animationValue;return renderItem({item:item,index:realIndex,animationValue:animationValue});}},i);},[loop,rawData,offsetX,visibleRanges,autoFillData,renderItem,layoutConfig,customAnimation]);return(0,_jsxRuntime.jsx)(_reactNativeGestureHandler.GestureHandlerRootView,{children:(0,_jsxRuntime.jsx)(_store.CTX.Provider,{value:{props:props,common:commonVariables},children:(0,_jsxRuntime.jsx)(_ScrollViewGesture.ScrollViewGesture,{size:size,translation:handlerOffset,style:[styles.container,{width:width||"100%",height:height||"100%"},style,vertical?styles.itemsVertical:styles.itemsHorizontal],testID:testID,onScrollBegin:scrollViewGestureOnScrollBegin,onScrollEnd:scrollViewGestureOnScrollEnd,onTouchBegin:scrollViewGestureOnTouchBegin,onTouchEnd:scrollViewGestureOnTouchEnd,children:data.map(renderLayout)},mode)})});});var _default=Carousel;exports.default=_default;var styles=_reactNative.StyleSheet.create({container:{overflow:"hidden"},itemsHorizontal:{flexDirection:"row"},itemsVertical:{flexDirection:"column"}});
-//# sourceMappingURL=Carousel.js.map

package/lib/commonjs/Carousel.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["Carousel.tsx"],"names":["Carousel","React","forwardRef","_props","ref","props","testID","loop","autoFillData","data","dataLength","rawData","rawDataLength","mode","style","width","height","vertical","autoPlay","windowSize","autoPlayReverse","autoPlayInterval","scrollAnimationDuration","withAnimation","renderItem","onScrollEnd","onSnapToItem","onScrollBegin","onProgressChange","customAnimation","defaultIndex","commonVariables","size","handlerOffset","offsetX","totalSize","x","value","isNaN","carouselController","_onScrollEnd","duration","next","prev","scrollTo","getSharedIndex","getCurrentIndex","startAutoPlay","start","pauseAutoPlay","pause","useCallback","_sharedIndex","Math","round","realIndex","index","scrollViewGestureOnScrollBegin","scrollViewGestureOnScrollEnd","scrollViewGestureOnTouchBegin","scrollViewGestureOnTouchEnd","useImperativeHandle","visibleRanges","total","viewSize","translation","layoutConfig","renderLayout","item","i","animationValue","common","styles","container","itemsVertical","itemsHorizontal","map","StyleSheet","create","overflow","flexDirection"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/no-use-before-define */\nimport React from \"react\";\nimport { StyleSheet } from \"react-native\";\nimport { GestureHandlerRootView } from \"react-native-gesture-handler\";\nimport { runOnJS, useDerivedValue } from \"react-native-reanimated\";\n\nimport { useAutoPlay } from \"./hooks/useAutoPlay\";\nimport { useCarouselController } from \"./hooks/useCarouselController\";\nimport { useCommonVariables } from \"./hooks/useCommonVariables\";\nimport { useInitProps } from \"./hooks/useInitProps\";\nimport { useLayoutConfig } from \"./hooks/useLayoutConfig\";\nimport { useOnProgressChange } from \"./hooks/useOnProgressChange\";\nimport { usePropsErrorBoundary } from \"./hooks/usePropsErrorBoundary\";\nimport { useVisibleRanges } from \"./hooks/useVisibleRanges\";\nimport { BaseLayout } from \"./layouts/BaseLayout\";\nimport { ScrollViewGesture } from \"./ScrollViewGesture\";\nimport { CTX } from \"./store\";\nimport type { ICarouselInstance, TCarouselProps } from \"./types\";\nimport { computedRealIndexWithAutoFillData } from \"./utils/computedWithAutoFillData\";\n\nconst Carousel = React.forwardRef<ICarouselInstance, TCarouselProps<any>>(\n  (_props, ref) => {\n    const props = useInitProps(_props);\n\n    const {\n      testID,\n      loop,\n      autoFillData,\n      // Fill data with autoFillData\n      data,\n      // Length of fill data\n      dataLength,\n      // Raw data that has not been processed\n      rawData,\n      // Length of raw data\n      rawDataLength,\n      mode,\n      style,\n      width,\n      height,\n      vertical,\n      autoPlay,\n      windowSize,\n      autoPlayReverse,\n      autoPlayInterval,\n      scrollAnimationDuration,\n      withAnimation,\n      renderItem,\n      onScrollEnd,\n      onSnapToItem,\n      onScrollBegin,\n      onProgressChange,\n      customAnimation,\n      defaultIndex,\n    } = props;\n\n    const commonVariables = useCommonVariables(props);\n    const { size, handlerOffset } = commonVariables;\n\n    const offsetX = useDerivedValue(() => {\n      const totalSize = size * dataLength;\n      const x = handlerOffset.value % totalSize;\n\n      if (!loop)\n        return handlerOffset.value;\n\n      return isNaN(x) ? 0 : x;\n    }, [loop, size, dataLength]);\n\n    usePropsErrorBoundary({ ...props, dataLength });\n    useOnProgressChange({\n      autoFillData,\n      loop,\n      size,\n      offsetX,\n      rawDataLength,\n      onProgressChange,\n    });\n\n    const carouselController = useCarouselController({\n      loop,\n      size,\n      dataLength,\n      autoFillData,\n      handlerOffset,\n      withAnimation,\n      defaultIndex,\n      onScrollEnd: () => runOnJS(_onScrollEnd)(),\n      onScrollBegin: () => !!onScrollBegin && runOnJS(onScrollBegin)(),\n      duration: scrollAnimationDuration,\n    });\n\n    const { next, prev, scrollTo, getSharedIndex, getCurrentIndex }\n            = carouselController;\n\n    const { start: startAutoPlay, pause: pauseAutoPlay } = useAutoPlay({\n      autoPlay,\n      autoPlayInterval,\n      autoPlayReverse,\n      carouselController,\n    });\n\n    const _onScrollEnd = React.useCallback(() => {\n      const _sharedIndex = Math.round(getSharedIndex());\n\n      const realIndex = computedRealIndexWithAutoFillData({\n        index: _sharedIndex,\n        dataLength: rawDataLength,\n        loop,\n        autoFillData,\n      });\n\n      if (onSnapToItem)\n        onSnapToItem(realIndex);\n\n      if (onScrollEnd)\n        onScrollEnd(realIndex);\n    }, [\n      loop,\n      autoFillData,\n      rawDataLength,\n      getSharedIndex,\n      onSnapToItem,\n      onScrollEnd,\n    ]);\n\n    const scrollViewGestureOnScrollBegin = React.useCallback(() => {\n      pauseAutoPlay();\n      onScrollBegin?.();\n    }, [onScrollBegin, pauseAutoPlay]);\n\n    const scrollViewGestureOnScrollEnd = React.useCallback(() => {\n      startAutoPlay();\n      _onScrollEnd();\n    }, [_onScrollEnd, startAutoPlay]);\n\n    const scrollViewGestureOnTouchBegin = React.useCallback(pauseAutoPlay, [\n      pauseAutoPlay,\n    ]);\n\n    const scrollViewGestureOnTouchEnd = React.useCallback(startAutoPlay, [\n      startAutoPlay,\n    ]);\n\n    React.useImperativeHandle(\n      ref,\n      () => ({\n        next,\n        prev,\n        getCurrentIndex,\n        scrollTo,\n      }),\n      [getCurrentIndex, next, prev, scrollTo],\n    );\n\n    const visibleRanges = useVisibleRanges({\n      total: dataLength,\n      viewSize: size,\n      translation: handlerOffset,\n      windowSize,\n    });\n\n    const layoutConfig = useLayoutConfig({ ...props, size });\n\n    const renderLayout = React.useCallback(\n      (item: any, i: number) => {\n        const realIndex = computedRealIndexWithAutoFillData({\n          index: i,\n          dataLength: rawDataLength,\n          loop,\n          autoFillData,\n        });\n\n        return (\n          <BaseLayout\n            key={i}\n            index={i}\n            handlerOffset={offsetX}\n            visibleRanges={visibleRanges}\n            animationStyle={customAnimation || layoutConfig}\n          >\n            {({ animationValue }) =>\n              renderItem({\n                item,\n                index: realIndex,\n                animationValue,\n              })\n            }\n          </BaseLayout>\n        );\n      },\n      [\n        loop,\n        rawData,\n        offsetX,\n        visibleRanges,\n        autoFillData,\n        renderItem,\n        layoutConfig,\n        customAnimation,\n      ],\n    );\n\n    return (\n      <GestureHandlerRootView>\n        <CTX.Provider value={{ props, common: commonVariables }}>\n          <ScrollViewGesture\n            key={mode}\n            size={size}\n            translation={handlerOffset}\n            style={[\n              styles.container,\n              {\n                width: width || \"100%\",\n                height: height || \"100%\",\n              },\n              style,\n              vertical\n                ? styles.itemsVertical\n                : styles.itemsHorizontal,\n            ]}\n            testID={testID}\n            onScrollBegin={scrollViewGestureOnScrollBegin}\n            onScrollEnd={scrollViewGestureOnScrollEnd}\n            onTouchBegin={scrollViewGestureOnTouchBegin}\n            onTouchEnd={scrollViewGestureOnTouchEnd}\n          >\n            {data.map(renderLayout)}\n          </ScrollViewGesture>\n        </CTX.Provider>\n      </GestureHandlerRootView>\n    );\n  },\n);\n\nexport default Carousel as <T extends any>(\n  props: React.PropsWithChildren<TCarouselProps<T>>\n) => React.ReactElement;\n\nconst styles = StyleSheet.create({\n  container: {\n    overflow: \"hidden\",\n  },\n  itemsHorizontal: {\n    flexDirection: \"row\",\n  },\n  itemsVertical: {\n    flexDirection: \"column\",\n  },\n});\n"]}

package/lib/commonjs/LazyView.js

@@ -1,2 +0,0 @@
-var _interopRequireDefault=require("@babel/runtime/helpers/interopRequireDefault");Object.defineProperty(exports,"__esModule",{value:true});exports.LazyView=void 0;var _react=_interopRequireDefault(require("react"));var _jsxRuntime=require("react/jsx-runtime");var LazyView=function LazyView(props){var shouldUpdate=props.shouldUpdate,children=props.children;if(!shouldUpdate)return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{});return(0,_jsxRuntime.jsx)(_jsxRuntime.Fragment,{children:children});};exports.LazyView=LazyView;
-//# sourceMappingURL=LazyView.js.map

package/lib/commonjs/LazyView.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["LazyView.tsx"],"names":["LazyView","props","shouldUpdate","children"],"mappings":"oKACA,oD,6CAMO,GAAMA,CAAAA,QAA4C,CAAG,QAA/CA,CAAAA,QAA+C,CAACC,KAAD,CAAW,CACrE,GAAQC,CAAAA,YAAR,CAAmCD,KAAnC,CAAQC,YAAR,CAAsBC,QAAtB,CAAmCF,KAAnC,CAAsBE,QAAtB,CAEA,GAAI,CAACD,YAAL,CACE,MAAO,4CAAP,CAEF,MAAO,mDAAGC,QAAH,EAAP,CACD,CAPM,C","sourcesContent":["import type { PropsWithChildren } from \"react\";\nimport React from \"react\";\n\ninterface Props {\n  shouldUpdate: boolean\n}\n\nexport const LazyView: React.FC<PropsWithChildren<Props>> = (props) => {\n  const { shouldUpdate, children } = props;\n\n  if (!shouldUpdate)\n    return <></>;\n\n  return <>{children}</>;\n};\n"]}