react-native-reanimated-carousel 2.0.0 → 2.2.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (68) hide show
  1. package/README.md +40 -10
  2. package/README.zh-CN.md +42 -9
  3. package/lib/commonjs/Carousel.js +20 -10
  4. package/lib/commonjs/Carousel.js.map +1 -1
  5. package/lib/commonjs/ScrollViewGesture.js +13 -5
  6. package/lib/commonjs/ScrollViewGesture.js.map +1 -1
  7. package/lib/commonjs/constants/index.js +9 -1
  8. package/lib/commonjs/constants/index.js.map +1 -1
  9. package/lib/commonjs/hooks/useAutoPlay.js +22 -16
  10. package/lib/commonjs/hooks/useAutoPlay.js.map +1 -1
  11. package/lib/commonjs/hooks/useCarouselController.js +94 -30
  12. package/lib/commonjs/hooks/useCarouselController.js.map +1 -1
  13. package/lib/commonjs/hooks/useInitProps.js +4 -1
  14. package/lib/commonjs/hooks/useInitProps.js.map +1 -1
  15. package/lib/commonjs/layouts/BaseLayout.js +14 -8
  16. package/lib/commonjs/layouts/BaseLayout.js.map +1 -1
  17. package/lib/commonjs/layouts/normal.js +1 -1
  18. package/lib/commonjs/layouts/normal.js.map +1 -1
  19. package/lib/commonjs/layouts/parallax.js.map +1 -1
  20. package/lib/commonjs/layouts/stack.js +15 -0
  21. package/lib/commonjs/layouts/stack.js.map +1 -1
  22. package/lib/module/Carousel.js +20 -10
  23. package/lib/module/Carousel.js.map +1 -1
  24. package/lib/module/ScrollViewGesture.js +13 -6
  25. package/lib/module/ScrollViewGesture.js.map +1 -1
  26. package/lib/module/constants/index.js +5 -0
  27. package/lib/module/constants/index.js.map +1 -1
  28. package/lib/module/hooks/useAutoPlay.js +22 -16
  29. package/lib/module/hooks/useAutoPlay.js.map +1 -1
  30. package/lib/module/hooks/useCarouselController.js +91 -30
  31. package/lib/module/hooks/useCarouselController.js.map +1 -1
  32. package/lib/module/hooks/useInitProps.js +4 -1
  33. package/lib/module/hooks/useInitProps.js.map +1 -1
  34. package/lib/module/layouts/BaseLayout.js +14 -10
  35. package/lib/module/layouts/BaseLayout.js.map +1 -1
  36. package/lib/module/layouts/normal.js +2 -2
  37. package/lib/module/layouts/normal.js.map +1 -1
  38. package/lib/module/layouts/parallax.js.map +1 -1
  39. package/lib/module/layouts/stack.js +12 -0
  40. package/lib/module/layouts/stack.js.map +1 -1
  41. package/lib/typescript/constants/index.d.ts +3 -0
  42. package/lib/typescript/hooks/useAutoPlay.d.ts +1 -1
  43. package/lib/typescript/hooks/useCarouselController.d.ts +8 -5
  44. package/lib/typescript/hooks/useInitProps.d.ts +3 -6
  45. package/lib/typescript/layouts/BaseLayout.d.ts +3 -0
  46. package/lib/typescript/layouts/parallax.d.ts +9 -1
  47. package/lib/typescript/layouts/stack.d.ts +25 -0
  48. package/lib/typescript/types.d.ts +45 -32
  49. package/package.json +11 -4
  50. package/src/Carousel.tsx +27 -8
  51. package/src/ScrollViewGesture.tsx +12 -5
  52. package/src/constants/index.ts +6 -0
  53. package/src/hooks/useAutoPlay.ts +20 -23
  54. package/src/hooks/useCarouselController.tsx +112 -50
  55. package/src/hooks/useInitProps.ts +18 -8
  56. package/src/layouts/BaseLayout.tsx +26 -12
  57. package/src/layouts/normal.ts +2 -7
  58. package/src/layouts/parallax.ts +10 -1
  59. package/src/layouts/stack.ts +42 -0
  60. package/src/types.ts +50 -32
  61. package/CHANGELOG.md +0 -324
  62. package/lib/commonjs/hooks/useIndexController.js +0 -65
  63. package/lib/commonjs/hooks/useIndexController.js.map +0 -1
  64. package/lib/module/hooks/useIndexController.js +0 -52
  65. package/lib/module/hooks/useIndexController.js.map +0 -1
  66. package/lib/typescript/hooks/useIndexController.d.ts +0 -18
  67. package/src/.DS_Store +0 -0
  68. package/src/hooks/useIndexController.ts +0 -78
package/README.md CHANGED
@@ -1,24 +1,27 @@
1
1
  English | [简体中文](./README.zh-CN.md)
2
2
 
3
- # react-native-reanimated-carousel 2
3
+ # react-native-reanimated-carousel
4
4
 
5
5
  <img src="assets/banner.png" width="100%"/>
6
6
 
7
- ![platforms](https://img.shields.io/badge/platforms-Android%20%7C%20iOS-brightgreen.svg?style=flat-square&colorB=191A17)
7
+ ![platforms](https://img.shields.io/badge/platforms-Android%20%7C%20iOS%20%7C%20Web-brightgreen.svg?style=flat-square&colorB=191A17)
8
8
  [![npm](https://img.shields.io/npm/v/react-native-reanimated-carousel.svg?style=flat-square)](https://www.npmjs.com/package/react-native-reanimated-carousel)
9
9
  [![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)
10
+ [![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)
10
11
  [![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)
11
12
  [![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)
12
13
  [![discord chat](https://img.shields.io/badge/chat-discord-blue?style=flat&logo=discord)](https://discord.gg/KsXRuDs43y)
13
14
 
14
15
  ## ReactNative community's best use of the carousel component! 🎉🎉🎉
15
16
 
16
- - **It completely solves this [problem](https://github.com/meliorence/react-native-snap-carousel/issues/632) for `react-native-snap-carousel`!**
17
+ - **It completely solves this** [[problem]](https://github.com/meliorence/react-native-snap-carousel/issues/632) **for `react-native-snap-carousel`!**
17
18
  - **Simple**、**Infinitely scrolling very smooth**、**Fully implemented using Reanimated 2!**
18
19
 
19
- > V2 has been released! Joint it! [V1 docs](https://github.com/dohooo/react-native-reanimated-carousel/tree/v1.x.x)
20
+ > V2 has been released! Join it! [[v1 docs]](https://github.com/dohooo/react-native-reanimated-carousel/tree/v1.x.x)
20
21
 
21
- > Click on the image to see the demo. [Try it(Snack)](https://snack.expo.dev/@zhaodonghao586/simple-carousel) 🍺
22
+ > Support to Web [[demo]](https://dohooo.github.io/react-native-reanimated-carousel/)
23
+
24
+ > Click on the image to see the code snippets. [[Try it]](https://snack.expo.dev/@zhaodonghao586/simple-carousel) 🍺
22
25
 
23
26
  <p align="center">
24
27
  <a href="./example/src/normal/index.tsx">
@@ -47,7 +50,28 @@ English | [简体中文](./README.zh-CN.md)
47
50
  </a>
48
51
  </p>
49
52
 
50
- <br/>
53
+ > Now you can make cool animations with us! Very easy! [[Details]](./docs/custom-animation.md)
54
+
55
+ <p align="center">
56
+ <a href="./example/src/advanced-parallax/index.tsx">
57
+ <img src="assets/advanced-parallax.gif" width="300"/>
58
+ </a>
59
+ <a href="./example/src/pause-advanced-parallax/index.tsx">
60
+ <img src="assets/pause-advanced-parallax.gif" width="300"/>
61
+ </a>
62
+ <a href="./example/src/scale-fade-in-out/index.tsx">
63
+ <img src="assets/scale-fade-in-out.gif" width="300"/>
64
+ </a>
65
+ <a href="./example/src/rotate-scale-fade-in-out/index.tsx">
66
+ <img src="assets/rotate-scale-fade-in-out.gif" width="300"/>
67
+ </a>
68
+ <a href="./example/src/rotate-in-out/index.tsx">
69
+ <img src="assets/rotate-in-out.gif" width="300"/>
70
+ </a>
71
+ <a href="./example/src/anim-tab-bar/index.tsx">
72
+ <img src="assets/anim-tab-bar.gif" width="300"/>
73
+ </a>
74
+ </p>
51
75
 
52
76
  ## Table of contents
53
77
 
@@ -83,7 +107,7 @@ import Carousel from 'react-native-reanimated-carousel';
83
107
  width={300}
84
108
  height={150}
85
109
  data={[1, 2, 3]}
86
- renderItem={(item) => <AnyElement />}
110
+ renderItem={({ item }) => <AnyElement />}
87
111
  />;
88
112
  ```
89
113
 
@@ -118,10 +142,16 @@ import Carousel from 'react-native-reanimated-carousel';
118
142
  </details>
119
143
 
120
144
  ## Example
121
-
145
+ > `:pretty` use pretty images
122
146
  ```shell
123
- yarn example -- ios
124
- yarn example -- android
147
+ yarn ios
148
+ yarn ios:pretty
149
+
150
+ yarn android
151
+ yarn android:pretty
152
+
153
+ yarn web
154
+ yarn web:pretty
125
155
  ```
126
156
 
127
157
  ## License
package/README.zh-CN.md CHANGED
@@ -1,24 +1,27 @@
1
1
  [English](./README.md) | 简体中文
2
2
 
3
- # react-native-reanimated-carousel 2
3
+ # react-native-reanimated-carousel
4
4
 
5
5
  <img src="assets/banner-zh.jpeg" width="100%"/>
6
6
 
7
- ![platforms](https://img.shields.io/badge/platforms-Android%20%7C%20iOS-brightgreen.svg?style=flat-square&colorB=191A17)
7
+ ![platforms](https://img.shields.io/badge/platforms-Android%20%7C%20iOS%20%7C%20Web-brightgreen.svg?style=flat-square&colorB=191A17)
8
8
  [![npm](https://img.shields.io/npm/v/react-native-reanimated-carousel.svg?style=flat-square)](https://www.npmjs.com/package/react-native-reanimated-carousel)
9
9
  [![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)
10
+ [![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)
10
11
  [![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)
11
12
  [![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)
12
13
  [![discord chat](https://img.shields.io/badge/chat-discord-blue?style=flat&logo=discord)](https://discord.gg/KsXRuDs43y)
13
14
 
14
15
  ## ReactNative 社区最好用的轮播图组件! 🎉🎉🎉
15
16
 
16
- - **完全解决了`react-native-snap-carousel`的[问题](https://github.com/meliorence/react-native-snap-carousel/issues/632)**
17
+ - **完全解决了`react-native-snap-carousel`的** [[问题]](https://github.com/meliorence/react-native-snap-carousel/issues/632)
17
18
  - **易用**、**无限滚动**、**完全使用 Reanimated2 实现**
18
19
 
19
- > V2 已经发布,希望大家喜欢!~ [V1 文档](https://github.com/dohooo/react-native-reanimated-carousel/tree/v1.x.x)
20
+ > v2 已经发布,希望大家喜欢!~ [[v1 文档]](https://github.com/dohooo/react-native-reanimated-carousel/tree/v1.x.x)
20
21
 
21
- > 点击图片,查看 demo。[试一下(Snack)](https://snack.expo.dev/@zhaodonghao586/simple-carousel) 🍺
22
+ > 支持Web端 [[示例]](https://dohooo.github.io/react-native-reanimated-carousel/)
23
+
24
+ > 点击图片,查看代码 [[试一下]](https://snack.expo.dev/@zhaodonghao586/simple-carousel) 🍺
22
25
 
23
26
  <p align="center">
24
27
  <a href="./example/src/normal/index.tsx">
@@ -47,7 +50,28 @@
47
50
  </a>
48
51
  </p>
49
52
 
50
- <br/>
53
+ > 现在你可以和我们一起来制作酷炫的动画了! 非常简单! [[详情]](./docs/custom-animation.zh-CN.md)
54
+
55
+ <p align="center">
56
+ <a href="./example/src/advanced-parallax/index.tsx">
57
+ <img src="assets/advanced-parallax.gif" width="300"/>
58
+ </a>
59
+ <a href="./example/src/pause-advanced-parallax/index.tsx">
60
+ <img src="assets/pause-advanced-parallax.gif" width="300"/>
61
+ </a>
62
+ <a href="./example/src/scale-fade-in-out/index.tsx">
63
+ <img src="assets/scale-fade-in-out.gif" width="300"/>
64
+ </a>
65
+ <a href="./example/src/rotate-scale-fade-in-out/index.tsx">
66
+ <img src="assets/rotate-scale-fade-in-out.gif" width="300"/>
67
+ </a>
68
+ <a href="./example/src/rotate-in-out/index.tsx">
69
+ <img src="assets/rotate-in-out.gif" width="300"/>
70
+ </a>
71
+ <a href="./example/src/anim-tab-bar/index.tsx">
72
+ <img src="assets/anim-tab-bar.gif" width="300"/>
73
+ </a>
74
+ </p>
51
75
 
52
76
  ## 目录
53
77
 
@@ -85,7 +109,7 @@ import Carousel from 'react-native-reanimated-carousel';
85
109
  width={300}
86
110
  height={150}
87
111
  data={[1, 2, 3]}
88
- renderItem={(item) => <AnyElement />}
112
+ renderItem={({ item }) => <AnyElement />}
89
113
  />;
90
114
  ```
91
115
 
@@ -116,11 +140,20 @@ import Carousel from 'react-native-reanimated-carousel';
116
140
  <img src="assets/normal-fast.gif" width="50%"/>
117
141
  </p>
118
142
  </details>
143
+
119
144
  ## 示例
120
145
 
146
+ > `:pretty` 使用更好看的图片
147
+
121
148
  ```shell
122
- yarn example -- ios
123
- yarn example -- android
149
+ yarn ios
150
+ yarn ios:pretty
151
+
152
+ yarn android
153
+ yarn android:pretty
154
+
155
+ yarn web
156
+ yarn web:pretty
124
157
  ```
125
158
 
126
159
  ## 许可
@@ -55,11 +55,13 @@ function Carousel(_props, ref) {
55
55
  windowSize,
56
56
  autoPlayReverse,
57
57
  autoPlayInterval,
58
+ scrollAnimationDuration,
58
59
  renderItem,
59
60
  onScrollEnd,
60
61
  onSnapToItem,
61
62
  onScrollBegin,
62
- onProgressChange
63
+ onProgressChange,
64
+ customAnimation
63
65
  } = props;
64
66
  const commonVariables = (0, _useCommonVariables.useCommonVariables)(props);
65
67
  const {
@@ -92,7 +94,8 @@ function Carousel(_props, ref) {
92
94
  originalLength: data.length,
93
95
  onScrollEnd: () => (0, _reactNativeReanimated.runOnJS)(_onScrollEnd)(),
94
96
  onScrollBegin: () => !!onScrollBegin && (0, _reactNativeReanimated.runOnJS)(onScrollBegin)(),
95
- onChange: i => onSnapToItem && (0, _reactNativeReanimated.runOnJS)(onSnapToItem)(i)
97
+ onChange: i => !!onSnapToItem && (0, _reactNativeReanimated.runOnJS)(onSnapToItem)(i),
98
+ duration: scrollAnimationDuration
96
99
  });
97
100
  const {
98
101
  next,
@@ -103,7 +106,7 @@ function Carousel(_props, ref) {
103
106
  getCurrentIndex
104
107
  } = carouselController;
105
108
  const {
106
- run,
109
+ start,
107
110
  pause
108
111
  } = (0, _useAutoPlay.useAutoPlay)({
109
112
  autoPlay,
@@ -123,10 +126,10 @@ function Carousel(_props, ref) {
123
126
  }, [sharedPreIndex, sharedIndex, computedIndex, onScrollEnd]);
124
127
 
125
128
  const scrollViewGestureOnScrollEnd = _react.default.useCallback(() => {
126
- run();
129
+ start();
127
130
 
128
131
  _onScrollEnd();
129
- }, [_onScrollEnd, run]);
132
+ }, [_onScrollEnd, start]);
130
133
 
131
134
  const goToIndex = _react.default.useCallback((i, animated) => {
132
135
  carouselController.to(i, animated);
@@ -136,8 +139,9 @@ function Carousel(_props, ref) {
136
139
  next,
137
140
  prev,
138
141
  getCurrentIndex,
139
- goToIndex
140
- }), [getCurrentIndex, goToIndex, next, prev]);
142
+ goToIndex,
143
+ scrollTo: carouselController.scrollTo
144
+ }), [getCurrentIndex, goToIndex, next, prev, carouselController.scrollTo]);
141
145
 
142
146
  const visibleRanges = (0, _useVisibleRanges.useVisibleRanges)({
143
147
  total: data.length,
@@ -165,9 +169,15 @@ function Carousel(_props, ref) {
165
169
  index: i,
166
170
  handlerOffsetX: offsetX,
167
171
  visibleRanges: visibleRanges,
168
- animationStyle: layoutConfig
169
- }, renderItem(item, realIndex));
170
- }, [data, offsetX, renderItem, layoutConfig, visibleRanges]);
172
+ animationStyle: customAnimation || layoutConfig
173
+ }, ({
174
+ animationValue
175
+ }) => renderItem({
176
+ item,
177
+ index: realIndex,
178
+ animationValue
179
+ }));
180
+ }, [data, offsetX, visibleRanges, renderItem, layoutConfig, customAnimation]);
171
181
 
172
182
  return /*#__PURE__*/_react.default.createElement(_store.CTX.Provider, {
173
183
  value: {
@@ -1 +1 @@
1
- {"version":3,"sources":["Carousel.tsx"],"names":["Carousel","_props","ref","props","data","loop","mode","style","width","height","vertical","autoPlay","windowSize","autoPlayReverse","autoPlayInterval","renderItem","onScrollEnd","onSnapToItem","onScrollBegin","onProgressChange","commonVariables","size","handlerOffsetX","offsetX","totalSize","length","x","value","isNaN","carouselController","disable","originalLength","_onScrollEnd","onChange","i","next","prev","sharedPreIndex","sharedIndex","computedIndex","getCurrentIndex","run","pause","scrollViewGestureOnScrollBegin","React","useCallback","current","scrollViewGestureOnScrollEnd","goToIndex","animated","to","useImperativeHandle","visibleRanges","total","viewSize","translation","layoutConfig","renderLayout","item","realIndex","DATA_LENGTH","SINGLE_ITEM","DOUBLE_ITEM","common","styles","container","itemsVertical","itemsHorizontal","map","forwardRef","StyleSheet","create","overflow","flexDirection"],"mappings":"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","sourcesContent":["import React, { PropsWithChildren } from 'react';\nimport Animated, { runOnJS, useDerivedValue } from 'react-native-reanimated';\nimport { useCarouselController } from './hooks/useCarouselController';\nimport { useAutoPlay } from './hooks/useAutoPlay';\nimport { usePropsErrorBoundary } from './hooks/usePropsErrorBoundary';\nimport { ScrollViewGesture } from './ScrollViewGesture';\nimport { useVisibleRanges } from './hooks/useVisibleRanges';\nimport type { ICarouselInstance, TCarouselProps } from './types';\nimport { StyleSheet, View } from 'react-native';\nimport { DATA_LENGTH } from './constants';\nimport { BaseLayout } from './layouts/BaseLayout';\nimport { useLayoutConfig } from './hooks/useLayoutConfig';\nimport { useInitProps } from './hooks/useInitProps';\nimport { CTX } from './store';\nimport { useCommonVariables } from './hooks/useCommonVariables';\nimport { useOnProgressChange } from './hooks/useOnProgressChange';\n\nfunction Carousel<T>(\n _props: PropsWithChildren<TCarouselProps<T>>,\n ref: React.Ref<ICarouselInstance>\n) {\n const props = useInitProps(_props);\n\n const {\n data,\n loop,\n mode,\n style,\n width,\n height,\n vertical,\n autoPlay,\n windowSize,\n autoPlayReverse,\n autoPlayInterval,\n renderItem,\n onScrollEnd,\n onSnapToItem,\n onScrollBegin,\n onProgressChange,\n } = props;\n\n const commonVariables = useCommonVariables(props);\n const { size, handlerOffsetX } = commonVariables;\n\n const offsetX = useDerivedValue(() => {\n const totalSize = size * data.length;\n const x = handlerOffsetX.value % totalSize;\n\n if (!loop) {\n return handlerOffsetX.value;\n }\n return isNaN(x) ? 0 : x;\n }, [loop, size, data]);\n\n usePropsErrorBoundary(props);\n useOnProgressChange({ size, offsetX, data, onProgressChange });\n\n const carouselController = useCarouselController({\n loop,\n size,\n handlerOffsetX,\n length: data.length,\n disable: !data.length,\n originalLength: data.length,\n onScrollEnd: () => runOnJS(_onScrollEnd)(),\n onScrollBegin: () => !!onScrollBegin && runOnJS(onScrollBegin)(),\n onChange: (i) => onSnapToItem && runOnJS(onSnapToItem)(i),\n });\n\n const {\n next,\n prev,\n sharedPreIndex,\n sharedIndex,\n computedIndex,\n getCurrentIndex,\n } = carouselController;\n\n const { run, pause } = useAutoPlay({\n autoPlay,\n autoPlayInterval,\n autoPlayReverse,\n carouselController,\n });\n\n const scrollViewGestureOnScrollBegin = React.useCallback(() => {\n pause();\n onScrollBegin?.();\n }, [onScrollBegin, pause]);\n\n const _onScrollEnd = React.useCallback(() => {\n computedIndex();\n onScrollEnd?.(sharedPreIndex.current, sharedIndex.current);\n }, [sharedPreIndex, sharedIndex, computedIndex, onScrollEnd]);\n\n const scrollViewGestureOnScrollEnd = React.useCallback(() => {\n run();\n _onScrollEnd();\n }, [_onScrollEnd, run]);\n\n const goToIndex = React.useCallback(\n (i: number, animated?: boolean) => {\n carouselController.to(i, animated);\n },\n [carouselController]\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n next,\n prev,\n getCurrentIndex,\n goToIndex,\n }),\n [getCurrentIndex, goToIndex, next, prev]\n );\n\n const visibleRanges = useVisibleRanges({\n total: data.length,\n viewSize: size,\n translation: handlerOffsetX,\n windowSize,\n });\n\n const layoutConfig = useLayoutConfig<T>({ ...props, size });\n\n const renderLayout = React.useCallback(\n (item: T, i: number) => {\n let realIndex = i;\n if (data.length === DATA_LENGTH.SINGLE_ITEM) {\n realIndex = i % 1;\n }\n\n if (data.length === DATA_LENGTH.DOUBLE_ITEM) {\n realIndex = i % 2;\n }\n\n return (\n <BaseLayout\n key={i}\n index={i}\n handlerOffsetX={offsetX}\n visibleRanges={visibleRanges}\n animationStyle={layoutConfig}\n >\n {renderItem(item, realIndex)}\n </BaseLayout>\n );\n },\n [data, offsetX, renderItem, layoutConfig, visibleRanges]\n );\n\n return (\n <CTX.Provider value={{ props, common: commonVariables }}>\n <View\n style={[\n styles.container,\n { width: width || '100%', height: height || '100%' },\n style,\n ]}\n >\n <ScrollViewGesture\n size={size}\n translation={handlerOffsetX}\n onScrollBegin={scrollViewGestureOnScrollBegin}\n onScrollEnd={scrollViewGestureOnScrollEnd}\n >\n <Animated.View\n key={mode}\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 >\n {data.map(renderLayout)}\n </Animated.View>\n </ScrollViewGesture>\n </View>\n </CTX.Provider>\n );\n}\n\nexport default React.forwardRef(Carousel) as typeof Carousel;\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"]}
1
+ {"version":3,"sources":["Carousel.tsx"],"names":["Carousel","_props","ref","props","data","loop","mode","style","width","height","vertical","autoPlay","windowSize","autoPlayReverse","autoPlayInterval","scrollAnimationDuration","renderItem","onScrollEnd","onSnapToItem","onScrollBegin","onProgressChange","customAnimation","commonVariables","size","handlerOffsetX","offsetX","totalSize","length","x","value","isNaN","carouselController","disable","originalLength","_onScrollEnd","onChange","i","duration","next","prev","sharedPreIndex","sharedIndex","computedIndex","getCurrentIndex","start","pause","scrollViewGestureOnScrollBegin","React","useCallback","current","scrollViewGestureOnScrollEnd","goToIndex","animated","to","useImperativeHandle","scrollTo","visibleRanges","total","viewSize","translation","layoutConfig","renderLayout","item","realIndex","DATA_LENGTH","SINGLE_ITEM","DOUBLE_ITEM","animationValue","index","common","styles","container","itemsVertical","itemsHorizontal","map","forwardRef","StyleSheet","create","overflow","flexDirection"],"mappings":"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","sourcesContent":["import React, { PropsWithChildren } from 'react';\nimport Animated, { runOnJS, useDerivedValue } from 'react-native-reanimated';\n\nimport { useCarouselController } from './hooks/useCarouselController';\nimport { useAutoPlay } from './hooks/useAutoPlay';\nimport { usePropsErrorBoundary } from './hooks/usePropsErrorBoundary';\nimport { ScrollViewGesture } from './ScrollViewGesture';\nimport { useVisibleRanges } from './hooks/useVisibleRanges';\n\nimport type { ICarouselInstance, TCarouselProps } from './types';\nimport { StyleSheet, View } from 'react-native';\nimport { DATA_LENGTH } from './constants';\nimport { BaseLayout } from './layouts/BaseLayout';\nimport { useLayoutConfig } from './hooks/useLayoutConfig';\nimport { useInitProps } from './hooks/useInitProps';\nimport { CTX } from './store';\nimport { useCommonVariables } from './hooks/useCommonVariables';\nimport { useOnProgressChange } from './hooks/useOnProgressChange';\n\nfunction Carousel<T>(\n _props: PropsWithChildren<TCarouselProps<T>>,\n ref: React.Ref<ICarouselInstance>\n) {\n const props = useInitProps(_props);\n\n const {\n data,\n loop,\n mode,\n style,\n width,\n height,\n vertical,\n autoPlay,\n windowSize,\n autoPlayReverse,\n autoPlayInterval,\n scrollAnimationDuration,\n renderItem,\n onScrollEnd,\n onSnapToItem,\n onScrollBegin,\n onProgressChange,\n customAnimation,\n } = props;\n\n const commonVariables = useCommonVariables(props);\n const { size, handlerOffsetX } = commonVariables;\n\n const offsetX = useDerivedValue(() => {\n const totalSize = size * data.length;\n const x = handlerOffsetX.value % totalSize;\n\n if (!loop) {\n return handlerOffsetX.value;\n }\n return isNaN(x) ? 0 : x;\n }, [loop, size, data]);\n\n usePropsErrorBoundary(props);\n useOnProgressChange({ size, offsetX, data, onProgressChange });\n\n const carouselController = useCarouselController({\n loop,\n size,\n handlerOffsetX,\n length: data.length,\n disable: !data.length,\n originalLength: data.length,\n onScrollEnd: () => runOnJS(_onScrollEnd)(),\n onScrollBegin: () => !!onScrollBegin && runOnJS(onScrollBegin)(),\n onChange: (i) => !!onSnapToItem && runOnJS(onSnapToItem)(i),\n duration: scrollAnimationDuration,\n });\n\n const {\n next,\n prev,\n sharedPreIndex,\n sharedIndex,\n computedIndex,\n getCurrentIndex,\n } = carouselController;\n\n const { start, pause } = useAutoPlay({\n autoPlay,\n autoPlayInterval,\n autoPlayReverse,\n carouselController,\n });\n\n const scrollViewGestureOnScrollBegin = React.useCallback(() => {\n pause();\n onScrollBegin?.();\n }, [onScrollBegin, pause]);\n\n const _onScrollEnd = React.useCallback(() => {\n computedIndex();\n onScrollEnd?.(sharedPreIndex.current, sharedIndex.current);\n }, [sharedPreIndex, sharedIndex, computedIndex, onScrollEnd]);\n\n const scrollViewGestureOnScrollEnd = React.useCallback(() => {\n start();\n _onScrollEnd();\n }, [_onScrollEnd, start]);\n\n const goToIndex = React.useCallback(\n (i: number, animated?: boolean) => {\n carouselController.to(i, animated);\n },\n [carouselController]\n );\n\n React.useImperativeHandle(\n ref,\n () => ({\n next,\n prev,\n getCurrentIndex,\n goToIndex,\n scrollTo: carouselController.scrollTo,\n }),\n [getCurrentIndex, goToIndex, next, prev, carouselController.scrollTo]\n );\n\n const visibleRanges = useVisibleRanges({\n total: data.length,\n viewSize: size,\n translation: handlerOffsetX,\n windowSize,\n });\n\n const layoutConfig = useLayoutConfig<T>({ ...props, size });\n\n const renderLayout = React.useCallback(\n (item: T, i: number) => {\n let realIndex = i;\n if (data.length === DATA_LENGTH.SINGLE_ITEM) {\n realIndex = i % 1;\n }\n\n if (data.length === DATA_LENGTH.DOUBLE_ITEM) {\n realIndex = i % 2;\n }\n\n return (\n <BaseLayout\n key={i}\n index={i}\n handlerOffsetX={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 data,\n offsetX,\n visibleRanges,\n renderItem,\n layoutConfig,\n customAnimation,\n ]\n );\n\n return (\n <CTX.Provider value={{ props, common: commonVariables }}>\n <View\n style={[\n styles.container,\n { width: width || '100%', height: height || '100%' },\n style,\n ]}\n >\n <ScrollViewGesture\n size={size}\n translation={handlerOffsetX}\n onScrollBegin={scrollViewGestureOnScrollBegin}\n onScrollEnd={scrollViewGestureOnScrollEnd}\n >\n <Animated.View\n key={mode}\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 >\n {data.map(renderLayout)}\n </Animated.View>\n </ScrollViewGesture>\n </View>\n </CTX.Provider>\n );\n}\n\nexport default React.forwardRef(Carousel) as typeof Carousel;\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"]}
@@ -13,6 +13,8 @@ var _reactNativeGestureHandler = require("react-native-gesture-handler");
13
13
 
14
14
  var _reactNativeReanimated = _interopRequireWildcard(require("react-native-reanimated"));
15
15
 
16
+ var _constants = require("./constants");
17
+
16
18
  var _store = require("./store");
17
19
 
18
20
  function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -32,7 +34,8 @@ const IScrollViewGesture = props => {
32
34
  pagingEnabled,
33
35
  enableSnap,
34
36
  panGestureHandlerProps,
35
- loop: infinite
37
+ loop: infinite,
38
+ scrollAnimationDuration
36
39
  }
37
40
  } = _react.default.useContext(_store.CTX);
38
41
 
@@ -51,14 +54,15 @@ const IScrollViewGesture = props => {
51
54
  const _withSpring = _react.default.useCallback((toValue, onFinished) => {
52
55
  'worklet';
53
56
 
54
- return (0, _reactNativeReanimated.withSpring)(toValue, {
55
- damping: 100
57
+ return (0, _reactNativeReanimated.withTiming)(toValue, {
58
+ duration: scrollAnimationDuration,
59
+ easing: _constants.Easing.easeOutQuart
56
60
  }, isFinished => {
57
61
  if (isFinished) {
58
62
  onFinished === null || onFinished === void 0 ? void 0 : onFinished();
59
63
  }
60
64
  });
61
- }, []);
65
+ }, [scrollAnimationDuration]);
62
66
 
63
67
  const endWithSpring = _react.default.useCallback(onFinished => {
64
68
  'worklet';
@@ -159,7 +163,11 @@ const IScrollViewGesture = props => {
159
163
  let panTranslation = isHorizontal.value ? translationX : translationY;
160
164
 
161
165
  if (!infinite && (translation.value > 0 || translation.value < -ctx.max)) {
162
- panTranslation = panTranslation * 0.5;
166
+ const boundary = translation.value > 0 ? 0 : -ctx.max;
167
+ const fixed = boundary - ctx.panOffset;
168
+ const dynamic = panTranslation - fixed;
169
+ translation.value = boundary + dynamic * 0.5;
170
+ return;
163
171
  }
164
172
 
165
173
  translation.value = ctx.panOffset + panTranslation;
@@ -1 +1 @@
1
- {"version":3,"sources":["ScrollViewGesture.tsx"],"names":["IScrollViewGesture","props","vertical","style","data","pagingEnabled","enableSnap","panGestureHandlerProps","loop","infinite","React","useContext","CTX","translation","onScrollBegin","onScrollEnd","size","maxPage","length","isHorizontal","touching","scrollEndTranslation","scrollEndVelocity","_withSpring","useCallback","toValue","onFinished","damping","isFinished","endWithSpring","origin","value","velocity","nextPage","Math","round","deceleration","page","velocityPage","finalPage","min","max","resetBoundary","onFinish","activeDecay","panGestureEventHandler","onStart","_","ctx","panOffset","onActive","e","translationX","translationY","panTranslation","onEnd","velocityX","velocityY","directionStyle","useMemo","styles","contentHorizontal","contentVertical","container","children","ScrollViewGesture","StyleSheet","create","flex","overflow","flexDirection"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleProp, StyleSheet, ViewStyle } from 'react-native';\nimport {\n PanGestureHandler,\n PanGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n cancelAnimation,\n runOnJS,\n useAnimatedGestureHandler,\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withDecay,\n withSpring,\n} from 'react-native-reanimated';\nimport { CTX } from './store';\n\ntype GestureContext = {\n panOffset: number;\n max: number;\n};\n\ninterface Props {\n size: number;\n infinite?: boolean;\n onScrollEnd?: () => void;\n onScrollBegin?: () => void;\n style?: StyleProp<ViewStyle>;\n translation: Animated.SharedValue<number>;\n}\n\nconst IScrollViewGesture: React.FC<Props> = (props) => {\n const {\n props: {\n vertical,\n style,\n data,\n pagingEnabled,\n enableSnap,\n panGestureHandlerProps,\n loop: infinite,\n },\n } = React.useContext(CTX);\n\n const { translation, onScrollBegin, onScrollEnd, size } = props;\n\n const maxPage = data.length;\n const isHorizontal = useDerivedValue(() => !vertical, [vertical]);\n const touching = useSharedValue(false);\n const scrollEndTranslation = useSharedValue(0);\n const scrollEndVelocity = useSharedValue(0);\n\n const _withSpring = React.useCallback(\n (toValue: number, onFinished?: () => void) => {\n 'worklet';\n return withSpring(\n toValue,\n {\n damping: 100,\n },\n (isFinished) => {\n if (isFinished) {\n onFinished?.();\n }\n }\n );\n },\n []\n );\n\n const endWithSpring = React.useCallback(\n (onFinished?: () => void) => {\n 'worklet';\n const origin = translation.value;\n const velocity = scrollEndVelocity.value;\n if (!pagingEnabled) {\n if (enableSnap) {\n const nextPage =\n Math.round((origin + velocity * 0.4) / size) * size;\n translation.value = _withSpring(nextPage, onFinished);\n return;\n }\n translation.value = withDecay({\n velocity,\n deceleration: 0.999,\n });\n return;\n }\n const page = Math.round(-translation.value / size);\n const velocityPage = Math.round(\n -(translation.value + scrollEndVelocity.value) / size\n );\n let finalPage = Math.min(\n page + 1,\n Math.max(page - 1, velocityPage)\n );\n if (!infinite) {\n finalPage = Math.min(maxPage - 1, Math.max(0, finalPage));\n }\n\n translation.value = _withSpring(-finalPage * size, onFinished);\n },\n [\n infinite,\n _withSpring,\n translation,\n scrollEndVelocity,\n size,\n maxPage,\n pagingEnabled,\n enableSnap,\n ]\n );\n\n const resetBoundary = React.useCallback(() => {\n 'worklet';\n const onFinish = (isFinished: boolean) => {\n if (isFinished) {\n touching.value = false;\n onScrollEnd && runOnJS(onScrollEnd)();\n }\n };\n const activeDecay = () => {\n touching.value = true;\n translation.value = withDecay(\n { velocity: scrollEndVelocity.value },\n onFinish\n );\n };\n\n if (touching.value) {\n return;\n }\n\n if (translation.value > 0) {\n if (scrollEndTranslation.value < 0) {\n activeDecay();\n return;\n }\n if (!infinite) {\n translation.value = _withSpring(0);\n return;\n }\n }\n\n if (translation.value < -((maxPage - 1) * size)) {\n if (scrollEndTranslation.value > 0) {\n activeDecay();\n return;\n }\n if (!infinite) {\n translation.value = _withSpring(-((maxPage - 1) * size));\n return;\n }\n }\n }, [\n infinite,\n touching,\n _withSpring,\n translation,\n scrollEndTranslation,\n scrollEndVelocity,\n onScrollEnd,\n maxPage,\n size,\n ]);\n\n useAnimatedReaction(\n () => translation.value,\n () => {\n if (!pagingEnabled) {\n resetBoundary();\n }\n },\n [pagingEnabled]\n );\n\n const panGestureEventHandler = useAnimatedGestureHandler<\n PanGestureHandlerGestureEvent,\n GestureContext\n >(\n {\n onStart: (_, ctx) => {\n touching.value = true;\n cancelAnimation(translation);\n onScrollBegin && runOnJS(onScrollBegin)();\n ctx.max = (maxPage - 1) * size;\n ctx.panOffset = translation.value;\n },\n onActive: (e, ctx) => {\n touching.value = true;\n const { translationX, translationY } = e;\n let panTranslation = isHorizontal.value\n ? translationX\n : translationY;\n\n if (\n !infinite &&\n (translation.value > 0 || translation.value < -ctx.max)\n ) {\n panTranslation = panTranslation * 0.5;\n }\n\n translation.value = ctx.panOffset + panTranslation;\n },\n onEnd: (e) => {\n const { velocityX, velocityY, translationX, translationY } = e;\n scrollEndVelocity.value = isHorizontal.value\n ? velocityX\n : velocityY;\n scrollEndTranslation.value = isHorizontal.value\n ? translationX\n : translationY;\n\n endWithSpring(() => onScrollEnd && runOnJS(onScrollEnd)());\n\n if (!infinite) {\n touching.value = false;\n }\n },\n },\n [pagingEnabled, isHorizontal.value, infinite, maxPage, size, enableSnap]\n );\n\n const directionStyle = React.useMemo(() => {\n return vertical ? styles.contentHorizontal : styles.contentVertical;\n }, [vertical]);\n\n return (\n <Animated.View style={[styles.container, directionStyle, style]}>\n <PanGestureHandler\n {...panGestureHandlerProps}\n onGestureEvent={panGestureEventHandler}\n >\n {props.children}\n </PanGestureHandler>\n </Animated.View>\n );\n};\n\nexport const ScrollViewGesture = IScrollViewGesture;\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n overflow: 'hidden',\n },\n contentVertical: {\n flexDirection: 'column',\n },\n contentHorizontal: {\n flexDirection: 'row',\n },\n});\n"]}
1
+ {"version":3,"sources":["ScrollViewGesture.tsx"],"names":["IScrollViewGesture","props","vertical","style","data","pagingEnabled","enableSnap","panGestureHandlerProps","loop","infinite","scrollAnimationDuration","React","useContext","CTX","translation","onScrollBegin","onScrollEnd","size","maxPage","length","isHorizontal","touching","scrollEndTranslation","scrollEndVelocity","_withSpring","useCallback","toValue","onFinished","duration","easing","Easing","easeOutQuart","isFinished","endWithSpring","origin","value","velocity","nextPage","Math","round","deceleration","page","velocityPage","finalPage","min","max","resetBoundary","onFinish","activeDecay","panGestureEventHandler","onStart","_","ctx","panOffset","onActive","e","translationX","translationY","panTranslation","boundary","fixed","dynamic","onEnd","velocityX","velocityY","directionStyle","useMemo","styles","contentHorizontal","contentVertical","container","children","ScrollViewGesture","StyleSheet","create","flex","overflow","flexDirection"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleProp, StyleSheet, ViewStyle } from 'react-native';\nimport {\n PanGestureHandler,\n PanGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n cancelAnimation,\n runOnJS,\n useAnimatedGestureHandler,\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withDecay,\n withTiming,\n} from 'react-native-reanimated';\nimport { Easing } from './constants';\nimport { CTX } from './store';\n\ntype GestureContext = {\n panOffset: number;\n max: number;\n};\n\ninterface Props {\n size: number;\n infinite?: boolean;\n onScrollEnd?: () => void;\n onScrollBegin?: () => void;\n style?: StyleProp<ViewStyle>;\n translation: Animated.SharedValue<number>;\n}\n\nconst IScrollViewGesture: React.FC<Props> = (props) => {\n const {\n props: {\n vertical,\n style,\n data,\n pagingEnabled,\n enableSnap,\n panGestureHandlerProps,\n loop: infinite,\n scrollAnimationDuration,\n },\n } = React.useContext(CTX);\n\n const { translation, onScrollBegin, onScrollEnd, size } = props;\n\n const maxPage = data.length;\n const isHorizontal = useDerivedValue(() => !vertical, [vertical]);\n const touching = useSharedValue(false);\n const scrollEndTranslation = useSharedValue(0);\n const scrollEndVelocity = useSharedValue(0);\n\n const _withSpring = React.useCallback(\n (toValue: number, onFinished?: () => void) => {\n 'worklet';\n return withTiming(\n toValue,\n {\n duration: scrollAnimationDuration,\n easing: Easing.easeOutQuart,\n },\n (isFinished) => {\n if (isFinished) {\n onFinished?.();\n }\n }\n );\n },\n [scrollAnimationDuration]\n );\n\n const endWithSpring = React.useCallback(\n (onFinished?: () => void) => {\n 'worklet';\n const origin = translation.value;\n const velocity = scrollEndVelocity.value;\n if (!pagingEnabled) {\n if (enableSnap) {\n const nextPage =\n Math.round((origin + velocity * 0.4) / size) * size;\n translation.value = _withSpring(nextPage, onFinished);\n return;\n }\n translation.value = withDecay({\n velocity,\n deceleration: 0.999,\n });\n return;\n }\n const page = Math.round(-translation.value / size);\n const velocityPage = Math.round(\n -(translation.value + scrollEndVelocity.value) / size\n );\n let finalPage = Math.min(\n page + 1,\n Math.max(page - 1, velocityPage)\n );\n if (!infinite) {\n finalPage = Math.min(maxPage - 1, Math.max(0, finalPage));\n }\n\n translation.value = _withSpring(-finalPage * size, onFinished);\n },\n [\n infinite,\n _withSpring,\n translation,\n scrollEndVelocity,\n size,\n maxPage,\n pagingEnabled,\n enableSnap,\n ]\n );\n\n const resetBoundary = React.useCallback(() => {\n 'worklet';\n const onFinish = (isFinished: boolean) => {\n if (isFinished) {\n touching.value = false;\n onScrollEnd && runOnJS(onScrollEnd)();\n }\n };\n const activeDecay = () => {\n touching.value = true;\n translation.value = withDecay(\n { velocity: scrollEndVelocity.value },\n onFinish\n );\n };\n\n if (touching.value) {\n return;\n }\n\n if (translation.value > 0) {\n if (scrollEndTranslation.value < 0) {\n activeDecay();\n return;\n }\n if (!infinite) {\n translation.value = _withSpring(0);\n return;\n }\n }\n\n if (translation.value < -((maxPage - 1) * size)) {\n if (scrollEndTranslation.value > 0) {\n activeDecay();\n return;\n }\n if (!infinite) {\n translation.value = _withSpring(-((maxPage - 1) * size));\n return;\n }\n }\n }, [\n infinite,\n touching,\n _withSpring,\n translation,\n scrollEndTranslation,\n scrollEndVelocity,\n onScrollEnd,\n maxPage,\n size,\n ]);\n\n useAnimatedReaction(\n () => translation.value,\n () => {\n if (!pagingEnabled) {\n resetBoundary();\n }\n },\n [pagingEnabled]\n );\n\n const panGestureEventHandler = useAnimatedGestureHandler<\n PanGestureHandlerGestureEvent,\n GestureContext\n >(\n {\n onStart: (_, ctx) => {\n touching.value = true;\n cancelAnimation(translation);\n onScrollBegin && runOnJS(onScrollBegin)();\n ctx.max = (maxPage - 1) * size;\n ctx.panOffset = translation.value;\n },\n onActive: (e, ctx) => {\n touching.value = true;\n const { translationX, translationY } = e;\n let panTranslation = isHorizontal.value\n ? translationX\n : translationY;\n\n if (\n !infinite &&\n (translation.value > 0 || translation.value < -ctx.max)\n ) {\n const boundary = translation.value > 0 ? 0 : -ctx.max;\n const fixed = boundary - ctx.panOffset;\n const dynamic = panTranslation - fixed;\n translation.value = boundary + dynamic * 0.5;\n return;\n }\n\n translation.value = ctx.panOffset + panTranslation;\n },\n onEnd: (e) => {\n const { velocityX, velocityY, translationX, translationY } = e;\n scrollEndVelocity.value = isHorizontal.value\n ? velocityX\n : velocityY;\n scrollEndTranslation.value = isHorizontal.value\n ? translationX\n : translationY;\n\n endWithSpring(() => onScrollEnd && runOnJS(onScrollEnd)());\n\n if (!infinite) {\n touching.value = false;\n }\n },\n },\n [pagingEnabled, isHorizontal.value, infinite, maxPage, size, enableSnap]\n );\n\n const directionStyle = React.useMemo(() => {\n return vertical ? styles.contentHorizontal : styles.contentVertical;\n }, [vertical]);\n\n return (\n <Animated.View style={[styles.container, directionStyle, style]}>\n <PanGestureHandler\n {...panGestureHandlerProps}\n onGestureEvent={panGestureEventHandler}\n >\n {props.children}\n </PanGestureHandler>\n </Animated.View>\n );\n};\n\nexport const ScrollViewGesture = IScrollViewGesture;\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n overflow: 'hidden',\n },\n contentVertical: {\n flexDirection: 'column',\n },\n contentHorizontal: {\n flexDirection: 'row',\n },\n});\n"]}
@@ -3,7 +3,10 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.DATA_LENGTH = void 0;
6
+ exports.Easing = exports.DATA_LENGTH = void 0;
7
+
8
+ var _reactNativeReanimated = require("react-native-reanimated");
9
+
7
10
  let DATA_LENGTH;
8
11
  exports.DATA_LENGTH = DATA_LENGTH;
9
12
 
@@ -11,4 +14,9 @@ exports.DATA_LENGTH = DATA_LENGTH;
11
14
  DATA_LENGTH[DATA_LENGTH["SINGLE_ITEM"] = 1] = "SINGLE_ITEM";
12
15
  DATA_LENGTH[DATA_LENGTH["DOUBLE_ITEM"] = 2] = "DOUBLE_ITEM";
13
16
  })(DATA_LENGTH || (exports.DATA_LENGTH = DATA_LENGTH = {}));
17
+
18
+ const Easing = {
19
+ easeOutQuart: _reactNativeReanimated.Easing.bezier(0.25, 1, 0.5, 1)
20
+ };
21
+ exports.Easing = Easing;
14
22
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"names":["DATA_LENGTH"],"mappings":";;;;;;IAAYA,W;;;WAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;GAAAA,W,2BAAAA,W","sourcesContent":["export enum DATA_LENGTH {\n SINGLE_ITEM = 1,\n DOUBLE_ITEM = 2,\n}\n"]}
1
+ {"version":3,"sources":["index.ts"],"names":["DATA_LENGTH","Easing","easeOutQuart","_Easing","bezier"],"mappings":";;;;;;;AAAA;;IAEYA,W;;;WAAAA,W;AAAAA,EAAAA,W,CAAAA,W;AAAAA,EAAAA,W,CAAAA,W;GAAAA,W,2BAAAA,W;;AAKL,MAAMC,MAAM,GAAG;AAClBC,EAAAA,YAAY,EAAEC,8BAAQC,MAAR,CAAe,IAAf,EAAqB,CAArB,EAAwB,GAAxB,EAA6B,CAA7B;AADI,CAAf","sourcesContent":["import { Easing as _Easing } from 'react-native-reanimated';\n\nexport enum DATA_LENGTH {\n SINGLE_ITEM = 1,\n DOUBLE_ITEM = 2,\n}\n\nexport const Easing = {\n easeOutQuart: _Easing.bezier(0.25, 1, 0.5, 1),\n};\n"]}
@@ -19,34 +19,40 @@ function useAutoPlay(opts) {
19
19
  carouselController
20
20
  } = opts;
21
21
  const timer = React.useRef();
22
- const pause = React.useCallback(() => {
23
- timer.current && clearInterval(timer.current);
24
- }, []);
25
- const run = React.useCallback(() => {
26
- if (timer.current) {
27
- pause();
28
- }
29
-
30
- if (!autoPlay) {
22
+ const stopped = React.useRef(!autoPlay);
23
+ const play = React.useCallback(() => {
24
+ if (stopped.current) {
31
25
  return;
32
26
  }
33
27
 
34
- timer.current = setInterval(() => {
35
- autoPlayReverse ? carouselController.prev() : carouselController.next();
28
+ timer.current = setTimeout(() => {
29
+ autoPlayReverse ? carouselController.prev({
30
+ onFinished: play
31
+ }) : carouselController.next({
32
+ onFinished: play
33
+ });
36
34
  }, autoPlayInterval);
37
- }, [pause, autoPlay, autoPlayReverse, autoPlayInterval, carouselController]);
35
+ }, [autoPlayReverse, autoPlayInterval, carouselController]);
36
+ const pause = React.useCallback(() => {
37
+ timer.current && clearInterval(timer.current);
38
+ stopped.current = true;
39
+ }, []);
40
+ const start = React.useCallback(() => {
41
+ stopped.current = false;
42
+ play();
43
+ }, [play]);
38
44
  React.useEffect(() => {
39
45
  if (autoPlay) {
40
- run();
46
+ start();
41
47
  } else {
42
48
  pause();
43
49
  }
44
50
 
45
51
  return pause;
46
- }, [run, pause, autoPlay]);
52
+ }, [pause, start, autoPlay]);
47
53
  return {
48
- run,
49
- pause
54
+ pause,
55
+ start
50
56
  };
51
57
  }
52
58
  //# sourceMappingURL=useAutoPlay.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["useAutoPlay.ts"],"names":["useAutoPlay","opts","autoPlay","autoPlayReverse","autoPlayInterval","carouselController","timer","React","useRef","pause","useCallback","current","clearInterval","run","setInterval","prev","next","useEffect"],"mappings":";;;;;;;AAAA;;;;;;AAGO,SAASA,WAAT,CAAqBC,IAArB,EAKJ;AACC,QAAM;AACFC,IAAAA,QAAQ,GAAG,KADT;AAEFC,IAAAA,eAAe,GAAG,KAFhB;AAGFC,IAAAA,gBAHE;AAIFC,IAAAA;AAJE,MAKFJ,IALJ;AAOA,QAAMK,KAAK,GAAGC,KAAK,CAACC,MAAN,EAAd;AAEA,QAAMC,KAAK,GAAGF,KAAK,CAACG,WAAN,CAAkB,MAAM;AAClCJ,IAAAA,KAAK,CAACK,OAAN,IAAiBC,aAAa,CAACN,KAAK,CAACK,OAAP,CAA9B;AACH,GAFa,EAEX,EAFW,CAAd;AAIA,QAAME,GAAG,GAAGN,KAAK,CAACG,WAAN,CAAkB,MAAM;AAChC,QAAIJ,KAAK,CAACK,OAAV,EAAmB;AACfF,MAAAA,KAAK;AACR;;AAED,QAAI,CAACP,QAAL,EAAe;AACX;AACH;;AAEDI,IAAAA,KAAK,CAACK,OAAN,GAAgBG,WAAW,CAAC,MAAM;AAC9BX,MAAAA,eAAe,GACTE,kBAAkB,CAACU,IAAnB,EADS,GAETV,kBAAkB,CAACW,IAAnB,EAFN;AAGH,KAJ0B,EAIxBZ,gBAJwB,CAA3B;AAKH,GAdW,EAcT,CACCK,KADD,EAECP,QAFD,EAGCC,eAHD,EAICC,gBAJD,EAKCC,kBALD,CAdS,CAAZ;AAsBAE,EAAAA,KAAK,CAACU,SAAN,CAAgB,MAAM;AAClB,QAAIf,QAAJ,EAAc;AACVW,MAAAA,GAAG;AACN,KAFD,MAEO;AACHJ,MAAAA,KAAK;AACR;;AACD,WAAOA,KAAP;AACH,GAPD,EAOG,CAACI,GAAD,EAAMJ,KAAN,EAAaP,QAAb,CAPH;AASA,SAAO;AACHW,IAAAA,GADG;AAEHJ,IAAAA;AAFG,GAAP;AAIH","sourcesContent":["import * as React from 'react';\nimport type { ICarouselController } from './useCarouselController';\n\nexport function useAutoPlay(opts: {\n autoPlay?: boolean;\n autoPlayInterval?: number;\n autoPlayReverse?: boolean;\n carouselController: ICarouselController;\n}) {\n const {\n autoPlay = false,\n autoPlayReverse = false,\n autoPlayInterval,\n carouselController,\n } = opts;\n\n const timer = React.useRef<NodeJS.Timer>();\n\n const pause = React.useCallback(() => {\n timer.current && clearInterval(timer.current);\n }, []);\n\n const run = React.useCallback(() => {\n if (timer.current) {\n pause();\n }\n\n if (!autoPlay) {\n return;\n }\n\n timer.current = setInterval(() => {\n autoPlayReverse\n ? carouselController.prev()\n : carouselController.next();\n }, autoPlayInterval);\n }, [\n pause,\n autoPlay,\n autoPlayReverse,\n autoPlayInterval,\n carouselController,\n ]);\n\n React.useEffect(() => {\n if (autoPlay) {\n run();\n } else {\n pause();\n }\n return pause;\n }, [run, pause, autoPlay]);\n\n return {\n run,\n pause,\n };\n}\n"]}
1
+ {"version":3,"sources":["useAutoPlay.ts"],"names":["useAutoPlay","opts","autoPlay","autoPlayReverse","autoPlayInterval","carouselController","timer","React","useRef","stopped","play","useCallback","current","setTimeout","prev","onFinished","next","pause","clearInterval","start","useEffect"],"mappings":";;;;;;;AAAA;;;;;;AAGO,SAASA,WAAT,CAAqBC,IAArB,EAKJ;AACC,QAAM;AACFC,IAAAA,QAAQ,GAAG,KADT;AAEFC,IAAAA,eAAe,GAAG,KAFhB;AAGFC,IAAAA,gBAHE;AAIFC,IAAAA;AAJE,MAKFJ,IALJ;AAOA,QAAMK,KAAK,GAAGC,KAAK,CAACC,MAAN,EAAd;AACA,QAAMC,OAAO,GAAGF,KAAK,CAACC,MAAN,CAAsB,CAACN,QAAvB,CAAhB;AAEA,QAAMQ,IAAI,GAAGH,KAAK,CAACI,WAAN,CAAkB,MAAM;AACjC,QAAIF,OAAO,CAACG,OAAZ,EAAqB;AACjB;AACH;;AAEDN,IAAAA,KAAK,CAACM,OAAN,GAAgBC,UAAU,CAAC,MAAM;AAC7BV,MAAAA,eAAe,GACTE,kBAAkB,CAACS,IAAnB,CAAwB;AAAEC,QAAAA,UAAU,EAAEL;AAAd,OAAxB,CADS,GAETL,kBAAkB,CAACW,IAAnB,CAAwB;AAAED,QAAAA,UAAU,EAAEL;AAAd,OAAxB,CAFN;AAGH,KAJyB,EAIvBN,gBAJuB,CAA1B;AAKH,GAVY,EAUV,CAACD,eAAD,EAAkBC,gBAAlB,EAAoCC,kBAApC,CAVU,CAAb;AAYA,QAAMY,KAAK,GAAGV,KAAK,CAACI,WAAN,CAAkB,MAAM;AAClCL,IAAAA,KAAK,CAACM,OAAN,IAAiBM,aAAa,CAACZ,KAAK,CAACM,OAAP,CAA9B;AACAH,IAAAA,OAAO,CAACG,OAAR,GAAkB,IAAlB;AACH,GAHa,EAGX,EAHW,CAAd;AAKA,QAAMO,KAAK,GAAGZ,KAAK,CAACI,WAAN,CAAkB,MAAM;AAClCF,IAAAA,OAAO,CAACG,OAAR,GAAkB,KAAlB;AACAF,IAAAA,IAAI;AACP,GAHa,EAGX,CAACA,IAAD,CAHW,CAAd;AAKAH,EAAAA,KAAK,CAACa,SAAN,CAAgB,MAAM;AAClB,QAAIlB,QAAJ,EAAc;AACViB,MAAAA,KAAK;AACR,KAFD,MAEO;AACHF,MAAAA,KAAK;AACR;;AACD,WAAOA,KAAP;AACH,GAPD,EAOG,CAACA,KAAD,EAAQE,KAAR,EAAejB,QAAf,CAPH;AASA,SAAO;AACHe,IAAAA,KADG;AAEHE,IAAAA;AAFG,GAAP;AAIH","sourcesContent":["import * as React from 'react';\nimport type { ICarouselController } from './useCarouselController';\n\nexport function useAutoPlay(opts: {\n autoPlay?: boolean;\n autoPlayInterval?: number;\n autoPlayReverse?: boolean;\n carouselController: ICarouselController;\n}) {\n const {\n autoPlay = false,\n autoPlayReverse = false,\n autoPlayInterval,\n carouselController,\n } = opts;\n\n const timer = React.useRef<NodeJS.Timer>();\n const stopped = React.useRef<boolean>(!autoPlay);\n\n const play = React.useCallback(() => {\n if (stopped.current) {\n return;\n }\n\n timer.current = setTimeout(() => {\n autoPlayReverse\n ? carouselController.prev({ onFinished: play })\n : carouselController.next({ onFinished: play });\n }, autoPlayInterval);\n }, [autoPlayReverse, autoPlayInterval, carouselController]);\n\n const pause = React.useCallback(() => {\n timer.current && clearInterval(timer.current);\n stopped.current = true;\n }, []);\n\n const start = React.useCallback(() => {\n stopped.current = false;\n play();\n }, [play]);\n\n React.useEffect(() => {\n if (autoPlay) {\n start();\n } else {\n pause();\n }\n return pause;\n }, [pause, start, autoPlay]);\n\n return {\n pause,\n start,\n };\n}\n"]}