@fountain-ui/lab 2.0.0-beta.13 → 2.0.0-beta.16

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 (135) hide show
  1. package/build/commonjs/Carousel/Carousel.js +27 -30
  2. package/build/commonjs/Carousel/Carousel.js.map +1 -1
  3. package/build/commonjs/Carousel/animation/createDefaultScrollAnimation.js +2 -2
  4. package/build/commonjs/Carousel/animation/createDefaultScrollAnimation.js.map +1 -1
  5. package/build/commonjs/Carousel/animation/parallaxItemStyleFactory.js +2 -2
  6. package/build/commonjs/Carousel/animation/parallaxItemStyleFactory.js.map +1 -1
  7. package/build/commonjs/Carousel/components/ItemView.js +2 -2
  8. package/build/commonjs/Carousel/components/ItemView.js.map +1 -1
  9. package/build/commonjs/Carousel/components/ScrollViewGesture.js +6 -6
  10. package/build/commonjs/Carousel/components/ScrollViewGesture.js.map +1 -1
  11. package/build/commonjs/Carousel/{hooks → components}/useItemInterpolation.js +6 -4
  12. package/build/commonjs/Carousel/components/useItemInterpolation.js.map +1 -0
  13. package/build/commonjs/Carousel/hooks/index.js +0 -16
  14. package/build/commonjs/Carousel/hooks/index.js.map +1 -1
  15. package/build/commonjs/Carousel/hooks/useIndexController.js +23 -45
  16. package/build/commonjs/Carousel/hooks/useIndexController.js.map +1 -1
  17. package/build/commonjs/Carousel/hooks/useItemVisibilityStore.js +12 -12
  18. package/build/commonjs/Carousel/hooks/useItemVisibilityStore.js.map +1 -1
  19. package/build/commonjs/Carousel/hooks/usePagingAnimation.js +72 -56
  20. package/build/commonjs/Carousel/hooks/usePagingAnimation.js.map +1 -1
  21. package/build/commonjs/Carousel/tick.js +16 -0
  22. package/build/commonjs/Carousel/tick.js.map +1 -0
  23. package/build/commonjs/Carousel/types.js +1 -0
  24. package/build/commonjs/Carousel/types.js.map +1 -1
  25. package/build/commonjs/ViewPager/ChildrenMemoizedPage.js +53 -47
  26. package/build/commonjs/ViewPager/ChildrenMemoizedPage.js.map +1 -1
  27. package/build/commonjs/ViewPager/InternalContext.js +17 -0
  28. package/build/commonjs/ViewPager/InternalContext.js.map +1 -0
  29. package/build/commonjs/ViewPager/ViewPagerNative.js +40 -17
  30. package/build/commonjs/ViewPager/ViewPagerNative.js.map +1 -1
  31. package/build/commonjs/ViewPager/ViewPagerProps.js.map +1 -1
  32. package/build/commonjs/ViewPager/ViewPagerWeb.js +19 -8
  33. package/build/commonjs/ViewPager/ViewPagerWeb.js.map +1 -1
  34. package/build/commonjs/ViewPager/index.js.map +1 -1
  35. package/build/commonjs/ViewPager/types.js +6 -0
  36. package/build/commonjs/ViewPager/types.js.map +1 -0
  37. package/build/commonjs/ViewPager/usePageStore.js +35 -0
  38. package/build/commonjs/ViewPager/usePageStore.js.map +1 -0
  39. package/build/commonjs/ViewPager/utils.js.map +1 -1
  40. package/build/commonjs/ViewabilityTrackerView/measureViewability.js +6 -6
  41. package/build/commonjs/ViewabilityTrackerView/measureViewability.js.map +1 -1
  42. package/build/commonjs/hooks/useUnstableCollapsibleAppBar.js +1 -1
  43. package/build/commonjs/hooks/useUnstableCollapsibleAppBar.js.map +1 -1
  44. package/build/module/Carousel/Carousel.js +27 -32
  45. package/build/module/Carousel/Carousel.js.map +1 -1
  46. package/build/module/Carousel/animation/createDefaultScrollAnimation.js +2 -2
  47. package/build/module/Carousel/animation/createDefaultScrollAnimation.js.map +1 -1
  48. package/build/module/Carousel/animation/parallaxItemStyleFactory.js +2 -2
  49. package/build/module/Carousel/animation/parallaxItemStyleFactory.js.map +1 -1
  50. package/build/module/Carousel/components/ItemView.js +1 -1
  51. package/build/module/Carousel/components/ItemView.js.map +1 -1
  52. package/build/module/Carousel/components/ScrollViewGesture.js +6 -6
  53. package/build/module/Carousel/components/ScrollViewGesture.js.map +1 -1
  54. package/build/module/Carousel/{hooks → components}/useItemInterpolation.js +3 -3
  55. package/build/module/Carousel/components/useItemInterpolation.js.map +1 -0
  56. package/build/module/Carousel/hooks/index.js +0 -2
  57. package/build/module/Carousel/hooks/index.js.map +1 -1
  58. package/build/module/Carousel/hooks/useIndexController.js +23 -39
  59. package/build/module/Carousel/hooks/useIndexController.js.map +1 -1
  60. package/build/module/Carousel/hooks/useItemVisibilityStore.js +10 -11
  61. package/build/module/Carousel/hooks/useItemVisibilityStore.js.map +1 -1
  62. package/build/module/Carousel/hooks/usePagingAnimation.js +73 -56
  63. package/build/module/Carousel/hooks/usePagingAnimation.js.map +1 -1
  64. package/build/module/Carousel/tick.js +6 -0
  65. package/build/module/Carousel/tick.js.map +1 -0
  66. package/build/module/Carousel/types.js +1 -0
  67. package/build/module/Carousel/types.js.map +1 -1
  68. package/build/module/ViewPager/ChildrenMemoizedPage.js +53 -47
  69. package/build/module/ViewPager/ChildrenMemoizedPage.js.map +1 -1
  70. package/build/module/ViewPager/InternalContext.js +7 -0
  71. package/build/module/ViewPager/InternalContext.js.map +1 -0
  72. package/build/module/ViewPager/ViewPagerNative.js +38 -17
  73. package/build/module/ViewPager/ViewPagerNative.js.map +1 -1
  74. package/build/module/ViewPager/ViewPagerProps.js.map +1 -1
  75. package/build/module/ViewPager/ViewPagerWeb.js +16 -8
  76. package/build/module/ViewPager/ViewPagerWeb.js.map +1 -1
  77. package/build/module/ViewPager/index.js.map +1 -1
  78. package/build/module/ViewPager/types.js +2 -0
  79. package/build/module/ViewPager/types.js.map +1 -0
  80. package/build/module/ViewPager/usePageStore.js +25 -0
  81. package/build/module/ViewPager/usePageStore.js.map +1 -0
  82. package/build/module/ViewPager/utils.js.map +1 -1
  83. package/build/module/ViewabilityTrackerView/measureViewability.js +2 -2
  84. package/build/module/ViewabilityTrackerView/measureViewability.js.map +1 -1
  85. package/build/module/hooks/useUnstableCollapsibleAppBar.js +1 -1
  86. package/build/module/hooks/useUnstableCollapsibleAppBar.js.map +1 -1
  87. package/build/typescript/Carousel/components/ScrollViewGesture.d.ts +2 -2
  88. package/build/typescript/Carousel/{hooks → components}/useItemInterpolation.d.ts +0 -0
  89. package/build/typescript/Carousel/hooks/index.d.ts +0 -2
  90. package/build/typescript/Carousel/hooks/useIndexController.d.ts +0 -2
  91. package/build/typescript/Carousel/hooks/useItemVisibilityStore.d.ts +5 -2
  92. package/build/typescript/Carousel/hooks/usePagingAnimation.d.ts +5 -7
  93. package/build/typescript/Carousel/tick.d.ts +2 -0
  94. package/build/typescript/Carousel/types.d.ts +4 -2
  95. package/build/typescript/ViewPager/ChildrenMemoizedPage.d.ts +1 -1
  96. package/build/typescript/ViewPager/InternalContext.d.ts +7 -0
  97. package/build/typescript/ViewPager/ViewPagerNative.d.ts +2 -2
  98. package/build/typescript/ViewPager/ViewPagerProps.d.ts +4 -22
  99. package/build/typescript/ViewPager/ViewPagerWeb.d.ts +2 -2
  100. package/build/typescript/ViewPager/index.d.ts +2 -1
  101. package/build/typescript/ViewPager/types.d.ts +19 -0
  102. package/build/typescript/ViewPager/usePageStore.d.ts +2 -0
  103. package/build/typescript/ViewPager/utils.d.ts +1 -1
  104. package/package.json +3 -3
  105. package/src/Carousel/Carousel.tsx +25 -34
  106. package/src/Carousel/animation/createDefaultScrollAnimation.ts +2 -2
  107. package/src/Carousel/animation/parallaxItemStyleFactory.ts +1 -1
  108. package/src/Carousel/components/ItemView.tsx +1 -1
  109. package/src/Carousel/components/ScrollViewGesture.tsx +8 -7
  110. package/src/Carousel/{hooks → components}/useItemInterpolation.ts +3 -3
  111. package/src/Carousel/hooks/index.ts +0 -2
  112. package/src/Carousel/hooks/useIndexController.tsx +25 -47
  113. package/src/Carousel/hooks/useItemVisibilityStore.ts +17 -13
  114. package/src/Carousel/hooks/usePagingAnimation.ts +104 -64
  115. package/src/Carousel/tick.ts +6 -0
  116. package/src/Carousel/types.ts +6 -2
  117. package/src/ViewPager/ChildrenMemoizedPage.tsx +53 -50
  118. package/src/ViewPager/InternalContext.ts +13 -0
  119. package/src/ViewPager/ViewPagerNative.tsx +53 -39
  120. package/src/ViewPager/ViewPagerProps.ts +4 -27
  121. package/src/ViewPager/ViewPagerWeb.tsx +23 -18
  122. package/src/ViewPager/index.ts +2 -1
  123. package/src/ViewPager/types.ts +24 -0
  124. package/src/ViewPager/usePageStore.ts +30 -0
  125. package/src/ViewPager/utils.tsx +1 -1
  126. package/src/ViewabilityTrackerView/measureViewability.ts +1 -3
  127. package/src/hooks/useUnstableCollapsibleAppBar.ts +1 -1
  128. package/build/commonjs/Carousel/hooks/useDimensionChangeReaction.js +0 -23
  129. package/build/commonjs/Carousel/hooks/useDimensionChangeReaction.js.map +0 -1
  130. package/build/commonjs/Carousel/hooks/useItemInterpolation.js.map +0 -1
  131. package/build/module/Carousel/hooks/useDimensionChangeReaction.js +0 -14
  132. package/build/module/Carousel/hooks/useDimensionChangeReaction.js.map +0 -1
  133. package/build/module/Carousel/hooks/useItemInterpolation.js.map +0 -1
  134. package/build/typescript/Carousel/hooks/useDimensionChangeReaction.d.ts +0 -7
  135. package/src/Carousel/hooks/useDimensionChangeReaction.ts +0 -25
@@ -35,7 +35,7 @@ const Carousel = /*#__PURE__*/(0, _react.forwardRef)(function Carousel(props, re
35
35
  itemHeight,
36
36
  itemWidth,
37
37
  loop = false,
38
- onIndexChange,
38
+ onIndexChange: onIndexChangeProp,
39
39
  renderItem,
40
40
  scrollEnabled = true,
41
41
  style,
@@ -43,49 +43,46 @@ const Carousel = /*#__PURE__*/(0, _react.forwardRef)(function Carousel(props, re
43
43
  } = props;
44
44
  const data = (0, _hooks.useLoopedData)(originalData, loop);
45
45
  const initialTx = itemWidth * initialIndex;
46
- const controlledTx = (0, _react.useRef)(new _reactNative.Animated.Value(initialTx)).current;
47
- const offsetTx = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
48
- const {
49
- currentIndex,
50
- getCurrentIndex,
51
- lastIndex,
52
- monitorElement
53
- } = (0, _hooks.useIndexController)({
54
- controlledTx,
46
+ const offsetX = (0, _react.useRef)(new _reactNative.Animated.Value(initialTx)).current;
47
+ const translateX = (0, _react.useRef)(new _reactNative.Animated.Value(0)).current;
48
+
49
+ const globalInterpolation = _reactNative.Animated.add(offsetX, translateX);
50
+
51
+ const [itemVisibilityStore, onIndexChange] = (0, _hooks.useItemVisibilityStore)({
55
52
  initialIndex,
56
- itemWidth,
57
- numberOfOriginalData: originalData.length,
58
- onIndexChange
59
- });
60
- const itemVisibilityStore = (0, _hooks.useItemVisibilityStore)({
61
- currentIndex,
62
53
  numberOfData: data.length,
63
54
  windowSize
64
55
  });
56
+ const handleIndexChange = (0, _react.useCallback)(newIndex => {
57
+ onIndexChange(newIndex);
58
+ onIndexChangeProp === null || onIndexChangeProp === void 0 ? void 0 : onIndexChangeProp(newIndex);
59
+ }, [onIndexChange, onIndexChangeProp]);
60
+ const indexController = (0, _hooks.useIndexController)({
61
+ initialIndex,
62
+ itemWidth,
63
+ numberOfOriginalData: originalData.length,
64
+ onIndexChange: handleIndexChange
65
+ });
65
66
  const {
66
- finalizeAnimation,
67
- globalInterpolation,
67
+ getCurrentIndex
68
+ } = indexController;
69
+ const {
70
+ interruptAnimation,
68
71
  startPagingAnimation
69
72
  } = (0, _hooks.usePagingAnimation)({
70
- controlledTx,
71
73
  createScrollAnimation,
72
- getCurrentIndex,
73
74
  itemWidth,
74
- lastIndex,
75
+ indexController,
75
76
  loop,
76
77
  numberOfData: data.length,
77
- offsetTx
78
+ offsetX,
79
+ translateX
78
80
  });
79
81
  const autoplayController = (0, _hooks.useAutoplayController)({
80
82
  enabled: autoplay,
81
83
  intervalMillis: autoplayInterval,
82
84
  startPagingAnimation
83
85
  });
84
- (0, _hooks.useDimensionChangeReaction)({
85
- controlledTx,
86
- currentIndex,
87
- itemWidth
88
- });
89
86
  (0, _react.useImperativeHandle)(ref, () => ({
90
87
  getCurrentIndex,
91
88
  next: () => startPagingAnimation('directional', {
@@ -107,7 +104,7 @@ const Carousel = /*#__PURE__*/(0, _react.forwardRef)(function Carousel(props, re
107
104
  }), [createItemStyle, data, globalInterpolation, itemHeight, itemWidth, itemVisibilityStore, loop]);
108
105
  return /*#__PURE__*/_react.default.createElement(_components.InternalContext.Provider, {
109
106
  value: contextValue
110
- }, monitorElement, /*#__PURE__*/_react.default.createElement(_ViewabilityTrackerView.default, {
107
+ }, /*#__PURE__*/_react.default.createElement(_ViewabilityTrackerView.default, {
111
108
  enabled: autoplay && !disableSmartAutoplay,
112
109
  measurementIntervalMillis: Math.max(3000, autoplayInterval),
113
110
  onViewabilityChange: _ref => {
@@ -123,8 +120,8 @@ const Carousel = /*#__PURE__*/(0, _react.forwardRef)(function Carousel(props, re
123
120
  }
124
121
  }, /*#__PURE__*/_react.default.createElement(_components.ScrollViewGesture, {
125
122
  autoplayController: autoplayController,
126
- finalizeAnimation: finalizeAnimation,
127
- offsetTx: offsetTx,
123
+ interruptAnimation: interruptAnimation,
124
+ translateX: translateX,
128
125
  scrollEnabled: scrollEnabled,
129
126
  startPagingAnimation: startPagingAnimation
130
127
  }, /*#__PURE__*/_react.default.createElement(_components.RootView, {
@@ -1 +1 @@
1
- {"version":3,"names":["Carousel","forwardRef","props","ref","autoplay","autoplayInterval","createItemStyle","createDefaultItemStyle","createScrollAnimation","createDefaultScrollAnimation","data","originalData","disableSmartAutoplay","initialIndex","itemHeight","itemWidth","loop","onIndexChange","renderItem","scrollEnabled","style","windowSize","useLoopedData","initialTx","controlledTx","useRef","Animated","Value","current","offsetTx","currentIndex","getCurrentIndex","lastIndex","monitorElement","useIndexController","numberOfOriginalData","length","itemVisibilityStore","useItemVisibilityStore","numberOfData","finalizeAnimation","globalInterpolation","startPagingAnimation","usePagingAnimation","autoplayController","useAutoplayController","enabled","intervalMillis","useDimensionChangeReaction","useImperativeHandle","next","direction","prev","scrollTo","option","contextValue","useMemo","Math","max","visible","resume","pause","memo"],"sources":["Carousel.tsx"],"sourcesContent":["import React, { forwardRef, memo, useImperativeHandle, useMemo, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport ViewabilityTrackerView from '../ViewabilityTrackerView';\nimport type CarouselProps from './CarouselProps';\nimport type { CarouselInstance } from './types';\nimport {\n useAutoplayController,\n useDimensionChangeReaction,\n useIndexController,\n useItemVisibilityStore,\n useLoopedData,\n usePagingAnimation,\n} from './hooks';\nimport { createDefaultItemStyle, createDefaultScrollAnimation } from './animation';\nimport { InternalContext, RootView, ScrollViewGesture } from './components';\n\nconst Carousel = forwardRef<CarouselInstance, CarouselProps>(function Carousel(props, ref) {\n const {\n autoplay = false,\n autoplayInterval = 3000,\n createItemStyle = createDefaultItemStyle,\n createScrollAnimation = createDefaultScrollAnimation,\n data: originalData,\n disableSmartAutoplay = false,\n initialIndex = 0,\n itemHeight,\n itemWidth,\n loop = false,\n onIndexChange,\n renderItem,\n scrollEnabled = true,\n style,\n windowSize = 5,\n } = props;\n\n const data = useLoopedData(originalData, loop);\n\n const initialTx = itemWidth * initialIndex;\n const controlledTx = useRef(new Animated.Value(initialTx)).current;\n const offsetTx = useRef(new Animated.Value(0)).current;\n\n const {\n currentIndex,\n getCurrentIndex,\n lastIndex,\n monitorElement,\n } = useIndexController({\n controlledTx,\n initialIndex,\n itemWidth,\n numberOfOriginalData: originalData.length,\n onIndexChange,\n });\n\n const itemVisibilityStore = useItemVisibilityStore({\n currentIndex,\n numberOfData: data.length,\n windowSize,\n });\n\n const {\n finalizeAnimation,\n globalInterpolation,\n startPagingAnimation,\n } = usePagingAnimation({\n controlledTx,\n createScrollAnimation,\n getCurrentIndex,\n itemWidth,\n lastIndex,\n loop,\n numberOfData: data.length,\n offsetTx,\n });\n\n const autoplayController = useAutoplayController({\n enabled: autoplay,\n intervalMillis: autoplayInterval,\n startPagingAnimation,\n });\n\n useDimensionChangeReaction({\n controlledTx,\n currentIndex,\n itemWidth,\n });\n\n useImperativeHandle(\n ref,\n () => ({\n getCurrentIndex,\n next: () => startPagingAnimation('directional', { direction: 'next' }),\n prev: () => startPagingAnimation('directional', { direction: 'prev' }),\n scrollTo: (option) => startPagingAnimation('index', option),\n }),\n [startPagingAnimation, getCurrentIndex],\n );\n\n const contextValue = useMemo(() => ({\n createItemStyle,\n data,\n globalInterpolation,\n itemHeight,\n itemWidth,\n itemVisibilityStore,\n loop,\n }), [\n createItemStyle,\n data,\n globalInterpolation,\n itemHeight,\n itemWidth,\n itemVisibilityStore,\n loop,\n ]);\n\n return (\n <InternalContext.Provider value={contextValue}>\n {monitorElement}\n\n <ViewabilityTrackerView\n enabled={autoplay && !disableSmartAutoplay}\n measurementIntervalMillis={Math.max(3000, autoplayInterval)}\n onViewabilityChange={({ visible }) => {\n if (visible) {\n autoplayController.resume();\n } else {\n autoplayController.pause();\n }\n }}\n >\n <ScrollViewGesture\n autoplayController={autoplayController}\n finalizeAnimation={finalizeAnimation}\n offsetTx={offsetTx}\n scrollEnabled={scrollEnabled}\n startPagingAnimation={startPagingAnimation}\n >\n <RootView\n data={data}\n itemHeight={itemHeight}\n originalData={originalData}\n renderItem={renderItem}\n style={style}\n />\n </ScrollViewGesture>\n </ViewabilityTrackerView>\n </InternalContext.Provider>\n );\n});\n\nexport default memo(Carousel);\n"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AAGA;;AAQA;;AACA;;;;;;;;AAEA,MAAMA,QAAQ,gBAAG,IAAAC,iBAAA,EAA4C,SAASD,QAAT,CAAkBE,KAAlB,EAAyBC,GAAzB,EAA8B;EACvF,MAAM;IACFC,QAAQ,GAAG,KADT;IAEFC,gBAAgB,GAAG,IAFjB;IAGFC,eAAe,GAAGC,iCAHhB;IAIFC,qBAAqB,GAAGC,uCAJtB;IAKFC,IAAI,EAAEC,YALJ;IAMFC,oBAAoB,GAAG,KANrB;IAOFC,YAAY,GAAG,CAPb;IAQFC,UARE;IASFC,SATE;IAUFC,IAAI,GAAG,KAVL;IAWFC,aAXE;IAYFC,UAZE;IAaFC,aAAa,GAAG,IAbd;IAcFC,KAdE;IAeFC,UAAU,GAAG;EAfX,IAgBFnB,KAhBJ;EAkBA,MAAMQ,IAAI,GAAG,IAAAY,oBAAA,EAAcX,YAAd,EAA4BK,IAA5B,CAAb;EAEA,MAAMO,SAAS,GAAGR,SAAS,GAAGF,YAA9B;EACA,MAAMW,YAAY,GAAG,IAAAC,aAAA,EAAO,IAAIC,qBAAA,CAASC,KAAb,CAAmBJ,SAAnB,CAAP,EAAsCK,OAA3D;EACA,MAAMC,QAAQ,GAAG,IAAAJ,aAAA,EAAO,IAAIC,qBAAA,CAASC,KAAb,CAAmB,CAAnB,CAAP,EAA8BC,OAA/C;EAEA,MAAM;IACFE,YADE;IAEFC,eAFE;IAGFC,SAHE;IAIFC;EAJE,IAKF,IAAAC,yBAAA,EAAmB;IACnBV,YADmB;IAEnBX,YAFmB;IAGnBE,SAHmB;IAInBoB,oBAAoB,EAAExB,YAAY,CAACyB,MAJhB;IAKnBnB;EALmB,CAAnB,CALJ;EAaA,MAAMoB,mBAAmB,GAAG,IAAAC,6BAAA,EAAuB;IAC/CR,YAD+C;IAE/CS,YAAY,EAAE7B,IAAI,CAAC0B,MAF4B;IAG/Cf;EAH+C,CAAvB,CAA5B;EAMA,MAAM;IACFmB,iBADE;IAEFC,mBAFE;IAGFC;EAHE,IAIF,IAAAC,yBAAA,EAAmB;IACnBnB,YADmB;IAEnBhB,qBAFmB;IAGnBuB,eAHmB;IAInBhB,SAJmB;IAKnBiB,SALmB;IAMnBhB,IANmB;IAOnBuB,YAAY,EAAE7B,IAAI,CAAC0B,MAPA;IAQnBP;EARmB,CAAnB,CAJJ;EAeA,MAAMe,kBAAkB,GAAG,IAAAC,4BAAA,EAAsB;IAC7CC,OAAO,EAAE1C,QADoC;IAE7C2C,cAAc,EAAE1C,gBAF6B;IAG7CqC;EAH6C,CAAtB,CAA3B;EAMA,IAAAM,iCAAA,EAA2B;IACvBxB,YADuB;IAEvBM,YAFuB;IAGvBf;EAHuB,CAA3B;EAMA,IAAAkC,0BAAA,EACI9C,GADJ,EAEI,OAAO;IACH4B,eADG;IAEHmB,IAAI,EAAE,MAAMR,oBAAoB,CAAC,aAAD,EAAgB;MAAES,SAAS,EAAE;IAAb,CAAhB,CAF7B;IAGHC,IAAI,EAAE,MAAMV,oBAAoB,CAAC,aAAD,EAAgB;MAAES,SAAS,EAAE;IAAb,CAAhB,CAH7B;IAIHE,QAAQ,EAAGC,MAAD,IAAYZ,oBAAoB,CAAC,OAAD,EAAUY,MAAV;EAJvC,CAAP,CAFJ,EAQI,CAACZ,oBAAD,EAAuBX,eAAvB,CARJ;EAWA,MAAMwB,YAAY,GAAG,IAAAC,cAAA,EAAQ,OAAO;IAChClD,eADgC;IAEhCI,IAFgC;IAGhC+B,mBAHgC;IAIhC3B,UAJgC;IAKhCC,SALgC;IAMhCsB,mBANgC;IAOhCrB;EAPgC,CAAP,CAAR,EAQjB,CACAV,eADA,EAEAI,IAFA,EAGA+B,mBAHA,EAIA3B,UAJA,EAKAC,SALA,EAMAsB,mBANA,EAOArB,IAPA,CARiB,CAArB;EAkBA,oBACI,6BAAC,2BAAD,CAAiB,QAAjB;IAA0B,KAAK,EAAEuC;EAAjC,GACKtB,cADL,eAGI,6BAAC,+BAAD;IACI,OAAO,EAAE7B,QAAQ,IAAI,CAACQ,oBAD1B;IAEI,yBAAyB,EAAE6C,IAAI,CAACC,GAAL,CAAS,IAAT,EAAerD,gBAAf,CAF/B;IAGI,mBAAmB,EAAE,QAAiB;MAAA,IAAhB;QAAEsD;MAAF,CAAgB;;MAClC,IAAIA,OAAJ,EAAa;QACTf,kBAAkB,CAACgB,MAAnB;MACH,CAFD,MAEO;QACHhB,kBAAkB,CAACiB,KAAnB;MACH;IACJ;EATL,gBAWI,6BAAC,6BAAD;IACI,kBAAkB,EAAEjB,kBADxB;IAEI,iBAAiB,EAAEJ,iBAFvB;IAGI,QAAQ,EAAEX,QAHd;IAII,aAAa,EAAEV,aAJnB;IAKI,oBAAoB,EAAEuB;EAL1B,gBAOI,6BAAC,oBAAD;IACI,IAAI,EAAEhC,IADV;IAEI,UAAU,EAAEI,UAFhB;IAGI,YAAY,EAAEH,YAHlB;IAII,UAAU,EAAEO,UAJhB;IAKI,KAAK,EAAEE;EALX,EAPJ,CAXJ,CAHJ,CADJ;AAiCH,CArIgB,CAAjB;;4BAuIe,IAAA0C,WAAA,EAAK9D,QAAL,C"}
1
+ {"version":3,"names":["Carousel","forwardRef","props","ref","autoplay","autoplayInterval","createItemStyle","createDefaultItemStyle","createScrollAnimation","createDefaultScrollAnimation","data","originalData","disableSmartAutoplay","initialIndex","itemHeight","itemWidth","loop","onIndexChange","onIndexChangeProp","renderItem","scrollEnabled","style","windowSize","useLoopedData","initialTx","offsetX","useRef","Animated","Value","current","translateX","globalInterpolation","add","itemVisibilityStore","useItemVisibilityStore","numberOfData","length","handleIndexChange","useCallback","newIndex","indexController","useIndexController","numberOfOriginalData","getCurrentIndex","interruptAnimation","startPagingAnimation","usePagingAnimation","autoplayController","useAutoplayController","enabled","intervalMillis","useImperativeHandle","next","direction","prev","scrollTo","option","contextValue","useMemo","Math","max","visible","resume","pause","memo"],"sources":["Carousel.tsx"],"sourcesContent":["import React, { forwardRef, memo, useCallback, useImperativeHandle, useMemo, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport ViewabilityTrackerView from '../ViewabilityTrackerView';\nimport type CarouselProps from './CarouselProps';\nimport type { CarouselInstance } from './types';\nimport {\n useAutoplayController,\n useIndexController,\n useItemVisibilityStore,\n useLoopedData,\n usePagingAnimation,\n} from './hooks';\nimport { createDefaultItemStyle, createDefaultScrollAnimation } from './animation';\nimport { InternalContext, RootView, ScrollViewGesture } from './components';\n\nconst Carousel = forwardRef<CarouselInstance, CarouselProps>(function Carousel(props, ref) {\n const {\n autoplay = false,\n autoplayInterval = 3000,\n createItemStyle = createDefaultItemStyle,\n createScrollAnimation = createDefaultScrollAnimation,\n data: originalData,\n disableSmartAutoplay = false,\n initialIndex = 0,\n itemHeight,\n itemWidth,\n loop = false,\n onIndexChange: onIndexChangeProp,\n renderItem,\n scrollEnabled = true,\n style,\n windowSize = 5,\n } = props;\n\n const data = useLoopedData(originalData, loop);\n\n const initialTx = itemWidth * initialIndex;\n const offsetX = useRef(new Animated.Value(initialTx)).current;\n const translateX = useRef(new Animated.Value(0)).current;\n const globalInterpolation = Animated.add(offsetX, translateX);\n\n const [itemVisibilityStore, onIndexChange] = useItemVisibilityStore({\n initialIndex,\n numberOfData: data.length,\n windowSize,\n });\n\n const handleIndexChange = useCallback((newIndex: number) => {\n onIndexChange(newIndex);\n onIndexChangeProp?.(newIndex);\n }, [onIndexChange, onIndexChangeProp]);\n\n const indexController = useIndexController({\n initialIndex,\n itemWidth,\n numberOfOriginalData: originalData.length,\n onIndexChange: handleIndexChange,\n });\n\n const { getCurrentIndex } = indexController;\n\n const {\n interruptAnimation,\n startPagingAnimation,\n } = usePagingAnimation({\n createScrollAnimation,\n itemWidth,\n indexController,\n loop,\n numberOfData: data.length,\n offsetX,\n translateX,\n });\n\n const autoplayController = useAutoplayController({\n enabled: autoplay,\n intervalMillis: autoplayInterval,\n startPagingAnimation,\n });\n\n useImperativeHandle(\n ref,\n () => ({\n getCurrentIndex,\n next: () => startPagingAnimation('directional', { direction: 'next' }),\n prev: () => startPagingAnimation('directional', { direction: 'prev' }),\n scrollTo: (option) => startPagingAnimation('index', option),\n }),\n [startPagingAnimation, getCurrentIndex],\n );\n\n const contextValue = useMemo(() => ({\n createItemStyle,\n data,\n globalInterpolation,\n itemHeight,\n itemWidth,\n itemVisibilityStore,\n loop,\n }), [\n createItemStyle,\n data,\n globalInterpolation,\n itemHeight,\n itemWidth,\n itemVisibilityStore,\n loop,\n ]);\n\n return (\n <InternalContext.Provider value={contextValue}>\n <ViewabilityTrackerView\n enabled={autoplay && !disableSmartAutoplay}\n measurementIntervalMillis={Math.max(3000, autoplayInterval)}\n onViewabilityChange={({ visible }) => {\n if (visible) {\n autoplayController.resume();\n } else {\n autoplayController.pause();\n }\n }}\n >\n <ScrollViewGesture\n autoplayController={autoplayController}\n interruptAnimation={interruptAnimation}\n translateX={translateX}\n scrollEnabled={scrollEnabled}\n startPagingAnimation={startPagingAnimation}\n >\n <RootView\n data={data}\n itemHeight={itemHeight}\n originalData={originalData}\n renderItem={renderItem}\n style={style}\n />\n </ScrollViewGesture>\n </ViewabilityTrackerView>\n </InternalContext.Provider>\n );\n});\n\nexport default memo(Carousel);\n"],"mappings":"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"}
@@ -10,8 +10,8 @@ var _reactNative = require("react-native");
10
10
  function createDefaultScrollAnimation(animatedValue, toValue) {
11
11
  return _reactNative.Animated.timing(animatedValue, {
12
12
  toValue: toValue,
13
- duration: 350,
14
- easing: _reactNative.Easing.bezier(0.25, 1, 0.5, 1),
13
+ duration: 180,
14
+ easing: _reactNative.Easing.bezier(0.2, 0.2, 0.2, 1),
15
15
  useNativeDriver: true
16
16
  });
17
17
  }
@@ -1 +1 @@
1
- {"version":3,"names":["createDefaultScrollAnimation","animatedValue","toValue","Animated","timing","duration","easing","Easing","bezier","useNativeDriver"],"sources":["createDefaultScrollAnimation.ts"],"sourcesContent":["import { Animated, Easing } from 'react-native';\n\nexport default function createDefaultScrollAnimation(\n animatedValue: Animated.Value,\n toValue: number,\n): Animated.CompositeAnimation {\n return Animated.timing(animatedValue, {\n toValue: toValue,\n duration: 350,\n easing: Easing.bezier(0.25, 1, 0.5, 1),\n useNativeDriver: true,\n });\n};\n"],"mappings":";;;;;;;AAAA;;AAEe,SAASA,4BAAT,CACXC,aADW,EAEXC,OAFW,EAGgB;EAC3B,OAAOC,qBAAA,CAASC,MAAT,CAAgBH,aAAhB,EAA+B;IAClCC,OAAO,EAAEA,OADyB;IAElCG,QAAQ,EAAE,GAFwB;IAGlCC,MAAM,EAAEC,mBAAA,CAAOC,MAAP,CAAc,IAAd,EAAoB,CAApB,EAAuB,GAAvB,EAA4B,CAA5B,CAH0B;IAIlCC,eAAe,EAAE;EAJiB,CAA/B,CAAP;AAMH;;AAAA"}
1
+ {"version":3,"names":["createDefaultScrollAnimation","animatedValue","toValue","Animated","timing","duration","easing","Easing","bezier","useNativeDriver"],"sources":["createDefaultScrollAnimation.ts"],"sourcesContent":["import { Animated, Easing } from 'react-native';\n\nexport default function createDefaultScrollAnimation(\n animatedValue: Animated.Value,\n toValue: number,\n): Animated.CompositeAnimation {\n return Animated.timing(animatedValue, {\n toValue: toValue,\n duration: 180,\n easing: Easing.bezier(0.2, 0.2, 0.2, 1),\n useNativeDriver: true,\n });\n};\n"],"mappings":";;;;;;;AAAA;;AAEe,SAASA,4BAAT,CACXC,aADW,EAEXC,OAFW,EAGgB;EAC3B,OAAOC,qBAAA,CAASC,MAAT,CAAgBH,aAAhB,EAA+B;IAClCC,OAAO,EAAEA,OADyB;IAElCG,QAAQ,EAAE,GAFwB;IAGlCC,MAAM,EAAEC,mBAAA,CAAOC,MAAP,CAAc,GAAd,EAAmB,GAAnB,EAAwB,GAAxB,EAA6B,CAA7B,CAH0B;IAIlCC,eAAe,EAAE;EAJiB,CAA/B,CAAP;AAMH;;AAAA"}
@@ -23,8 +23,8 @@ function parallaxItemStyleFactory() {
23
23
  adjacentItemOpacity,
24
24
  adjacentItemScale,
25
25
  scrollingOffset
26
- } = { ...config,
27
- ...defaultParallaxAnimationConfig
26
+ } = { ...defaultParallaxAnimationConfig,
27
+ ...config
28
28
  };
29
29
 
30
30
  const createItemStyle = (itemInterpolation, itemWidth) => {
@@ -1 +1 @@
1
- {"version":3,"names":["defaultParallaxAnimationConfig","activeItemScale","activeItemOpacity","adjacentItemScale","Math","pow","adjacentItemOpacity","scrollingOffset","parallaxItemStyleFactory","config","createItemStyle","itemInterpolation","itemWidth","translate","interpolate","inputRange","itemInterpolationInputRange","outputRange","zIndex","extrapolate","scale","opacity","transform","translateX"],"sources":["parallaxItemStyleFactory.ts"],"sourcesContent":["import type { CreateItemStyle } from '../types';\nimport { itemInterpolationInputRange } from './animationUtils';\n\nexport interface ParallaxAnimationConfig {\n activeItemScale?: number;\n activeItemOpacity?: number;\n adjacentItemScale?: number;\n adjacentItemOpacity?: number;\n scrollingOffset?: number;\n}\n\nconst defaultParallaxAnimationConfig: Required<Readonly<ParallaxAnimationConfig>> = {\n activeItemScale: 0.9,\n activeItemOpacity: 1,\n adjacentItemScale: Math.pow(0.9, 2),\n adjacentItemOpacity: 0.5,\n scrollingOffset: 50,\n};\n\nexport default function parallaxItemStyleFactory(config: ParallaxAnimationConfig = defaultParallaxAnimationConfig) {\n const {\n activeItemOpacity,\n activeItemScale,\n adjacentItemOpacity,\n adjacentItemScale,\n scrollingOffset,\n }: Required<ParallaxAnimationConfig> = {\n ...config,\n ...defaultParallaxAnimationConfig,\n };\n\n const createItemStyle: CreateItemStyle = (itemInterpolation, itemWidth) => {\n const translate = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [\n -itemWidth + scrollingOffset,\n 0,\n itemWidth - scrollingOffset,\n ],\n });\n\n const zIndex = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [0, itemWidth, 0],\n extrapolate: 'clamp',\n });\n\n const scale = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [\n adjacentItemScale,\n activeItemScale,\n adjacentItemScale,\n ],\n extrapolate: 'clamp',\n });\n\n const opacity = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [\n adjacentItemOpacity,\n activeItemOpacity,\n adjacentItemOpacity,\n ],\n extrapolate: 'clamp',\n });\n\n return {\n transform: [\n { translateX: translate },\n { scale },\n ],\n zIndex,\n opacity,\n };\n };\n\n return createItemStyle;\n};\n"],"mappings":";;;;;;;AACA;;AAUA,MAAMA,8BAA2E,GAAG;EAChFC,eAAe,EAAE,GAD+D;EAEhFC,iBAAiB,EAAE,CAF6D;EAGhFC,iBAAiB,EAAEC,IAAI,CAACC,GAAL,CAAS,GAAT,EAAc,CAAd,CAH6D;EAIhFC,mBAAmB,EAAE,GAJ2D;EAKhFC,eAAe,EAAE;AAL+D,CAApF;;AAQe,SAASC,wBAAT,GAAoG;EAAA,IAAlEC,MAAkE,uEAAhCT,8BAAgC;EAC/G,MAAM;IACFE,iBADE;IAEFD,eAFE;IAGFK,mBAHE;IAIFH,iBAJE;IAKFI;EALE,IAMiC,EACnC,GAAGE,MADgC;IAEnC,GAAGT;EAFgC,CANvC;;EAWA,MAAMU,eAAgC,GAAG,CAACC,iBAAD,EAAoBC,SAApB,KAAkC;IACvE,MAAMC,SAAS,GAAGF,iBAAiB,CAACG,WAAlB,CAA8B;MAC5CC,UAAU,EAAEC,2CADgC;MAE5CC,WAAW,EAAE,CACT,CAACL,SAAD,GAAaL,eADJ,EAET,CAFS,EAGTK,SAAS,GAAGL,eAHH;IAF+B,CAA9B,CAAlB;IASA,MAAMW,MAAM,GAAGP,iBAAiB,CAACG,WAAlB,CAA8B;MACzCC,UAAU,EAAEC,2CAD6B;MAEzCC,WAAW,EAAE,CAAC,CAAD,EAAIL,SAAJ,EAAe,CAAf,CAF4B;MAGzCO,WAAW,EAAE;IAH4B,CAA9B,CAAf;IAMA,MAAMC,KAAK,GAAGT,iBAAiB,CAACG,WAAlB,CAA8B;MACxCC,UAAU,EAAEC,2CAD4B;MAExCC,WAAW,EAAE,CACTd,iBADS,EAETF,eAFS,EAGTE,iBAHS,CAF2B;MAOxCgB,WAAW,EAAE;IAP2B,CAA9B,CAAd;IAUA,MAAME,OAAO,GAAGV,iBAAiB,CAACG,WAAlB,CAA8B;MAC1CC,UAAU,EAAEC,2CAD8B;MAE1CC,WAAW,EAAE,CACTX,mBADS,EAETJ,iBAFS,EAGTI,mBAHS,CAF6B;MAO1Ca,WAAW,EAAE;IAP6B,CAA9B,CAAhB;IAUA,OAAO;MACHG,SAAS,EAAE,CACP;QAAEC,UAAU,EAAEV;MAAd,CADO,EAEP;QAAEO;MAAF,CAFO,CADR;MAKHF,MALG;MAMHG;IANG,CAAP;EAQH,CA5CD;;EA8CA,OAAOX,eAAP;AACH;;AAAA"}
1
+ {"version":3,"names":["defaultParallaxAnimationConfig","activeItemScale","activeItemOpacity","adjacentItemScale","Math","pow","adjacentItemOpacity","scrollingOffset","parallaxItemStyleFactory","config","createItemStyle","itemInterpolation","itemWidth","translate","interpolate","inputRange","itemInterpolationInputRange","outputRange","zIndex","extrapolate","scale","opacity","transform","translateX"],"sources":["parallaxItemStyleFactory.ts"],"sourcesContent":["import type { CreateItemStyle } from '../types';\nimport { itemInterpolationInputRange } from './animationUtils';\n\nexport interface ParallaxAnimationConfig {\n activeItemScale?: number;\n activeItemOpacity?: number;\n adjacentItemScale?: number;\n adjacentItemOpacity?: number;\n scrollingOffset?: number;\n}\n\nconst defaultParallaxAnimationConfig: Required<Readonly<ParallaxAnimationConfig>> = {\n activeItemScale: 0.9,\n activeItemOpacity: 1,\n adjacentItemScale: Math.pow(0.9, 2),\n adjacentItemOpacity: 0.5,\n scrollingOffset: 50,\n};\n\nexport default function parallaxItemStyleFactory(config: ParallaxAnimationConfig = defaultParallaxAnimationConfig) {\n const {\n activeItemOpacity,\n activeItemScale,\n adjacentItemOpacity,\n adjacentItemScale,\n scrollingOffset,\n }: Required<ParallaxAnimationConfig> = {\n ...defaultParallaxAnimationConfig,\n ...config,\n };\n\n const createItemStyle: CreateItemStyle = (itemInterpolation, itemWidth) => {\n const translate = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [\n -itemWidth + scrollingOffset,\n 0,\n itemWidth - scrollingOffset,\n ],\n });\n\n const zIndex = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [0, itemWidth, 0],\n extrapolate: 'clamp',\n });\n\n const scale = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [\n adjacentItemScale,\n activeItemScale,\n adjacentItemScale,\n ],\n extrapolate: 'clamp',\n });\n\n const opacity = itemInterpolation.interpolate({\n inputRange: itemInterpolationInputRange,\n outputRange: [\n adjacentItemOpacity,\n activeItemOpacity,\n adjacentItemOpacity,\n ],\n extrapolate: 'clamp',\n });\n\n return {\n transform: [\n { translateX: translate },\n { scale },\n ],\n zIndex,\n opacity,\n };\n };\n\n return createItemStyle;\n};\n"],"mappings":";;;;;;;AACA;;AAUA,MAAMA,8BAA2E,GAAG;EAChFC,eAAe,EAAE,GAD+D;EAEhFC,iBAAiB,EAAE,CAF6D;EAGhFC,iBAAiB,EAAEC,IAAI,CAACC,GAAL,CAAS,GAAT,EAAc,CAAd,CAH6D;EAIhFC,mBAAmB,EAAE,GAJ2D;EAKhFC,eAAe,EAAE;AAL+D,CAApF;;AAQe,SAASC,wBAAT,GAAoG;EAAA,IAAlEC,MAAkE,uEAAhCT,8BAAgC;EAC/G,MAAM;IACFE,iBADE;IAEFD,eAFE;IAGFK,mBAHE;IAIFH,iBAJE;IAKFI;EALE,IAMiC,EACnC,GAAGP,8BADgC;IAEnC,GAAGS;EAFgC,CANvC;;EAWA,MAAMC,eAAgC,GAAG,CAACC,iBAAD,EAAoBC,SAApB,KAAkC;IACvE,MAAMC,SAAS,GAAGF,iBAAiB,CAACG,WAAlB,CAA8B;MAC5CC,UAAU,EAAEC,2CADgC;MAE5CC,WAAW,EAAE,CACT,CAACL,SAAD,GAAaL,eADJ,EAET,CAFS,EAGTK,SAAS,GAAGL,eAHH;IAF+B,CAA9B,CAAlB;IASA,MAAMW,MAAM,GAAGP,iBAAiB,CAACG,WAAlB,CAA8B;MACzCC,UAAU,EAAEC,2CAD6B;MAEzCC,WAAW,EAAE,CAAC,CAAD,EAAIL,SAAJ,EAAe,CAAf,CAF4B;MAGzCO,WAAW,EAAE;IAH4B,CAA9B,CAAf;IAMA,MAAMC,KAAK,GAAGT,iBAAiB,CAACG,WAAlB,CAA8B;MACxCC,UAAU,EAAEC,2CAD4B;MAExCC,WAAW,EAAE,CACTd,iBADS,EAETF,eAFS,EAGTE,iBAHS,CAF2B;MAOxCgB,WAAW,EAAE;IAP2B,CAA9B,CAAd;IAUA,MAAME,OAAO,GAAGV,iBAAiB,CAACG,WAAlB,CAA8B;MAC1CC,UAAU,EAAEC,2CAD8B;MAE1CC,WAAW,EAAE,CACTX,mBADS,EAETJ,iBAFS,EAGTI,mBAHS,CAF6B;MAO1Ca,WAAW,EAAE;IAP6B,CAA9B,CAAhB;IAUA,OAAO;MACHG,SAAS,EAAE,CACP;QAAEC,UAAU,EAAEV;MAAd,CADO,EAEP;QAAEO;MAAF,CAFO,CADR;MAKHF,MALG;MAMHG;IANG,CAAP;EAQH,CA5CD;;EA8CA,OAAOX,eAAP;AACH;;AAAA"}
@@ -11,7 +11,7 @@ var _reactNative = require("react-native");
11
11
 
12
12
  var _core = require("@fountain-ui/core");
13
13
 
14
- var _hooks = require("../hooks");
14
+ var _useItemInterpolation = _interopRequireDefault(require("./useItemInterpolation"));
15
15
 
16
16
  var _InternalContext = _interopRequireDefault(require("./InternalContext"));
17
17
 
@@ -34,7 +34,7 @@ function ItemView(props) {
34
34
  itemVisibilityStore
35
35
  } = (0, _react.useContext)(_InternalContext.default);
36
36
  const [visible, setVisible] = (0, _react.useState)(false);
37
- const interpolation = (0, _hooks.useItemInterpolation)(index);
37
+ const interpolation = (0, _useItemInterpolation.default)(index);
38
38
  const itemStyle = (0, _react.useMemo)(() => createItemStyle(interpolation, itemWidth), [createItemStyle, interpolation]);
39
39
  (0, _react.useEffect)(() => {
40
40
  return itemVisibilityStore.subscribe(ranges => {
@@ -1 +1 @@
1
- {"version":3,"names":["ItemView","props","children","index","onLayout","createItemStyle","itemHeight","itemWidth","itemVisibilityStore","useContext","InternalContext","visible","setVisible","useState","interpolation","useItemInterpolation","itemStyle","useMemo","useEffect","subscribe","ranges","nextVisible","some","from","to","width","height","undefined","styles","absolute","StyleSheet","create","position"],"sources":["ItemView.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport React, { useContext, useEffect, useMemo, useState } from 'react';\nimport type { ViewProps } from 'react-native';\nimport { Animated } from 'react-native';\nimport { StyleSheet } from '@fountain-ui/core';\nimport { useItemInterpolation } from '../hooks';\nimport InternalContext from './InternalContext';\n\nexport interface ItemViewProps {\n children: (interpolation: Animated.AnimatedInterpolation) => ReactElement | null;\n index: number;\n onLayout?: ViewProps['onLayout'];\n}\n\nexport default function ItemView(props: ItemViewProps) {\n const {\n children,\n index,\n onLayout,\n } = props;\n\n const {\n createItemStyle,\n itemHeight,\n itemWidth,\n itemVisibilityStore,\n } = useContext(InternalContext);\n\n const [visible, setVisible] = useState(false);\n\n const interpolation = useItemInterpolation(index);\n\n const itemStyle = useMemo(\n () => createItemStyle(interpolation, itemWidth),\n [createItemStyle, interpolation],\n );\n\n useEffect(() => {\n return itemVisibilityStore.subscribe(ranges => {\n const nextVisible = ranges.some(([from, to]) => index >= from && index <= to);\n setVisible(nextVisible);\n });\n }, [itemVisibilityStore]);\n\n return (\n <Animated.View\n children={visible ? children(interpolation) : null}\n onLayout={onLayout}\n style={[\n {\n width: itemWidth,\n height: itemHeight !== 'auto' ? itemHeight : undefined,\n },\n styles.absolute,\n // @ts-ignore\n itemStyle,\n ]}\n />\n );\n};\n\nconst styles = StyleSheet.create({\n absolute: {\n position: 'absolute',\n },\n});\n"],"mappings":";;;;;;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;;;;;AAQe,SAASA,QAAT,CAAkBC,KAAlB,EAAwC;EACnD,MAAM;IACFC,QADE;IAEFC,KAFE;IAGFC;EAHE,IAIFH,KAJJ;EAMA,MAAM;IACFI,eADE;IAEFC,UAFE;IAGFC,SAHE;IAIFC;EAJE,IAKF,IAAAC,iBAAA,EAAWC,wBAAX,CALJ;EAOA,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwB,IAAAC,eAAA,EAAS,KAAT,CAA9B;EAEA,MAAMC,aAAa,GAAG,IAAAC,2BAAA,EAAqBZ,KAArB,CAAtB;EAEA,MAAMa,SAAS,GAAG,IAAAC,cAAA,EACd,MAAMZ,eAAe,CAACS,aAAD,EAAgBP,SAAhB,CADP,EAEd,CAACF,eAAD,EAAkBS,aAAlB,CAFc,CAAlB;EAKA,IAAAI,gBAAA,EAAU,MAAM;IACZ,OAAOV,mBAAmB,CAACW,SAApB,CAA8BC,MAAM,IAAI;MAC3C,MAAMC,WAAW,GAAGD,MAAM,CAACE,IAAP,CAAY;QAAA,IAAC,CAACC,IAAD,EAAOC,EAAP,CAAD;QAAA,OAAgBrB,KAAK,IAAIoB,IAAT,IAAiBpB,KAAK,IAAIqB,EAA1C;MAAA,CAAZ,CAApB;MACAZ,UAAU,CAACS,WAAD,CAAV;IACH,CAHM,CAAP;EAIH,CALD,EAKG,CAACb,mBAAD,CALH;EAOA,oBACI,6BAAC,qBAAD,CAAU,IAAV;IACI,QAAQ,EAAEG,OAAO,GAAGT,QAAQ,CAACY,aAAD,CAAX,GAA6B,IADlD;IAEI,QAAQ,EAAEV,QAFd;IAGI,KAAK,EAAE,CACH;MACIqB,KAAK,EAAElB,SADX;MAEImB,MAAM,EAAEpB,UAAU,KAAK,MAAf,GAAwBA,UAAxB,GAAqCqB;IAFjD,CADG,EAKHC,MAAM,CAACC,QALJ,EAMH;IACAb,SAPG;EAHX,EADJ;AAeH;;AAAA;;AAED,MAAMY,MAAM,GAAGE,gBAAA,CAAWC,MAAX,CAAkB;EAC7BF,QAAQ,EAAE;IACNG,QAAQ,EAAE;EADJ;AADmB,CAAlB,CAAf"}
1
+ {"version":3,"names":["ItemView","props","children","index","onLayout","createItemStyle","itemHeight","itemWidth","itemVisibilityStore","useContext","InternalContext","visible","setVisible","useState","interpolation","useItemInterpolation","itemStyle","useMemo","useEffect","subscribe","ranges","nextVisible","some","from","to","width","height","undefined","styles","absolute","StyleSheet","create","position"],"sources":["ItemView.tsx"],"sourcesContent":["import type { ReactElement } from 'react';\nimport React, { useContext, useEffect, useMemo, useState } from 'react';\nimport type { ViewProps } from 'react-native';\nimport { Animated } from 'react-native';\nimport { StyleSheet } from '@fountain-ui/core';\nimport useItemInterpolation from './useItemInterpolation';\nimport InternalContext from './InternalContext';\n\nexport interface ItemViewProps {\n children: (interpolation: Animated.AnimatedInterpolation) => ReactElement | null;\n index: number;\n onLayout?: ViewProps['onLayout'];\n}\n\nexport default function ItemView(props: ItemViewProps) {\n const {\n children,\n index,\n onLayout,\n } = props;\n\n const {\n createItemStyle,\n itemHeight,\n itemWidth,\n itemVisibilityStore,\n } = useContext(InternalContext);\n\n const [visible, setVisible] = useState(false);\n\n const interpolation = useItemInterpolation(index);\n\n const itemStyle = useMemo(\n () => createItemStyle(interpolation, itemWidth),\n [createItemStyle, interpolation],\n );\n\n useEffect(() => {\n return itemVisibilityStore.subscribe(ranges => {\n const nextVisible = ranges.some(([from, to]) => index >= from && index <= to);\n setVisible(nextVisible);\n });\n }, [itemVisibilityStore]);\n\n return (\n <Animated.View\n children={visible ? children(interpolation) : null}\n onLayout={onLayout}\n style={[\n {\n width: itemWidth,\n height: itemHeight !== 'auto' ? itemHeight : undefined,\n },\n styles.absolute,\n // @ts-ignore\n itemStyle,\n ]}\n />\n );\n};\n\nconst styles = StyleSheet.create({\n absolute: {\n position: 'absolute',\n },\n});\n"],"mappings":";;;;;;;AACA;;AAEA;;AACA;;AACA;;AACA;;;;;;;;AAQe,SAASA,QAAT,CAAkBC,KAAlB,EAAwC;EACnD,MAAM;IACFC,QADE;IAEFC,KAFE;IAGFC;EAHE,IAIFH,KAJJ;EAMA,MAAM;IACFI,eADE;IAEFC,UAFE;IAGFC,SAHE;IAIFC;EAJE,IAKF,IAAAC,iBAAA,EAAWC,wBAAX,CALJ;EAOA,MAAM,CAACC,OAAD,EAAUC,UAAV,IAAwB,IAAAC,eAAA,EAAS,KAAT,CAA9B;EAEA,MAAMC,aAAa,GAAG,IAAAC,6BAAA,EAAqBZ,KAArB,CAAtB;EAEA,MAAMa,SAAS,GAAG,IAAAC,cAAA,EACd,MAAMZ,eAAe,CAACS,aAAD,EAAgBP,SAAhB,CADP,EAEd,CAACF,eAAD,EAAkBS,aAAlB,CAFc,CAAlB;EAKA,IAAAI,gBAAA,EAAU,MAAM;IACZ,OAAOV,mBAAmB,CAACW,SAApB,CAA8BC,MAAM,IAAI;MAC3C,MAAMC,WAAW,GAAGD,MAAM,CAACE,IAAP,CAAY;QAAA,IAAC,CAACC,IAAD,EAAOC,EAAP,CAAD;QAAA,OAAgBrB,KAAK,IAAIoB,IAAT,IAAiBpB,KAAK,IAAIqB,EAA1C;MAAA,CAAZ,CAApB;MACAZ,UAAU,CAACS,WAAD,CAAV;IACH,CAHM,CAAP;EAIH,CALD,EAKG,CAACb,mBAAD,CALH;EAOA,oBACI,6BAAC,qBAAD,CAAU,IAAV;IACI,QAAQ,EAAEG,OAAO,GAAGT,QAAQ,CAACY,aAAD,CAAX,GAA6B,IADlD;IAEI,QAAQ,EAAEV,QAFd;IAGI,KAAK,EAAE,CACH;MACIqB,KAAK,EAAElB,SADX;MAEImB,MAAM,EAAEpB,UAAU,KAAK,MAAf,GAAwBA,UAAxB,GAAqCqB;IAFjD,CADG,EAKHC,MAAM,CAACC,QALJ,EAMH;IACAb,SAPG;EAHX,EADJ;AAeH;;AAAA;;AAED,MAAMY,MAAM,GAAGE,gBAAA,CAAWC,MAAX,CAAkB;EAC7BF,QAAQ,EAAE;IACNG,QAAQ,EAAE;EADJ;AADmB,CAAlB,CAAf"}
@@ -19,7 +19,7 @@ const SCROLL_TO_ADJACENT_TX_THRESHOLD = 80;
19
19
  const SCROLL_TO_ADJACENT_VX_THRESHOLD = 1000;
20
20
  const ACTIVE_OFFSET_ABS_X = 5;
21
21
  const activeOffsetX = [-ACTIVE_OFFSET_ABS_X, ACTIVE_OFFSET_ABS_X];
22
- const endAnimationStates = [_reactNativeGestureHandler.State.CANCELLED, _reactNativeGestureHandler.State.END];
22
+ const endAnimationStates = [_reactNativeGestureHandler.State.CANCELLED, _reactNativeGestureHandler.State.END, _reactNativeGestureHandler.State.FAILED];
23
23
 
24
24
  function shouldScrollToAdjacent(translationX, velocityX) {
25
25
  const isSameDirection = translationX * velocityX > 0;
@@ -31,8 +31,8 @@ function ScrollViewGesture(props) {
31
31
  const {
32
32
  autoplayController,
33
33
  children,
34
- finalizeAnimation,
35
- offsetTx,
34
+ interruptAnimation,
35
+ translateX,
36
36
  scrollEnabled,
37
37
  startPagingAnimation
38
38
  } = props;
@@ -42,11 +42,11 @@ function ScrollViewGesture(props) {
42
42
  } = autoplayController;
43
43
  const handleGestureBegin = (0, _react.useCallback)(() => {
44
44
  pauseAutoplay();
45
- finalizeAnimation();
46
- }, [finalizeAnimation, pauseAutoplay]);
45
+ interruptAnimation();
46
+ }, [interruptAnimation, pauseAutoplay]);
47
47
  const handleGestureEvent = (0, _react.useCallback)(_reactNative.Animated.event([{
48
48
  nativeEvent: {
49
- translationX: offsetTx
49
+ translationX: translateX
50
50
  }
51
51
  }], {
52
52
  useNativeDriver: true
@@ -1 +1 @@
1
- {"version":3,"names":["SCROLL_TO_ADJACENT_TX_THRESHOLD","SCROLL_TO_ADJACENT_VX_THRESHOLD","ACTIVE_OFFSET_ABS_X","activeOffsetX","endAnimationStates","GestureHandlerState","CANCELLED","END","shouldScrollToAdjacent","translationX","velocityX","isSameDirection","isEnoughMovement","Math","abs","ScrollViewGesture","props","autoplayController","children","finalizeAnimation","offsetTx","scrollEnabled","startPagingAnimation","pause","pauseAutoplay","resume","resumeAutoplay","handleGestureBegin","useCallback","handleGestureEvent","Animated","event","nativeEvent","useNativeDriver","handleHandlerStateChange","state","includes","direction","isOriginatedFromGesture"],"sources":["ScrollViewGesture.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport React, { useCallback } from 'react';\nimport { Animated } from 'react-native';\nimport type { PanGestureHandlerStateChangeEvent } from 'react-native-gesture-handler';\nimport { PanGestureHandler, State as GestureHandlerState } from 'react-native-gesture-handler';\nimport type { AutoplayController, PagingDirection, StartPagingAnimation } from '../types';\n\nexport interface ScrollViewGestureProps {\n autoplayController: AutoplayController;\n children: ReactNode;\n finalizeAnimation: () => void;\n offsetTx: Animated.Value,\n scrollEnabled: boolean;\n startPagingAnimation: StartPagingAnimation;\n}\n\nconst SCROLL_TO_ADJACENT_TX_THRESHOLD = 80;\nconst SCROLL_TO_ADJACENT_VX_THRESHOLD = 1000;\n\nconst ACTIVE_OFFSET_ABS_X = 5;\nconst activeOffsetX: number[] = [-ACTIVE_OFFSET_ABS_X, ACTIVE_OFFSET_ABS_X];\n\nconst endAnimationStates: Readonly<GestureHandlerState[]> = [\n GestureHandlerState.CANCELLED,\n GestureHandlerState.END,\n];\n\nfunction shouldScrollToAdjacent(translationX: number, velocityX: number): boolean {\n const isSameDirection = translationX * velocityX > 0;\n const isEnoughMovement =\n Math.abs(translationX) >= SCROLL_TO_ADJACENT_TX_THRESHOLD\n || Math.abs(velocityX) >= SCROLL_TO_ADJACENT_VX_THRESHOLD;\n\n return isSameDirection && isEnoughMovement;\n}\n\nexport default function ScrollViewGesture(props: ScrollViewGestureProps) {\n const {\n autoplayController,\n children,\n finalizeAnimation,\n offsetTx,\n scrollEnabled,\n startPagingAnimation,\n } = props;\n\n const { pause: pauseAutoplay, resume: resumeAutoplay } = autoplayController;\n\n const handleGestureBegin = useCallback(() => {\n pauseAutoplay();\n\n finalizeAnimation();\n }, [finalizeAnimation, pauseAutoplay]);\n\n const handleGestureEvent = useCallback(Animated.event(\n [{ nativeEvent: { translationX: offsetTx } }],\n { useNativeDriver: true },\n ), []);\n\n const handleHandlerStateChange = useCallback((event: PanGestureHandlerStateChangeEvent) => {\n const { nativeEvent: { translationX, velocityX, state } } = event;\n\n if (endAnimationStates.includes(state)) {\n const direction: PagingDirection = shouldScrollToAdjacent(translationX, velocityX)\n ? (translationX < 0 ? 'next' : 'prev')\n : 'stay';\n\n startPagingAnimation(\n 'directional',\n { direction: direction, isOriginatedFromGesture: true },\n );\n\n resumeAutoplay();\n }\n }, [startPagingAnimation, resumeAutoplay]);\n\n return (\n <PanGestureHandler\n activeOffsetX={activeOffsetX}\n children={children}\n enabled={scrollEnabled}\n onBegan={handleGestureBegin}\n onGestureEvent={handleGestureEvent}\n onHandlerStateChange={handleHandlerStateChange}\n />\n );\n}\n"],"mappings":";;;;;;;AACA;;AACA;;AAEA;;;;;;AAYA,MAAMA,+BAA+B,GAAG,EAAxC;AACA,MAAMC,+BAA+B,GAAG,IAAxC;AAEA,MAAMC,mBAAmB,GAAG,CAA5B;AACA,MAAMC,aAAuB,GAAG,CAAC,CAACD,mBAAF,EAAuBA,mBAAvB,CAAhC;AAEA,MAAME,kBAAmD,GAAG,CACxDC,gCAAA,CAAoBC,SADoC,EAExDD,gCAAA,CAAoBE,GAFoC,CAA5D;;AAKA,SAASC,sBAAT,CAAgCC,YAAhC,EAAsDC,SAAtD,EAAkF;EAC9E,MAAMC,eAAe,GAAGF,YAAY,GAAGC,SAAf,GAA2B,CAAnD;EACA,MAAME,gBAAgB,GAClBC,IAAI,CAACC,GAAL,CAASL,YAAT,KAA0BT,+BAA1B,IACGa,IAAI,CAACC,GAAL,CAASJ,SAAT,KAAuBT,+BAF9B;EAIA,OAAOU,eAAe,IAAIC,gBAA1B;AACH;;AAEc,SAASG,iBAAT,CAA2BC,KAA3B,EAA0D;EACrE,MAAM;IACFC,kBADE;IAEFC,QAFE;IAGFC,iBAHE;IAIFC,QAJE;IAKFC,aALE;IAMFC;EANE,IAOFN,KAPJ;EASA,MAAM;IAAEO,KAAK,EAAEC,aAAT;IAAwBC,MAAM,EAAEC;EAAhC,IAAmDT,kBAAzD;EAEA,MAAMU,kBAAkB,GAAG,IAAAC,kBAAA,EAAY,MAAM;IACzCJ,aAAa;IAEbL,iBAAiB;EACpB,CAJ0B,EAIxB,CAACA,iBAAD,EAAoBK,aAApB,CAJwB,CAA3B;EAMA,MAAMK,kBAAkB,GAAG,IAAAD,kBAAA,EAAYE,qBAAA,CAASC,KAAT,CACnC,CAAC;IAAEC,WAAW,EAAE;MAAEvB,YAAY,EAAEW;IAAhB;EAAf,CAAD,CADmC,EAEnC;IAAEa,eAAe,EAAE;EAAnB,CAFmC,CAAZ,EAGxB,EAHwB,CAA3B;EAKA,MAAMC,wBAAwB,GAAG,IAAAN,kBAAA,EAAaG,KAAD,IAA8C;IACvF,MAAM;MAAEC,WAAW,EAAE;QAAEvB,YAAF;QAAgBC,SAAhB;QAA2ByB;MAA3B;IAAf,IAAsDJ,KAA5D;;IAEA,IAAI3B,kBAAkB,CAACgC,QAAnB,CAA4BD,KAA5B,CAAJ,EAAwC;MACpC,MAAME,SAA0B,GAAG7B,sBAAsB,CAACC,YAAD,EAAeC,SAAf,CAAtB,GAC5BD,YAAY,GAAG,CAAf,GAAmB,MAAnB,GAA4B,MADA,GAE7B,MAFN;MAIAa,oBAAoB,CAChB,aADgB,EAEhB;QAAEe,SAAS,EAAEA,SAAb;QAAwBC,uBAAuB,EAAE;MAAjD,CAFgB,CAApB;MAKAZ,cAAc;IACjB;EACJ,CAfgC,EAe9B,CAACJ,oBAAD,EAAuBI,cAAvB,CAf8B,CAAjC;EAiBA,oBACI,6BAAC,4CAAD;IACI,aAAa,EAAEvB,aADnB;IAEI,QAAQ,EAAEe,QAFd;IAGI,OAAO,EAAEG,aAHb;IAII,OAAO,EAAEM,kBAJb;IAKI,cAAc,EAAEE,kBALpB;IAMI,oBAAoB,EAAEK;EAN1B,EADJ;AAUH"}
1
+ {"version":3,"names":["SCROLL_TO_ADJACENT_TX_THRESHOLD","SCROLL_TO_ADJACENT_VX_THRESHOLD","ACTIVE_OFFSET_ABS_X","activeOffsetX","endAnimationStates","GestureHandlerState","CANCELLED","END","FAILED","shouldScrollToAdjacent","translationX","velocityX","isSameDirection","isEnoughMovement","Math","abs","ScrollViewGesture","props","autoplayController","children","interruptAnimation","translateX","scrollEnabled","startPagingAnimation","pause","pauseAutoplay","resume","resumeAutoplay","handleGestureBegin","useCallback","handleGestureEvent","Animated","event","nativeEvent","useNativeDriver","handleHandlerStateChange","state","includes","direction","isOriginatedFromGesture"],"sources":["ScrollViewGesture.tsx"],"sourcesContent":["import type { ReactNode } from 'react';\nimport React, { useCallback } from 'react';\nimport { Animated } from 'react-native';\nimport type { PanGestureHandlerStateChangeEvent } from 'react-native-gesture-handler';\nimport { PanGestureHandler, State as GestureHandlerState } from 'react-native-gesture-handler';\nimport type { AutoplayController, PagingDirection, StartPagingAnimation } from '../types';\n\nexport interface ScrollViewGestureProps {\n autoplayController: AutoplayController;\n children: ReactNode;\n interruptAnimation: () => void;\n translateX: Animated.Value,\n scrollEnabled: boolean;\n startPagingAnimation: StartPagingAnimation;\n}\n\nconst SCROLL_TO_ADJACENT_TX_THRESHOLD = 80;\nconst SCROLL_TO_ADJACENT_VX_THRESHOLD = 1000;\n\nconst ACTIVE_OFFSET_ABS_X = 5;\nconst activeOffsetX: number[] = [-ACTIVE_OFFSET_ABS_X, ACTIVE_OFFSET_ABS_X];\n\nconst endAnimationStates: Readonly<GestureHandlerState[]> = [\n GestureHandlerState.CANCELLED,\n GestureHandlerState.END,\n GestureHandlerState.FAILED,\n];\n\nfunction shouldScrollToAdjacent(translationX: number, velocityX: number): boolean {\n const isSameDirection = translationX * velocityX > 0;\n const isEnoughMovement =\n Math.abs(translationX) >= SCROLL_TO_ADJACENT_TX_THRESHOLD\n || Math.abs(velocityX) >= SCROLL_TO_ADJACENT_VX_THRESHOLD;\n\n return isSameDirection && isEnoughMovement;\n}\n\nexport default function ScrollViewGesture(props: ScrollViewGestureProps) {\n const {\n autoplayController,\n children,\n interruptAnimation,\n translateX,\n scrollEnabled,\n startPagingAnimation,\n } = props;\n\n const { pause: pauseAutoplay, resume: resumeAutoplay } = autoplayController;\n\n const handleGestureBegin = useCallback(() => {\n pauseAutoplay();\n\n interruptAnimation();\n }, [interruptAnimation, pauseAutoplay]);\n\n const handleGestureEvent = useCallback(Animated.event(\n [{ nativeEvent: { translationX: translateX } }],\n { useNativeDriver: true },\n ), []);\n\n const handleHandlerStateChange = useCallback((event: PanGestureHandlerStateChangeEvent) => {\n const { nativeEvent: { translationX, velocityX, state } } = event;\n\n if (endAnimationStates.includes(state)) {\n const direction: PagingDirection = shouldScrollToAdjacent(translationX, velocityX)\n ? (translationX < 0 ? 'next' : 'prev')\n : 'stay';\n\n startPagingAnimation(\n 'directional',\n { direction: direction, isOriginatedFromGesture: true },\n );\n\n resumeAutoplay();\n }\n }, [startPagingAnimation, resumeAutoplay]);\n\n return (\n <PanGestureHandler\n activeOffsetX={activeOffsetX}\n children={children}\n enabled={scrollEnabled}\n onBegan={handleGestureBegin}\n onGestureEvent={handleGestureEvent}\n onHandlerStateChange={handleHandlerStateChange}\n />\n );\n}\n"],"mappings":";;;;;;;AACA;;AACA;;AAEA;;;;;;AAYA,MAAMA,+BAA+B,GAAG,EAAxC;AACA,MAAMC,+BAA+B,GAAG,IAAxC;AAEA,MAAMC,mBAAmB,GAAG,CAA5B;AACA,MAAMC,aAAuB,GAAG,CAAC,CAACD,mBAAF,EAAuBA,mBAAvB,CAAhC;AAEA,MAAME,kBAAmD,GAAG,CACxDC,gCAAA,CAAoBC,SADoC,EAExDD,gCAAA,CAAoBE,GAFoC,EAGxDF,gCAAA,CAAoBG,MAHoC,CAA5D;;AAMA,SAASC,sBAAT,CAAgCC,YAAhC,EAAsDC,SAAtD,EAAkF;EAC9E,MAAMC,eAAe,GAAGF,YAAY,GAAGC,SAAf,GAA2B,CAAnD;EACA,MAAME,gBAAgB,GAClBC,IAAI,CAACC,GAAL,CAASL,YAAT,KAA0BV,+BAA1B,IACGc,IAAI,CAACC,GAAL,CAASJ,SAAT,KAAuBV,+BAF9B;EAIA,OAAOW,eAAe,IAAIC,gBAA1B;AACH;;AAEc,SAASG,iBAAT,CAA2BC,KAA3B,EAA0D;EACrE,MAAM;IACFC,kBADE;IAEFC,QAFE;IAGFC,kBAHE;IAIFC,UAJE;IAKFC,aALE;IAMFC;EANE,IAOFN,KAPJ;EASA,MAAM;IAAEO,KAAK,EAAEC,aAAT;IAAwBC,MAAM,EAAEC;EAAhC,IAAmDT,kBAAzD;EAEA,MAAMU,kBAAkB,GAAG,IAAAC,kBAAA,EAAY,MAAM;IACzCJ,aAAa;IAEbL,kBAAkB;EACrB,CAJ0B,EAIxB,CAACA,kBAAD,EAAqBK,aAArB,CAJwB,CAA3B;EAMA,MAAMK,kBAAkB,GAAG,IAAAD,kBAAA,EAAYE,qBAAA,CAASC,KAAT,CACnC,CAAC;IAAEC,WAAW,EAAE;MAAEvB,YAAY,EAAEW;IAAhB;EAAf,CAAD,CADmC,EAEnC;IAAEa,eAAe,EAAE;EAAnB,CAFmC,CAAZ,EAGxB,EAHwB,CAA3B;EAKA,MAAMC,wBAAwB,GAAG,IAAAN,kBAAA,EAAaG,KAAD,IAA8C;IACvF,MAAM;MAAEC,WAAW,EAAE;QAAEvB,YAAF;QAAgBC,SAAhB;QAA2ByB;MAA3B;IAAf,IAAsDJ,KAA5D;;IAEA,IAAI5B,kBAAkB,CAACiC,QAAnB,CAA4BD,KAA5B,CAAJ,EAAwC;MACpC,MAAME,SAA0B,GAAG7B,sBAAsB,CAACC,YAAD,EAAeC,SAAf,CAAtB,GAC5BD,YAAY,GAAG,CAAf,GAAmB,MAAnB,GAA4B,MADA,GAE7B,MAFN;MAIAa,oBAAoB,CAChB,aADgB,EAEhB;QAAEe,SAAS,EAAEA,SAAb;QAAwBC,uBAAuB,EAAE;MAAjD,CAFgB,CAApB;MAKAZ,cAAc;IACjB;EACJ,CAfgC,EAe9B,CAACJ,oBAAD,EAAuBI,cAAvB,CAf8B,CAAjC;EAiBA,oBACI,6BAAC,4CAAD;IACI,aAAa,EAAExB,aADnB;IAEI,QAAQ,EAAEgB,QAFd;IAGI,OAAO,EAAEG,aAHb;IAII,OAAO,EAAEM,kBAJb;IAKI,cAAc,EAAEE,kBALpB;IAMI,oBAAoB,EAAEK;EAN1B,EADJ;AAUH"}
@@ -9,7 +9,9 @@ var _react = require("react");
9
9
 
10
10
  var _reactNative = require("react-native");
11
11
 
12
- var _components = require("../components");
12
+ var _InternalContext = _interopRequireDefault(require("./InternalContext"));
13
+
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
15
 
14
16
  const OVERSCROLL_FRICTION_FACTOR = 4;
15
17
 
@@ -19,7 +21,7 @@ function useItemInterpolation(index) {
19
21
  data,
20
22
  globalInterpolation,
21
23
  loop
22
- } = (0, _react.useContext)(_components.InternalContext);
24
+ } = (0, _react.useContext)(_InternalContext.default);
23
25
  const numberOfData = data.length;
24
26
  const interpolationConfigOnLoop = (0, _react.useMemo)(() => {
25
27
  const lastIndex = numberOfData - 1;
@@ -54,8 +56,8 @@ function useItemInterpolation(index) {
54
56
  }, [index, itemWidth, numberOfData]);
55
57
  return (0, _react.useMemo)(() => {
56
58
  const interpolationConfig = loop ? interpolationConfigOnLoop : interpolationConfigOnNoLoop;
57
- const offsetX = globalInterpolation.interpolate(interpolationConfig);
58
- return _reactNative.Animated.divide(offsetX, itemWidth);
59
+ const localOffsetX = globalInterpolation.interpolate(interpolationConfig);
60
+ return _reactNative.Animated.divide(localOffsetX, itemWidth);
59
61
  }, [globalInterpolation, interpolationConfigOnLoop, interpolationConfigOnNoLoop, itemWidth, loop]);
60
62
  }
61
63
 
@@ -0,0 +1 @@
1
+ {"version":3,"names":["OVERSCROLL_FRICTION_FACTOR","useItemInterpolation","index","itemWidth","data","globalInterpolation","loop","useContext","InternalContext","numberOfData","length","interpolationConfigOnLoop","useMemo","lastIndex","maxWidth","Math","abs","halfOfItemWidth","positiveCount","round","startPosition","max","min","inputRange","Number","MIN_VALUE","outputRange","extrapolate","interpolationConfigOnNoLoop","friction","interpolationConfig","localOffsetX","interpolate","Animated","divide"],"sources":["useItemInterpolation.ts"],"sourcesContent":["import { useContext, useMemo } from 'react';\nimport { Animated } from 'react-native';\nimport InternalContext from './InternalContext';\n\nconst OVERSCROLL_FRICTION_FACTOR = 4;\n\nexport default function useItemInterpolation(index: number): Animated.AnimatedInterpolation {\n const {\n itemWidth,\n data,\n globalInterpolation,\n loop,\n } = useContext(InternalContext);\n\n const numberOfData = data.length;\n\n const interpolationConfigOnLoop = useMemo<Animated.InterpolationConfigType>(() => {\n const lastIndex = numberOfData - 1;\n const maxWidth = Math.abs(itemWidth * numberOfData);\n const halfOfItemWidth = 0.5 * itemWidth;\n\n const positiveCount = Math.round(lastIndex / 2);\n const startPosition = index > positiveCount\n ? (index - numberOfData) * itemWidth\n : itemWidth * index;\n\n const max = positiveCount * itemWidth;\n const min = -((lastIndex - positiveCount) * itemWidth);\n\n const inputRange = [\n -maxWidth,\n min - halfOfItemWidth - startPosition - Number.MIN_VALUE,\n min - halfOfItemWidth - startPosition,\n 0,\n max + halfOfItemWidth - startPosition,\n max + halfOfItemWidth - startPosition + Number.MIN_VALUE,\n maxWidth,\n ];\n\n const outputRange = [\n startPosition,\n max + halfOfItemWidth - Number.MIN_VALUE,\n min - halfOfItemWidth,\n startPosition,\n max + halfOfItemWidth,\n min - halfOfItemWidth + Number.MIN_VALUE,\n startPosition,\n ];\n\n return {\n inputRange,\n outputRange,\n extrapolate: 'clamp',\n };\n }, [\n index,\n itemWidth,\n numberOfData,\n ]);\n\n const interpolationConfigOnNoLoop = useMemo<Animated.InterpolationConfigType>(() => {\n const lastIndex = numberOfData - 1;\n const maxWidth = itemWidth * lastIndex;\n const startPosition = itemWidth * index;\n const friction = itemWidth / OVERSCROLL_FRICTION_FACTOR;\n\n const inputRange = [\n -(maxWidth + itemWidth), // overscroll\n -maxWidth,\n 0,\n itemWidth, // overscroll\n ];\n\n const outputRange = [\n -maxWidth + startPosition - friction,\n -maxWidth + startPosition,\n startPosition,\n startPosition + friction,\n ];\n\n return {\n inputRange,\n outputRange,\n extrapolate: 'clamp',\n };\n }, [\n index,\n itemWidth,\n numberOfData,\n ]);\n\n return useMemo(() => {\n const interpolationConfig = loop\n ? interpolationConfigOnLoop\n : interpolationConfigOnNoLoop;\n\n const localOffsetX = globalInterpolation.interpolate(interpolationConfig);\n\n return Animated.divide(localOffsetX, itemWidth);\n }, [\n globalInterpolation,\n interpolationConfigOnLoop,\n interpolationConfigOnNoLoop,\n itemWidth,\n loop,\n ]);\n};\n"],"mappings":"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"}
@@ -9,24 +9,12 @@ Object.defineProperty(exports, "useAutoplayController", {
9
9
  return _useAutoplayController.default;
10
10
  }
11
11
  });
12
- Object.defineProperty(exports, "useDimensionChangeReaction", {
13
- enumerable: true,
14
- get: function () {
15
- return _useDimensionChangeReaction.default;
16
- }
17
- });
18
12
  Object.defineProperty(exports, "useIndexController", {
19
13
  enumerable: true,
20
14
  get: function () {
21
15
  return _useIndexController.default;
22
16
  }
23
17
  });
24
- Object.defineProperty(exports, "useItemInterpolation", {
25
- enumerable: true,
26
- get: function () {
27
- return _useItemInterpolation.default;
28
- }
29
- });
30
18
  Object.defineProperty(exports, "useItemVisibilityStore", {
31
19
  enumerable: true,
32
20
  get: function () {
@@ -48,12 +36,8 @@ Object.defineProperty(exports, "usePagingAnimation", {
48
36
 
49
37
  var _useAutoplayController = _interopRequireDefault(require("./useAutoplayController"));
50
38
 
51
- var _useDimensionChangeReaction = _interopRequireDefault(require("./useDimensionChangeReaction"));
52
-
53
39
  var _useIndexController = _interopRequireDefault(require("./useIndexController"));
54
40
 
55
- var _useItemInterpolation = _interopRequireDefault(require("./useItemInterpolation"));
56
-
57
41
  var _useLoopedData = _interopRequireDefault(require("./useLoopedData"));
58
42
 
59
43
  var _usePagingAnimation = _interopRequireDefault(require("./usePagingAnimation"));
@@ -1 +1 @@
1
- {"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as useAutoplayController } from './useAutoplayController';\nexport { default as useDimensionChangeReaction } from './useDimensionChangeReaction';\nexport { default as useIndexController } from './useIndexController';\nexport { default as useItemInterpolation } from './useItemInterpolation';\nexport { default as useLoopedData } from './useLoopedData';\nexport { default as usePagingAnimation } from './usePagingAnimation';\nexport { default as useItemVisibilityStore } from './useItemVisibilityStore';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA"}
1
+ {"version":3,"names":[],"sources":["index.ts"],"sourcesContent":["export { default as useAutoplayController } from './useAutoplayController';\nexport { default as useIndexController } from './useIndexController';\nexport { default as useLoopedData } from './useLoopedData';\nexport { default as usePagingAnimation } from './usePagingAnimation';\nexport { default as useItemVisibilityStore } from './useItemVisibilityStore';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA"}
@@ -5,64 +5,42 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.default = useIndexController;
7
7
 
8
- var _react = _interopRequireWildcard(require("react"));
8
+ var _react = require("react");
9
9
 
10
- var _reactNative = require("react-native");
11
-
12
- function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
13
-
14
- function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && 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; }
15
-
16
- const normalizeIndex = (maybeIndex, numberOfData) => Math.abs(Math.floor(maybeIndex)) % numberOfData;
10
+ var _utils = require("@fountain-ui/utils");
17
11
 
18
12
  function useIndexController(params) {
19
13
  const {
20
- controlledTx,
21
14
  initialIndex,
22
15
  itemWidth,
23
16
  numberOfOriginalData,
24
17
  onIndexChange
25
18
  } = params;
26
- const indexRef = (0, _react.useRef)(initialIndex);
27
- const [index, setIndex] = (0, _react.useState)(indexRef.current);
28
- const maybeIndex = (0, _react.useMemo)(() => {
29
- const negative = new _reactNative.Animated.Value(-1);
30
-
31
- const reversedTx = _reactNative.Animated.multiply(controlledTx, negative);
32
-
33
- const normalized = _reactNative.Animated.divide(reversedTx, itemWidth);
34
-
35
- return _reactNative.Animated.modulo(normalized, numberOfOriginalData);
36
- }, [controlledTx, itemWidth, numberOfOriginalData]);
37
- (0, _react.useEffect)(() => {
38
- const subscriptionId = maybeIndex.addListener(observedValue => {
39
- const newIndex = normalizeIndex(observedValue.value, numberOfOriginalData);
40
-
41
- if (indexRef.current !== newIndex) {
42
- indexRef.current = newIndex;
43
- setIndex(newIndex);
44
- onIndexChange === null || onIndexChange === void 0 ? void 0 : onIndexChange(newIndex);
19
+ const currentIndexRef = (0, _react.useRef)(initialIndex);
20
+ const indexChangedRef = (0, _react.useRef)(false);
21
+ const getCurrentIndex = (0, _react.useCallback)(() => currentIndexRef.current, []);
22
+ const notifyAnimationState = (0, _react.useCallback)(state => {
23
+ if (state === 'finished' || state === 'interrupted') {
24
+ if (indexChangedRef.current) {
25
+ onIndexChange === null || onIndexChange === void 0 ? void 0 : onIndexChange(getCurrentIndex());
45
26
  }
46
- });
47
- return () => {
48
- maybeIndex.removeListener(subscriptionId);
49
- };
50
- }, [maybeIndex, numberOfOriginalData, onIndexChange]);
51
- const getCurrentIndex = (0, _react.useCallback)(() => indexRef.current, []);
27
+ }
28
+ }, [getCurrentIndex, onIndexChange]);
29
+ const notifyOffsetHasChanged = (0, _react.useCallback)(offset => {
30
+ const roundedOffset = Math.round(offset / itemWidth) * itemWidth; // To prevent floating point problem, make sure index is integer type.
31
+
32
+ const nextIndex = Math.floor((0, _utils.mod)(-roundedOffset / itemWidth, numberOfOriginalData));
33
+
34
+ if (nextIndex !== currentIndexRef.current) {
35
+ currentIndexRef.current = nextIndex;
36
+ indexChangedRef.current = true;
37
+ }
38
+ }, [itemWidth, numberOfOriginalData]);
52
39
  return {
53
- currentIndex: index,
54
40
  getCurrentIndex,
55
41
  lastIndex: numberOfOriginalData - 1,
56
- monitorElement: /*#__PURE__*/_react.default.createElement(_reactNative.Animated.View, {
57
- collapsable: false,
58
- style: [{
59
- zIndex: maybeIndex
60
- }, {
61
- width: 1,
62
- height: 1,
63
- position: 'absolute'
64
- }]
65
- })
42
+ notifyAnimationState,
43
+ notifyOffsetHasChanged
66
44
  };
67
45
  }
68
46
 
@@ -1 +1 @@
1
- {"version":3,"names":["normalizeIndex","maybeIndex","numberOfData","Math","abs","floor","useIndexController","params","controlledTx","initialIndex","itemWidth","numberOfOriginalData","onIndexChange","indexRef","useRef","index","setIndex","useState","current","useMemo","negative","Animated","Value","reversedTx","multiply","normalized","divide","modulo","useEffect","subscriptionId","addListener","observedValue","newIndex","value","removeListener","getCurrentIndex","useCallback","currentIndex","lastIndex","monitorElement","zIndex","width","height","position"],"sources":["useIndexController.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\nimport { Animated } from 'react-native';\nimport type { IndexController } from '../types';\n\nexport interface UseIndexControllerParameters {\n controlledTx: Animated.AnimatedValue;\n initialIndex: number;\n itemWidth: number;\n numberOfOriginalData: number;\n onIndexChange?: (newIndex: number) => void;\n}\n\nconst normalizeIndex = (maybeIndex: number, numberOfData: number): number =>\n Math.abs(Math.floor(maybeIndex)) % numberOfData;\n\nexport default function useIndexController(params: UseIndexControllerParameters): IndexController {\n const {\n controlledTx,\n initialIndex,\n itemWidth,\n numberOfOriginalData,\n onIndexChange,\n } = params;\n\n const indexRef = useRef<number>(initialIndex);\n const [index, setIndex] = useState<number>(indexRef.current);\n\n const maybeIndex = useMemo(() => {\n const negative = new Animated.Value(-1);\n const reversedTx = Animated.multiply(controlledTx, negative);\n const normalized = Animated.divide(reversedTx, itemWidth);\n return Animated.modulo(normalized, numberOfOriginalData);\n }, [\n controlledTx,\n itemWidth,\n numberOfOriginalData,\n ]);\n\n useEffect(() => {\n const subscriptionId = maybeIndex.addListener((observedValue) => {\n const newIndex = normalizeIndex(observedValue.value, numberOfOriginalData);\n\n if (indexRef.current !== newIndex) {\n indexRef.current = newIndex;\n setIndex(newIndex);\n\n onIndexChange?.(newIndex);\n }\n });\n\n return () => {\n maybeIndex.removeListener(subscriptionId);\n };\n }, [\n maybeIndex,\n numberOfOriginalData,\n onIndexChange,\n ]);\n\n const getCurrentIndex = useCallback(() => indexRef.current, []);\n\n return {\n currentIndex: index,\n getCurrentIndex,\n lastIndex: numberOfOriginalData - 1,\n monitorElement: (\n <Animated.View\n collapsable={false}\n style={[\n { zIndex: maybeIndex },\n { width: 1, height: 1, position: 'absolute' },\n ]}\n />\n ),\n };\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;;;;;AAWA,MAAMA,cAAc,GAAG,CAACC,UAAD,EAAqBC,YAArB,KACnBC,IAAI,CAACC,GAAL,CAASD,IAAI,CAACE,KAAL,CAAWJ,UAAX,CAAT,IAAmCC,YADvC;;AAGe,SAASI,kBAAT,CAA4BC,MAA5B,EAAmF;EAC9F,MAAM;IACFC,YADE;IAEFC,YAFE;IAGFC,SAHE;IAIFC,oBAJE;IAKFC;EALE,IAMFL,MANJ;EAQA,MAAMM,QAAQ,GAAG,IAAAC,aAAA,EAAeL,YAAf,CAAjB;EACA,MAAM,CAACM,KAAD,EAAQC,QAAR,IAAoB,IAAAC,eAAA,EAAiBJ,QAAQ,CAACK,OAA1B,CAA1B;EAEA,MAAMjB,UAAU,GAAG,IAAAkB,cAAA,EAAQ,MAAM;IAC7B,MAAMC,QAAQ,GAAG,IAAIC,qBAAA,CAASC,KAAb,CAAmB,CAAC,CAApB,CAAjB;;IACA,MAAMC,UAAU,GAAGF,qBAAA,CAASG,QAAT,CAAkBhB,YAAlB,EAAgCY,QAAhC,CAAnB;;IACA,MAAMK,UAAU,GAAGJ,qBAAA,CAASK,MAAT,CAAgBH,UAAhB,EAA4Bb,SAA5B,CAAnB;;IACA,OAAOW,qBAAA,CAASM,MAAT,CAAgBF,UAAhB,EAA4Bd,oBAA5B,CAAP;EACH,CALkB,EAKhB,CACCH,YADD,EAECE,SAFD,EAGCC,oBAHD,CALgB,CAAnB;EAWA,IAAAiB,gBAAA,EAAU,MAAM;IACZ,MAAMC,cAAc,GAAG5B,UAAU,CAAC6B,WAAX,CAAwBC,aAAD,IAAmB;MAC7D,MAAMC,QAAQ,GAAGhC,cAAc,CAAC+B,aAAa,CAACE,KAAf,EAAsBtB,oBAAtB,CAA/B;;MAEA,IAAIE,QAAQ,CAACK,OAAT,KAAqBc,QAAzB,EAAmC;QAC/BnB,QAAQ,CAACK,OAAT,GAAmBc,QAAnB;QACAhB,QAAQ,CAACgB,QAAD,CAAR;QAEApB,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAGoB,QAAH,CAAb;MACH;IACJ,CATsB,CAAvB;IAWA,OAAO,MAAM;MACT/B,UAAU,CAACiC,cAAX,CAA0BL,cAA1B;IACH,CAFD;EAGH,CAfD,EAeG,CACC5B,UADD,EAECU,oBAFD,EAGCC,aAHD,CAfH;EAqBA,MAAMuB,eAAe,GAAG,IAAAC,kBAAA,EAAY,MAAMvB,QAAQ,CAACK,OAA3B,EAAoC,EAApC,CAAxB;EAEA,OAAO;IACHmB,YAAY,EAAEtB,KADX;IAEHoB,eAFG;IAGHG,SAAS,EAAE3B,oBAAoB,GAAG,CAH/B;IAIH4B,cAAc,eACV,6BAAC,qBAAD,CAAU,IAAV;MACI,WAAW,EAAE,KADjB;MAEI,KAAK,EAAE,CACH;QAAEC,MAAM,EAAEvC;MAAV,CADG,EAEH;QAAEwC,KAAK,EAAE,CAAT;QAAYC,MAAM,EAAE,CAApB;QAAuBC,QAAQ,EAAE;MAAjC,CAFG;IAFX;EALD,CAAP;AAcH;;AAAA"}
1
+ {"version":3,"names":["useIndexController","params","initialIndex","itemWidth","numberOfOriginalData","onIndexChange","currentIndexRef","useRef","indexChangedRef","getCurrentIndex","useCallback","current","notifyAnimationState","state","notifyOffsetHasChanged","offset","roundedOffset","Math","round","nextIndex","floor","mod","lastIndex"],"sources":["useIndexController.tsx"],"sourcesContent":["import React, { useCallback, useRef } from 'react';\nimport { mod } from '@fountain-ui/utils';\nimport type { AnimationState, IndexController } from '../types';\n\nexport interface UseIndexControllerParameters {\n initialIndex: number;\n itemWidth: number;\n numberOfOriginalData: number;\n onIndexChange?: (newIndex: number) => void;\n}\n\nexport default function useIndexController(params: UseIndexControllerParameters): IndexController {\n const {\n initialIndex,\n itemWidth,\n numberOfOriginalData,\n onIndexChange,\n } = params;\n\n const currentIndexRef = useRef<number>(initialIndex);\n const indexChangedRef = useRef<boolean>(false);\n\n const getCurrentIndex = useCallback(() => currentIndexRef.current, []);\n\n const notifyAnimationState = useCallback((state: AnimationState) => {\n if (state === 'finished' || state === 'interrupted') {\n if (indexChangedRef.current) {\n onIndexChange?.(getCurrentIndex());\n }\n }\n }, [\n getCurrentIndex,\n onIndexChange,\n ]);\n\n const notifyOffsetHasChanged = useCallback((offset: number) => {\n const roundedOffset = Math.round(offset / itemWidth) * itemWidth;\n\n // To prevent floating point problem, make sure index is integer type.\n const nextIndex = Math.floor(mod((-roundedOffset / itemWidth), numberOfOriginalData));\n\n if (nextIndex !== currentIndexRef.current) {\n currentIndexRef.current = nextIndex;\n indexChangedRef.current = true;\n }\n }, [itemWidth, numberOfOriginalData]);\n\n return {\n getCurrentIndex,\n lastIndex: numberOfOriginalData - 1,\n notifyAnimationState,\n notifyOffsetHasChanged,\n };\n};\n"],"mappings":";;;;;;;AAAA;;AACA;;AAUe,SAASA,kBAAT,CAA4BC,MAA5B,EAAmF;EAC9F,MAAM;IACFC,YADE;IAEFC,SAFE;IAGFC,oBAHE;IAIFC;EAJE,IAKFJ,MALJ;EAOA,MAAMK,eAAe,GAAG,IAAAC,aAAA,EAAeL,YAAf,CAAxB;EACA,MAAMM,eAAe,GAAG,IAAAD,aAAA,EAAgB,KAAhB,CAAxB;EAEA,MAAME,eAAe,GAAG,IAAAC,kBAAA,EAAY,MAAMJ,eAAe,CAACK,OAAlC,EAA2C,EAA3C,CAAxB;EAEA,MAAMC,oBAAoB,GAAG,IAAAF,kBAAA,EAAaG,KAAD,IAA2B;IAChE,IAAIA,KAAK,KAAK,UAAV,IAAwBA,KAAK,KAAK,aAAtC,EAAqD;MACjD,IAAIL,eAAe,CAACG,OAApB,EAA6B;QACzBN,aAAa,SAAb,IAAAA,aAAa,WAAb,YAAAA,aAAa,CAAGI,eAAe,EAAlB,CAAb;MACH;IACJ;EACJ,CAN4B,EAM1B,CACCA,eADD,EAECJ,aAFD,CAN0B,CAA7B;EAWA,MAAMS,sBAAsB,GAAG,IAAAJ,kBAAA,EAAaK,MAAD,IAAoB;IAC3D,MAAMC,aAAa,GAAGC,IAAI,CAACC,KAAL,CAAWH,MAAM,GAAGZ,SAApB,IAAiCA,SAAvD,CAD2D,CAG3D;;IACA,MAAMgB,SAAS,GAAGF,IAAI,CAACG,KAAL,CAAW,IAAAC,UAAA,EAAK,CAACL,aAAD,GAAiBb,SAAtB,EAAkCC,oBAAlC,CAAX,CAAlB;;IAEA,IAAIe,SAAS,KAAKb,eAAe,CAACK,OAAlC,EAA2C;MACvCL,eAAe,CAACK,OAAhB,GAA0BQ,SAA1B;MACAX,eAAe,CAACG,OAAhB,GAA0B,IAA1B;IACH;EACJ,CAV8B,EAU5B,CAACR,SAAD,EAAYC,oBAAZ,CAV4B,CAA/B;EAYA,OAAO;IACHK,eADG;IAEHa,SAAS,EAAElB,oBAAoB,GAAG,CAF/B;IAGHQ,oBAHG;IAIHE;EAJG,CAAP;AAMH;;AAAA"}
@@ -7,6 +7,8 @@ exports.default = useItemVisibilityStore;
7
7
 
8
8
  var _react = require("react");
9
9
 
10
+ var _utils = require("@fountain-ui/utils");
11
+
10
12
  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
11
13
 
12
14
  class SimpleItemVisibilityStore {
@@ -54,10 +56,6 @@ function normalize(windowSize, numberOfData) {
54
56
  return windowSize;
55
57
  }
56
58
 
57
- function mod(value, modulo) {
58
- return (value % modulo + modulo) % modulo;
59
- }
60
-
61
59
  function makeVisibleIndexRanges(numberOfData, windowSize, index) {
62
60
  const ws = normalize(windowSize, numberOfData);
63
61
  const firstIndex = 0;
@@ -65,30 +63,32 @@ function makeVisibleIndexRanges(numberOfData, windowSize, index) {
65
63
  const halfNumberOfAdjacent = Math.floor(ws / 2);
66
64
  const leftSide = index - halfNumberOfAdjacent;
67
65
  const rightSide = index + halfNumberOfAdjacent;
68
- const leftRanges = leftSide >= 0 ? [[leftSide, index]] : [[firstIndex, index], [mod(leftSide, numberOfData), lastIndex]];
69
- const rightRanges = rightSide < numberOfData ? [[index, rightSide]] : [[index, lastIndex], [firstIndex, mod(rightSide, numberOfData)]]; // @ts-ignore
66
+ const leftRanges = leftSide >= 0 ? [[leftSide, index]] : [[firstIndex, index], [(0, _utils.mod)(leftSide, numberOfData), lastIndex]];
67
+ const rightRanges = rightSide < numberOfData ? [[index, rightSide]] : [[index, lastIndex], [firstIndex, (0, _utils.mod)(rightSide, numberOfData)]]; // @ts-ignore
70
68
 
71
69
  return [...leftRanges, ...rightRanges];
72
70
  }
73
71
 
74
72
  function useItemVisibilityStore(params) {
75
73
  const {
76
- currentIndex,
74
+ initialIndex,
77
75
  numberOfData,
78
76
  windowSize
79
77
  } = params;
80
- const [initialRange] = (0, _react.useState)(() => makeVisibleIndexRanges(numberOfData, windowSize, currentIndex));
78
+ const [initialRange] = (0, _react.useState)(() => {
79
+ return makeVisibleIndexRanges(numberOfData, windowSize, initialIndex);
80
+ });
81
81
  const store = (0, _react.useRef)(new SimpleItemVisibilityStore(initialRange)).current;
82
- (0, _react.useEffect)(() => {
83
- const newRanges = makeVisibleIndexRanges(numberOfData, windowSize, currentIndex);
82
+ const onIndexChange = (0, _react.useCallback)(newIndex => {
83
+ const newRanges = makeVisibleIndexRanges(numberOfData, windowSize, newIndex);
84
84
  store.dispatch(newRanges);
85
- }, [currentIndex, numberOfData, windowSize]);
85
+ }, [numberOfData, windowSize]);
86
86
  (0, _react.useEffect)(() => {
87
87
  return () => {
88
88
  store.removeAllListeners();
89
89
  };
90
90
  }, []);
91
- return store;
91
+ return [store, onIndexChange];
92
92
  }
93
93
 
94
94
  ;