react-native-reanimated-carousel 0.4.3 → 0.4.4

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 (11) hide show
  1. package/lib/commonjs/Carousel.js +20 -16
  2. package/lib/commonjs/Carousel.js.map +1 -1
  3. package/lib/commonjs/useLock.js +1 -0
  4. package/lib/commonjs/useLock.js.map +1 -1
  5. package/lib/module/Carousel.js +20 -16
  6. package/lib/module/Carousel.js.map +1 -1
  7. package/lib/module/useLock.js +1 -0
  8. package/lib/module/useLock.js.map +1 -1
  9. package/package.json +1 -1
  10. package/src/Carousel.tsx +17 -17
  11. package/src/useLock.ts +1 -1
package/lib/commonjs/Carousel.js CHANGED
@@ -112,7 +112,7 @@ function Carousel(props, ref) {
112
112
  }
113
113
  }, [onSnapToItem, loop, _data]);
114
114
 
115
- const callComputedIndex = _react.default.useCallback(isFinished => isFinished && (computedIndex === null || computedIndex === void 0 ? void 0 : computedIndex()), [computedIndex]);
115
+ const callComputedIndex = _react.default.useCallback(() => computedIndex === null || computedIndex === void 0 ? void 0 : computedIndex(), [computedIndex]);
116
116
 
117
117
  const next = _react.default.useCallback(() => {
118
118
  return carouselController.next(callComputedIndex);
@@ -131,9 +131,10 @@ function Carousel(props, ref) {
131
131
  if (lockController.isLock()) return;
132
132
  ctx.startContentOffsetX = handlerOffsetX.value;
133
133
  ctx.currentContentOffsetX = handlerOffsetX.value;
134
+ ctx.start = true;
134
135
  },
135
136
  onActive: (e, ctx) => {
136
- if (lockController.isLock()) return;
137
+ if (lockController.isLock() || !ctx.start) return;
137
138
  /**
138
139
  * `onActive` and `onEnd` return different values of translationX！So that creates a bias！TAT
139
140
  * */
@@ -148,17 +149,16 @@ function Carousel(props, ref) {
148
149
  handlerOffsetX.value = Math.max(Math.min(ctx.currentContentOffsetX + e.translationX, 0), -(data.length - 1) * width);
149
150
  },
150
151
  onEnd: (e, ctx) => {
151
- if (lockController.isLock()) return;
152
+ if (lockController.isLock() || !ctx.start) return;
152
153
  const translationX = ctx.translationX;
153
154
 
154
155
  function _withTimingCallback(num) {
155
- lockController.lock();
156
156
  return (0, _reactNativeReanimated.withTiming)(num, timingConfig, isFinished => {
157
157
  if (isFinished) {
158
+ ctx.start = false;
158
159
  lockController.unLock();
160
+ (0, _reactNativeReanimated.runOnJS)(callComputedIndex)();
159
161
  }
160
-
161
- (0, _reactNativeReanimated.runOnJS)(callComputedIndex)(isFinished);
162
162
  });
163
163
  }
164
164
 
@@ -170,6 +170,8 @@ function Carousel(props, ref) {
170
170
  return;
171
171
  }
172
172
 
173
+ lockController.lock();
174
+
173
175
  if (Math.abs(translationX) + Math.abs(e.velocityX) > width / 2) {
174
176
  handlerOffsetX.value = _withTimingCallback(handlerOffsetX.value + width - translationX);
175
177
  } else {
@@ -187,6 +189,8 @@ function Carousel(props, ref) {
187
189
  return;
188
190
  }
189
191
 
192
+ lockController.lock();
193
+
190
194
  if (Math.abs(translationX) + Math.abs(e.velocityX) > width / 2) {
191
195
  handlerOffsetX.value = _withTimingCallback(handlerOffsetX.value - width - translationX);
192
196
  } else {
@@ -210,7 +214,7 @@ function Carousel(props, ref) {
210
214
  switch (mode) {
211
215
  case 'parallax':
212
216
  return ({
213
- index,
217
+ index: i,
214
218
  children
215
219
  }) => /*#__PURE__*/_react.default.createElement(_index.ParallaxLayout, {
216
220
  parallaxScrollingOffset: parallaxScrollingOffset,
@@ -218,22 +222,22 @@ function Carousel(props, ref) {
218
222
  computedAnimResult: computedAnimResult,
219
223
  width: width,
220
224
  handlerOffsetX: offsetX,
221
- index: index,
222
- key: index,
225
+ index: i,
226
+ key: i,
223
227
  loop: loop
224
228
  }, children);
225
229
 
226
230
  default:
227
231
  return ({
228
- index,
232
+ index: i,
229
233
  children
230
234
  }) => /*#__PURE__*/_react.default.createElement(_CarouselItem.CarouselItem, {
231
235
  computedAnimResult: computedAnimResult,
232
236
  width: width,
233
237
  height: height,
234
238
  handlerOffsetX: offsetX,
235
- index: index,
236
- key: index,
239
+ index: i,
240
+ key: i,
237
241
  loop: loop
238
242
  }, children);
239
243
  }
@@ -249,11 +253,11 @@ function Carousel(props, ref) {
249
253
  flexDirection: 'row',
250
254
  position: 'relative'
251
255
  }, style]
252
- }, data.map((item, index) => {
256
+ }, data.map((item, i) => {
253
257
  return /*#__PURE__*/_react.default.createElement(Layouts, {
254
- index: index,
255
- key: index
256
- }, renderItem(item, index));
258
+ index: i,
259
+ key: i
260
+ }, renderItem(item, i));
257
261
  })));
258
262
  }
259
263
 
package/lib/commonjs/Carousel.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["Carousel.tsx"],"names":["defaultTimingConfig","duration","Carousel","props","ref","height","data","_data","width","loop","mode","renderItem","autoPlay","autoPlayReverse","autoPlayInterval","parallaxScrollingOffset","parallaxScrollingScale","onSnapToItem","style","timingConfig","lockController","handlerOffsetX","React","useMemo","length","computedAnimResult","carouselController","disable","index","computedIndex","offsetX","x","value","WL","isNaN","i","callComputedIndex","useCallback","isFinished","next","prev","getCurrentIndex","animatedListScrollHandler","onStart","_","ctx","isLock","startContentOffsetX","currentContentOffsetX","onActive","e","translationX","Math","max","min","onEnd","_withTimingCallback","num","lock","unLock","abs","velocityX","useImperativeHandle","Layouts","children","flexDirection","position","map","item","forwardRef"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewStyle } from 'react-native';\nimport {\n PanGestureHandler,\n PanGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n runOnJS,\n useAnimatedGestureHandler,\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { CarouselItem } from './CarouselItem';\nimport type { TMode } from './layouts';\nimport { ParallaxLayout } from './layouts/index';\nimport { useCarouselController } from './useCarouselController';\nimport { useComputedAnim } from './useComputedAnim';\nimport { useAutoPlay } from './useAutoPlay';\nimport { useComputedIndex } from './useComputedIndex';\nimport { useLockController } from './useLock';\n\nconst defaultTimingConfig: Animated.WithTimingConfig = {\n duration: 250,\n};\n\nexport interface ICarouselProps<T extends unknown> {\n ref?: React.Ref<ICarouselInstance>;\n /**\n * Carousel loop playback.\n * @default true\n */\n loop?: boolean;\n /**\n * Carousel Animated transitions.\n * @default 'default'\n */\n mode?: TMode;\n /**\n * Render carousel item.\n */\n renderItem: (data: T, index: number) => React.ReactNode;\n /**\n * Specified carousel container width.\n */\n width: number;\n /**\n * Specified carousel container height.\n * @default '100%'\n */\n height?: FlexStyle['height'];\n /**\n * Carousel items data set.\n */\n data: T[];\n /**\n * Auto play\n */\n autoPlay?: boolean;\n /**\n * Auto play\n * @description reverse playback\n */\n autoPlayReverse?: boolean;\n /**\n * Auto play\n * @description playback interval\n */\n autoPlayInterval?: number;\n /**\n * Carousel container style\n */\n style?: ViewStyle;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 100\n */\n parallaxScrollingOffset?: number;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 0.8\n */\n parallaxScrollingScale?: number;\n /**\n * Callback fired when navigating to an item\n */\n onSnapToItem?: (index: number) => void;\n /**\n * Timing config of translation animated\n */\n timingConfig?: Animated.WithTimingConfig;\n}\n\nexport interface ICarouselInstance {\n /**\n * Play the last one\n */\n prev: () => void;\n /**\n * Play the next one\n */\n next: () => void;\n /**\n * Get current item index\n */\n getCurrentIndex: () => number;\n}\n\nfunction Carousel<T extends unknown = any>(\n props: ICarouselProps<T>,\n ref: React.Ref<ICarouselInstance>\n) {\n const {\n height = '100%',\n data: _data = [],\n width,\n loop = true,\n mode = 'default',\n renderItem,\n autoPlay,\n autoPlayReverse,\n autoPlayInterval,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n onSnapToItem,\n style,\n timingConfig = defaultTimingConfig,\n } = props;\n const lockController = useLockController();\n const handlerOffsetX = useSharedValue<number>(0);\n const data = React.useMemo<T[]>(() => {\n if (!loop) return _data;\n\n if (_data.length === 1) {\n return [_data[0], _data[0], _data[0]];\n }\n\n if (_data.length === 2) {\n return [_data[0], _data[1], _data[0], _data[1]];\n }\n\n return _data;\n }, [_data, loop]);\n\n const computedAnimResult = useComputedAnim(width, data.length);\n const carouselController = useCarouselController({\n width,\n handlerOffsetX,\n lockController,\n timingConfig,\n disable: !data.length,\n });\n useAutoPlay({\n autoPlay,\n autoPlayInterval,\n autoPlayReverse,\n carouselController,\n lockController,\n });\n const { index, computedIndex } = useComputedIndex({\n length: data.length,\n handlerOffsetX,\n width,\n });\n\n const offsetX = useDerivedValue(() => {\n const x = handlerOffsetX.value % computedAnimResult.WL;\n return isNaN(x) ? 0 : x;\n }, [computedAnimResult]);\n\n useAnimatedReaction(\n () => index.value,\n (i) => {\n if (loop) {\n switch (_data.length) {\n case 1:\n i = 0;\n break;\n case 2:\n i = i % 2;\n break;\n }\n onSnapToItem && runOnJS(onSnapToItem)(i);\n }\n },\n [onSnapToItem, loop, _data]\n );\n\n const callComputedIndex = React.useCallback(\n (isFinished: boolean) => isFinished && computedIndex?.(),\n [computedIndex]\n );\n\n const next = React.useCallback(() => {\n return carouselController.next(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const prev = React.useCallback(() => {\n return carouselController.prev(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const getCurrentIndex = React.useCallback(() => {\n return index.value;\n }, [index]);\n\n const animatedListScrollHandler =\n useAnimatedGestureHandler<PanGestureHandlerGestureEvent>(\n {\n onStart: (_, ctx: any) => {\n if (lockController.isLock()) return;\n ctx.startContentOffsetX = handlerOffsetX.value;\n ctx.currentContentOffsetX = handlerOffsetX.value;\n },\n onActive: (e, ctx: any) => {\n if (lockController.isLock()) return;\n /**\n * `onActive` and `onEnd` return different values of translationX！So that creates a bias！TAT\n * */\n ctx.translationX = e.translationX;\n if (loop) {\n handlerOffsetX.value =\n ctx.currentContentOffsetX + e.translationX;\n return;\n }\n handlerOffsetX.value = Math.max(\n Math.min(ctx.currentContentOffsetX + e.translationX, 0),\n -(data.length - 1) * width\n );\n },\n onEnd: (e, ctx: any) => {\n if (lockController.isLock()) return;\n const translationX = ctx.translationX;\n\n function _withTimingCallback(num: number) {\n lockController.lock();\n return withTiming(num, timingConfig, (isFinished) => {\n if (isFinished) {\n lockController.unLock();\n }\n runOnJS(callComputedIndex)(isFinished);\n });\n }\n\n if (translationX > 0) {\n /**\n * If not loop no , longer scroll when sliding to the start.\n * */\n if (!loop && handlerOffsetX.value >= 0) {\n return;\n }\n\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value + width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n\n if (translationX < 0) {\n /**\n * If not loop , no longer scroll when sliding to the end.\n * */\n if (\n !loop &&\n handlerOffsetX.value <= -(data.length - 1) * width\n ) {\n return;\n }\n\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n },\n },\n [loop, data, lockController]\n );\n\n React.useImperativeHandle(ref, () => {\n return {\n next,\n prev,\n getCurrentIndex,\n };\n });\n\n const Layouts = React.useMemo<React.FC<{ index: number }>>(() => {\n switch (mode) {\n case 'parallax':\n return ({ index, children }) => (\n <ParallaxLayout\n parallaxScrollingOffset={parallaxScrollingOffset}\n parallaxScrollingScale={parallaxScrollingScale}\n computedAnimResult={computedAnimResult}\n width={width}\n handlerOffsetX={offsetX}\n index={index}\n key={index}\n loop={loop}\n >\n {children}\n </ParallaxLayout>\n );\n default:\n return ({ index, children }) => (\n <CarouselItem\n computedAnimResult={computedAnimResult}\n width={width}\n height={height}\n handlerOffsetX={offsetX}\n index={index}\n key={index}\n loop={loop}\n >\n {children}\n </CarouselItem>\n );\n }\n }, [\n loop,\n mode,\n computedAnimResult,\n height,\n offsetX,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n width,\n ]);\n\n return (\n <PanGestureHandler onHandlerStateChange={animatedListScrollHandler}>\n <Animated.View\n style={[\n // eslint-disable-next-line react-native/no-inline-styles\n {\n width,\n height,\n flexDirection: 'row',\n position: 'relative',\n },\n style,\n ]}\n >\n {data.map((item, index) => {\n return (\n <Layouts index={index} key={index}>\n {renderItem(item, index)}\n </Layouts>\n );\n })}\n </Animated.View>\n </PanGestureHandler>\n );\n}\n\nexport default React.forwardRef(Carousel) as typeof Carousel;\n"]}
1
+ {"version":3,"sources":["Carousel.tsx"],"names":["defaultTimingConfig","duration","Carousel","props","ref","height","data","_data","width","loop","mode","renderItem","autoPlay","autoPlayReverse","autoPlayInterval","parallaxScrollingOffset","parallaxScrollingScale","onSnapToItem","style","timingConfig","lockController","handlerOffsetX","React","useMemo","length","computedAnimResult","carouselController","disable","index","computedIndex","offsetX","x","value","WL","isNaN","i","callComputedIndex","useCallback","next","prev","getCurrentIndex","animatedListScrollHandler","onStart","_","ctx","isLock","startContentOffsetX","currentContentOffsetX","start","onActive","e","translationX","Math","max","min","onEnd","_withTimingCallback","num","isFinished","unLock","lock","abs","velocityX","useImperativeHandle","Layouts","children","flexDirection","position","map","item","forwardRef"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewStyle } from 'react-native';\nimport {\n PanGestureHandler,\n PanGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n runOnJS,\n useAnimatedGestureHandler,\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { CarouselItem } from './CarouselItem';\nimport type { TMode } from './layouts';\nimport { ParallaxLayout } from './layouts/index';\nimport { useCarouselController } from './useCarouselController';\nimport { useComputedAnim } from './useComputedAnim';\nimport { useAutoPlay } from './useAutoPlay';\nimport { useComputedIndex } from './useComputedIndex';\nimport { useLockController } from './useLock';\n\nconst defaultTimingConfig: Animated.WithTimingConfig = {\n duration: 250,\n};\n\nexport interface ICarouselProps<T extends unknown> {\n ref?: React.Ref<ICarouselInstance>;\n /**\n * Carousel loop playback.\n * @default true\n */\n loop?: boolean;\n /**\n * Carousel Animated transitions.\n * @default 'default'\n */\n mode?: TMode;\n /**\n * Render carousel item.\n */\n renderItem: (data: T, index: number) => React.ReactNode;\n /**\n * Specified carousel container width.\n */\n width: number;\n /**\n * Specified carousel container height.\n * @default '100%'\n */\n height?: FlexStyle['height'];\n /**\n * Carousel items data set.\n */\n data: T[];\n /**\n * Auto play\n */\n autoPlay?: boolean;\n /**\n * Auto play\n * @description reverse playback\n */\n autoPlayReverse?: boolean;\n /**\n * Auto play\n * @description playback interval\n */\n autoPlayInterval?: number;\n /**\n * Carousel container style\n */\n style?: ViewStyle;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 100\n */\n parallaxScrollingOffset?: number;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 0.8\n */\n parallaxScrollingScale?: number;\n /**\n * Callback fired when navigating to an item\n */\n onSnapToItem?: (index: number) => void;\n /**\n * Timing config of translation animated\n */\n timingConfig?: Animated.WithTimingConfig;\n}\n\nexport interface ICarouselInstance {\n /**\n * Play the last one\n */\n prev: () => void;\n /**\n * Play the next one\n */\n next: () => void;\n /**\n * Get current item index\n */\n getCurrentIndex: () => number;\n}\n\nfunction Carousel<T extends unknown = any>(\n props: ICarouselProps<T>,\n ref: React.Ref<ICarouselInstance>\n) {\n const {\n height = '100%',\n data: _data = [],\n width,\n loop = true,\n mode = 'default',\n renderItem,\n autoPlay,\n autoPlayReverse,\n autoPlayInterval,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n onSnapToItem,\n style,\n timingConfig = defaultTimingConfig,\n } = props;\n const lockController = useLockController();\n const handlerOffsetX = useSharedValue<number>(0);\n const data = React.useMemo<T[]>(() => {\n if (!loop) return _data;\n\n if (_data.length === 1) {\n return [_data[0], _data[0], _data[0]];\n }\n\n if (_data.length === 2) {\n return [_data[0], _data[1], _data[0], _data[1]];\n }\n\n return _data;\n }, [_data, loop]);\n\n const computedAnimResult = useComputedAnim(width, data.length);\n const carouselController = useCarouselController({\n width,\n handlerOffsetX,\n lockController,\n timingConfig,\n disable: !data.length,\n });\n useAutoPlay({\n autoPlay,\n autoPlayInterval,\n autoPlayReverse,\n carouselController,\n lockController,\n });\n const { index, computedIndex } = useComputedIndex({\n length: data.length,\n handlerOffsetX,\n width,\n });\n\n const offsetX = useDerivedValue(() => {\n const x = handlerOffsetX.value % computedAnimResult.WL;\n return isNaN(x) ? 0 : x;\n }, [computedAnimResult]);\n\n useAnimatedReaction(\n () => index.value,\n (i) => {\n if (loop) {\n switch (_data.length) {\n case 1:\n i = 0;\n break;\n case 2:\n i = i % 2;\n break;\n }\n onSnapToItem && runOnJS(onSnapToItem)(i);\n }\n },\n [onSnapToItem, loop, _data]\n );\n\n const callComputedIndex = React.useCallback(\n () => computedIndex?.(),\n [computedIndex]\n );\n\n const next = React.useCallback(() => {\n return carouselController.next(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const prev = React.useCallback(() => {\n return carouselController.prev(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const getCurrentIndex = React.useCallback(() => {\n return index.value;\n }, [index]);\n\n const animatedListScrollHandler =\n useAnimatedGestureHandler<PanGestureHandlerGestureEvent>(\n {\n onStart: (_, ctx: any) => {\n if (lockController.isLock()) return;\n ctx.startContentOffsetX = handlerOffsetX.value;\n ctx.currentContentOffsetX = handlerOffsetX.value;\n ctx.start = true;\n },\n onActive: (e, ctx: any) => {\n if (lockController.isLock() || !ctx.start) return;\n /**\n * `onActive` and `onEnd` return different values of translationX！So that creates a bias！TAT\n * */\n ctx.translationX = e.translationX;\n if (loop) {\n handlerOffsetX.value =\n ctx.currentContentOffsetX + e.translationX;\n return;\n }\n handlerOffsetX.value = Math.max(\n Math.min(ctx.currentContentOffsetX + e.translationX, 0),\n -(data.length - 1) * width\n );\n },\n onEnd: (e, ctx: any) => {\n if (lockController.isLock() || !ctx.start) return;\n const translationX = ctx.translationX;\n function _withTimingCallback(num: number) {\n return withTiming(num, timingConfig, (isFinished) => {\n if (isFinished) {\n ctx.start = false;\n lockController.unLock();\n runOnJS(callComputedIndex)();\n }\n });\n }\n\n if (translationX > 0) {\n /**\n * If not loop no , longer scroll when sliding to the start.\n * */\n if (!loop && handlerOffsetX.value >= 0) {\n return;\n }\n lockController.lock();\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value + width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n\n if (translationX < 0) {\n /**\n * If not loop , no longer scroll when sliding to the end.\n * */\n if (\n !loop &&\n handlerOffsetX.value <= -(data.length - 1) * width\n ) {\n return;\n }\n lockController.lock();\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n },\n },\n [loop, data, lockController]\n );\n\n React.useImperativeHandle(ref, () => {\n return {\n next,\n prev,\n getCurrentIndex,\n };\n });\n\n const Layouts = React.useMemo<React.FC<{ index: number }>>(() => {\n switch (mode) {\n case 'parallax':\n return ({ index: i, children }) => (\n <ParallaxLayout\n parallaxScrollingOffset={parallaxScrollingOffset}\n parallaxScrollingScale={parallaxScrollingScale}\n computedAnimResult={computedAnimResult}\n width={width}\n handlerOffsetX={offsetX}\n index={i}\n key={i}\n loop={loop}\n >\n {children}\n </ParallaxLayout>\n );\n default:\n return ({ index: i, children }) => (\n <CarouselItem\n computedAnimResult={computedAnimResult}\n width={width}\n height={height}\n handlerOffsetX={offsetX}\n index={i}\n key={i}\n loop={loop}\n >\n {children}\n </CarouselItem>\n );\n }\n }, [\n loop,\n mode,\n computedAnimResult,\n height,\n offsetX,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n width,\n ]);\n\n return (\n <PanGestureHandler onHandlerStateChange={animatedListScrollHandler}>\n <Animated.View\n style={[\n // eslint-disable-next-line react-native/no-inline-styles\n {\n width,\n height,\n flexDirection: 'row',\n position: 'relative',\n },\n style,\n ]}\n >\n {data.map((item, i) => {\n return (\n <Layouts index={i} key={i}>\n {renderItem(item, i)}\n </Layouts>\n );\n })}\n </Animated.View>\n </PanGestureHandler>\n );\n}\n\nexport default React.forwardRef(Carousel) as typeof Carousel;\n"]}
package/lib/commonjs/useLock.js CHANGED
@@ -11,6 +11,7 @@ var _reactNativeReanimated = require("react-native-reanimated");
11
11
  * Cannot operate while animation is locking
12
12
  */
13
13
  function useLockController() {
14
+ // This value is true if the animation is executing
14
15
  const _lock = (0, _reactNativeReanimated.useSharedValue)(false);
15
16
 
16
17
  function lock() {
package/lib/commonjs/useLock.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["useLock.ts"],"names":["useLockController","_lock","lock","value","unLock","isLock"],"mappings":";;;;;;;AAAA;;AAQA;AACA;AACA;AACO,SAASA,iBAAT,GAA8C;AACjD,QAAMC,KAAK,GAAG,2CAAwB,KAAxB,CAAd;;AACA,WAASC,IAAT,GAAgB;AACZ;;AACAD,IAAAA,KAAK,CAACE,KAAN,GAAc,IAAd;AACH;;AACD,WAASC,MAAT,GAAkB;AACd;;AACAH,IAAAA,KAAK,CAACE,KAAN,GAAc,KAAd;AACH;;AACD,WAASE,MAAT,GAAkB;AACd;;AACA,WAAOJ,KAAK,CAACE,KAAb;AACH;;AACD,SAAO;AACHD,IAAAA,IADG;AAEHE,IAAAA,MAFG;AAGHC,IAAAA;AAHG,GAAP;AAKH","sourcesContent":["import { useSharedValue } from 'react-native-reanimated';\n\nexport interface ILockController {\n lock(): void;\n unLock(): void;\n isLock(): boolean;\n}\n\n/**\n * Cannot operate while animation is locking\n */\nexport function useLockController(): ILockController {\n const _lock = useSharedValue<boolean>(false);\n function lock() {\n 'worklet';\n _lock.value = true;\n }\n function unLock() {\n 'worklet';\n _lock.value = false;\n }\n function isLock() {\n 'worklet';\n return _lock.value;\n }\n return {\n lock,\n unLock,\n isLock,\n };\n}\n"]}
1
+ {"version":3,"sources":["useLock.ts"],"names":["useLockController","_lock","lock","value","unLock","isLock"],"mappings":";;;;;;;AAAA;;AAOA;AACA;AACA;AACO,SAASA,iBAAT,GAA8C;AACjD;AACA,QAAMC,KAAK,GAAG,2CAAwB,KAAxB,CAAd;;AACA,WAASC,IAAT,GAAgB;AACZ;;AACAD,IAAAA,KAAK,CAACE,KAAN,GAAc,IAAd;AACH;;AACD,WAASC,MAAT,GAAkB;AACd;;AACAH,IAAAA,KAAK,CAACE,KAAN,GAAc,KAAd;AACH;;AACD,WAASE,MAAT,GAAkB;AACd;;AACA,WAAOJ,KAAK,CAACE,KAAb;AACH;;AACD,SAAO;AACHD,IAAAA,IADG;AAEHE,IAAAA,MAFG;AAGHC,IAAAA;AAHG,GAAP;AAKH","sourcesContent":["import { useSharedValue } from 'react-native-reanimated';\nexport interface ILockController {\n lock(): void;\n unLock(): void;\n isLock(): boolean;\n}\n\n/**\n * Cannot operate while animation is locking\n */\nexport function useLockController(): ILockController {\n // This value is true if the animation is executing\n const _lock = useSharedValue<boolean>(false);\n function lock() {\n 'worklet';\n _lock.value = true;\n }\n function unLock() {\n 'worklet';\n _lock.value = false;\n }\n function isLock() {\n 'worklet';\n return _lock.value;\n }\n return {\n lock,\n unLock,\n isLock,\n };\n}\n"]}
package/lib/module/Carousel.js CHANGED
@@ -86,7 +86,7 @@ function Carousel(props, ref) {
86
86
  onSnapToItem && runOnJS(onSnapToItem)(i);
87
87
  }
88
88
  }, [onSnapToItem, loop, _data]);
89
- const callComputedIndex = React.useCallback(isFinished => isFinished && (computedIndex === null || computedIndex === void 0 ? void 0 : computedIndex()), [computedIndex]);
89
+ const callComputedIndex = React.useCallback(() => computedIndex === null || computedIndex === void 0 ? void 0 : computedIndex(), [computedIndex]);
90
90
  const next = React.useCallback(() => {
91
91
  return carouselController.next(callComputedIndex);
92
92
  }, [carouselController, callComputedIndex]);
@@ -101,9 +101,10 @@ function Carousel(props, ref) {
101
101
  if (lockController.isLock()) return;
102
102
  ctx.startContentOffsetX = handlerOffsetX.value;
103
103
  ctx.currentContentOffsetX = handlerOffsetX.value;
104
+ ctx.start = true;
104
105
  },
105
106
  onActive: (e, ctx) => {
106
- if (lockController.isLock()) return;
107
+ if (lockController.isLock() || !ctx.start) return;
107
108
  /**
108
109
  * `onActive` and `onEnd` return different values of translationX！So that creates a bias！TAT
109
110
  * */
@@ -118,17 +119,16 @@ function Carousel(props, ref) {
118
119
  handlerOffsetX.value = Math.max(Math.min(ctx.currentContentOffsetX + e.translationX, 0), -(data.length - 1) * width);
119
120
  },
120
121
  onEnd: (e, ctx) => {
121
- if (lockController.isLock()) return;
122
+ if (lockController.isLock() || !ctx.start) return;
122
123
  const translationX = ctx.translationX;
123
124
 
124
125
  function _withTimingCallback(num) {
125
- lockController.lock();
126
126
  return withTiming(num, timingConfig, isFinished => {
127
127
  if (isFinished) {
128
+ ctx.start = false;
128
129
  lockController.unLock();
130
+ runOnJS(callComputedIndex)();
129
131
  }
130
-
131
- runOnJS(callComputedIndex)(isFinished);
132
132
  });
133
133
  }
134
134
 
@@ -140,6 +140,8 @@ function Carousel(props, ref) {
140
140
  return;
141
141
  }
142
142
 
143
+ lockController.lock();
144
+
143
145
  if (Math.abs(translationX) + Math.abs(e.velocityX) > width / 2) {
144
146
  handlerOffsetX.value = _withTimingCallback(handlerOffsetX.value + width - translationX);
145
147
  } else {
@@ -157,6 +159,8 @@ function Carousel(props, ref) {
157
159
  return;
158
160
  }
159
161
 
162
+ lockController.lock();
163
+
160
164
  if (Math.abs(translationX) + Math.abs(e.velocityX) > width / 2) {
161
165
  handlerOffsetX.value = _withTimingCallback(handlerOffsetX.value - width - translationX);
162
166
  } else {
@@ -178,7 +182,7 @@ function Carousel(props, ref) {
178
182
  switch (mode) {
179
183
  case 'parallax':
180
184
  return ({
181
- index,
185
+ index: i,
182
186
  children
183
187
  }) => /*#__PURE__*/React.createElement(ParallaxLayout, {
184
188
  parallaxScrollingOffset: parallaxScrollingOffset,
@@ -186,22 +190,22 @@ function Carousel(props, ref) {
186
190
  computedAnimResult: computedAnimResult,
187
191
  width: width,
188
192
  handlerOffsetX: offsetX,
189
- index: index,
190
- key: index,
193
+ index: i,
194
+ key: i,
191
195
  loop: loop
192
196
  }, children);
193
197
 
194
198
  default:
195
199
  return ({
196
- index,
200
+ index: i,
197
201
  children
198
202
  }) => /*#__PURE__*/React.createElement(CarouselItem, {
199
203
  computedAnimResult: computedAnimResult,
200
204
  width: width,
201
205
  height: height,
202
206
  handlerOffsetX: offsetX,
203
- index: index,
204
- key: index,
207
+ index: i,
208
+ key: i,
205
209
  loop: loop
206
210
  }, children);
207
211
  }
@@ -216,11 +220,11 @@ function Carousel(props, ref) {
216
220
  flexDirection: 'row',
217
221
  position: 'relative'
218
222
  }, style]
219
- }, data.map((item, index) => {
223
+ }, data.map((item, i) => {
220
224
  return /*#__PURE__*/React.createElement(Layouts, {
221
- index: index,
222
- key: index
223
- }, renderItem(item, index));
225
+ index: i,
226
+ key: i
227
+ }, renderItem(item, i));
224
228
  })));
225
229
  }
226
230
 
package/lib/module/Carousel.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["Carousel.tsx"],"names":["React","PanGestureHandler","Animated","runOnJS","useAnimatedGestureHandler","useAnimatedReaction","useDerivedValue","useSharedValue","withTiming","CarouselItem","ParallaxLayout","useCarouselController","useComputedAnim","useAutoPlay","useComputedIndex","useLockController","defaultTimingConfig","duration","Carousel","props","ref","height","data","_data","width","loop","mode","renderItem","autoPlay","autoPlayReverse","autoPlayInterval","parallaxScrollingOffset","parallaxScrollingScale","onSnapToItem","style","timingConfig","lockController","handlerOffsetX","useMemo","length","computedAnimResult","carouselController","disable","index","computedIndex","offsetX","x","value","WL","isNaN","i","callComputedIndex","useCallback","isFinished","next","prev","getCurrentIndex","animatedListScrollHandler","onStart","_","ctx","isLock","startContentOffsetX","currentContentOffsetX","onActive","e","translationX","Math","max","min","onEnd","_withTimingCallback","num","lock","unLock","abs","velocityX","useImperativeHandle","Layouts","children","flexDirection","position","map","item","forwardRef"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewStyle } from 'react-native';\nimport {\n PanGestureHandler,\n PanGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n runOnJS,\n useAnimatedGestureHandler,\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { CarouselItem } from './CarouselItem';\nimport type { TMode } from './layouts';\nimport { ParallaxLayout } from './layouts/index';\nimport { useCarouselController } from './useCarouselController';\nimport { useComputedAnim } from './useComputedAnim';\nimport { useAutoPlay } from './useAutoPlay';\nimport { useComputedIndex } from './useComputedIndex';\nimport { useLockController } from './useLock';\n\nconst defaultTimingConfig: Animated.WithTimingConfig = {\n duration: 250,\n};\n\nexport interface ICarouselProps<T extends unknown> {\n ref?: React.Ref<ICarouselInstance>;\n /**\n * Carousel loop playback.\n * @default true\n */\n loop?: boolean;\n /**\n * Carousel Animated transitions.\n * @default 'default'\n */\n mode?: TMode;\n /**\n * Render carousel item.\n */\n renderItem: (data: T, index: number) => React.ReactNode;\n /**\n * Specified carousel container width.\n */\n width: number;\n /**\n * Specified carousel container height.\n * @default '100%'\n */\n height?: FlexStyle['height'];\n /**\n * Carousel items data set.\n */\n data: T[];\n /**\n * Auto play\n */\n autoPlay?: boolean;\n /**\n * Auto play\n * @description reverse playback\n */\n autoPlayReverse?: boolean;\n /**\n * Auto play\n * @description playback interval\n */\n autoPlayInterval?: number;\n /**\n * Carousel container style\n */\n style?: ViewStyle;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 100\n */\n parallaxScrollingOffset?: number;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 0.8\n */\n parallaxScrollingScale?: number;\n /**\n * Callback fired when navigating to an item\n */\n onSnapToItem?: (index: number) => void;\n /**\n * Timing config of translation animated\n */\n timingConfig?: Animated.WithTimingConfig;\n}\n\nexport interface ICarouselInstance {\n /**\n * Play the last one\n */\n prev: () => void;\n /**\n * Play the next one\n */\n next: () => void;\n /**\n * Get current item index\n */\n getCurrentIndex: () => number;\n}\n\nfunction Carousel<T extends unknown = any>(\n props: ICarouselProps<T>,\n ref: React.Ref<ICarouselInstance>\n) {\n const {\n height = '100%',\n data: _data = [],\n width,\n loop = true,\n mode = 'default',\n renderItem,\n autoPlay,\n autoPlayReverse,\n autoPlayInterval,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n onSnapToItem,\n style,\n timingConfig = defaultTimingConfig,\n } = props;\n const lockController = useLockController();\n const handlerOffsetX = useSharedValue<number>(0);\n const data = React.useMemo<T[]>(() => {\n if (!loop) return _data;\n\n if (_data.length === 1) {\n return [_data[0], _data[0], _data[0]];\n }\n\n if (_data.length === 2) {\n return [_data[0], _data[1], _data[0], _data[1]];\n }\n\n return _data;\n }, [_data, loop]);\n\n const computedAnimResult = useComputedAnim(width, data.length);\n const carouselController = useCarouselController({\n width,\n handlerOffsetX,\n lockController,\n timingConfig,\n disable: !data.length,\n });\n useAutoPlay({\n autoPlay,\n autoPlayInterval,\n autoPlayReverse,\n carouselController,\n lockController,\n });\n const { index, computedIndex } = useComputedIndex({\n length: data.length,\n handlerOffsetX,\n width,\n });\n\n const offsetX = useDerivedValue(() => {\n const x = handlerOffsetX.value % computedAnimResult.WL;\n return isNaN(x) ? 0 : x;\n }, [computedAnimResult]);\n\n useAnimatedReaction(\n () => index.value,\n (i) => {\n if (loop) {\n switch (_data.length) {\n case 1:\n i = 0;\n break;\n case 2:\n i = i % 2;\n break;\n }\n onSnapToItem && runOnJS(onSnapToItem)(i);\n }\n },\n [onSnapToItem, loop, _data]\n );\n\n const callComputedIndex = React.useCallback(\n (isFinished: boolean) => isFinished && computedIndex?.(),\n [computedIndex]\n );\n\n const next = React.useCallback(() => {\n return carouselController.next(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const prev = React.useCallback(() => {\n return carouselController.prev(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const getCurrentIndex = React.useCallback(() => {\n return index.value;\n }, [index]);\n\n const animatedListScrollHandler =\n useAnimatedGestureHandler<PanGestureHandlerGestureEvent>(\n {\n onStart: (_, ctx: any) => {\n if (lockController.isLock()) return;\n ctx.startContentOffsetX = handlerOffsetX.value;\n ctx.currentContentOffsetX = handlerOffsetX.value;\n },\n onActive: (e, ctx: any) => {\n if (lockController.isLock()) return;\n /**\n * `onActive` and `onEnd` return different values of translationX！So that creates a bias！TAT\n * */\n ctx.translationX = e.translationX;\n if (loop) {\n handlerOffsetX.value =\n ctx.currentContentOffsetX + e.translationX;\n return;\n }\n handlerOffsetX.value = Math.max(\n Math.min(ctx.currentContentOffsetX + e.translationX, 0),\n -(data.length - 1) * width\n );\n },\n onEnd: (e, ctx: any) => {\n if (lockController.isLock()) return;\n const translationX = ctx.translationX;\n\n function _withTimingCallback(num: number) {\n lockController.lock();\n return withTiming(num, timingConfig, (isFinished) => {\n if (isFinished) {\n lockController.unLock();\n }\n runOnJS(callComputedIndex)(isFinished);\n });\n }\n\n if (translationX > 0) {\n /**\n * If not loop no , longer scroll when sliding to the start.\n * */\n if (!loop && handlerOffsetX.value >= 0) {\n return;\n }\n\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value + width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n\n if (translationX < 0) {\n /**\n * If not loop , no longer scroll when sliding to the end.\n * */\n if (\n !loop &&\n handlerOffsetX.value <= -(data.length - 1) * width\n ) {\n return;\n }\n\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n },\n },\n [loop, data, lockController]\n );\n\n React.useImperativeHandle(ref, () => {\n return {\n next,\n prev,\n getCurrentIndex,\n };\n });\n\n const Layouts = React.useMemo<React.FC<{ index: number }>>(() => {\n switch (mode) {\n case 'parallax':\n return ({ index, children }) => (\n <ParallaxLayout\n parallaxScrollingOffset={parallaxScrollingOffset}\n parallaxScrollingScale={parallaxScrollingScale}\n computedAnimResult={computedAnimResult}\n width={width}\n handlerOffsetX={offsetX}\n index={index}\n key={index}\n loop={loop}\n >\n {children}\n </ParallaxLayout>\n );\n default:\n return ({ index, children }) => (\n <CarouselItem\n computedAnimResult={computedAnimResult}\n width={width}\n height={height}\n handlerOffsetX={offsetX}\n index={index}\n key={index}\n loop={loop}\n >\n {children}\n </CarouselItem>\n );\n }\n }, [\n loop,\n mode,\n computedAnimResult,\n height,\n offsetX,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n width,\n ]);\n\n return (\n <PanGestureHandler onHandlerStateChange={animatedListScrollHandler}>\n <Animated.View\n style={[\n // eslint-disable-next-line react-native/no-inline-styles\n {\n width,\n height,\n flexDirection: 'row',\n position: 'relative',\n },\n style,\n ]}\n >\n {data.map((item, index) => {\n return (\n <Layouts index={index} key={index}>\n {renderItem(item, index)}\n </Layouts>\n );\n })}\n </Animated.View>\n </PanGestureHandler>\n );\n}\n\nexport default React.forwardRef(Carousel) as typeof Carousel;\n"]}
1
+ {"version":3,"sources":["Carousel.tsx"],"names":["React","PanGestureHandler","Animated","runOnJS","useAnimatedGestureHandler","useAnimatedReaction","useDerivedValue","useSharedValue","withTiming","CarouselItem","ParallaxLayout","useCarouselController","useComputedAnim","useAutoPlay","useComputedIndex","useLockController","defaultTimingConfig","duration","Carousel","props","ref","height","data","_data","width","loop","mode","renderItem","autoPlay","autoPlayReverse","autoPlayInterval","parallaxScrollingOffset","parallaxScrollingScale","onSnapToItem","style","timingConfig","lockController","handlerOffsetX","useMemo","length","computedAnimResult","carouselController","disable","index","computedIndex","offsetX","x","value","WL","isNaN","i","callComputedIndex","useCallback","next","prev","getCurrentIndex","animatedListScrollHandler","onStart","_","ctx","isLock","startContentOffsetX","currentContentOffsetX","start","onActive","e","translationX","Math","max","min","onEnd","_withTimingCallback","num","isFinished","unLock","lock","abs","velocityX","useImperativeHandle","Layouts","children","flexDirection","position","map","item","forwardRef"],"mappings":"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","sourcesContent":["import React from 'react';\nimport type { FlexStyle, ViewStyle } from 'react-native';\nimport {\n PanGestureHandler,\n PanGestureHandlerGestureEvent,\n} from 'react-native-gesture-handler';\nimport Animated, {\n runOnJS,\n useAnimatedGestureHandler,\n useAnimatedReaction,\n useDerivedValue,\n useSharedValue,\n withTiming,\n} from 'react-native-reanimated';\nimport { CarouselItem } from './CarouselItem';\nimport type { TMode } from './layouts';\nimport { ParallaxLayout } from './layouts/index';\nimport { useCarouselController } from './useCarouselController';\nimport { useComputedAnim } from './useComputedAnim';\nimport { useAutoPlay } from './useAutoPlay';\nimport { useComputedIndex } from './useComputedIndex';\nimport { useLockController } from './useLock';\n\nconst defaultTimingConfig: Animated.WithTimingConfig = {\n duration: 250,\n};\n\nexport interface ICarouselProps<T extends unknown> {\n ref?: React.Ref<ICarouselInstance>;\n /**\n * Carousel loop playback.\n * @default true\n */\n loop?: boolean;\n /**\n * Carousel Animated transitions.\n * @default 'default'\n */\n mode?: TMode;\n /**\n * Render carousel item.\n */\n renderItem: (data: T, index: number) => React.ReactNode;\n /**\n * Specified carousel container width.\n */\n width: number;\n /**\n * Specified carousel container height.\n * @default '100%'\n */\n height?: FlexStyle['height'];\n /**\n * Carousel items data set.\n */\n data: T[];\n /**\n * Auto play\n */\n autoPlay?: boolean;\n /**\n * Auto play\n * @description reverse playback\n */\n autoPlayReverse?: boolean;\n /**\n * Auto play\n * @description playback interval\n */\n autoPlayInterval?: number;\n /**\n * Carousel container style\n */\n style?: ViewStyle;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 100\n */\n parallaxScrollingOffset?: number;\n /**\n * When use 'default' Layout props,this prop can be control prev/next item offset.\n * @default 0.8\n */\n parallaxScrollingScale?: number;\n /**\n * Callback fired when navigating to an item\n */\n onSnapToItem?: (index: number) => void;\n /**\n * Timing config of translation animated\n */\n timingConfig?: Animated.WithTimingConfig;\n}\n\nexport interface ICarouselInstance {\n /**\n * Play the last one\n */\n prev: () => void;\n /**\n * Play the next one\n */\n next: () => void;\n /**\n * Get current item index\n */\n getCurrentIndex: () => number;\n}\n\nfunction Carousel<T extends unknown = any>(\n props: ICarouselProps<T>,\n ref: React.Ref<ICarouselInstance>\n) {\n const {\n height = '100%',\n data: _data = [],\n width,\n loop = true,\n mode = 'default',\n renderItem,\n autoPlay,\n autoPlayReverse,\n autoPlayInterval,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n onSnapToItem,\n style,\n timingConfig = defaultTimingConfig,\n } = props;\n const lockController = useLockController();\n const handlerOffsetX = useSharedValue<number>(0);\n const data = React.useMemo<T[]>(() => {\n if (!loop) return _data;\n\n if (_data.length === 1) {\n return [_data[0], _data[0], _data[0]];\n }\n\n if (_data.length === 2) {\n return [_data[0], _data[1], _data[0], _data[1]];\n }\n\n return _data;\n }, [_data, loop]);\n\n const computedAnimResult = useComputedAnim(width, data.length);\n const carouselController = useCarouselController({\n width,\n handlerOffsetX,\n lockController,\n timingConfig,\n disable: !data.length,\n });\n useAutoPlay({\n autoPlay,\n autoPlayInterval,\n autoPlayReverse,\n carouselController,\n lockController,\n });\n const { index, computedIndex } = useComputedIndex({\n length: data.length,\n handlerOffsetX,\n width,\n });\n\n const offsetX = useDerivedValue(() => {\n const x = handlerOffsetX.value % computedAnimResult.WL;\n return isNaN(x) ? 0 : x;\n }, [computedAnimResult]);\n\n useAnimatedReaction(\n () => index.value,\n (i) => {\n if (loop) {\n switch (_data.length) {\n case 1:\n i = 0;\n break;\n case 2:\n i = i % 2;\n break;\n }\n onSnapToItem && runOnJS(onSnapToItem)(i);\n }\n },\n [onSnapToItem, loop, _data]\n );\n\n const callComputedIndex = React.useCallback(\n () => computedIndex?.(),\n [computedIndex]\n );\n\n const next = React.useCallback(() => {\n return carouselController.next(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const prev = React.useCallback(() => {\n return carouselController.prev(callComputedIndex);\n }, [carouselController, callComputedIndex]);\n\n const getCurrentIndex = React.useCallback(() => {\n return index.value;\n }, [index]);\n\n const animatedListScrollHandler =\n useAnimatedGestureHandler<PanGestureHandlerGestureEvent>(\n {\n onStart: (_, ctx: any) => {\n if (lockController.isLock()) return;\n ctx.startContentOffsetX = handlerOffsetX.value;\n ctx.currentContentOffsetX = handlerOffsetX.value;\n ctx.start = true;\n },\n onActive: (e, ctx: any) => {\n if (lockController.isLock() || !ctx.start) return;\n /**\n * `onActive` and `onEnd` return different values of translationX！So that creates a bias！TAT\n * */\n ctx.translationX = e.translationX;\n if (loop) {\n handlerOffsetX.value =\n ctx.currentContentOffsetX + e.translationX;\n return;\n }\n handlerOffsetX.value = Math.max(\n Math.min(ctx.currentContentOffsetX + e.translationX, 0),\n -(data.length - 1) * width\n );\n },\n onEnd: (e, ctx: any) => {\n if (lockController.isLock() || !ctx.start) return;\n const translationX = ctx.translationX;\n function _withTimingCallback(num: number) {\n return withTiming(num, timingConfig, (isFinished) => {\n if (isFinished) {\n ctx.start = false;\n lockController.unLock();\n runOnJS(callComputedIndex)();\n }\n });\n }\n\n if (translationX > 0) {\n /**\n * If not loop no , longer scroll when sliding to the start.\n * */\n if (!loop && handlerOffsetX.value >= 0) {\n return;\n }\n lockController.lock();\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value + width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n\n if (translationX < 0) {\n /**\n * If not loop , no longer scroll when sliding to the end.\n * */\n if (\n !loop &&\n handlerOffsetX.value <= -(data.length - 1) * width\n ) {\n return;\n }\n lockController.lock();\n if (\n Math.abs(translationX) + Math.abs(e.velocityX) >\n width / 2\n ) {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - width - translationX\n );\n } else {\n handlerOffsetX.value = _withTimingCallback(\n handlerOffsetX.value - translationX\n );\n }\n return;\n }\n },\n },\n [loop, data, lockController]\n );\n\n React.useImperativeHandle(ref, () => {\n return {\n next,\n prev,\n getCurrentIndex,\n };\n });\n\n const Layouts = React.useMemo<React.FC<{ index: number }>>(() => {\n switch (mode) {\n case 'parallax':\n return ({ index: i, children }) => (\n <ParallaxLayout\n parallaxScrollingOffset={parallaxScrollingOffset}\n parallaxScrollingScale={parallaxScrollingScale}\n computedAnimResult={computedAnimResult}\n width={width}\n handlerOffsetX={offsetX}\n index={i}\n key={i}\n loop={loop}\n >\n {children}\n </ParallaxLayout>\n );\n default:\n return ({ index: i, children }) => (\n <CarouselItem\n computedAnimResult={computedAnimResult}\n width={width}\n height={height}\n handlerOffsetX={offsetX}\n index={i}\n key={i}\n loop={loop}\n >\n {children}\n </CarouselItem>\n );\n }\n }, [\n loop,\n mode,\n computedAnimResult,\n height,\n offsetX,\n parallaxScrollingOffset,\n parallaxScrollingScale,\n width,\n ]);\n\n return (\n <PanGestureHandler onHandlerStateChange={animatedListScrollHandler}>\n <Animated.View\n style={[\n // eslint-disable-next-line react-native/no-inline-styles\n {\n width,\n height,\n flexDirection: 'row',\n position: 'relative',\n },\n style,\n ]}\n >\n {data.map((item, i) => {\n return (\n <Layouts index={i} key={i}>\n {renderItem(item, i)}\n </Layouts>\n );\n })}\n </Animated.View>\n </PanGestureHandler>\n );\n}\n\nexport default React.forwardRef(Carousel) as typeof Carousel;\n"]}
package/lib/module/useLock.js CHANGED
@@ -4,6 +4,7 @@ import { useSharedValue } from 'react-native-reanimated';
4
4
  * Cannot operate while animation is locking
5
5
  */
6
6
  export function useLockController() {
7
+ // This value is true if the animation is executing
7
8
  const _lock = useSharedValue(false);
8
9
 
9
10
  function lock() {
package/lib/module/useLock.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["useLock.ts"],"names":["useSharedValue","useLockController","_lock","lock","value","unLock","isLock"],"mappings":"AAAA,SAASA,cAAT,QAA+B,yBAA/B;;AAQA;AACA;AACA;AACA,OAAO,SAASC,iBAAT,GAA8C;AACjD,QAAMC,KAAK,GAAGF,cAAc,CAAU,KAAV,CAA5B;;AACA,WAASG,IAAT,GAAgB;AACZ;;AACAD,IAAAA,KAAK,CAACE,KAAN,GAAc,IAAd;AACH;;AACD,WAASC,MAAT,GAAkB;AACd;;AACAH,IAAAA,KAAK,CAACE,KAAN,GAAc,KAAd;AACH;;AACD,WAASE,MAAT,GAAkB;AACd;;AACA,WAAOJ,KAAK,CAACE,KAAb;AACH;;AACD,SAAO;AACHD,IAAAA,IADG;AAEHE,IAAAA,MAFG;AAGHC,IAAAA;AAHG,GAAP;AAKH","sourcesContent":["import { useSharedValue } from 'react-native-reanimated';\n\nexport interface ILockController {\n lock(): void;\n unLock(): void;\n isLock(): boolean;\n}\n\n/**\n * Cannot operate while animation is locking\n */\nexport function useLockController(): ILockController {\n const _lock = useSharedValue<boolean>(false);\n function lock() {\n 'worklet';\n _lock.value = true;\n }\n function unLock() {\n 'worklet';\n _lock.value = false;\n }\n function isLock() {\n 'worklet';\n return _lock.value;\n }\n return {\n lock,\n unLock,\n isLock,\n };\n}\n"]}
1
+ {"version":3,"sources":["useLock.ts"],"names":["useSharedValue","useLockController","_lock","lock","value","unLock","isLock"],"mappings":"AAAA,SAASA,cAAT,QAA+B,yBAA/B;;AAOA;AACA;AACA;AACA,OAAO,SAASC,iBAAT,GAA8C;AACjD;AACA,QAAMC,KAAK,GAAGF,cAAc,CAAU,KAAV,CAA5B;;AACA,WAASG,IAAT,GAAgB;AACZ;;AACAD,IAAAA,KAAK,CAACE,KAAN,GAAc,IAAd;AACH;;AACD,WAASC,MAAT,GAAkB;AACd;;AACAH,IAAAA,KAAK,CAACE,KAAN,GAAc,KAAd;AACH;;AACD,WAASE,MAAT,GAAkB;AACd;;AACA,WAAOJ,KAAK,CAACE,KAAb;AACH;;AACD,SAAO;AACHD,IAAAA,IADG;AAEHE,IAAAA,MAFG;AAGHC,IAAAA;AAHG,GAAP;AAKH","sourcesContent":["import { useSharedValue } from 'react-native-reanimated';\nexport interface ILockController {\n lock(): void;\n unLock(): void;\n isLock(): boolean;\n}\n\n/**\n * Cannot operate while animation is locking\n */\nexport function useLockController(): ILockController {\n // This value is true if the animation is executing\n const _lock = useSharedValue<boolean>(false);\n function lock() {\n 'worklet';\n _lock.value = true;\n }\n function unLock() {\n 'worklet';\n _lock.value = false;\n }\n function isLock() {\n 'worklet';\n return _lock.value;\n }\n return {\n lock,\n unLock,\n isLock,\n };\n}\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "react-native-reanimated-carousel",
3
- "version": "0.4.3",
3
+ "version": "0.4.4",
4
4
  "description": "Simple carousel component.fully implemented using Reanimated 2.Infinitely scrolling, very smooth.",
5
5
  "main": "lib/commonjs/index",
6
6
  "module": "lib/module/index",
package/src/Carousel.tsx CHANGED
@@ -188,7 +188,7 @@ function Carousel<T extends unknown = any>(
188
188
  );
189
189
 
190
190
  const callComputedIndex = React.useCallback(
191
- (isFinished: boolean) => isFinished && computedIndex?.(),
191
+ () => computedIndex?.(),
192
192
  [computedIndex]
193
193
  );
194
194
 
@@ -211,9 +211,10 @@ function Carousel<T extends unknown = any>(
211
211
  if (lockController.isLock()) return;
212
212
  ctx.startContentOffsetX = handlerOffsetX.value;
213
213
  ctx.currentContentOffsetX = handlerOffsetX.value;
214
+ ctx.start = true;
214
215
  },
215
216
  onActive: (e, ctx: any) => {
216
- if (lockController.isLock()) return;
217
+ if (lockController.isLock() || !ctx.start) return;
217
218
  /**
218
219
  * `onActive` and `onEnd` return different values of translationX！So that creates a bias！TAT
219
220
  * */
@@ -229,16 +230,15 @@ function Carousel<T extends unknown = any>(
229
230
  );
230
231
  },
231
232
  onEnd: (e, ctx: any) => {
232
- if (lockController.isLock()) return;
233
+ if (lockController.isLock() || !ctx.start) return;
233
234
  const translationX = ctx.translationX;
234
-
235
235
  function _withTimingCallback(num: number) {
236
- lockController.lock();
237
236
  return withTiming(num, timingConfig, (isFinished) => {
238
237
  if (isFinished) {
238
+ ctx.start = false;
239
239
  lockController.unLock();
240
+ runOnJS(callComputedIndex)();
240
241
  }
241
- runOnJS(callComputedIndex)(isFinished);
242
242
  });
243
243
  }
244
244
 
@@ -249,7 +249,7 @@ function Carousel<T extends unknown = any>(
249
249
  if (!loop && handlerOffsetX.value >= 0) {
250
250
  return;
251
251
  }
252
-
252
+ lockController.lock();
253
253
  if (
254
254
  Math.abs(translationX) + Math.abs(e.velocityX) >
255
255
  width / 2
@@ -275,7 +275,7 @@ function Carousel<T extends unknown = any>(
275
275
  ) {
276
276
  return;
277
277
  }
278
-
278
+ lockController.lock();
279
279
  if (
280
280
  Math.abs(translationX) + Math.abs(e.velocityX) >
281
281
  width / 2
@@ -306,29 +306,29 @@ function Carousel<T extends unknown = any>(
306
306
  const Layouts = React.useMemo<React.FC<{ index: number }>>(() => {
307
307
  switch (mode) {
308
308
  case 'parallax':
309
- return ({ index, children }) => (
309
+ return ({ index: i, children }) => (
310
310
  <ParallaxLayout
311
311
  parallaxScrollingOffset={parallaxScrollingOffset}
312
312
  parallaxScrollingScale={parallaxScrollingScale}
313
313
  computedAnimResult={computedAnimResult}
314
314
  width={width}
315
315
  handlerOffsetX={offsetX}
316
- index={index}
317
- key={index}
316
+ index={i}
317
+ key={i}
318
318
  loop={loop}
319
319
  >
320
320
  {children}
321
321
  </ParallaxLayout>
322
322
  );
323
323
  default:
324
- return ({ index, children }) => (
324
+ return ({ index: i, children }) => (
325
325
  <CarouselItem
326
326
  computedAnimResult={computedAnimResult}
327
327
  width={width}
328
328
  height={height}
329
329
  handlerOffsetX={offsetX}
330
- index={index}
331
- key={index}
330
+ index={i}
331
+ key={i}
332
332
  loop={loop}
333
333
  >
334
334
  {children}
@@ -360,10 +360,10 @@ function Carousel<T extends unknown = any>(
360
360
  style,
361
361
  ]}
362
362
  >
363
- {data.map((item, index) => {
363
+ {data.map((item, i) => {
364
364
  return (
365
- <Layouts index={index} key={index}>
366
- {renderItem(item, index)}
365
+ <Layouts index={i} key={i}>
366
+ {renderItem(item, i)}
367
367
  </Layouts>
368
368
  );
369
369
  })}
package/src/useLock.ts CHANGED
@@ -1,5 +1,4 @@
1
1
  import { useSharedValue } from 'react-native-reanimated';
2
-
3
2
  export interface ILockController {
4
3
  lock(): void;
5
4
  unLock(): void;
@@ -10,6 +9,7 @@ export interface ILockController {
10
9
  * Cannot operate while animation is locking
11
10
  */
12
11
  export function useLockController(): ILockController {
12
+ // This value is true if the animation is executing
13
13
  const _lock = useSharedValue<boolean>(false);
14
14
  function lock() {
15
15
  'worklet';