@r0b0t3d/react-native-carousel 3.4.3 → 3.4.5

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 (20) hide show
  1. package/lib/commonjs/components/Carousel.js +29 -15
  2. package/lib/commonjs/components/Carousel.js.map +1 -1
  3. package/lib/commonjs/components/PageItem.js +23 -15
  4. package/lib/commonjs/components/PageItem.js.map +1 -1
  5. package/lib/commonjs/components/PaginationIndicator.js +9 -6
  6. package/lib/commonjs/components/PaginationIndicator.js.map +1 -1
  7. package/lib/module/components/Carousel.js +30 -15
  8. package/lib/module/components/Carousel.js.map +1 -1
  9. package/lib/module/components/PageItem.js +23 -14
  10. package/lib/module/components/PageItem.js.map +1 -1
  11. package/lib/module/components/PaginationIndicator.js +9 -6
  12. package/lib/module/components/PaginationIndicator.js.map +1 -1
  13. package/lib/typescript/components/Carousel.d.ts +1 -1
  14. package/lib/typescript/components/PageItem.d.ts +2 -1
  15. package/lib/typescript/types.d.ts +1 -0
  16. package/package.json +2 -2
  17. package/src/components/Carousel.tsx +28 -9
  18. package/src/components/PageItem.tsx +38 -18
  19. package/src/components/PaginationIndicator.tsx +10 -6
  20. package/src/types.ts +1 -0
package/lib/commonjs/components/Carousel.js CHANGED
@@ -29,9 +29,9 @@ function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj;
29
29
 
30
30
  function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
31
31
 
32
- const {
33
- width: wWidth
34
- } = _reactNative.Dimensions.get('screen');
32
+ const getScreenWidth = () => {
33
+ return _reactNative.Dimensions.get('screen').width;
34
+ };
35
35
 
36
36
  function Carousel({
37
37
  style,
@@ -42,8 +42,8 @@ function Carousel({
42
42
  autoPlay = false,
43
43
  duration = 1000,
44
44
  animation,
45
- sliderWidth = wWidth,
46
- itemWidth = wWidth,
45
+ sliderWidth = getScreenWidth(),
46
+ itemWidth = getScreenWidth(),
47
47
  firstItemAlignment = 'center',
48
48
  inactiveOpacity = 1,
49
49
  inactiveScale = 1,
@@ -52,10 +52,11 @@ function Carousel({
52
52
  renderItem,
53
53
  onPageChange,
54
54
  scrollViewProps = {},
55
- keyExtractor
55
+ keyExtractor,
56
+ onItemPress
56
57
  }) {
57
58
  const currentPage = (0, _reactNativeReanimated.useSharedValue)(0);
58
- const animatedScroll = (0, _reactNativeReanimated.useSharedValue)(currentPage.value * sliderWidth);
59
+ const animatedScroll = (0, _reactNativeReanimated.useSharedValue)(0);
59
60
  const freeze = (0, _reactNativeReanimated.useSharedValue)(false);
60
61
  const [isDragging, setDragging] = (0, _react.useState)(false);
61
62
  const expectedPosition = (0, _reactNativeReanimated.useSharedValue)(-1);
@@ -64,6 +65,9 @@ function Carousel({
64
65
  currentPage: animatedPage,
65
66
  totalPage
66
67
  } = (0, _useCarouselContext.useCarouselContext)();
68
+ (0, _react.useEffect)(() => {
69
+ animatedScroll.value = currentPage.value * sliderWidth;
70
+ }, []);
67
71
  const horizontalPadding = (0, _react.useMemo)(() => {
68
72
  const padding = (sliderWidth - itemWidth) / 2;
69
73
  return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;
@@ -274,6 +278,18 @@ function Carousel({
274
278
  paddingRight: spaceBetween / 2
275
279
  };
276
280
  }, [spaceBetween, firstItemAlignment]);
281
+ const handleItemPress = (0, _react.useCallback)((item, index) => () => {
282
+ handleScrollTo(index);
283
+
284
+ if (onItemPress) {
285
+ onItemPress(item, index);
286
+ }
287
+ }, [onItemPress, handlePageChange]);
288
+ const contentContainerStyle = (0, _react.useMemo)(() => {
289
+ return {
290
+ paddingHorizontal: horizontalPadding
291
+ };
292
+ }, [horizontalPadding]);
277
293
 
278
294
  function renderPage(item, i) {
279
295
  return /*#__PURE__*/_react.default.createElement(_PageItem.default, {
@@ -288,15 +304,15 @@ function Carousel({
288
304
  renderItem: renderItem,
289
305
  freeze: freeze,
290
306
  inactiveOpacity: inactiveOpacity,
291
- inactiveScale: inactiveScale
307
+ inactiveScale: inactiveScale,
308
+ onPress: handleItemPress(item, i)
292
309
  });
293
310
  }
294
311
 
295
312
  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
296
313
  style: style
297
- }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.ScrollView, _extends({
298
- ref: scrollViewRef
299
- }, scrollViewProps, {
314
+ }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.ScrollView, _extends({}, scrollViewProps, {
315
+ ref: scrollViewRef,
300
316
  style: styles.container,
301
317
  horizontal: true,
302
318
  disableScrollViewPanResponder: true,
@@ -306,12 +322,10 @@ function Carousel({
306
322
  snapToStart: true,
307
323
  snapToEnd: true,
308
324
  decelerationRate: "fast",
309
- scrollEventThrottle: 16,
325
+ scrollEventThrottle: 4,
310
326
  onScroll: scrollHandler,
311
327
  bounces: false,
312
- contentContainerStyle: {
313
- paddingHorizontal: horizontalPadding
314
- }
328
+ contentContainerStyle: contentContainerStyle
315
329
  }), pageItems.map(renderPage)));
316
330
  }
317
331
 
package/lib/commonjs/components/Carousel.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["Carousel.tsx"],"names":["width","wWidth","Dimensions","get","Carousel","style","data","initialPage","loop","additionalPagesPerSide","autoPlay","duration","animation","sliderWidth","itemWidth","firstItemAlignment","inactiveOpacity","inactiveScale","spaceBetween","spaceHeadTail","renderItem","onPageChange","scrollViewProps","keyExtractor","currentPage","animatedScroll","value","freeze","isDragging","setDragging","expectedPosition","pageMapper","animatedPage","totalPage","horizontalPadding","padding","scrollViewRef","offsets","itemCount","length","pageItems","headItems","slice","tailItems","newItems","i","current","getActualPage","page","getRef","scrollTo","getNode","handleScrollTo","animated","x","y","jumpTo","delay","Platform","OS","setTimeout","goNext","next","goPrev","prev","snapToItem","index","console","error","pageIndex","indices","Object","keys","filter","idx","Number","map","toIndex","setCarouselHandlers","handlePageChange","actualPage","refreshPage","offset","pageNum","beginDrag","endDrag","getItemKey","item","id","scrollHandler","onScroll","event","contentOffset","onBeginDrag","_e","onEndDrag","containerStyle","paddingLeft","paddingRight","renderPage","styles","container","paddingHorizontal","StyleSheet","create","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, {\n useState,\n useRef,\n useEffect,\n useCallback,\n useMemo,\n} from 'react';\nimport { View, Dimensions, StyleSheet, Platform } from 'react-native';\nimport { useInterval } from '@r0b0t3d/react-native-hooks';\nimport Animated, {\n useSharedValue,\n useAnimatedScrollHandler,\n runOnJS,\n useAnimatedRef,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\nimport PageItem from './PageItem';\nimport { findNearestPage, generateOffsets } from '../utils';\nimport { useCarouselContext } from './useCarouselContext';\nimport { useInternalCarouselContext } from './useInternalCarouselContext';\n\nconst { width: wWidth } = Dimensions.get('screen');\n\nfunction Carousel<TData>({\n style,\n data,\n initialPage = 0,\n loop = false,\n additionalPagesPerSide = 2,\n autoPlay = false,\n duration = 1000,\n animation,\n sliderWidth = wWidth,\n itemWidth = wWidth,\n firstItemAlignment = 'center',\n inactiveOpacity = 1,\n inactiveScale = 1,\n spaceBetween = 0,\n spaceHeadTail = 0,\n renderItem,\n onPageChange,\n scrollViewProps = {},\n keyExtractor,\n}: CarouselProps<TData>) {\n const currentPage = useSharedValue(0);\n const animatedScroll = useSharedValue(currentPage.value * sliderWidth);\n const freeze = useSharedValue(false);\n const [isDragging, setDragging] = useState(false);\n const expectedPosition = useSharedValue(-1);\n const pageMapper = useRef<Record<number, number>>({});\n const { currentPage: animatedPage, totalPage } = useCarouselContext();\n\n const horizontalPadding = useMemo(() => {\n const padding = (sliderWidth - itemWidth) / 2;\n return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;\n }, [sliderWidth, itemWidth, firstItemAlignment, loop, spaceHeadTail]);\n\n const scrollViewRef = useAnimatedRef<any>();\n\n const offsets = useMemo(() => {\n return generateOffsets({\n sliderWidth,\n itemWidth,\n itemCount: data.length + (loop ? additionalPagesPerSide * 2 : 0),\n horizontalPadding,\n });\n }, [sliderWidth, itemWidth, data, horizontalPadding]);\n\n const pageItems = useMemo(() => {\n if (!data) {\n return [];\n }\n totalPage.value = data.length;\n if (loop) {\n const headItems = data.slice(\n data.length - additionalPagesPerSide,\n data.length\n );\n const tailItems = data.slice(0, additionalPagesPerSide);\n const newItems = [...headItems, ...data, ...tailItems];\n for (let i = 0; i < newItems.length; i++) {\n pageMapper.current[i] =\n (data.length - additionalPagesPerSide + i) % data.length;\n }\n return newItems;\n } else {\n for (let i = 0; i < data.length; i++) {\n pageMapper.current[i] = i;\n }\n return data;\n }\n }, [data, loop]);\n\n const getActualPage = useCallback((page: number) => {\n return pageMapper.current[page];\n }, []);\n\n const getRef = useCallback(() => {\n if (!scrollViewRef.current) return;\n if (scrollViewRef.current.scrollTo) {\n return scrollViewRef.current;\n }\n return scrollViewRef.current.getNode();\n }, []);\n\n const handleScrollTo = useCallback(\n (page: number, animated = true) => {\n if (getRef()) {\n getRef().scrollTo({ x: offsets[page], y: 0, animated });\n }\n },\n [getRef, offsets]\n );\n\n const jumpTo = useCallback(\n (page: number, delay = 200) => {\n expectedPosition.value = page;\n if (Platform.OS === 'android') {\n freeze.value = true;\n }\n setTimeout(() => {\n animatedScroll.value = offsets[page];\n handleScrollTo(page, false);\n }, delay);\n },\n [handleScrollTo, animatedScroll, freeze]\n );\n\n const goNext = useCallback(() => {\n const next = currentPage.value + 1;\n handleScrollTo(next);\n }, [handleScrollTo]);\n\n const goPrev = useCallback(() => {\n const prev = currentPage.value - 1;\n handleScrollTo(prev);\n }, [handleScrollTo]);\n\n const snapToItem = useCallback(\n (index: number, animated = true) => {\n if (index < 0 || index >= data.length) {\n console.error(`Index not valid ${index}`);\n return;\n }\n let pageIndex = index;\n if (loop) {\n const indices: number[] = Object.keys(pageMapper.current)\n .filter((idx) => pageMapper.current[Number(idx)] === index)\n .map((idx) => Number(idx));\n const toIndex = findNearestPage(currentPage.value, indices, 10);\n pageIndex = indices[toIndex];\n }\n handleScrollTo(pageIndex, animated);\n },\n [handleScrollTo]\n );\n\n const { setCarouselHandlers } = useInternalCarouselContext();\n\n useEffect(() => {\n if (setCarouselHandlers) {\n setCarouselHandlers({\n goNext,\n goPrev,\n snapToItem,\n });\n }\n }, [goNext, goPrev, snapToItem, setCarouselHandlers]);\n\n const handlePageChange = useCallback(\n (page: number) => {\n const actualPage = getActualPage(page);\n animatedPage.value = actualPage;\n if (onPageChange) {\n onPageChange(actualPage);\n }\n if (!loop) return;\n if (page === pageItems.length - 1) {\n jumpTo(additionalPagesPerSide * 2 - 1);\n } else if (page === 0) {\n jumpTo(pageItems.length - additionalPagesPerSide * 2);\n }\n },\n [onPageChange, loop, getActualPage, jumpTo, pageItems]\n );\n\n const refreshPage = useCallback(\n (offset) => {\n 'worklet';\n const pageNum = findNearestPage(offset, offsets, 20); \n if (pageNum === -1) {\n return;\n }\n if (pageNum !== currentPage.value) {\n if (expectedPosition.value === pageNum) {\n freeze.value = false;\n }\n currentPage.value = pageNum;\n runOnJS(handlePageChange)(pageNum);\n }\n },\n [isDragging, offsets, handlePageChange]\n );\n\n useInterval(\n () => {\n goNext();\n },\n !autoPlay || !loop || isDragging ? -1 : duration\n );\n\n useEffect(() => {\n if (initialPage < 0 || initialPage >= data.length) {\n console.error(`Invalid initialPage ${initialPage}`);\n return;\n }\n let pageIndex = initialPage;\n if (loop) {\n pageIndex = initialPage + additionalPagesPerSide;\n }\n if (currentPage.value !== pageIndex) {\n setTimeout(() => {\n handleScrollTo(pageIndex, false);\n freeze.value = false;\n });\n }\n }, []);\n\n const beginDrag = useCallback(() => {\n if (autoPlay) {\n setDragging(true);\n }\n }, [autoPlay]);\n\n const endDrag = useCallback(() => {\n if (autoPlay) {\n setTimeout(() => setDragging(false), 200);\n }\n }, [autoPlay]);\n\n const getItemKey = useCallback(\n (item: TData, index: number): string => {\n if (keyExtractor) {\n return `${keyExtractor(item, index)}-${index}`;\n }\n if ((item as any).id) {\n return `${(item as any).id}-${index}`;\n }\n console.error('You need implement keyExtractor');\n return '';\n },\n [keyExtractor]\n );\n\n const scrollHandler = useAnimatedScrollHandler(\n {\n onScroll: (event) => {\n animatedScroll.value = event.contentOffset.x;\n refreshPage(animatedScroll.value);\n },\n onBeginDrag: (_e) => {\n runOnJS(beginDrag)();\n },\n onEndDrag: (_e) => {\n runOnJS(endDrag)();\n },\n },\n [beginDrag, endDrag, refreshPage]\n );\n\n const containerStyle = useCallback(\n (index: number) => {\n if (firstItemAlignment === 'start') {\n return {\n paddingLeft: index === 0 ? 0 : spaceBetween / 2,\n paddingRight: index === data.length - 1 ? 0 : spaceBetween / 2,\n };\n }\n return {\n paddingLeft: spaceBetween / 2,\n paddingRight: spaceBetween / 2,\n };\n },\n [spaceBetween, firstItemAlignment]\n );\n\n function renderPage(item: TData, i: number) {\n return (\n <PageItem\n key={getItemKey(item, i)}\n containerStyle={containerStyle(i)}\n item={item}\n index={i}\n offset={offsets[i]}\n itemWidth={itemWidth}\n animatedValue={animatedScroll}\n animation={animation}\n renderItem={renderItem}\n freeze={freeze}\n inactiveOpacity={inactiveOpacity}\n inactiveScale={inactiveScale}\n />\n );\n }\n\n return (\n <View style={style}>\n <Animated.ScrollView\n ref={scrollViewRef}\n {...scrollViewProps}\n style={styles.container}\n horizontal\n disableScrollViewPanResponder\n disableIntervalMomentum\n showsHorizontalScrollIndicator={false}\n snapToOffsets={offsets}\n snapToStart\n snapToEnd\n decelerationRate=\"fast\"\n scrollEventThrottle={16}\n onScroll={scrollHandler}\n bounces={false}\n contentContainerStyle={{\n paddingHorizontal: horizontalPadding,\n }}\n >\n {pageItems.map(renderPage)}\n </Animated.ScrollView>\n </View>\n );\n}\n\nexport default Carousel;\n\nconst styles = StyleSheet.create({\n container: { flex: 1 },\n});\n"]}
1
+ {"version":3,"sources":["Carousel.tsx"],"names":["getScreenWidth","Dimensions","get","width","Carousel","style","data","initialPage","loop","additionalPagesPerSide","autoPlay","duration","animation","sliderWidth","itemWidth","firstItemAlignment","inactiveOpacity","inactiveScale","spaceBetween","spaceHeadTail","renderItem","onPageChange","scrollViewProps","keyExtractor","onItemPress","currentPage","animatedScroll","freeze","isDragging","setDragging","expectedPosition","pageMapper","animatedPage","totalPage","value","horizontalPadding","padding","scrollViewRef","offsets","itemCount","length","pageItems","headItems","slice","tailItems","newItems","i","current","getActualPage","page","getRef","scrollTo","getNode","handleScrollTo","animated","x","y","jumpTo","delay","Platform","OS","setTimeout","goNext","next","goPrev","prev","snapToItem","index","console","error","pageIndex","indices","Object","keys","filter","idx","Number","map","toIndex","setCarouselHandlers","handlePageChange","actualPage","refreshPage","offset","pageNum","beginDrag","endDrag","getItemKey","item","id","scrollHandler","onScroll","event","contentOffset","onBeginDrag","_e","onEndDrag","containerStyle","paddingLeft","paddingRight","handleItemPress","contentContainerStyle","paddingHorizontal","renderPage","styles","container","StyleSheet","create","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, {\n useState,\n useRef,\n useEffect,\n useCallback,\n useMemo,\n} from 'react';\nimport { View, Dimensions, StyleSheet, Platform } from 'react-native';\nimport { useInterval } from '@r0b0t3d/react-native-hooks';\nimport Animated, {\n useSharedValue,\n useAnimatedScrollHandler,\n runOnJS,\n useAnimatedRef,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\nimport PageItem from './PageItem';\nimport { findNearestPage, generateOffsets } from '../utils';\nimport { useCarouselContext } from './useCarouselContext';\nimport { useInternalCarouselContext } from './useInternalCarouselContext';\n\nconst getScreenWidth = () => {\n return Dimensions.get('screen').width;\n};\n\nfunction Carousel<TData>({\n style,\n data,\n initialPage = 0,\n loop = false,\n additionalPagesPerSide = 2,\n autoPlay = false,\n duration = 1000,\n animation,\n sliderWidth = getScreenWidth(),\n itemWidth = getScreenWidth(),\n firstItemAlignment = 'center',\n inactiveOpacity = 1,\n inactiveScale = 1,\n spaceBetween = 0,\n spaceHeadTail = 0,\n renderItem,\n onPageChange,\n scrollViewProps = {},\n keyExtractor,\n onItemPress\n}: CarouselProps<TData>) {\n const currentPage = useSharedValue(0);\n const animatedScroll = useSharedValue(0);\n const freeze = useSharedValue(false);\n const [isDragging, setDragging] = useState(false);\n const expectedPosition = useSharedValue(-1);\n const pageMapper = useRef<Record<number, number>>({});\n const { currentPage: animatedPage, totalPage } = useCarouselContext();\n\n useEffect(() => {\n animatedScroll.value = currentPage.value * sliderWidth;\n }, []);\n\n const horizontalPadding = useMemo(() => {\n const padding = (sliderWidth - itemWidth) / 2;\n return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;\n }, [sliderWidth, itemWidth, firstItemAlignment, loop, spaceHeadTail]);\n\n const scrollViewRef = useAnimatedRef<any>();\n\n const offsets = useMemo(() => {\n return generateOffsets({\n sliderWidth,\n itemWidth,\n itemCount: data.length + (loop ? additionalPagesPerSide * 2 : 0),\n horizontalPadding,\n });\n }, [sliderWidth, itemWidth, data, horizontalPadding]);\n\n const pageItems = useMemo(() => {\n if (!data) {\n return [];\n }\n totalPage.value = data.length;\n if (loop) {\n const headItems = data.slice(\n data.length - additionalPagesPerSide,\n data.length\n );\n const tailItems = data.slice(0, additionalPagesPerSide);\n const newItems = [...headItems, ...data, ...tailItems];\n for (let i = 0; i < newItems.length; i++) {\n pageMapper.current[i] =\n (data.length - additionalPagesPerSide + i) % data.length;\n }\n return newItems;\n } else {\n for (let i = 0; i < data.length; i++) {\n pageMapper.current[i] = i;\n }\n return data;\n }\n }, [data, loop]);\n\n const getActualPage = useCallback((page: number) => {\n return pageMapper.current[page];\n }, []);\n\n const getRef = useCallback(() => {\n if (!scrollViewRef.current) return;\n if (scrollViewRef.current.scrollTo) {\n return scrollViewRef.current;\n }\n return scrollViewRef.current.getNode();\n }, []);\n\n const handleScrollTo = useCallback(\n (page: number, animated = true) => {\n if (getRef()) {\n getRef().scrollTo({ x: offsets[page], y: 0, animated });\n }\n },\n [getRef, offsets]\n );\n\n const jumpTo = useCallback(\n (page: number, delay = 200) => {\n expectedPosition.value = page;\n if (Platform.OS === 'android') {\n freeze.value = true;\n }\n setTimeout(() => {\n animatedScroll.value = offsets[page];\n handleScrollTo(page, false);\n }, delay);\n },\n [handleScrollTo, animatedScroll, freeze]\n );\n\n const goNext = useCallback(() => {\n const next = currentPage.value + 1;\n handleScrollTo(next);\n }, [handleScrollTo]);\n\n const goPrev = useCallback(() => {\n const prev = currentPage.value - 1;\n handleScrollTo(prev);\n }, [handleScrollTo]);\n\n const snapToItem = useCallback(\n (index: number, animated = true) => {\n if (index < 0 || index >= data.length) {\n console.error(`Index not valid ${index}`);\n return;\n }\n let pageIndex = index;\n if (loop) {\n const indices: number[] = Object.keys(pageMapper.current)\n .filter((idx) => pageMapper.current[Number(idx)] === index)\n .map((idx) => Number(idx));\n const toIndex = findNearestPage(currentPage.value, indices, 10);\n pageIndex = indices[toIndex];\n }\n handleScrollTo(pageIndex, animated);\n },\n [handleScrollTo]\n );\n\n const { setCarouselHandlers } = useInternalCarouselContext();\n\n useEffect(() => {\n if (setCarouselHandlers) {\n setCarouselHandlers({\n goNext,\n goPrev,\n snapToItem,\n });\n }\n }, [goNext, goPrev, snapToItem, setCarouselHandlers]);\n\n const handlePageChange = useCallback(\n (page: number) => {\n const actualPage = getActualPage(page);\n animatedPage.value = actualPage;\n if (onPageChange) {\n onPageChange(actualPage);\n }\n if (!loop) return;\n if (page === pageItems.length - 1) {\n jumpTo(additionalPagesPerSide * 2 - 1);\n } else if (page === 0) {\n jumpTo(pageItems.length - additionalPagesPerSide * 2);\n }\n },\n [onPageChange, loop, getActualPage, jumpTo, pageItems]\n );\n\n const refreshPage = useCallback(\n (offset) => {\n 'worklet';\n const pageNum = findNearestPage(offset, offsets, 20); \n if (pageNum === -1) {\n return;\n }\n if (pageNum !== currentPage.value) {\n if (expectedPosition.value === pageNum) {\n freeze.value = false;\n }\n currentPage.value = pageNum;\n runOnJS(handlePageChange)(pageNum);\n }\n },\n [isDragging, offsets, handlePageChange]\n );\n\n useInterval(\n () => {\n goNext();\n },\n !autoPlay || !loop || isDragging ? -1 : duration\n );\n\n useEffect(() => {\n if (initialPage < 0 || initialPage >= data.length) {\n console.error(`Invalid initialPage ${initialPage}`);\n return;\n }\n let pageIndex = initialPage;\n if (loop) {\n pageIndex = initialPage + additionalPagesPerSide;\n }\n if (currentPage.value !== pageIndex) {\n setTimeout(() => {\n handleScrollTo(pageIndex, false);\n freeze.value = false;\n });\n }\n }, []);\n\n const beginDrag = useCallback(() => {\n if (autoPlay) {\n setDragging(true);\n }\n }, [autoPlay]);\n\n const endDrag = useCallback(() => {\n if (autoPlay) {\n setTimeout(() => setDragging(false), 200);\n }\n }, [autoPlay]);\n\n const getItemKey = useCallback(\n (item: TData, index: number): string => {\n if (keyExtractor) {\n return `${keyExtractor(item, index)}-${index}`;\n }\n if ((item as any).id) {\n return `${(item as any).id}-${index}`;\n }\n console.error('You need implement keyExtractor');\n return '';\n },\n [keyExtractor]\n );\n\n const scrollHandler = useAnimatedScrollHandler(\n {\n onScroll: (event) => {\n animatedScroll.value = event.contentOffset.x;\n refreshPage(animatedScroll.value);\n },\n onBeginDrag: (_e) => {\n runOnJS(beginDrag)();\n },\n onEndDrag: (_e) => {\n runOnJS(endDrag)();\n },\n },\n [beginDrag, endDrag, refreshPage]\n );\n\n const containerStyle = useCallback(\n (index: number) => {\n if (firstItemAlignment === 'start') {\n return {\n paddingLeft: index === 0 ? 0 : spaceBetween / 2,\n paddingRight: index === data.length - 1 ? 0 : spaceBetween / 2,\n };\n }\n return {\n paddingLeft: spaceBetween / 2,\n paddingRight: spaceBetween / 2,\n };\n },\n [spaceBetween, firstItemAlignment]\n );\n\n const handleItemPress = useCallback((item: TData, index: number) => () => {\n handleScrollTo(index);\n if (onItemPress) {\n onItemPress(item, index);\n }\n }, [onItemPress, handlePageChange]);\n\n const contentContainerStyle = useMemo(() => {\n return {\n paddingHorizontal: horizontalPadding,\n };\n }, [horizontalPadding]);\n\n function renderPage(item: TData, i: number) {\n return (\n <PageItem\n key={getItemKey(item, i)}\n containerStyle={containerStyle(i)}\n item={item}\n index={i}\n offset={offsets[i]}\n itemWidth={itemWidth}\n animatedValue={animatedScroll}\n animation={animation}\n renderItem={renderItem}\n freeze={freeze}\n inactiveOpacity={inactiveOpacity}\n inactiveScale={inactiveScale}\n onPress={handleItemPress(item, i)}\n />\n );\n }\n\n return (\n <View style={style}>\n <Animated.ScrollView\n {...scrollViewProps}\n ref={scrollViewRef}\n style={styles.container}\n horizontal\n disableScrollViewPanResponder\n disableIntervalMomentum\n showsHorizontalScrollIndicator={false}\n snapToOffsets={offsets}\n snapToStart\n snapToEnd\n decelerationRate=\"fast\"\n scrollEventThrottle={4}\n onScroll={scrollHandler}\n bounces={false}\n contentContainerStyle={contentContainerStyle}\n >\n {pageItems.map(renderPage)}\n </Animated.ScrollView>\n </View>\n );\n}\n\nexport default Carousel;\n\nconst styles = StyleSheet.create({\n container: { flex: 1 },\n});\n"]}
package/lib/commonjs/components/PageItem.js CHANGED
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = PageItem;
7
7
 
8
- var _react = _interopRequireDefault(require("react"));
8
+ var _react = _interopRequireWildcard(require("react"));
9
9
 
10
10
  var _reactNative = require("react-native");
11
11
 
@@ -15,8 +15,6 @@ function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return
15
15
 
16
16
  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
17
17
 
18
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
19
-
20
18
  /* eslint-disable @typescript-eslint/ban-ts-comment */
21
19
  function PageItem({
22
20
  item,
@@ -29,7 +27,8 @@ function PageItem({
29
27
  itemWidth,
30
28
  inactiveOpacity,
31
29
  inactiveScale,
32
- containerStyle
30
+ containerStyle,
31
+ onPress
33
32
  }) {
34
33
  const scale = (0, _reactNativeReanimated.useDerivedValue)(() => {
35
34
  const inputRange = [offset - itemWidth, offset, offset + itemWidth];
@@ -78,10 +77,7 @@ function PageItem({
78
77
  if (typeof item === 'object' && item.source) {
79
78
  return /*#__PURE__*/_react.default.createElement(_reactNative.Image, {
80
79
  source: item.source,
81
- style: { ..._reactNative.StyleSheet.absoluteFillObject,
82
- height: undefined,
83
- width: undefined
84
- },
80
+ style: styles.image,
85
81
  resizeMode: "cover"
86
82
  });
87
83
  }
@@ -90,16 +86,28 @@ function PageItem({
90
86
  return null;
91
87
  }
92
88
 
93
- return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
94
- collapsable: false,
95
- style: [{
89
+ const mContainerStyle = (0, _react.useMemo)(() => {
90
+ return [{
96
91
  width: itemWidth,
97
92
  overflow: 'hidden'
98
- }, containerStyle]
93
+ }, containerStyle];
94
+ }, [itemWidth, containerStyle]);
95
+ return /*#__PURE__*/_react.default.createElement(_reactNative.TouchableOpacity, {
96
+ activeOpacity: 0.9,
97
+ style: mContainerStyle,
98
+ onPress: onPress
99
99
  }, /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
100
- style: [{
101
- flex: 1
102
- }, animatedStyle]
100
+ style: [styles.container, animatedStyle]
103
101
  }, renderContent()));
104
102
  }
103
+
104
+ const styles = _reactNative.StyleSheet.create({
105
+ container: {
106
+ flex: 1
107
+ },
108
+ image: { ..._reactNative.StyleSheet.absoluteFillObject,
109
+ height: undefined,
110
+ width: undefined
111
+ }
112
+ });
105
113
  //# sourceMappingURL=PageItem.js.map
package/lib/commonjs/components/PageItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["PageItem.tsx"],"names":["PageItem","item","index","offset","renderItem","animatedValue","animation","freeze","itemWidth","inactiveOpacity","inactiveScale","containerStyle","scale","inputRange","scaleOutputRange","value","translateX","parallaxOutputRange","opacity","opacityOutputRange","animatedStyle","transform","push","renderContent","scrollPosition","source","StyleSheet","absoluteFillObject","height","undefined","width","console","error","overflow","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\n\ntype Props<TData> = {\n item: TData;\n index: number;\n offset: number;\n renderItem: CarouselProps['renderItem'];\n animatedValue: Animated.SharedValue<number>;\n animation?: 'parallax';\n freeze: Animated.SharedValue<boolean>;\n itemWidth: number;\n inactiveOpacity: number;\n inactiveScale: number;\n containerStyle: StyleProp<ViewStyle>;\n};\n\nexport default function PageItem<TData = any>({\n item,\n index,\n offset,\n renderItem,\n animatedValue,\n animation,\n freeze,\n itemWidth,\n inactiveOpacity,\n inactiveScale,\n containerStyle,\n}: Props<TData>) {\n const scale = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const scaleOutputRange = [inactiveScale, 1, inactiveScale];\n return interpolate(animatedValue.value, inputRange, scaleOutputRange);\n }, []);\n\n const translateX = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const parallaxOutputRange = freeze.value\n ? [0, 0, 0]\n : [-itemWidth / 2, 0, itemWidth / 4];\n\n return interpolate(animatedValue.value, inputRange, parallaxOutputRange);\n }, []);\n\n const opacity = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const opacityOutputRange = freeze.value\n ? [1, 1, 1]\n : [inactiveOpacity, 1, inactiveOpacity];\n return interpolate(animatedValue.value, inputRange, opacityOutputRange);\n }, []);\n // @ts-ignore\n const animatedStyle = useAnimatedStyle(() => {\n const transform: ViewStyle['transform'] = [\n {\n scale: scale.value,\n },\n ];\n if (animation === 'parallax') {\n transform.push({\n translateX: translateX.value,\n });\n }\n return {\n opacity: opacity.value,\n transform,\n };\n }, []);\n\n function renderContent() {\n if (renderItem) {\n return renderItem(\n { item, index },\n { scrollPosition: animatedValue, offset }\n );\n }\n if (typeof item === 'object' && (item as any).source) {\n return (\n <Image\n source={(item as any).source}\n style={{\n ...StyleSheet.absoluteFillObject,\n height: undefined,\n width: undefined,\n }}\n resizeMode=\"cover\"\n />\n );\n }\n console.error('You need implement renderItem');\n return null;\n }\n\n return (\n <View\n collapsable={false}\n style={[\n {\n width: itemWidth,\n overflow: 'hidden',\n },\n containerStyle,\n ]}\n >\n <Animated.View style={[{ flex: 1 }, animatedStyle]}>\n {renderContent()}\n </Animated.View>\n </View>\n );\n}\n"]}
1
+ {"version":3,"sources":["PageItem.tsx"],"names":["PageItem","item","index","offset","renderItem","animatedValue","animation","freeze","itemWidth","inactiveOpacity","inactiveScale","containerStyle","onPress","scale","inputRange","scaleOutputRange","value","translateX","parallaxOutputRange","opacity","opacityOutputRange","animatedStyle","transform","push","renderContent","scrollPosition","source","styles","image","console","error","mContainerStyle","width","overflow","container","StyleSheet","create","flex","absoluteFillObject","height","undefined"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useMemo } from 'react';\nimport {\n Image,\n StyleProp,\n StyleSheet,\n TouchableOpacity,\n ViewStyle,\n} from 'react-native';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\n\ntype Props<TData> = {\n item: TData;\n index: number;\n offset: number;\n renderItem: CarouselProps['renderItem'];\n animatedValue: Animated.SharedValue<number>;\n animation?: 'parallax';\n freeze: Animated.SharedValue<boolean>;\n itemWidth: number;\n inactiveOpacity: number;\n inactiveScale: number;\n containerStyle: StyleProp<ViewStyle>;\n onPress: () => void;\n};\n\nexport default function PageItem<TData = any>({\n item,\n index,\n offset,\n renderItem,\n animatedValue,\n animation,\n freeze,\n itemWidth,\n inactiveOpacity,\n inactiveScale,\n containerStyle,\n onPress,\n}: Props<TData>) {\n const scale = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const scaleOutputRange = [inactiveScale, 1, inactiveScale];\n return interpolate(animatedValue.value, inputRange, scaleOutputRange);\n }, []);\n\n const translateX = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const parallaxOutputRange = freeze.value\n ? [0, 0, 0]\n : [-itemWidth / 2, 0, itemWidth / 4];\n\n return interpolate(animatedValue.value, inputRange, parallaxOutputRange);\n }, []);\n\n const opacity = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const opacityOutputRange = freeze.value\n ? [1, 1, 1]\n : [inactiveOpacity, 1, inactiveOpacity];\n return interpolate(animatedValue.value, inputRange, opacityOutputRange);\n }, []);\n // @ts-ignore\n const animatedStyle = useAnimatedStyle(() => {\n const transform: ViewStyle['transform'] = [\n {\n scale: scale.value,\n },\n ];\n if (animation === 'parallax') {\n transform.push({\n translateX: translateX.value,\n });\n }\n return {\n opacity: opacity.value,\n transform,\n };\n }, []);\n\n function renderContent() {\n if (renderItem) {\n return renderItem(\n { item, index },\n { scrollPosition: animatedValue, offset }\n );\n }\n if (typeof item === 'object' && (item as any).source) {\n return (\n <Image\n source={(item as any).source}\n style={styles.image}\n resizeMode=\"cover\"\n />\n );\n }\n console.error('You need implement renderItem');\n return null;\n }\n\n const mContainerStyle: StyleProp<ViewStyle> = useMemo(() => {\n return [\n {\n width: itemWidth,\n overflow: 'hidden',\n },\n containerStyle,\n ];\n }, [itemWidth, containerStyle]);\n\n return (\n <TouchableOpacity\n activeOpacity={0.9}\n style={mContainerStyle}\n onPress={onPress}\n >\n <Animated.View style={[styles.container, animatedStyle]}>\n {renderContent()}\n </Animated.View>\n </TouchableOpacity>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n },\n image: {\n ...StyleSheet.absoluteFillObject,\n height: undefined,\n width: undefined,\n },\n});\n"]}
package/lib/commonjs/components/PaginationIndicator.js CHANGED
@@ -59,6 +59,14 @@ function PaginationIndicator({
59
59
  }]
60
60
  };
61
61
  }, []);
62
+ const dotStyle = (0, _react.useMemo)(() => {
63
+ return {
64
+ width: configs.indicatorSelectedWidth,
65
+ height: configs.indicatorWidth,
66
+ borderRadius: (configs.indicatorWidth || 0) / 2,
67
+ backgroundColor: configs.indicatorSelectedColor
68
+ };
69
+ }, [configs]);
62
70
 
63
71
  function renderItem(pageNumber) {
64
72
  // @ts-ignore
@@ -84,12 +92,7 @@ function PaginationIndicator({
84
92
  return /*#__PURE__*/_react.default.createElement(_reactNative.View, {
85
93
  style: [styles.container, containerStyle]
86
94
  }, [...Array(totalPage.value).keys()].map(renderItem), /*#__PURE__*/_react.default.createElement(_reactNativeReanimated.default.View, {
87
- style: [styles.dotSelectedStyle, {
88
- width: configs.indicatorSelectedWidth,
89
- height: configs.indicatorWidth,
90
- borderRadius: configs.indicatorWidth / 2,
91
- backgroundColor: configs.indicatorSelectedColor
92
- }, activeIndicatorStyle, animatedStyle]
95
+ style: [styles.dotSelectedStyle, dotStyle, activeIndicatorStyle, animatedStyle]
93
96
  }));
94
97
  }
95
98
 
package/lib/commonjs/components/PaginationIndicator.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["PaginationIndicator.tsx"],"names":["defaultIndicatorConfigs","indicatorColor","indicatorWidth","indicatorSelectedColor","indicatorSelectedWidth","spaceBetween","defaultSpringConfig","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","PaginationIndicator","containerStyle","indicatorStyle","activeIndicatorStyle","indicatorConfigs","currentPage","totalPage","configs","translateX","value","animatedStyle","transform","renderItem","pageNumber","width","console","error","styles","container","Array","keys","map","dotSelectedStyle","height","borderRadius","backgroundColor","IndicatorItem","dotContainerStyle","dotContainer","marginEnd","undefined","dotStyle","animatedWidth","aStyle","StyleSheet","create","flexDirection","alignItems","justifyContent","position"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useMemo } from 'react';\nimport { View, StyleSheet, ViewStyle, StyleProp } from 'react-native';\nimport Animated, {\n useAnimatedStyle,\n useDerivedValue,\n withSpring,\n} from 'react-native-reanimated';\nimport type { IndicatorConfigs, PaginationProps } from '../types';\nimport { useCarouselContext } from './useCarouselContext';\n\nconst defaultIndicatorConfigs: IndicatorConfigs = {\n indicatorColor: 'gray',\n indicatorWidth: 6,\n indicatorSelectedColor: 'blue',\n indicatorSelectedWidth: 6,\n spaceBetween: 3,\n};\n\nconst defaultSpringConfig = {\n stiffness: 1000,\n damping: 500,\n mass: 3,\n overshootClamping: true,\n restDisplacementThreshold: 0.01,\n restSpeedThreshold: 0.01,\n};\n\nexport default function PaginationIndicator({\n containerStyle,\n indicatorStyle,\n activeIndicatorStyle,\n indicatorConfigs,\n}: PaginationProps) {\n const { currentPage, totalPage } = useCarouselContext();\n\n const configs = useMemo(() => {\n return {\n ...defaultIndicatorConfigs,\n ...indicatorConfigs,\n };\n }, [indicatorConfigs]);\n\n const translateX = useDerivedValue(() => {\n return withSpring(\n currentPage.value * (configs.indicatorWidth! + configs.spaceBetween!),\n defaultSpringConfig\n );\n }, []);\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n transform: [\n {\n translateX: translateX.value,\n },\n ],\n };\n }, []);\n\n function renderItem(pageNumber: number) {\n // @ts-ignore\n if (activeIndicatorStyle?.width) {\n console.error(\n 'Do not use activeIndicatorStyle: { width }. Please use indicatorConfigs: { indicatorSelectedWidth } instead'\n );\n }\n // @ts-ignore\n if (indicatorStyle?.width) {\n console.error(\n 'Do not use indicatorStyle: { width }. Please use indicatorConfigs: { indicatorWidth } instead'\n );\n }\n return (\n <IndicatorItem\n key={`index${pageNumber}`}\n currentPage={currentPage}\n pageNumber={pageNumber}\n configs={configs}\n indicatorStyle={indicatorStyle}\n activeIndicatorStyle={activeIndicatorStyle}\n />\n );\n }\n\n return (\n <View style={[styles.container, containerStyle]}>\n {[...Array(totalPage.value).keys()].map(renderItem)}\n <Animated.View\n style={[\n styles.dotSelectedStyle,\n {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n borderRadius: configs.indicatorWidth! / 2,\n backgroundColor: configs.indicatorSelectedColor,\n },\n activeIndicatorStyle,\n animatedStyle,\n ]}\n />\n </View>\n );\n}\n\nfunction IndicatorItem({\n currentPage,\n pageNumber,\n configs,\n activeIndicatorStyle,\n indicatorStyle,\n}: {\n currentPage: Animated.SharedValue<number>;\n pageNumber: number;\n configs: IndicatorConfigs;\n activeIndicatorStyle?: StyleProp<ViewStyle>;\n indicatorStyle?: StyleProp<ViewStyle>;\n}) {\n const dotContainerStyle: StyleProp<ViewStyle> = useMemo(()=> [\n styles.dotContainer,\n {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n marginEnd: configs.spaceBetween,\n },\n activeIndicatorStyle,\n {\n // Disable backgroundColor in activeIndicatorStyle\n backgroundColor: undefined,\n },\n ], [activeIndicatorStyle]);\n\n const dotStyle: StyleProp<ViewStyle> = useMemo(() => [\n {\n width: configs.indicatorWidth,\n height: configs.indicatorWidth,\n borderRadius: configs.indicatorWidth! / 2,\n backgroundColor: configs.indicatorColor,\n },\n indicatorStyle,\n ], [indicatorStyle]);\n\n const animatedWidth = useDerivedValue(() => {\n return withSpring(\n currentPage.value === pageNumber\n ? configs.indicatorSelectedWidth!\n : configs.indicatorWidth!,\n defaultSpringConfig\n );\n });\n\n const aStyle = useAnimatedStyle(() => {\n return {\n width: animatedWidth.value,\n };\n }, []);\n\n return (\n <Animated.View style={[dotContainerStyle, aStyle]}>\n <View style={dotStyle} />\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n flexDirection: 'row',\n alignItems: 'center',\n },\n dotContainer: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n dotSelectedStyle: {\n position: 'absolute',\n },\n});"]}
1
+ {"version":3,"sources":["PaginationIndicator.tsx"],"names":["defaultIndicatorConfigs","indicatorColor","indicatorWidth","indicatorSelectedColor","indicatorSelectedWidth","spaceBetween","defaultSpringConfig","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","PaginationIndicator","containerStyle","indicatorStyle","activeIndicatorStyle","indicatorConfigs","currentPage","totalPage","configs","translateX","value","animatedStyle","transform","dotStyle","width","height","borderRadius","backgroundColor","renderItem","pageNumber","console","error","styles","container","Array","keys","map","dotSelectedStyle","IndicatorItem","dotContainerStyle","dotContainer","marginEnd","undefined","animatedWidth","aStyle","StyleSheet","create","flexDirection","alignItems","justifyContent","position"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useMemo } from 'react';\nimport { View, StyleSheet, ViewStyle, StyleProp } from 'react-native';\nimport Animated, {\n useAnimatedStyle,\n useDerivedValue,\n withSpring,\n} from 'react-native-reanimated';\nimport type { IndicatorConfigs, PaginationProps } from '../types';\nimport { useCarouselContext } from './useCarouselContext';\n\nconst defaultIndicatorConfigs: IndicatorConfigs = {\n indicatorColor: 'gray',\n indicatorWidth: 6,\n indicatorSelectedColor: 'blue',\n indicatorSelectedWidth: 6,\n spaceBetween: 3,\n};\n\nconst defaultSpringConfig = {\n stiffness: 1000,\n damping: 500,\n mass: 3,\n overshootClamping: true,\n restDisplacementThreshold: 0.01,\n restSpeedThreshold: 0.01,\n};\n\nexport default function PaginationIndicator({\n containerStyle,\n indicatorStyle,\n activeIndicatorStyle,\n indicatorConfigs,\n}: PaginationProps) {\n const { currentPage, totalPage } = useCarouselContext();\n\n const configs = useMemo(() => {\n return {\n ...defaultIndicatorConfigs,\n ...indicatorConfigs,\n };\n }, [indicatorConfigs]);\n\n const translateX = useDerivedValue(() => {\n return withSpring(\n currentPage.value * (configs.indicatorWidth! + configs.spaceBetween!),\n defaultSpringConfig\n );\n }, []);\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n transform: [\n {\n translateX: translateX.value,\n },\n ],\n };\n }, []);\n\n const dotStyle: StyleProp<ViewStyle> = useMemo(() => {\n return {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n borderRadius: (configs.indicatorWidth || 0) / 2,\n backgroundColor: configs.indicatorSelectedColor,\n };\n }, [configs]);\n\n function renderItem(pageNumber: number) {\n // @ts-ignore\n if (activeIndicatorStyle?.width) {\n console.error(\n 'Do not use activeIndicatorStyle: { width }. Please use indicatorConfigs: { indicatorSelectedWidth } instead'\n );\n }\n // @ts-ignore\n if (indicatorStyle?.width) {\n console.error(\n 'Do not use indicatorStyle: { width }. Please use indicatorConfigs: { indicatorWidth } instead'\n );\n }\n return (\n <IndicatorItem\n key={`index${pageNumber}`}\n currentPage={currentPage}\n pageNumber={pageNumber}\n configs={configs}\n indicatorStyle={indicatorStyle}\n activeIndicatorStyle={activeIndicatorStyle}\n />\n );\n }\n\n return (\n <View style={[styles.container, containerStyle]}>\n {[...Array(totalPage.value).keys()].map(renderItem)}\n <Animated.View\n style={[\n styles.dotSelectedStyle,\n dotStyle,\n activeIndicatorStyle,\n animatedStyle,\n ]}\n />\n </View>\n );\n}\n\nfunction IndicatorItem({\n currentPage,\n pageNumber,\n configs,\n activeIndicatorStyle,\n indicatorStyle,\n}: {\n currentPage: Animated.SharedValue<number>;\n pageNumber: number;\n configs: IndicatorConfigs;\n activeIndicatorStyle?: StyleProp<ViewStyle>;\n indicatorStyle?: StyleProp<ViewStyle>;\n}) {\n const dotContainerStyle: StyleProp<ViewStyle> = useMemo(()=> [\n styles.dotContainer,\n {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n marginEnd: configs.spaceBetween,\n },\n activeIndicatorStyle,\n {\n // Disable backgroundColor in activeIndicatorStyle\n backgroundColor: undefined,\n },\n ], [activeIndicatorStyle]);\n\n const dotStyle: StyleProp<ViewStyle> = useMemo(() => [\n {\n width: configs.indicatorWidth,\n height: configs.indicatorWidth,\n borderRadius: configs.indicatorWidth! / 2,\n backgroundColor: configs.indicatorColor,\n },\n indicatorStyle,\n ], [indicatorStyle]);\n\n const animatedWidth = useDerivedValue(() => {\n return withSpring(\n currentPage.value === pageNumber\n ? configs.indicatorSelectedWidth!\n : configs.indicatorWidth!,\n defaultSpringConfig\n );\n });\n\n const aStyle = useAnimatedStyle(() => {\n return {\n width: animatedWidth.value,\n };\n }, []);\n\n return (\n <Animated.View style={[dotContainerStyle, aStyle]}>\n <View style={dotStyle} />\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n flexDirection: 'row',\n alignItems: 'center',\n },\n dotContainer: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n dotSelectedStyle: {\n position: 'absolute',\n },\n});"]}
package/lib/module/components/Carousel.js CHANGED
@@ -9,9 +9,10 @@ import PageItem from './PageItem';
9
9
  import { findNearestPage, generateOffsets } from '../utils';
10
10
  import { useCarouselContext } from './useCarouselContext';
11
11
  import { useInternalCarouselContext } from './useInternalCarouselContext';
12
- const {
13
- width: wWidth
14
- } = Dimensions.get('screen');
12
+
13
+ const getScreenWidth = () => {
14
+ return Dimensions.get('screen').width;
15
+ };
15
16
 
16
17
  function Carousel({
17
18
  style,
@@ -22,8 +23,8 @@ function Carousel({
22
23
  autoPlay = false,
23
24
  duration = 1000,
24
25
  animation,
25
- sliderWidth = wWidth,
26
- itemWidth = wWidth,
26
+ sliderWidth = getScreenWidth(),
27
+ itemWidth = getScreenWidth(),
27
28
  firstItemAlignment = 'center',
28
29
  inactiveOpacity = 1,
29
30
  inactiveScale = 1,
@@ -32,10 +33,11 @@ function Carousel({
32
33
  renderItem,
33
34
  onPageChange,
34
35
  scrollViewProps = {},
35
- keyExtractor
36
+ keyExtractor,
37
+ onItemPress
36
38
  }) {
37
39
  const currentPage = useSharedValue(0);
38
- const animatedScroll = useSharedValue(currentPage.value * sliderWidth);
40
+ const animatedScroll = useSharedValue(0);
39
41
  const freeze = useSharedValue(false);
40
42
  const [isDragging, setDragging] = useState(false);
41
43
  const expectedPosition = useSharedValue(-1);
@@ -44,6 +46,9 @@ function Carousel({
44
46
  currentPage: animatedPage,
45
47
  totalPage
46
48
  } = useCarouselContext();
49
+ useEffect(() => {
50
+ animatedScroll.value = currentPage.value * sliderWidth;
51
+ }, []);
47
52
  const horizontalPadding = useMemo(() => {
48
53
  const padding = (sliderWidth - itemWidth) / 2;
49
54
  return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;
@@ -254,6 +259,18 @@ function Carousel({
254
259
  paddingRight: spaceBetween / 2
255
260
  };
256
261
  }, [spaceBetween, firstItemAlignment]);
262
+ const handleItemPress = useCallback((item, index) => () => {
263
+ handleScrollTo(index);
264
+
265
+ if (onItemPress) {
266
+ onItemPress(item, index);
267
+ }
268
+ }, [onItemPress, handlePageChange]);
269
+ const contentContainerStyle = useMemo(() => {
270
+ return {
271
+ paddingHorizontal: horizontalPadding
272
+ };
273
+ }, [horizontalPadding]);
257
274
 
258
275
  function renderPage(item, i) {
259
276
  return /*#__PURE__*/React.createElement(PageItem, {
@@ -268,15 +285,15 @@ function Carousel({
268
285
  renderItem: renderItem,
269
286
  freeze: freeze,
270
287
  inactiveOpacity: inactiveOpacity,
271
- inactiveScale: inactiveScale
288
+ inactiveScale: inactiveScale,
289
+ onPress: handleItemPress(item, i)
272
290
  });
273
291
  }
274
292
 
275
293
  return /*#__PURE__*/React.createElement(View, {
276
294
  style: style
277
- }, /*#__PURE__*/React.createElement(Animated.ScrollView, _extends({
278
- ref: scrollViewRef
279
- }, scrollViewProps, {
295
+ }, /*#__PURE__*/React.createElement(Animated.ScrollView, _extends({}, scrollViewProps, {
296
+ ref: scrollViewRef,
280
297
  style: styles.container,
281
298
  horizontal: true,
282
299
  disableScrollViewPanResponder: true,
@@ -286,12 +303,10 @@ function Carousel({
286
303
  snapToStart: true,
287
304
  snapToEnd: true,
288
305
  decelerationRate: "fast",
289
- scrollEventThrottle: 16,
306
+ scrollEventThrottle: 4,
290
307
  onScroll: scrollHandler,
291
308
  bounces: false,
292
- contentContainerStyle: {
293
- paddingHorizontal: horizontalPadding
294
- }
309
+ contentContainerStyle: contentContainerStyle
295
310
  }), pageItems.map(renderPage)));
296
311
  }
297
312
 
package/lib/module/components/Carousel.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["Carousel.tsx"],"names":["React","useState","useRef","useEffect","useCallback","useMemo","View","Dimensions","StyleSheet","Platform","useInterval","Animated","useSharedValue","useAnimatedScrollHandler","runOnJS","useAnimatedRef","PageItem","findNearestPage","generateOffsets","useCarouselContext","useInternalCarouselContext","width","wWidth","get","Carousel","style","data","initialPage","loop","additionalPagesPerSide","autoPlay","duration","animation","sliderWidth","itemWidth","firstItemAlignment","inactiveOpacity","inactiveScale","spaceBetween","spaceHeadTail","renderItem","onPageChange","scrollViewProps","keyExtractor","currentPage","animatedScroll","value","freeze","isDragging","setDragging","expectedPosition","pageMapper","animatedPage","totalPage","horizontalPadding","padding","scrollViewRef","offsets","itemCount","length","pageItems","headItems","slice","tailItems","newItems","i","current","getActualPage","page","getRef","scrollTo","getNode","handleScrollTo","animated","x","y","jumpTo","delay","OS","setTimeout","goNext","next","goPrev","prev","snapToItem","index","console","error","pageIndex","indices","Object","keys","filter","idx","Number","map","toIndex","setCarouselHandlers","handlePageChange","actualPage","refreshPage","offset","pageNum","beginDrag","endDrag","getItemKey","item","id","scrollHandler","onScroll","event","contentOffset","onBeginDrag","_e","onEndDrag","containerStyle","paddingLeft","paddingRight","renderPage","styles","container","paddingHorizontal","create","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, {\n useState,\n useRef,\n useEffect,\n useCallback,\n useMemo,\n} from 'react';\nimport { View, Dimensions, StyleSheet, Platform } from 'react-native';\nimport { useInterval } from '@r0b0t3d/react-native-hooks';\nimport Animated, {\n useSharedValue,\n useAnimatedScrollHandler,\n runOnJS,\n useAnimatedRef,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\nimport PageItem from './PageItem';\nimport { findNearestPage, generateOffsets } from '../utils';\nimport { useCarouselContext } from './useCarouselContext';\nimport { useInternalCarouselContext } from './useInternalCarouselContext';\n\nconst { width: wWidth } = Dimensions.get('screen');\n\nfunction Carousel<TData>({\n style,\n data,\n initialPage = 0,\n loop = false,\n additionalPagesPerSide = 2,\n autoPlay = false,\n duration = 1000,\n animation,\n sliderWidth = wWidth,\n itemWidth = wWidth,\n firstItemAlignment = 'center',\n inactiveOpacity = 1,\n inactiveScale = 1,\n spaceBetween = 0,\n spaceHeadTail = 0,\n renderItem,\n onPageChange,\n scrollViewProps = {},\n keyExtractor,\n}: CarouselProps<TData>) {\n const currentPage = useSharedValue(0);\n const animatedScroll = useSharedValue(currentPage.value * sliderWidth);\n const freeze = useSharedValue(false);\n const [isDragging, setDragging] = useState(false);\n const expectedPosition = useSharedValue(-1);\n const pageMapper = useRef<Record<number, number>>({});\n const { currentPage: animatedPage, totalPage } = useCarouselContext();\n\n const horizontalPadding = useMemo(() => {\n const padding = (sliderWidth - itemWidth) / 2;\n return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;\n }, [sliderWidth, itemWidth, firstItemAlignment, loop, spaceHeadTail]);\n\n const scrollViewRef = useAnimatedRef<any>();\n\n const offsets = useMemo(() => {\n return generateOffsets({\n sliderWidth,\n itemWidth,\n itemCount: data.length + (loop ? additionalPagesPerSide * 2 : 0),\n horizontalPadding,\n });\n }, [sliderWidth, itemWidth, data, horizontalPadding]);\n\n const pageItems = useMemo(() => {\n if (!data) {\n return [];\n }\n totalPage.value = data.length;\n if (loop) {\n const headItems = data.slice(\n data.length - additionalPagesPerSide,\n data.length\n );\n const tailItems = data.slice(0, additionalPagesPerSide);\n const newItems = [...headItems, ...data, ...tailItems];\n for (let i = 0; i < newItems.length; i++) {\n pageMapper.current[i] =\n (data.length - additionalPagesPerSide + i) % data.length;\n }\n return newItems;\n } else {\n for (let i = 0; i < data.length; i++) {\n pageMapper.current[i] = i;\n }\n return data;\n }\n }, [data, loop]);\n\n const getActualPage = useCallback((page: number) => {\n return pageMapper.current[page];\n }, []);\n\n const getRef = useCallback(() => {\n if (!scrollViewRef.current) return;\n if (scrollViewRef.current.scrollTo) {\n return scrollViewRef.current;\n }\n return scrollViewRef.current.getNode();\n }, []);\n\n const handleScrollTo = useCallback(\n (page: number, animated = true) => {\n if (getRef()) {\n getRef().scrollTo({ x: offsets[page], y: 0, animated });\n }\n },\n [getRef, offsets]\n );\n\n const jumpTo = useCallback(\n (page: number, delay = 200) => {\n expectedPosition.value = page;\n if (Platform.OS === 'android') {\n freeze.value = true;\n }\n setTimeout(() => {\n animatedScroll.value = offsets[page];\n handleScrollTo(page, false);\n }, delay);\n },\n [handleScrollTo, animatedScroll, freeze]\n );\n\n const goNext = useCallback(() => {\n const next = currentPage.value + 1;\n handleScrollTo(next);\n }, [handleScrollTo]);\n\n const goPrev = useCallback(() => {\n const prev = currentPage.value - 1;\n handleScrollTo(prev);\n }, [handleScrollTo]);\n\n const snapToItem = useCallback(\n (index: number, animated = true) => {\n if (index < 0 || index >= data.length) {\n console.error(`Index not valid ${index}`);\n return;\n }\n let pageIndex = index;\n if (loop) {\n const indices: number[] = Object.keys(pageMapper.current)\n .filter((idx) => pageMapper.current[Number(idx)] === index)\n .map((idx) => Number(idx));\n const toIndex = findNearestPage(currentPage.value, indices, 10);\n pageIndex = indices[toIndex];\n }\n handleScrollTo(pageIndex, animated);\n },\n [handleScrollTo]\n );\n\n const { setCarouselHandlers } = useInternalCarouselContext();\n\n useEffect(() => {\n if (setCarouselHandlers) {\n setCarouselHandlers({\n goNext,\n goPrev,\n snapToItem,\n });\n }\n }, [goNext, goPrev, snapToItem, setCarouselHandlers]);\n\n const handlePageChange = useCallback(\n (page: number) => {\n const actualPage = getActualPage(page);\n animatedPage.value = actualPage;\n if (onPageChange) {\n onPageChange(actualPage);\n }\n if (!loop) return;\n if (page === pageItems.length - 1) {\n jumpTo(additionalPagesPerSide * 2 - 1);\n } else if (page === 0) {\n jumpTo(pageItems.length - additionalPagesPerSide * 2);\n }\n },\n [onPageChange, loop, getActualPage, jumpTo, pageItems]\n );\n\n const refreshPage = useCallback(\n (offset) => {\n 'worklet';\n const pageNum = findNearestPage(offset, offsets, 20); \n if (pageNum === -1) {\n return;\n }\n if (pageNum !== currentPage.value) {\n if (expectedPosition.value === pageNum) {\n freeze.value = false;\n }\n currentPage.value = pageNum;\n runOnJS(handlePageChange)(pageNum);\n }\n },\n [isDragging, offsets, handlePageChange]\n );\n\n useInterval(\n () => {\n goNext();\n },\n !autoPlay || !loop || isDragging ? -1 : duration\n );\n\n useEffect(() => {\n if (initialPage < 0 || initialPage >= data.length) {\n console.error(`Invalid initialPage ${initialPage}`);\n return;\n }\n let pageIndex = initialPage;\n if (loop) {\n pageIndex = initialPage + additionalPagesPerSide;\n }\n if (currentPage.value !== pageIndex) {\n setTimeout(() => {\n handleScrollTo(pageIndex, false);\n freeze.value = false;\n });\n }\n }, []);\n\n const beginDrag = useCallback(() => {\n if (autoPlay) {\n setDragging(true);\n }\n }, [autoPlay]);\n\n const endDrag = useCallback(() => {\n if (autoPlay) {\n setTimeout(() => setDragging(false), 200);\n }\n }, [autoPlay]);\n\n const getItemKey = useCallback(\n (item: TData, index: number): string => {\n if (keyExtractor) {\n return `${keyExtractor(item, index)}-${index}`;\n }\n if ((item as any).id) {\n return `${(item as any).id}-${index}`;\n }\n console.error('You need implement keyExtractor');\n return '';\n },\n [keyExtractor]\n );\n\n const scrollHandler = useAnimatedScrollHandler(\n {\n onScroll: (event) => {\n animatedScroll.value = event.contentOffset.x;\n refreshPage(animatedScroll.value);\n },\n onBeginDrag: (_e) => {\n runOnJS(beginDrag)();\n },\n onEndDrag: (_e) => {\n runOnJS(endDrag)();\n },\n },\n [beginDrag, endDrag, refreshPage]\n );\n\n const containerStyle = useCallback(\n (index: number) => {\n if (firstItemAlignment === 'start') {\n return {\n paddingLeft: index === 0 ? 0 : spaceBetween / 2,\n paddingRight: index === data.length - 1 ? 0 : spaceBetween / 2,\n };\n }\n return {\n paddingLeft: spaceBetween / 2,\n paddingRight: spaceBetween / 2,\n };\n },\n [spaceBetween, firstItemAlignment]\n );\n\n function renderPage(item: TData, i: number) {\n return (\n <PageItem\n key={getItemKey(item, i)}\n containerStyle={containerStyle(i)}\n item={item}\n index={i}\n offset={offsets[i]}\n itemWidth={itemWidth}\n animatedValue={animatedScroll}\n animation={animation}\n renderItem={renderItem}\n freeze={freeze}\n inactiveOpacity={inactiveOpacity}\n inactiveScale={inactiveScale}\n />\n );\n }\n\n return (\n <View style={style}>\n <Animated.ScrollView\n ref={scrollViewRef}\n {...scrollViewProps}\n style={styles.container}\n horizontal\n disableScrollViewPanResponder\n disableIntervalMomentum\n showsHorizontalScrollIndicator={false}\n snapToOffsets={offsets}\n snapToStart\n snapToEnd\n decelerationRate=\"fast\"\n scrollEventThrottle={16}\n onScroll={scrollHandler}\n bounces={false}\n contentContainerStyle={{\n paddingHorizontal: horizontalPadding,\n }}\n >\n {pageItems.map(renderPage)}\n </Animated.ScrollView>\n </View>\n );\n}\n\nexport default Carousel;\n\nconst styles = StyleSheet.create({\n container: { flex: 1 },\n});\n"]}
1
+ {"version":3,"sources":["Carousel.tsx"],"names":["React","useState","useRef","useEffect","useCallback","useMemo","View","Dimensions","StyleSheet","Platform","useInterval","Animated","useSharedValue","useAnimatedScrollHandler","runOnJS","useAnimatedRef","PageItem","findNearestPage","generateOffsets","useCarouselContext","useInternalCarouselContext","getScreenWidth","get","width","Carousel","style","data","initialPage","loop","additionalPagesPerSide","autoPlay","duration","animation","sliderWidth","itemWidth","firstItemAlignment","inactiveOpacity","inactiveScale","spaceBetween","spaceHeadTail","renderItem","onPageChange","scrollViewProps","keyExtractor","onItemPress","currentPage","animatedScroll","freeze","isDragging","setDragging","expectedPosition","pageMapper","animatedPage","totalPage","value","horizontalPadding","padding","scrollViewRef","offsets","itemCount","length","pageItems","headItems","slice","tailItems","newItems","i","current","getActualPage","page","getRef","scrollTo","getNode","handleScrollTo","animated","x","y","jumpTo","delay","OS","setTimeout","goNext","next","goPrev","prev","snapToItem","index","console","error","pageIndex","indices","Object","keys","filter","idx","Number","map","toIndex","setCarouselHandlers","handlePageChange","actualPage","refreshPage","offset","pageNum","beginDrag","endDrag","getItemKey","item","id","scrollHandler","onScroll","event","contentOffset","onBeginDrag","_e","onEndDrag","containerStyle","paddingLeft","paddingRight","handleItemPress","contentContainerStyle","paddingHorizontal","renderPage","styles","container","create","flex"],"mappings":";;AAAA;AACA,OAAOA,KAAP,IACEC,QADF,EAEEC,MAFF,EAGEC,SAHF,EAIEC,WAJF,EAKEC,OALF,QAMO,OANP;AAOA,SAASC,IAAT,EAAeC,UAAf,EAA2BC,UAA3B,EAAuCC,QAAvC,QAAuD,cAAvD;AACA,SAASC,WAAT,QAA4B,6BAA5B;AACA,OAAOC,QAAP,IACEC,cADF,EAEEC,wBAFF,EAGEC,OAHF,EAIEC,cAJF,QAKO,yBALP;AAOA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAASC,eAAT,EAA0BC,eAA1B,QAAiD,UAAjD;AACA,SAASC,kBAAT,QAAmC,sBAAnC;AACA,SAASC,0BAAT,QAA2C,8BAA3C;;AAEA,MAAMC,cAAc,GAAG,MAAM;AAC3B,SAAOd,UAAU,CAACe,GAAX,CAAe,QAAf,EAAyBC,KAAhC;AACD,CAFD;;AAIA,SAASC,QAAT,CAAyB;AACvBC,EAAAA,KADuB;AAEvBC,EAAAA,IAFuB;AAGvBC,EAAAA,WAAW,GAAG,CAHS;AAIvBC,EAAAA,IAAI,GAAG,KAJgB;AAKvBC,EAAAA,sBAAsB,GAAG,CALF;AAMvBC,EAAAA,QAAQ,GAAG,KANY;AAOvBC,EAAAA,QAAQ,GAAG,IAPY;AAQvBC,EAAAA,SARuB;AASvBC,EAAAA,WAAW,GAAGZ,cAAc,EATL;AAUvBa,EAAAA,SAAS,GAAGb,cAAc,EAVH;AAWvBc,EAAAA,kBAAkB,GAAG,QAXE;AAYvBC,EAAAA,eAAe,GAAG,CAZK;AAavBC,EAAAA,aAAa,GAAG,CAbO;AAcvBC,EAAAA,YAAY,GAAG,CAdQ;AAevBC,EAAAA,aAAa,GAAG,CAfO;AAgBvBC,EAAAA,UAhBuB;AAiBvBC,EAAAA,YAjBuB;AAkBvBC,EAAAA,eAAe,GAAG,EAlBK;AAmBvBC,EAAAA,YAnBuB;AAoBvBC,EAAAA;AApBuB,CAAzB,EAqByB;AACvB,QAAMC,WAAW,GAAGjC,cAAc,CAAC,CAAD,CAAlC;AACA,QAAMkC,cAAc,GAAGlC,cAAc,CAAC,CAAD,CAArC;AACA,QAAMmC,MAAM,GAAGnC,cAAc,CAAC,KAAD,CAA7B;AACA,QAAM,CAACoC,UAAD,EAAaC,WAAb,IAA4BhD,QAAQ,CAAC,KAAD,CAA1C;AACA,QAAMiD,gBAAgB,GAAGtC,cAAc,CAAC,CAAC,CAAF,CAAvC;AACA,QAAMuC,UAAU,GAAGjD,MAAM,CAAyB,EAAzB,CAAzB;AACA,QAAM;AAAE2C,IAAAA,WAAW,EAAEO,YAAf;AAA6BC,IAAAA;AAA7B,MAA2ClC,kBAAkB,EAAnE;AAEAhB,EAAAA,SAAS,CAAC,MAAM;AACd2C,IAAAA,cAAc,CAACQ,KAAf,GAAuBT,WAAW,CAACS,KAAZ,GAAoBrB,WAA3C;AACD,GAFQ,EAEN,EAFM,CAAT;AAIA,QAAMsB,iBAAiB,GAAGlD,OAAO,CAAC,MAAM;AACtC,UAAMmD,OAAO,GAAG,CAACvB,WAAW,GAAGC,SAAf,IAA4B,CAA5C;AACA,WAAOC,kBAAkB,KAAK,QAAvB,IAAmCP,IAAnC,GAA0C4B,OAA1C,GAAoDjB,aAA3D;AACD,GAHgC,EAG9B,CAACN,WAAD,EAAcC,SAAd,EAAyBC,kBAAzB,EAA6CP,IAA7C,EAAmDW,aAAnD,CAH8B,CAAjC;AAKA,QAAMkB,aAAa,GAAG1C,cAAc,EAApC;AAEA,QAAM2C,OAAO,GAAGrD,OAAO,CAAC,MAAM;AAC5B,WAAOa,eAAe,CAAC;AACrBe,MAAAA,WADqB;AAErBC,MAAAA,SAFqB;AAGrByB,MAAAA,SAAS,EAAEjC,IAAI,CAACkC,MAAL,IAAehC,IAAI,GAAGC,sBAAsB,GAAG,CAA5B,GAAgC,CAAnD,CAHU;AAIrB0B,MAAAA;AAJqB,KAAD,CAAtB;AAMD,GAPsB,EAOpB,CAACtB,WAAD,EAAcC,SAAd,EAAyBR,IAAzB,EAA+B6B,iBAA/B,CAPoB,CAAvB;AASA,QAAMM,SAAS,GAAGxD,OAAO,CAAC,MAAM;AAC9B,QAAI,CAACqB,IAAL,EAAW;AACT,aAAO,EAAP;AACD;;AACD2B,IAAAA,SAAS,CAACC,KAAV,GAAkB5B,IAAI,CAACkC,MAAvB;;AACA,QAAIhC,IAAJ,EAAU;AACR,YAAMkC,SAAS,GAAGpC,IAAI,CAACqC,KAAL,CAChBrC,IAAI,CAACkC,MAAL,GAAc/B,sBADE,EAEhBH,IAAI,CAACkC,MAFW,CAAlB;AAIA,YAAMI,SAAS,GAAGtC,IAAI,CAACqC,KAAL,CAAW,CAAX,EAAclC,sBAAd,CAAlB;AACA,YAAMoC,QAAQ,GAAG,CAAC,GAAGH,SAAJ,EAAe,GAAGpC,IAAlB,EAAwB,GAAGsC,SAA3B,CAAjB;;AACA,WAAK,IAAIE,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,QAAQ,CAACL,MAA7B,EAAqCM,CAAC,EAAtC,EAA0C;AACxCf,QAAAA,UAAU,CAACgB,OAAX,CAAmBD,CAAnB,IACE,CAACxC,IAAI,CAACkC,MAAL,GAAc/B,sBAAd,GAAuCqC,CAAxC,IAA6CxC,IAAI,CAACkC,MADpD;AAED;;AACD,aAAOK,QAAP;AACD,KAZD,MAYO;AACL,WAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGxC,IAAI,CAACkC,MAAzB,EAAiCM,CAAC,EAAlC,EAAsC;AACpCf,QAAAA,UAAU,CAACgB,OAAX,CAAmBD,CAAnB,IAAwBA,CAAxB;AACD;;AACD,aAAOxC,IAAP;AACD;AACF,GAvBwB,EAuBtB,CAACA,IAAD,EAAOE,IAAP,CAvBsB,CAAzB;AAyBA,QAAMwC,aAAa,GAAGhE,WAAW,CAAEiE,IAAD,IAAkB;AAClD,WAAOlB,UAAU,CAACgB,OAAX,CAAmBE,IAAnB,CAAP;AACD,GAFgC,EAE9B,EAF8B,CAAjC;AAIA,QAAMC,MAAM,GAAGlE,WAAW,CAAC,MAAM;AAC/B,QAAI,CAACqD,aAAa,CAACU,OAAnB,EAA4B;;AAC5B,QAAIV,aAAa,CAACU,OAAd,CAAsBI,QAA1B,EAAoC;AAClC,aAAOd,aAAa,CAACU,OAArB;AACD;;AACD,WAAOV,aAAa,CAACU,OAAd,CAAsBK,OAAtB,EAAP;AACD,GANyB,EAMvB,EANuB,CAA1B;AAQA,QAAMC,cAAc,GAAGrE,WAAW,CAChC,CAACiE,IAAD,EAAeK,QAAQ,GAAG,IAA1B,KAAmC;AACjC,QAAIJ,MAAM,EAAV,EAAc;AACZA,MAAAA,MAAM,GAAGC,QAAT,CAAkB;AAAEI,QAAAA,CAAC,EAAEjB,OAAO,CAACW,IAAD,CAAZ;AAAoBO,QAAAA,CAAC,EAAE,CAAvB;AAA0BF,QAAAA;AAA1B,OAAlB;AACD;AACF,GAL+B,EAMhC,CAACJ,MAAD,EAASZ,OAAT,CANgC,CAAlC;AASA,QAAMmB,MAAM,GAAGzE,WAAW,CACxB,CAACiE,IAAD,EAAeS,KAAK,GAAG,GAAvB,KAA+B;AAC7B5B,IAAAA,gBAAgB,CAACI,KAAjB,GAAyBe,IAAzB;;AACA,QAAI5D,QAAQ,CAACsE,EAAT,KAAgB,SAApB,EAA+B;AAC7BhC,MAAAA,MAAM,CAACO,KAAP,GAAe,IAAf;AACD;;AACD0B,IAAAA,UAAU,CAAC,MAAM;AACflC,MAAAA,cAAc,CAACQ,KAAf,GAAuBI,OAAO,CAACW,IAAD,CAA9B;AACAI,MAAAA,cAAc,CAACJ,IAAD,EAAO,KAAP,CAAd;AACD,KAHS,EAGPS,KAHO,CAAV;AAID,GAVuB,EAWxB,CAACL,cAAD,EAAiB3B,cAAjB,EAAiCC,MAAjC,CAXwB,CAA1B;AAcA,QAAMkC,MAAM,GAAG7E,WAAW,CAAC,MAAM;AAC/B,UAAM8E,IAAI,GAAGrC,WAAW,CAACS,KAAZ,GAAoB,CAAjC;AACAmB,IAAAA,cAAc,CAACS,IAAD,CAAd;AACD,GAHyB,EAGvB,CAACT,cAAD,CAHuB,CAA1B;AAKA,QAAMU,MAAM,GAAG/E,WAAW,CAAC,MAAM;AAC/B,UAAMgF,IAAI,GAAGvC,WAAW,CAACS,KAAZ,GAAoB,CAAjC;AACAmB,IAAAA,cAAc,CAACW,IAAD,CAAd;AACD,GAHyB,EAGvB,CAACX,cAAD,CAHuB,CAA1B;AAKA,QAAMY,UAAU,GAAGjF,WAAW,CAC5B,CAACkF,KAAD,EAAgBZ,QAAQ,GAAG,IAA3B,KAAoC;AAClC,QAAIY,KAAK,GAAG,CAAR,IAAaA,KAAK,IAAI5D,IAAI,CAACkC,MAA/B,EAAuC;AACrC2B,MAAAA,OAAO,CAACC,KAAR,CAAe,mBAAkBF,KAAM,EAAvC;AACA;AACD;;AACD,QAAIG,SAAS,GAAGH,KAAhB;;AACA,QAAI1D,IAAJ,EAAU;AACR,YAAM8D,OAAiB,GAAGC,MAAM,CAACC,IAAP,CAAYzC,UAAU,CAACgB,OAAvB,EACvB0B,MADuB,CACfC,GAAD,IAAS3C,UAAU,CAACgB,OAAX,CAAmB4B,MAAM,CAACD,GAAD,CAAzB,MAAoCR,KAD7B,EAEvBU,GAFuB,CAElBF,GAAD,IAASC,MAAM,CAACD,GAAD,CAFI,CAA1B;AAGA,YAAMG,OAAO,GAAGhF,eAAe,CAAC4B,WAAW,CAACS,KAAb,EAAoBoC,OAApB,EAA6B,EAA7B,CAA/B;AACAD,MAAAA,SAAS,GAAGC,OAAO,CAACO,OAAD,CAAnB;AACD;;AACDxB,IAAAA,cAAc,CAACgB,SAAD,EAAYf,QAAZ,CAAd;AACD,GAf2B,EAgB5B,CAACD,cAAD,CAhB4B,CAA9B;AAmBA,QAAM;AAAEyB,IAAAA;AAAF,MAA0B9E,0BAA0B,EAA1D;AAEAjB,EAAAA,SAAS,CAAC,MAAM;AACd,QAAI+F,mBAAJ,EAAyB;AACvBA,MAAAA,mBAAmB,CAAC;AAClBjB,QAAAA,MADkB;AAElBE,QAAAA,MAFkB;AAGlBE,QAAAA;AAHkB,OAAD,CAAnB;AAKD;AACF,GARQ,EAQN,CAACJ,MAAD,EAASE,MAAT,EAAiBE,UAAjB,EAA6Ba,mBAA7B,CARM,CAAT;AAUA,QAAMC,gBAAgB,GAAG/F,WAAW,CACjCiE,IAAD,IAAkB;AAChB,UAAM+B,UAAU,GAAGhC,aAAa,CAACC,IAAD,CAAhC;AACAjB,IAAAA,YAAY,CAACE,KAAb,GAAqB8C,UAArB;;AACA,QAAI3D,YAAJ,EAAkB;AAChBA,MAAAA,YAAY,CAAC2D,UAAD,CAAZ;AACD;;AACD,QAAI,CAACxE,IAAL,EAAW;;AACX,QAAIyC,IAAI,KAAKR,SAAS,CAACD,MAAV,GAAmB,CAAhC,EAAmC;AACjCiB,MAAAA,MAAM,CAAChD,sBAAsB,GAAG,CAAzB,GAA6B,CAA9B,CAAN;AACD,KAFD,MAEO,IAAIwC,IAAI,KAAK,CAAb,EAAgB;AACrBQ,MAAAA,MAAM,CAAChB,SAAS,CAACD,MAAV,GAAmB/B,sBAAsB,GAAG,CAA7C,CAAN;AACD;AACF,GAbiC,EAclC,CAACY,YAAD,EAAeb,IAAf,EAAqBwC,aAArB,EAAoCS,MAApC,EAA4ChB,SAA5C,CAdkC,CAApC;AAiBA,QAAMwC,WAAW,GAAGjG,WAAW,CAC5BkG,MAAD,IAAY;AACV;;AACA,UAAMC,OAAO,GAAGtF,eAAe,CAACqF,MAAD,EAAS5C,OAAT,EAAkB,EAAlB,CAA/B;;AACA,QAAI6C,OAAO,KAAK,CAAC,CAAjB,EAAoB;AAClB;AACD;;AACD,QAAIA,OAAO,KAAK1D,WAAW,CAACS,KAA5B,EAAmC;AACjC,UAAIJ,gBAAgB,CAACI,KAAjB,KAA2BiD,OAA/B,EAAwC;AACtCxD,QAAAA,MAAM,CAACO,KAAP,GAAe,KAAf;AACD;;AACDT,MAAAA,WAAW,CAACS,KAAZ,GAAoBiD,OAApB;AACAzF,MAAAA,OAAO,CAACqF,gBAAD,CAAP,CAA0BI,OAA1B;AACD;AACF,GAd4B,EAe7B,CAACvD,UAAD,EAAaU,OAAb,EAAsByC,gBAAtB,CAf6B,CAA/B;AAkBAzF,EAAAA,WAAW,CACT,MAAM;AACJuE,IAAAA,MAAM;AACP,GAHQ,EAIT,CAACnD,QAAD,IAAa,CAACF,IAAd,IAAsBoB,UAAtB,GAAmC,CAAC,CAApC,GAAwCjB,QAJ/B,CAAX;AAOA5B,EAAAA,SAAS,CAAC,MAAM;AACd,QAAIwB,WAAW,GAAG,CAAd,IAAmBA,WAAW,IAAID,IAAI,CAACkC,MAA3C,EAAmD;AACjD2B,MAAAA,OAAO,CAACC,KAAR,CAAe,uBAAsB7D,WAAY,EAAjD;AACA;AACD;;AACD,QAAI8D,SAAS,GAAG9D,WAAhB;;AACA,QAAIC,IAAJ,EAAU;AACR6D,MAAAA,SAAS,GAAG9D,WAAW,GAAGE,sBAA1B;AACD;;AACD,QAAIgB,WAAW,CAACS,KAAZ,KAAsBmC,SAA1B,EAAqC;AACnCT,MAAAA,UAAU,CAAC,MAAM;AACfP,QAAAA,cAAc,CAACgB,SAAD,EAAY,KAAZ,CAAd;AACA1C,QAAAA,MAAM,CAACO,KAAP,GAAe,KAAf;AACD,OAHS,CAAV;AAID;AACF,GAfQ,EAeN,EAfM,CAAT;AAiBA,QAAMkD,SAAS,GAAGpG,WAAW,CAAC,MAAM;AAClC,QAAI0B,QAAJ,EAAc;AACZmB,MAAAA,WAAW,CAAC,IAAD,CAAX;AACD;AACF,GAJ4B,EAI1B,CAACnB,QAAD,CAJ0B,CAA7B;AAMA,QAAM2E,OAAO,GAAGrG,WAAW,CAAC,MAAM;AAChC,QAAI0B,QAAJ,EAAc;AACZkD,MAAAA,UAAU,CAAC,MAAM/B,WAAW,CAAC,KAAD,CAAlB,EAA2B,GAA3B,CAAV;AACD;AACF,GAJ0B,EAIxB,CAACnB,QAAD,CAJwB,CAA3B;AAMA,QAAM4E,UAAU,GAAGtG,WAAW,CAC5B,CAACuG,IAAD,EAAcrB,KAAd,KAAwC;AACtC,QAAI3C,YAAJ,EAAkB;AAChB,aAAQ,GAAEA,YAAY,CAACgE,IAAD,EAAOrB,KAAP,CAAc,IAAGA,KAAM,EAA7C;AACD;;AACD,QAAKqB,IAAD,CAAcC,EAAlB,EAAsB;AACpB,aAAQ,GAAGD,IAAD,CAAcC,EAAG,IAAGtB,KAAM,EAApC;AACD;;AACDC,IAAAA,OAAO,CAACC,KAAR,CAAc,iCAAd;AACA,WAAO,EAAP;AACD,GAV2B,EAW5B,CAAC7C,YAAD,CAX4B,CAA9B;AAcA,QAAMkE,aAAa,GAAGhG,wBAAwB,CAC5C;AACEiG,IAAAA,QAAQ,EAAGC,KAAD,IAAW;AACnBjE,MAAAA,cAAc,CAACQ,KAAf,GAAuByD,KAAK,CAACC,aAAN,CAAoBrC,CAA3C;AACA0B,MAAAA,WAAW,CAACvD,cAAc,CAACQ,KAAhB,CAAX;AACD,KAJH;AAKE2D,IAAAA,WAAW,EAAGC,EAAD,IAAQ;AACnBpG,MAAAA,OAAO,CAAC0F,SAAD,CAAP;AACD,KAPH;AAQEW,IAAAA,SAAS,EAAGD,EAAD,IAAQ;AACjBpG,MAAAA,OAAO,CAAC2F,OAAD,CAAP;AACD;AAVH,GAD4C,EAa5C,CAACD,SAAD,EAAYC,OAAZ,EAAqBJ,WAArB,CAb4C,CAA9C;AAgBA,QAAMe,cAAc,GAAGhH,WAAW,CAC/BkF,KAAD,IAAmB;AACjB,QAAInD,kBAAkB,KAAK,OAA3B,EAAoC;AAClC,aAAO;AACLkF,QAAAA,WAAW,EAAE/B,KAAK,KAAK,CAAV,GAAc,CAAd,GAAkBhD,YAAY,GAAG,CADzC;AAELgF,QAAAA,YAAY,EAAEhC,KAAK,KAAK5D,IAAI,CAACkC,MAAL,GAAc,CAAxB,GAA4B,CAA5B,GAAgCtB,YAAY,GAAG;AAFxD,OAAP;AAID;;AACD,WAAO;AACL+E,MAAAA,WAAW,EAAE/E,YAAY,GAAG,CADvB;AAELgF,MAAAA,YAAY,EAAEhF,YAAY,GAAG;AAFxB,KAAP;AAID,GAZ+B,EAahC,CAACA,YAAD,EAAeH,kBAAf,CAbgC,CAAlC;AAgBA,QAAMoF,eAAe,GAAGnH,WAAW,CAAC,CAACuG,IAAD,EAAcrB,KAAd,KAAgC,MAAM;AACxEb,IAAAA,cAAc,CAACa,KAAD,CAAd;;AACA,QAAI1C,WAAJ,EAAiB;AACfA,MAAAA,WAAW,CAAC+D,IAAD,EAAOrB,KAAP,CAAX;AACD;AACF,GALkC,EAKhC,CAAC1C,WAAD,EAAcuD,gBAAd,CALgC,CAAnC;AAOA,QAAMqB,qBAAqB,GAAGnH,OAAO,CAAC,MAAM;AAC1C,WAAO;AACLoH,MAAAA,iBAAiB,EAAElE;AADd,KAAP;AAGD,GAJoC,EAIlC,CAACA,iBAAD,CAJkC,CAArC;;AAMA,WAASmE,UAAT,CAAoBf,IAApB,EAAiCzC,CAAjC,EAA4C;AAC1C,wBACE,oBAAC,QAAD;AACE,MAAA,GAAG,EAAEwC,UAAU,CAACC,IAAD,EAAOzC,CAAP,CADjB;AAEE,MAAA,cAAc,EAAEkD,cAAc,CAAClD,CAAD,CAFhC;AAGE,MAAA,IAAI,EAAEyC,IAHR;AAIE,MAAA,KAAK,EAAEzC,CAJT;AAKE,MAAA,MAAM,EAAER,OAAO,CAACQ,CAAD,CALjB;AAME,MAAA,SAAS,EAAEhC,SANb;AAOE,MAAA,aAAa,EAAEY,cAPjB;AAQE,MAAA,SAAS,EAAEd,SARb;AASE,MAAA,UAAU,EAAEQ,UATd;AAUE,MAAA,MAAM,EAAEO,MAVV;AAWE,MAAA,eAAe,EAAEX,eAXnB;AAYE,MAAA,aAAa,EAAEC,aAZjB;AAaE,MAAA,OAAO,EAAEkF,eAAe,CAACZ,IAAD,EAAOzC,CAAP;AAb1B,MADF;AAiBD;;AAED,sBACE,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAEzC;AAAb,kBACE,oBAAC,QAAD,CAAU,UAAV,eACMiB,eADN;AAEE,IAAA,GAAG,EAAEe,aAFP;AAGE,IAAA,KAAK,EAAEkE,MAAM,CAACC,SAHhB;AAIE,IAAA,UAAU,MAJZ;AAKE,IAAA,6BAA6B,MAL/B;AAME,IAAA,uBAAuB,MANzB;AAOE,IAAA,8BAA8B,EAAE,KAPlC;AAQE,IAAA,aAAa,EAAElE,OARjB;AASE,IAAA,WAAW,MATb;AAUE,IAAA,SAAS,MAVX;AAWE,IAAA,gBAAgB,EAAC,MAXnB;AAYE,IAAA,mBAAmB,EAAE,CAZvB;AAaE,IAAA,QAAQ,EAAEmD,aAbZ;AAcE,IAAA,OAAO,EAAE,KAdX;AAeE,IAAA,qBAAqB,EAAEW;AAfzB,MAiBG3D,SAAS,CAACmC,GAAV,CAAc0B,UAAd,CAjBH,CADF,CADF;AAuBD;;AAED,eAAelG,QAAf;AAEA,MAAMmG,MAAM,GAAGnH,UAAU,CAACqH,MAAX,CAAkB;AAC/BD,EAAAA,SAAS,EAAE;AAAEE,IAAAA,IAAI,EAAE;AAAR;AADoB,CAAlB,CAAf","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, {\n useState,\n useRef,\n useEffect,\n useCallback,\n useMemo,\n} from 'react';\nimport { View, Dimensions, StyleSheet, Platform } from 'react-native';\nimport { useInterval } from '@r0b0t3d/react-native-hooks';\nimport Animated, {\n useSharedValue,\n useAnimatedScrollHandler,\n runOnJS,\n useAnimatedRef,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\nimport PageItem from './PageItem';\nimport { findNearestPage, generateOffsets } from '../utils';\nimport { useCarouselContext } from './useCarouselContext';\nimport { useInternalCarouselContext } from './useInternalCarouselContext';\n\nconst getScreenWidth = () => {\n return Dimensions.get('screen').width;\n};\n\nfunction Carousel<TData>({\n style,\n data,\n initialPage = 0,\n loop = false,\n additionalPagesPerSide = 2,\n autoPlay = false,\n duration = 1000,\n animation,\n sliderWidth = getScreenWidth(),\n itemWidth = getScreenWidth(),\n firstItemAlignment = 'center',\n inactiveOpacity = 1,\n inactiveScale = 1,\n spaceBetween = 0,\n spaceHeadTail = 0,\n renderItem,\n onPageChange,\n scrollViewProps = {},\n keyExtractor,\n onItemPress\n}: CarouselProps<TData>) {\n const currentPage = useSharedValue(0);\n const animatedScroll = useSharedValue(0);\n const freeze = useSharedValue(false);\n const [isDragging, setDragging] = useState(false);\n const expectedPosition = useSharedValue(-1);\n const pageMapper = useRef<Record<number, number>>({});\n const { currentPage: animatedPage, totalPage } = useCarouselContext();\n\n useEffect(() => {\n animatedScroll.value = currentPage.value * sliderWidth;\n }, []);\n\n const horizontalPadding = useMemo(() => {\n const padding = (sliderWidth - itemWidth) / 2;\n return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;\n }, [sliderWidth, itemWidth, firstItemAlignment, loop, spaceHeadTail]);\n\n const scrollViewRef = useAnimatedRef<any>();\n\n const offsets = useMemo(() => {\n return generateOffsets({\n sliderWidth,\n itemWidth,\n itemCount: data.length + (loop ? additionalPagesPerSide * 2 : 0),\n horizontalPadding,\n });\n }, [sliderWidth, itemWidth, data, horizontalPadding]);\n\n const pageItems = useMemo(() => {\n if (!data) {\n return [];\n }\n totalPage.value = data.length;\n if (loop) {\n const headItems = data.slice(\n data.length - additionalPagesPerSide,\n data.length\n );\n const tailItems = data.slice(0, additionalPagesPerSide);\n const newItems = [...headItems, ...data, ...tailItems];\n for (let i = 0; i < newItems.length; i++) {\n pageMapper.current[i] =\n (data.length - additionalPagesPerSide + i) % data.length;\n }\n return newItems;\n } else {\n for (let i = 0; i < data.length; i++) {\n pageMapper.current[i] = i;\n }\n return data;\n }\n }, [data, loop]);\n\n const getActualPage = useCallback((page: number) => {\n return pageMapper.current[page];\n }, []);\n\n const getRef = useCallback(() => {\n if (!scrollViewRef.current) return;\n if (scrollViewRef.current.scrollTo) {\n return scrollViewRef.current;\n }\n return scrollViewRef.current.getNode();\n }, []);\n\n const handleScrollTo = useCallback(\n (page: number, animated = true) => {\n if (getRef()) {\n getRef().scrollTo({ x: offsets[page], y: 0, animated });\n }\n },\n [getRef, offsets]\n );\n\n const jumpTo = useCallback(\n (page: number, delay = 200) => {\n expectedPosition.value = page;\n if (Platform.OS === 'android') {\n freeze.value = true;\n }\n setTimeout(() => {\n animatedScroll.value = offsets[page];\n handleScrollTo(page, false);\n }, delay);\n },\n [handleScrollTo, animatedScroll, freeze]\n );\n\n const goNext = useCallback(() => {\n const next = currentPage.value + 1;\n handleScrollTo(next);\n }, [handleScrollTo]);\n\n const goPrev = useCallback(() => {\n const prev = currentPage.value - 1;\n handleScrollTo(prev);\n }, [handleScrollTo]);\n\n const snapToItem = useCallback(\n (index: number, animated = true) => {\n if (index < 0 || index >= data.length) {\n console.error(`Index not valid ${index}`);\n return;\n }\n let pageIndex = index;\n if (loop) {\n const indices: number[] = Object.keys(pageMapper.current)\n .filter((idx) => pageMapper.current[Number(idx)] === index)\n .map((idx) => Number(idx));\n const toIndex = findNearestPage(currentPage.value, indices, 10);\n pageIndex = indices[toIndex];\n }\n handleScrollTo(pageIndex, animated);\n },\n [handleScrollTo]\n );\n\n const { setCarouselHandlers } = useInternalCarouselContext();\n\n useEffect(() => {\n if (setCarouselHandlers) {\n setCarouselHandlers({\n goNext,\n goPrev,\n snapToItem,\n });\n }\n }, [goNext, goPrev, snapToItem, setCarouselHandlers]);\n\n const handlePageChange = useCallback(\n (page: number) => {\n const actualPage = getActualPage(page);\n animatedPage.value = actualPage;\n if (onPageChange) {\n onPageChange(actualPage);\n }\n if (!loop) return;\n if (page === pageItems.length - 1) {\n jumpTo(additionalPagesPerSide * 2 - 1);\n } else if (page === 0) {\n jumpTo(pageItems.length - additionalPagesPerSide * 2);\n }\n },\n [onPageChange, loop, getActualPage, jumpTo, pageItems]\n );\n\n const refreshPage = useCallback(\n (offset) => {\n 'worklet';\n const pageNum = findNearestPage(offset, offsets, 20); \n if (pageNum === -1) {\n return;\n }\n if (pageNum !== currentPage.value) {\n if (expectedPosition.value === pageNum) {\n freeze.value = false;\n }\n currentPage.value = pageNum;\n runOnJS(handlePageChange)(pageNum);\n }\n },\n [isDragging, offsets, handlePageChange]\n );\n\n useInterval(\n () => {\n goNext();\n },\n !autoPlay || !loop || isDragging ? -1 : duration\n );\n\n useEffect(() => {\n if (initialPage < 0 || initialPage >= data.length) {\n console.error(`Invalid initialPage ${initialPage}`);\n return;\n }\n let pageIndex = initialPage;\n if (loop) {\n pageIndex = initialPage + additionalPagesPerSide;\n }\n if (currentPage.value !== pageIndex) {\n setTimeout(() => {\n handleScrollTo(pageIndex, false);\n freeze.value = false;\n });\n }\n }, []);\n\n const beginDrag = useCallback(() => {\n if (autoPlay) {\n setDragging(true);\n }\n }, [autoPlay]);\n\n const endDrag = useCallback(() => {\n if (autoPlay) {\n setTimeout(() => setDragging(false), 200);\n }\n }, [autoPlay]);\n\n const getItemKey = useCallback(\n (item: TData, index: number): string => {\n if (keyExtractor) {\n return `${keyExtractor(item, index)}-${index}`;\n }\n if ((item as any).id) {\n return `${(item as any).id}-${index}`;\n }\n console.error('You need implement keyExtractor');\n return '';\n },\n [keyExtractor]\n );\n\n const scrollHandler = useAnimatedScrollHandler(\n {\n onScroll: (event) => {\n animatedScroll.value = event.contentOffset.x;\n refreshPage(animatedScroll.value);\n },\n onBeginDrag: (_e) => {\n runOnJS(beginDrag)();\n },\n onEndDrag: (_e) => {\n runOnJS(endDrag)();\n },\n },\n [beginDrag, endDrag, refreshPage]\n );\n\n const containerStyle = useCallback(\n (index: number) => {\n if (firstItemAlignment === 'start') {\n return {\n paddingLeft: index === 0 ? 0 : spaceBetween / 2,\n paddingRight: index === data.length - 1 ? 0 : spaceBetween / 2,\n };\n }\n return {\n paddingLeft: spaceBetween / 2,\n paddingRight: spaceBetween / 2,\n };\n },\n [spaceBetween, firstItemAlignment]\n );\n\n const handleItemPress = useCallback((item: TData, index: number) => () => {\n handleScrollTo(index);\n if (onItemPress) {\n onItemPress(item, index);\n }\n }, [onItemPress, handlePageChange]);\n\n const contentContainerStyle = useMemo(() => {\n return {\n paddingHorizontal: horizontalPadding,\n };\n }, [horizontalPadding]);\n\n function renderPage(item: TData, i: number) {\n return (\n <PageItem\n key={getItemKey(item, i)}\n containerStyle={containerStyle(i)}\n item={item}\n index={i}\n offset={offsets[i]}\n itemWidth={itemWidth}\n animatedValue={animatedScroll}\n animation={animation}\n renderItem={renderItem}\n freeze={freeze}\n inactiveOpacity={inactiveOpacity}\n inactiveScale={inactiveScale}\n onPress={handleItemPress(item, i)}\n />\n );\n }\n\n return (\n <View style={style}>\n <Animated.ScrollView\n {...scrollViewProps}\n ref={scrollViewRef}\n style={styles.container}\n horizontal\n disableScrollViewPanResponder\n disableIntervalMomentum\n showsHorizontalScrollIndicator={false}\n snapToOffsets={offsets}\n snapToStart\n snapToEnd\n decelerationRate=\"fast\"\n scrollEventThrottle={4}\n onScroll={scrollHandler}\n bounces={false}\n contentContainerStyle={contentContainerStyle}\n >\n {pageItems.map(renderPage)}\n </Animated.ScrollView>\n </View>\n );\n}\n\nexport default Carousel;\n\nconst styles = StyleSheet.create({\n container: { flex: 1 },\n});\n"]}
package/lib/module/components/PageItem.js CHANGED
@@ -1,6 +1,6 @@
1
1
  /* eslint-disable @typescript-eslint/ban-ts-comment */
2
- import React from 'react';
3
- import { Image, StyleSheet, View } from 'react-native';
2
+ import React, { useMemo } from 'react';
3
+ import { Image, StyleSheet, TouchableOpacity } from 'react-native';
4
4
  import Animated, { interpolate, useAnimatedStyle, useDerivedValue } from 'react-native-reanimated';
5
5
  export default function PageItem({
6
6
  item,
@@ -13,7 +13,8 @@ export default function PageItem({
13
13
  itemWidth,
14
14
  inactiveOpacity,
15
15
  inactiveScale,
16
- containerStyle
16
+ containerStyle,
17
+ onPress
17
18
  }) {
18
19
  const scale = useDerivedValue(() => {
19
20
  const inputRange = [offset - itemWidth, offset, offset + itemWidth];
@@ -62,10 +63,7 @@ export default function PageItem({
62
63
  if (typeof item === 'object' && item.source) {
63
64
  return /*#__PURE__*/React.createElement(Image, {
64
65
  source: item.source,
65
- style: { ...StyleSheet.absoluteFillObject,
66
- height: undefined,
67
- width: undefined
68
- },
66
+ style: styles.image,
69
67
  resizeMode: "cover"
70
68
  });
71
69
  }
@@ -74,16 +72,27 @@ export default function PageItem({
74
72
  return null;
75
73
  }
76
74
 
77
- return /*#__PURE__*/React.createElement(View, {
78
- collapsable: false,
79
- style: [{
75
+ const mContainerStyle = useMemo(() => {
76
+ return [{
80
77
  width: itemWidth,
81
78
  overflow: 'hidden'
82
- }, containerStyle]
79
+ }, containerStyle];
80
+ }, [itemWidth, containerStyle]);
81
+ return /*#__PURE__*/React.createElement(TouchableOpacity, {
82
+ activeOpacity: 0.9,
83
+ style: mContainerStyle,
84
+ onPress: onPress
83
85
  }, /*#__PURE__*/React.createElement(Animated.View, {
84
- style: [{
85
- flex: 1
86
- }, animatedStyle]
86
+ style: [styles.container, animatedStyle]
87
87
  }, renderContent()));
88
88
  }
89
+ const styles = StyleSheet.create({
90
+ container: {
91
+ flex: 1
92
+ },
93
+ image: { ...StyleSheet.absoluteFillObject,
94
+ height: undefined,
95
+ width: undefined
96
+ }
97
+ });
89
98
  //# sourceMappingURL=PageItem.js.map
package/lib/module/components/PageItem.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["PageItem.tsx"],"names":["React","Image","StyleSheet","View","Animated","interpolate","useAnimatedStyle","useDerivedValue","PageItem","item","index","offset","renderItem","animatedValue","animation","freeze","itemWidth","inactiveOpacity","inactiveScale","containerStyle","scale","inputRange","scaleOutputRange","value","translateX","parallaxOutputRange","opacity","opacityOutputRange","animatedStyle","transform","push","renderContent","scrollPosition","source","absoluteFillObject","height","undefined","width","console","error","overflow","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\n\ntype Props<TData> = {\n item: TData;\n index: number;\n offset: number;\n renderItem: CarouselProps['renderItem'];\n animatedValue: Animated.SharedValue<number>;\n animation?: 'parallax';\n freeze: Animated.SharedValue<boolean>;\n itemWidth: number;\n inactiveOpacity: number;\n inactiveScale: number;\n containerStyle: StyleProp<ViewStyle>;\n};\n\nexport default function PageItem<TData = any>({\n item,\n index,\n offset,\n renderItem,\n animatedValue,\n animation,\n freeze,\n itemWidth,\n inactiveOpacity,\n inactiveScale,\n containerStyle,\n}: Props<TData>) {\n const scale = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const scaleOutputRange = [inactiveScale, 1, inactiveScale];\n return interpolate(animatedValue.value, inputRange, scaleOutputRange);\n }, []);\n\n const translateX = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const parallaxOutputRange = freeze.value\n ? [0, 0, 0]\n : [-itemWidth / 2, 0, itemWidth / 4];\n\n return interpolate(animatedValue.value, inputRange, parallaxOutputRange);\n }, []);\n\n const opacity = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const opacityOutputRange = freeze.value\n ? [1, 1, 1]\n : [inactiveOpacity, 1, inactiveOpacity];\n return interpolate(animatedValue.value, inputRange, opacityOutputRange);\n }, []);\n // @ts-ignore\n const animatedStyle = useAnimatedStyle(() => {\n const transform: ViewStyle['transform'] = [\n {\n scale: scale.value,\n },\n ];\n if (animation === 'parallax') {\n transform.push({\n translateX: translateX.value,\n });\n }\n return {\n opacity: opacity.value,\n transform,\n };\n }, []);\n\n function renderContent() {\n if (renderItem) {\n return renderItem(\n { item, index },\n { scrollPosition: animatedValue, offset }\n );\n }\n if (typeof item === 'object' && (item as any).source) {\n return (\n <Image\n source={(item as any).source}\n style={{\n ...StyleSheet.absoluteFillObject,\n height: undefined,\n width: undefined,\n }}\n resizeMode=\"cover\"\n />\n );\n }\n console.error('You need implement renderItem');\n return null;\n }\n\n return (\n <View\n collapsable={false}\n style={[\n {\n width: itemWidth,\n overflow: 'hidden',\n },\n containerStyle,\n ]}\n >\n <Animated.View style={[{ flex: 1 }, animatedStyle]}>\n {renderContent()}\n </Animated.View>\n </View>\n );\n}\n"]}
1
+ {"version":3,"sources":["PageItem.tsx"],"names":["React","useMemo","Image","StyleSheet","TouchableOpacity","Animated","interpolate","useAnimatedStyle","useDerivedValue","PageItem","item","index","offset","renderItem","animatedValue","animation","freeze","itemWidth","inactiveOpacity","inactiveScale","containerStyle","onPress","scale","inputRange","scaleOutputRange","value","translateX","parallaxOutputRange","opacity","opacityOutputRange","animatedStyle","transform","push","renderContent","scrollPosition","source","styles","image","console","error","mContainerStyle","width","overflow","container","create","flex","absoluteFillObject","height","undefined"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useMemo } from 'react';\nimport {\n Image,\n StyleProp,\n StyleSheet,\n TouchableOpacity,\n ViewStyle,\n} from 'react-native';\nimport Animated, {\n interpolate,\n useAnimatedStyle,\n useDerivedValue,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\n\ntype Props<TData> = {\n item: TData;\n index: number;\n offset: number;\n renderItem: CarouselProps['renderItem'];\n animatedValue: Animated.SharedValue<number>;\n animation?: 'parallax';\n freeze: Animated.SharedValue<boolean>;\n itemWidth: number;\n inactiveOpacity: number;\n inactiveScale: number;\n containerStyle: StyleProp<ViewStyle>;\n onPress: () => void;\n};\n\nexport default function PageItem<TData = any>({\n item,\n index,\n offset,\n renderItem,\n animatedValue,\n animation,\n freeze,\n itemWidth,\n inactiveOpacity,\n inactiveScale,\n containerStyle,\n onPress,\n}: Props<TData>) {\n const scale = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const scaleOutputRange = [inactiveScale, 1, inactiveScale];\n return interpolate(animatedValue.value, inputRange, scaleOutputRange);\n }, []);\n\n const translateX = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const parallaxOutputRange = freeze.value\n ? [0, 0, 0]\n : [-itemWidth / 2, 0, itemWidth / 4];\n\n return interpolate(animatedValue.value, inputRange, parallaxOutputRange);\n }, []);\n\n const opacity = useDerivedValue(() => {\n const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n const opacityOutputRange = freeze.value\n ? [1, 1, 1]\n : [inactiveOpacity, 1, inactiveOpacity];\n return interpolate(animatedValue.value, inputRange, opacityOutputRange);\n }, []);\n // @ts-ignore\n const animatedStyle = useAnimatedStyle(() => {\n const transform: ViewStyle['transform'] = [\n {\n scale: scale.value,\n },\n ];\n if (animation === 'parallax') {\n transform.push({\n translateX: translateX.value,\n });\n }\n return {\n opacity: opacity.value,\n transform,\n };\n }, []);\n\n function renderContent() {\n if (renderItem) {\n return renderItem(\n { item, index },\n { scrollPosition: animatedValue, offset }\n );\n }\n if (typeof item === 'object' && (item as any).source) {\n return (\n <Image\n source={(item as any).source}\n style={styles.image}\n resizeMode=\"cover\"\n />\n );\n }\n console.error('You need implement renderItem');\n return null;\n }\n\n const mContainerStyle: StyleProp<ViewStyle> = useMemo(() => {\n return [\n {\n width: itemWidth,\n overflow: 'hidden',\n },\n containerStyle,\n ];\n }, [itemWidth, containerStyle]);\n\n return (\n <TouchableOpacity\n activeOpacity={0.9}\n style={mContainerStyle}\n onPress={onPress}\n >\n <Animated.View style={[styles.container, animatedStyle]}>\n {renderContent()}\n </Animated.View>\n </TouchableOpacity>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n flex: 1,\n },\n image: {\n ...StyleSheet.absoluteFillObject,\n height: undefined,\n width: undefined,\n },\n});\n"]}
package/lib/module/components/PaginationIndicator.js CHANGED
@@ -43,6 +43,14 @@ export default function PaginationIndicator({
43
43
  }]
44
44
  };
45
45
  }, []);
46
+ const dotStyle = useMemo(() => {
47
+ return {
48
+ width: configs.indicatorSelectedWidth,
49
+ height: configs.indicatorWidth,
50
+ borderRadius: (configs.indicatorWidth || 0) / 2,
51
+ backgroundColor: configs.indicatorSelectedColor
52
+ };
53
+ }, [configs]);
46
54
 
47
55
  function renderItem(pageNumber) {
48
56
  // @ts-ignore
@@ -68,12 +76,7 @@ export default function PaginationIndicator({
68
76
  return /*#__PURE__*/React.createElement(View, {
69
77
  style: [styles.container, containerStyle]
70
78
  }, [...Array(totalPage.value).keys()].map(renderItem), /*#__PURE__*/React.createElement(Animated.View, {
71
- style: [styles.dotSelectedStyle, {
72
- width: configs.indicatorSelectedWidth,
73
- height: configs.indicatorWidth,
74
- borderRadius: configs.indicatorWidth / 2,
75
- backgroundColor: configs.indicatorSelectedColor
76
- }, activeIndicatorStyle, animatedStyle]
79
+ style: [styles.dotSelectedStyle, dotStyle, activeIndicatorStyle, animatedStyle]
77
80
  }));
78
81
  }
79
82
 
package/lib/module/components/PaginationIndicator.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["PaginationIndicator.tsx"],"names":["React","useMemo","View","StyleSheet","Animated","useAnimatedStyle","useDerivedValue","withSpring","useCarouselContext","defaultIndicatorConfigs","indicatorColor","indicatorWidth","indicatorSelectedColor","indicatorSelectedWidth","spaceBetween","defaultSpringConfig","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","PaginationIndicator","containerStyle","indicatorStyle","activeIndicatorStyle","indicatorConfigs","currentPage","totalPage","configs","translateX","value","animatedStyle","transform","renderItem","pageNumber","width","console","error","styles","container","Array","keys","map","dotSelectedStyle","height","borderRadius","backgroundColor","IndicatorItem","dotContainerStyle","dotContainer","marginEnd","undefined","dotStyle","animatedWidth","aStyle","create","flexDirection","alignItems","justifyContent","position"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useMemo } from 'react';\nimport { View, StyleSheet, ViewStyle, StyleProp } from 'react-native';\nimport Animated, {\n useAnimatedStyle,\n useDerivedValue,\n withSpring,\n} from 'react-native-reanimated';\nimport type { IndicatorConfigs, PaginationProps } from '../types';\nimport { useCarouselContext } from './useCarouselContext';\n\nconst defaultIndicatorConfigs: IndicatorConfigs = {\n indicatorColor: 'gray',\n indicatorWidth: 6,\n indicatorSelectedColor: 'blue',\n indicatorSelectedWidth: 6,\n spaceBetween: 3,\n};\n\nconst defaultSpringConfig = {\n stiffness: 1000,\n damping: 500,\n mass: 3,\n overshootClamping: true,\n restDisplacementThreshold: 0.01,\n restSpeedThreshold: 0.01,\n};\n\nexport default function PaginationIndicator({\n containerStyle,\n indicatorStyle,\n activeIndicatorStyle,\n indicatorConfigs,\n}: PaginationProps) {\n const { currentPage, totalPage } = useCarouselContext();\n\n const configs = useMemo(() => {\n return {\n ...defaultIndicatorConfigs,\n ...indicatorConfigs,\n };\n }, [indicatorConfigs]);\n\n const translateX = useDerivedValue(() => {\n return withSpring(\n currentPage.value * (configs.indicatorWidth! + configs.spaceBetween!),\n defaultSpringConfig\n );\n }, []);\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n transform: [\n {\n translateX: translateX.value,\n },\n ],\n };\n }, []);\n\n function renderItem(pageNumber: number) {\n // @ts-ignore\n if (activeIndicatorStyle?.width) {\n console.error(\n 'Do not use activeIndicatorStyle: { width }. Please use indicatorConfigs: { indicatorSelectedWidth } instead'\n );\n }\n // @ts-ignore\n if (indicatorStyle?.width) {\n console.error(\n 'Do not use indicatorStyle: { width }. Please use indicatorConfigs: { indicatorWidth } instead'\n );\n }\n return (\n <IndicatorItem\n key={`index${pageNumber}`}\n currentPage={currentPage}\n pageNumber={pageNumber}\n configs={configs}\n indicatorStyle={indicatorStyle}\n activeIndicatorStyle={activeIndicatorStyle}\n />\n );\n }\n\n return (\n <View style={[styles.container, containerStyle]}>\n {[...Array(totalPage.value).keys()].map(renderItem)}\n <Animated.View\n style={[\n styles.dotSelectedStyle,\n {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n borderRadius: configs.indicatorWidth! / 2,\n backgroundColor: configs.indicatorSelectedColor,\n },\n activeIndicatorStyle,\n animatedStyle,\n ]}\n />\n </View>\n );\n}\n\nfunction IndicatorItem({\n currentPage,\n pageNumber,\n configs,\n activeIndicatorStyle,\n indicatorStyle,\n}: {\n currentPage: Animated.SharedValue<number>;\n pageNumber: number;\n configs: IndicatorConfigs;\n activeIndicatorStyle?: StyleProp<ViewStyle>;\n indicatorStyle?: StyleProp<ViewStyle>;\n}) {\n const dotContainerStyle: StyleProp<ViewStyle> = useMemo(()=> [\n styles.dotContainer,\n {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n marginEnd: configs.spaceBetween,\n },\n activeIndicatorStyle,\n {\n // Disable backgroundColor in activeIndicatorStyle\n backgroundColor: undefined,\n },\n ], [activeIndicatorStyle]);\n\n const dotStyle: StyleProp<ViewStyle> = useMemo(() => [\n {\n width: configs.indicatorWidth,\n height: configs.indicatorWidth,\n borderRadius: configs.indicatorWidth! / 2,\n backgroundColor: configs.indicatorColor,\n },\n indicatorStyle,\n ], [indicatorStyle]);\n\n const animatedWidth = useDerivedValue(() => {\n return withSpring(\n currentPage.value === pageNumber\n ? configs.indicatorSelectedWidth!\n : configs.indicatorWidth!,\n defaultSpringConfig\n );\n });\n\n const aStyle = useAnimatedStyle(() => {\n return {\n width: animatedWidth.value,\n };\n }, []);\n\n return (\n <Animated.View style={[dotContainerStyle, aStyle]}>\n <View style={dotStyle} />\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n flexDirection: 'row',\n alignItems: 'center',\n },\n dotContainer: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n dotSelectedStyle: {\n position: 'absolute',\n },\n});"]}
1
+ {"version":3,"sources":["PaginationIndicator.tsx"],"names":["React","useMemo","View","StyleSheet","Animated","useAnimatedStyle","useDerivedValue","withSpring","useCarouselContext","defaultIndicatorConfigs","indicatorColor","indicatorWidth","indicatorSelectedColor","indicatorSelectedWidth","spaceBetween","defaultSpringConfig","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","PaginationIndicator","containerStyle","indicatorStyle","activeIndicatorStyle","indicatorConfigs","currentPage","totalPage","configs","translateX","value","animatedStyle","transform","dotStyle","width","height","borderRadius","backgroundColor","renderItem","pageNumber","console","error","styles","container","Array","keys","map","dotSelectedStyle","IndicatorItem","dotContainerStyle","dotContainer","marginEnd","undefined","animatedWidth","aStyle","create","flexDirection","alignItems","justifyContent","position"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useMemo } from 'react';\nimport { View, StyleSheet, ViewStyle, StyleProp } from 'react-native';\nimport Animated, {\n useAnimatedStyle,\n useDerivedValue,\n withSpring,\n} from 'react-native-reanimated';\nimport type { IndicatorConfigs, PaginationProps } from '../types';\nimport { useCarouselContext } from './useCarouselContext';\n\nconst defaultIndicatorConfigs: IndicatorConfigs = {\n indicatorColor: 'gray',\n indicatorWidth: 6,\n indicatorSelectedColor: 'blue',\n indicatorSelectedWidth: 6,\n spaceBetween: 3,\n};\n\nconst defaultSpringConfig = {\n stiffness: 1000,\n damping: 500,\n mass: 3,\n overshootClamping: true,\n restDisplacementThreshold: 0.01,\n restSpeedThreshold: 0.01,\n};\n\nexport default function PaginationIndicator({\n containerStyle,\n indicatorStyle,\n activeIndicatorStyle,\n indicatorConfigs,\n}: PaginationProps) {\n const { currentPage, totalPage } = useCarouselContext();\n\n const configs = useMemo(() => {\n return {\n ...defaultIndicatorConfigs,\n ...indicatorConfigs,\n };\n }, [indicatorConfigs]);\n\n const translateX = useDerivedValue(() => {\n return withSpring(\n currentPage.value * (configs.indicatorWidth! + configs.spaceBetween!),\n defaultSpringConfig\n );\n }, []);\n\n const animatedStyle = useAnimatedStyle(() => {\n return {\n transform: [\n {\n translateX: translateX.value,\n },\n ],\n };\n }, []);\n\n const dotStyle: StyleProp<ViewStyle> = useMemo(() => {\n return {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n borderRadius: (configs.indicatorWidth || 0) / 2,\n backgroundColor: configs.indicatorSelectedColor,\n };\n }, [configs]);\n\n function renderItem(pageNumber: number) {\n // @ts-ignore\n if (activeIndicatorStyle?.width) {\n console.error(\n 'Do not use activeIndicatorStyle: { width }. Please use indicatorConfigs: { indicatorSelectedWidth } instead'\n );\n }\n // @ts-ignore\n if (indicatorStyle?.width) {\n console.error(\n 'Do not use indicatorStyle: { width }. Please use indicatorConfigs: { indicatorWidth } instead'\n );\n }\n return (\n <IndicatorItem\n key={`index${pageNumber}`}\n currentPage={currentPage}\n pageNumber={pageNumber}\n configs={configs}\n indicatorStyle={indicatorStyle}\n activeIndicatorStyle={activeIndicatorStyle}\n />\n );\n }\n\n return (\n <View style={[styles.container, containerStyle]}>\n {[...Array(totalPage.value).keys()].map(renderItem)}\n <Animated.View\n style={[\n styles.dotSelectedStyle,\n dotStyle,\n activeIndicatorStyle,\n animatedStyle,\n ]}\n />\n </View>\n );\n}\n\nfunction IndicatorItem({\n currentPage,\n pageNumber,\n configs,\n activeIndicatorStyle,\n indicatorStyle,\n}: {\n currentPage: Animated.SharedValue<number>;\n pageNumber: number;\n configs: IndicatorConfigs;\n activeIndicatorStyle?: StyleProp<ViewStyle>;\n indicatorStyle?: StyleProp<ViewStyle>;\n}) {\n const dotContainerStyle: StyleProp<ViewStyle> = useMemo(()=> [\n styles.dotContainer,\n {\n width: configs.indicatorSelectedWidth,\n height: configs.indicatorWidth,\n marginEnd: configs.spaceBetween,\n },\n activeIndicatorStyle,\n {\n // Disable backgroundColor in activeIndicatorStyle\n backgroundColor: undefined,\n },\n ], [activeIndicatorStyle]);\n\n const dotStyle: StyleProp<ViewStyle> = useMemo(() => [\n {\n width: configs.indicatorWidth,\n height: configs.indicatorWidth,\n borderRadius: configs.indicatorWidth! / 2,\n backgroundColor: configs.indicatorColor,\n },\n indicatorStyle,\n ], [indicatorStyle]);\n\n const animatedWidth = useDerivedValue(() => {\n return withSpring(\n currentPage.value === pageNumber\n ? configs.indicatorSelectedWidth!\n : configs.indicatorWidth!,\n defaultSpringConfig\n );\n });\n\n const aStyle = useAnimatedStyle(() => {\n return {\n width: animatedWidth.value,\n };\n }, []);\n\n return (\n <Animated.View style={[dotContainerStyle, aStyle]}>\n <View style={dotStyle} />\n </Animated.View>\n );\n}\n\nconst styles = StyleSheet.create({\n container: {\n flexDirection: 'row',\n alignItems: 'center',\n },\n dotContainer: {\n alignItems: 'center',\n justifyContent: 'center',\n },\n dotSelectedStyle: {\n position: 'absolute',\n },\n});"]}
package/lib/typescript/components/Carousel.d.ts CHANGED
@@ -1,3 +1,3 @@
1
1
  import type { CarouselProps } from '../types';
2
- declare function Carousel<TData>({ style, data, initialPage, loop, additionalPagesPerSide, autoPlay, duration, animation, sliderWidth, itemWidth, firstItemAlignment, inactiveOpacity, inactiveScale, spaceBetween, spaceHeadTail, renderItem, onPageChange, scrollViewProps, keyExtractor, }: CarouselProps<TData>): JSX.Element;
2
+ declare function Carousel<TData>({ style, data, initialPage, loop, additionalPagesPerSide, autoPlay, duration, animation, sliderWidth, itemWidth, firstItemAlignment, inactiveOpacity, inactiveScale, spaceBetween, spaceHeadTail, renderItem, onPageChange, scrollViewProps, keyExtractor, onItemPress }: CarouselProps<TData>): JSX.Element;
3
3
  export default Carousel;
package/lib/typescript/components/PageItem.d.ts CHANGED
@@ -13,6 +13,7 @@ declare type Props<TData> = {
13
13
  inactiveOpacity: number;
14
14
  inactiveScale: number;
15
15
  containerStyle: StyleProp<ViewStyle>;
16
+ onPress: () => void;
16
17
  };
17
- export default function PageItem<TData = any>({ item, index, offset, renderItem, animatedValue, animation, freeze, itemWidth, inactiveOpacity, inactiveScale, containerStyle, }: Props<TData>): JSX.Element;
18
+ export default function PageItem<TData = any>({ item, index, offset, renderItem, animatedValue, animation, freeze, itemWidth, inactiveOpacity, inactiveScale, containerStyle, onPress, }: Props<TData>): JSX.Element;
18
19
  export {};
package/lib/typescript/types.d.ts CHANGED
@@ -28,6 +28,7 @@ export declare type CarouselProps<T = any> = {
28
28
  }) => React.ReactNode;
29
29
  onPageChange?: (index: number) => void;
30
30
  keyExtractor?: (item: T, index?: number) => string;
31
+ onItemPress?: (item: T, index?: number) => void;
31
32
  };
32
33
  export declare type CarouselHandles = {
33
34
  goNext(): void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@r0b0t3d/react-native-carousel",
3
- "version": "3.4.3",
3
+ "version": "3.4.5",
4
4
  "description": "React Native Carousel",
5
5
  "main": "lib/commonjs/index",
6
6
  "module": "lib/module/index",
@@ -31,7 +31,7 @@
31
31
  "ios",
32
32
  "android"
33
33
  ],
34
- "repository": "https://github.com/r0b0t3d/react-native-carousel",
34
+ "repository": "git@github.com:r0b0t3d/react-native-carousel.git",
35
35
  "author": "Tuan Luong <tuanluong.it@gmail.com> (https://github.com/r0b0t3d)",
36
36
  "license": "MIT",
37
37
  "bugs": {
package/src/components/Carousel.tsx CHANGED
@@ -20,7 +20,9 @@ import { findNearestPage, generateOffsets } from '../utils';
20
20
  import { useCarouselContext } from './useCarouselContext';
21
21
  import { useInternalCarouselContext } from './useInternalCarouselContext';
22
22
 
23
- const { width: wWidth } = Dimensions.get('screen');
23
+ const getScreenWidth = () => {
24
+ return Dimensions.get('screen').width;
25
+ };
24
26
 
25
27
  function Carousel<TData>({
26
28
  style,
@@ -31,8 +33,8 @@ function Carousel<TData>({
31
33
  autoPlay = false,
32
34
  duration = 1000,
33
35
  animation,
34
- sliderWidth = wWidth,
35
- itemWidth = wWidth,
36
+ sliderWidth = getScreenWidth(),
37
+ itemWidth = getScreenWidth(),
36
38
  firstItemAlignment = 'center',
37
39
  inactiveOpacity = 1,
38
40
  inactiveScale = 1,
@@ -42,15 +44,20 @@ function Carousel<TData>({
42
44
  onPageChange,
43
45
  scrollViewProps = {},
44
46
  keyExtractor,
47
+ onItemPress
45
48
  }: CarouselProps<TData>) {
46
49
  const currentPage = useSharedValue(0);
47
- const animatedScroll = useSharedValue(currentPage.value * sliderWidth);
50
+ const animatedScroll = useSharedValue(0);
48
51
  const freeze = useSharedValue(false);
49
52
  const [isDragging, setDragging] = useState(false);
50
53
  const expectedPosition = useSharedValue(-1);
51
54
  const pageMapper = useRef<Record<number, number>>({});
52
55
  const { currentPage: animatedPage, totalPage } = useCarouselContext();
53
56
 
57
+ useEffect(() => {
58
+ animatedScroll.value = currentPage.value * sliderWidth;
59
+ }, []);
60
+
54
61
  const horizontalPadding = useMemo(() => {
55
62
  const padding = (sliderWidth - itemWidth) / 2;
56
63
  return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;
@@ -285,6 +292,19 @@ function Carousel<TData>({
285
292
  [spaceBetween, firstItemAlignment]
286
293
  );
287
294
 
295
+ const handleItemPress = useCallback((item: TData, index: number) => () => {
296
+ handleScrollTo(index);
297
+ if (onItemPress) {
298
+ onItemPress(item, index);
299
+ }
300
+ }, [onItemPress, handlePageChange]);
301
+
302
+ const contentContainerStyle = useMemo(() => {
303
+ return {
304
+ paddingHorizontal: horizontalPadding,
305
+ };
306
+ }, [horizontalPadding]);
307
+
288
308
  function renderPage(item: TData, i: number) {
289
309
  return (
290
310
  <PageItem
@@ -300,6 +320,7 @@ function Carousel<TData>({
300
320
  freeze={freeze}
301
321
  inactiveOpacity={inactiveOpacity}
302
322
  inactiveScale={inactiveScale}
323
+ onPress={handleItemPress(item, i)}
303
324
  />
304
325
  );
305
326
  }
@@ -307,8 +328,8 @@ function Carousel<TData>({
307
328
  return (
308
329
  <View style={style}>
309
330
  <Animated.ScrollView
310
- ref={scrollViewRef}
311
331
  {...scrollViewProps}
332
+ ref={scrollViewRef}
312
333
  style={styles.container}
313
334
  horizontal
314
335
  disableScrollViewPanResponder
@@ -318,12 +339,10 @@ function Carousel<TData>({
318
339
  snapToStart
319
340
  snapToEnd
320
341
  decelerationRate="fast"
321
- scrollEventThrottle={16}
342
+ scrollEventThrottle={4}
322
343
  onScroll={scrollHandler}
323
344
  bounces={false}
324
- contentContainerStyle={{
325
- paddingHorizontal: horizontalPadding,
326
- }}
345
+ contentContainerStyle={contentContainerStyle}
327
346
  >
328
347
  {pageItems.map(renderPage)}
329
348
  </Animated.ScrollView>
package/src/components/PageItem.tsx CHANGED
@@ -1,6 +1,12 @@
1
1
  /* eslint-disable @typescript-eslint/ban-ts-comment */
2
- import React from 'react';
3
- import { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
2
+ import React, { useMemo } from 'react';
3
+ import {
4
+ Image,
5
+ StyleProp,
6
+ StyleSheet,
7
+ TouchableOpacity,
8
+ ViewStyle,
9
+ } from 'react-native';
4
10
  import Animated, {
5
11
  interpolate,
6
12
  useAnimatedStyle,
@@ -20,6 +26,7 @@ type Props<TData> = {
20
26
  inactiveOpacity: number;
21
27
  inactiveScale: number;
22
28
  containerStyle: StyleProp<ViewStyle>;
29
+ onPress: () => void;
23
30
  };
24
31
 
25
32
  export default function PageItem<TData = any>({
@@ -34,6 +41,7 @@ export default function PageItem<TData = any>({
34
41
  inactiveOpacity,
35
42
  inactiveScale,
36
43
  containerStyle,
44
+ onPress,
37
45
  }: Props<TData>) {
38
46
  const scale = useDerivedValue(() => {
39
47
  const inputRange = [offset - itemWidth, offset, offset + itemWidth];
@@ -86,11 +94,7 @@ export default function PageItem<TData = any>({
86
94
  return (
87
95
  <Image
88
96
  source={(item as any).source}
89
- style={{
90
- ...StyleSheet.absoluteFillObject,
91
- height: undefined,
92
- width: undefined,
93
- }}
97
+ style={styles.image}
94
98
  resizeMode="cover"
95
99
  />
96
100
  );
@@ -99,20 +103,36 @@ export default function PageItem<TData = any>({
99
103
  return null;
100
104
  }
101
105
 
106
+ const mContainerStyle: StyleProp<ViewStyle> = useMemo(() => {
107
+ return [
108
+ {
109
+ width: itemWidth,
110
+ overflow: 'hidden',
111
+ },
112
+ containerStyle,
113
+ ];
114
+ }, [itemWidth, containerStyle]);
115
+
102
116
  return (
103
- <View
104
- collapsable={false}
105
- style={[
106
- {
107
- width: itemWidth,
108
- overflow: 'hidden',
109
- },
110
- containerStyle,
111
- ]}
117
+ <TouchableOpacity
118
+ activeOpacity={0.9}
119
+ style={mContainerStyle}
120
+ onPress={onPress}
112
121
  >
113
- <Animated.View style={[{ flex: 1 }, animatedStyle]}>
122
+ <Animated.View style={[styles.container, animatedStyle]}>
114
123
  {renderContent()}
115
124
  </Animated.View>
116
- </View>
125
+ </TouchableOpacity>
117
126
  );
118
127
  }
128
+
129
+ const styles = StyleSheet.create({
130
+ container: {
131
+ flex: 1,
132
+ },
133
+ image: {
134
+ ...StyleSheet.absoluteFillObject,
135
+ height: undefined,
136
+ width: undefined,
137
+ },
138
+ });
package/src/components/PaginationIndicator.tsx CHANGED
@@ -58,6 +58,15 @@ export default function PaginationIndicator({
58
58
  };
59
59
  }, []);
60
60
 
61
+ const dotStyle: StyleProp<ViewStyle> = useMemo(() => {
62
+ return {
63
+ width: configs.indicatorSelectedWidth,
64
+ height: configs.indicatorWidth,
65
+ borderRadius: (configs.indicatorWidth || 0) / 2,
66
+ backgroundColor: configs.indicatorSelectedColor,
67
+ };
68
+ }, [configs]);
69
+
61
70
  function renderItem(pageNumber: number) {
62
71
  // @ts-ignore
63
72
  if (activeIndicatorStyle?.width) {
@@ -89,12 +98,7 @@ export default function PaginationIndicator({
89
98
  <Animated.View
90
99
  style={[
91
100
  styles.dotSelectedStyle,
92
- {
93
- width: configs.indicatorSelectedWidth,
94
- height: configs.indicatorWidth,
95
- borderRadius: configs.indicatorWidth! / 2,
96
- backgroundColor: configs.indicatorSelectedColor,
97
- },
101
+ dotStyle,
98
102
  activeIndicatorStyle,
99
103
  animatedStyle,
100
104
  ]}
package/src/types.ts CHANGED
@@ -28,6 +28,7 @@ export type CarouselProps<T = any> = {
28
28
  ) => React.ReactNode;
29
29
  onPageChange?: (index: number) => void;
30
30
  keyExtractor?: (item: T, index?: number) => string;
31
+ onItemPress?: (item: T, index?: number) => void;
31
32
  };
32
33
 
33
34
  export type CarouselHandles = {