@fountain-ui/lab 2.0.0-beta.14 → 2.0.0-beta.15
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.
- package/build/commonjs/Carousel/Carousel.js +27 -30
- package/build/commonjs/Carousel/Carousel.js.map +1 -1
- package/build/commonjs/Carousel/animation/createDefaultScrollAnimation.js +2 -2
- package/build/commonjs/Carousel/animation/createDefaultScrollAnimation.js.map +1 -1
- package/build/commonjs/Carousel/animation/parallaxItemStyleFactory.js +2 -2
- package/build/commonjs/Carousel/animation/parallaxItemStyleFactory.js.map +1 -1
- package/build/commonjs/Carousel/components/ItemView.js +2 -2
- package/build/commonjs/Carousel/components/ItemView.js.map +1 -1
- package/build/commonjs/Carousel/components/ScrollViewGesture.js +6 -6
- package/build/commonjs/Carousel/components/ScrollViewGesture.js.map +1 -1
- package/build/commonjs/Carousel/{hooks → components}/useItemInterpolation.js +6 -4
- package/build/commonjs/Carousel/components/useItemInterpolation.js.map +1 -0
- package/build/commonjs/Carousel/hooks/index.js +0 -16
- package/build/commonjs/Carousel/hooks/index.js.map +1 -1
- package/build/commonjs/Carousel/hooks/useIndexController.js +15 -46
- package/build/commonjs/Carousel/hooks/useIndexController.js.map +1 -1
- package/build/commonjs/Carousel/hooks/useItemVisibilityStore.js +12 -12
- package/build/commonjs/Carousel/hooks/useItemVisibilityStore.js.map +1 -1
- package/build/commonjs/Carousel/hooks/usePagingAnimation.js +70 -56
- package/build/commonjs/Carousel/hooks/usePagingAnimation.js.map +1 -1
- package/build/commonjs/Carousel/tick.js +16 -0
- package/build/commonjs/Carousel/tick.js.map +1 -0
- package/build/commonjs/Carousel/types.js.map +1 -1
- package/build/commonjs/ViewPager/ChildrenMemoizedPage.js +44 -35
- package/build/commonjs/ViewPager/ChildrenMemoizedPage.js.map +1 -1
- package/build/commonjs/ViewPager/ViewPagerNative.js +2 -3
- package/build/commonjs/ViewPager/ViewPagerNative.js.map +1 -1
- package/build/commonjs/ViewPager/usePageStore.js +5 -0
- package/build/commonjs/ViewPager/usePageStore.js.map +1 -1
- package/build/commonjs/ViewabilityTrackerView/measureViewability.js +6 -6
- package/build/commonjs/ViewabilityTrackerView/measureViewability.js.map +1 -1
- package/build/module/Carousel/Carousel.js +27 -32
- package/build/module/Carousel/Carousel.js.map +1 -1
- package/build/module/Carousel/animation/createDefaultScrollAnimation.js +2 -2
- package/build/module/Carousel/animation/createDefaultScrollAnimation.js.map +1 -1
- package/build/module/Carousel/animation/parallaxItemStyleFactory.js +2 -2
- package/build/module/Carousel/animation/parallaxItemStyleFactory.js.map +1 -1
- package/build/module/Carousel/components/ItemView.js +1 -1
- package/build/module/Carousel/components/ItemView.js.map +1 -1
- package/build/module/Carousel/components/ScrollViewGesture.js +6 -6
- package/build/module/Carousel/components/ScrollViewGesture.js.map +1 -1
- package/build/module/Carousel/{hooks → components}/useItemInterpolation.js +3 -3
- package/build/module/Carousel/components/useItemInterpolation.js.map +1 -0
- package/build/module/Carousel/hooks/index.js +0 -2
- package/build/module/Carousel/hooks/index.js.map +1 -1
- package/build/module/Carousel/hooks/useIndexController.js +14 -39
- package/build/module/Carousel/hooks/useIndexController.js.map +1 -1
- package/build/module/Carousel/hooks/useItemVisibilityStore.js +10 -11
- package/build/module/Carousel/hooks/useItemVisibilityStore.js.map +1 -1
- package/build/module/Carousel/hooks/usePagingAnimation.js +71 -56
- package/build/module/Carousel/hooks/usePagingAnimation.js.map +1 -1
- package/build/module/Carousel/tick.js +6 -0
- package/build/module/Carousel/tick.js.map +1 -0
- package/build/module/Carousel/types.js.map +1 -1
- package/build/module/ViewPager/ChildrenMemoizedPage.js +44 -35
- package/build/module/ViewPager/ChildrenMemoizedPage.js.map +1 -1
- package/build/module/ViewPager/ViewPagerNative.js +2 -3
- package/build/module/ViewPager/ViewPagerNative.js.map +1 -1
- package/build/module/ViewPager/usePageStore.js +5 -0
- package/build/module/ViewPager/usePageStore.js.map +1 -1
- package/build/module/ViewabilityTrackerView/measureViewability.js +2 -2
- package/build/module/ViewabilityTrackerView/measureViewability.js.map +1 -1
- package/build/typescript/Carousel/components/ScrollViewGesture.d.ts +2 -2
- package/build/typescript/Carousel/{hooks → components}/useItemInterpolation.d.ts +0 -0
- package/build/typescript/Carousel/hooks/index.d.ts +0 -2
- package/build/typescript/Carousel/hooks/useIndexController.d.ts +0 -2
- package/build/typescript/Carousel/hooks/useItemVisibilityStore.d.ts +5 -2
- package/build/typescript/Carousel/hooks/usePagingAnimation.d.ts +5 -7
- package/build/typescript/Carousel/tick.d.ts +2 -0
- package/build/typescript/Carousel/types.d.ts +1 -2
- package/package.json +3 -3
- package/src/Carousel/Carousel.tsx +25 -34
- package/src/Carousel/animation/createDefaultScrollAnimation.ts +2 -2
- package/src/Carousel/animation/parallaxItemStyleFactory.ts +1 -1
- package/src/Carousel/components/ItemView.tsx +1 -1
- package/src/Carousel/components/ScrollViewGesture.tsx +8 -7
- package/src/Carousel/{hooks → components}/useItemInterpolation.ts +3 -3
- package/src/Carousel/hooks/index.ts +0 -2
- package/src/Carousel/hooks/useIndexController.tsx +14 -44
- package/src/Carousel/hooks/useItemVisibilityStore.ts +17 -13
- package/src/Carousel/hooks/usePagingAnimation.ts +95 -64
- package/src/Carousel/tick.ts +6 -0
- package/src/Carousel/types.ts +1 -2
- package/src/ViewPager/ChildrenMemoizedPage.tsx +46 -39
- package/src/ViewPager/ViewPagerNative.tsx +3 -3
- package/src/ViewPager/usePageStore.ts +6 -0
- package/src/ViewabilityTrackerView/measureViewability.ts +1 -3
- package/build/commonjs/Carousel/hooks/useDimensionChangeReaction.js +0 -23
- package/build/commonjs/Carousel/hooks/useDimensionChangeReaction.js.map +0 -1
- package/build/commonjs/Carousel/hooks/useItemInterpolation.js.map +0 -1
- package/build/module/Carousel/hooks/useDimensionChangeReaction.js +0 -14
- package/build/module/Carousel/hooks/useDimensionChangeReaction.js.map +0 -1
- package/build/module/Carousel/hooks/useItemInterpolation.js.map +0 -1
- package/build/typescript/Carousel/hooks/useDimensionChangeReaction.d.ts +0 -7
- package/src/Carousel/hooks/useDimensionChangeReaction.ts +0 -25
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import { useCallback,
|
|
2
|
-
import { Animated, Platform } from 'react-native';
|
|
1
|
+
import { useCallback, useRef } from 'react';
|
|
3
2
|
|
|
4
3
|
function directionToValue(itemWidth) {
|
|
5
4
|
return function (direction) {
|
|
@@ -16,73 +15,87 @@ function directionToValue(itemWidth) {
|
|
|
16
15
|
};
|
|
17
16
|
}
|
|
18
17
|
|
|
18
|
+
function toValueCompensator(itemWidth) {
|
|
19
|
+
return function (toValue, currentOffset) {
|
|
20
|
+
const remainder = Math.abs(currentOffset % itemWidth);
|
|
21
|
+
const halfOfItemWidth = Math.abs(itemWidth / 2);
|
|
22
|
+
const compensateVector = remainder > halfOfItemWidth ? remainder - itemWidth : remainder;
|
|
23
|
+
const direction = currentOffset > 0 ? -1 : 1;
|
|
24
|
+
return toValue + direction * compensateVector;
|
|
25
|
+
};
|
|
26
|
+
}
|
|
27
|
+
|
|
19
28
|
export default function usePagingAnimation(params) {
|
|
20
29
|
const {
|
|
21
|
-
controlledTx,
|
|
22
30
|
createScrollAnimation,
|
|
23
|
-
getCurrentIndex,
|
|
24
31
|
itemWidth,
|
|
25
|
-
|
|
32
|
+
indexController,
|
|
26
33
|
loop,
|
|
27
34
|
numberOfData,
|
|
28
|
-
|
|
35
|
+
offsetX,
|
|
36
|
+
translateX
|
|
29
37
|
} = params;
|
|
30
|
-
const
|
|
38
|
+
const {
|
|
39
|
+
getCurrentIndex,
|
|
40
|
+
lastIndex,
|
|
41
|
+
notifyOffsetHasChanged
|
|
42
|
+
} = indexController;
|
|
31
43
|
const toValueRef = useRef(0);
|
|
32
|
-
const
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
44
|
+
const currentOffsetRef = useRef(0);
|
|
45
|
+
const isAnimatingRef = useRef(false);
|
|
46
|
+
const maxWidth = Math.abs(numberOfData * itemWidth);
|
|
47
|
+
const ensureOffsetBoundary = useCallback(offset => {
|
|
48
|
+
if (loop) {
|
|
49
|
+
const isCloseToEnd = Math.abs(offset) >= maxWidth - itemWidth;
|
|
50
|
+
|
|
51
|
+
if (isCloseToEnd) {
|
|
52
|
+
const signOfOffset = offset > 0 ? 1 : -1;
|
|
53
|
+
return offset + -signOfOffset * maxWidth;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
36
56
|
|
|
37
|
-
|
|
38
|
-
|
|
57
|
+
return offset % maxWidth;
|
|
58
|
+
}, [itemWidth, loop, maxWidth]);
|
|
59
|
+
const requireNewOffset = useCallback(newOffset => {
|
|
60
|
+
const nextOffset = ensureOffsetBoundary(newOffset);
|
|
61
|
+
currentOffsetRef.current = nextOffset;
|
|
62
|
+
offsetX.setValue(nextOffset);
|
|
63
|
+
toValueRef.current = 0;
|
|
64
|
+
translateX.setValue(0);
|
|
65
|
+
}, [ensureOffsetBoundary, offsetX, translateX]);
|
|
66
|
+
const interruptAnimation = useCallback(() => {
|
|
67
|
+
if (toValueRef.current === 0) {
|
|
68
|
+
// Performance optimization
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
39
71
|
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
72
|
+
translateX.stopAnimation(lastValue => {
|
|
73
|
+
isAnimatingRef.current = false;
|
|
74
|
+
const prevOffset = currentOffsetRef.current;
|
|
75
|
+
const totalOffset = prevOffset + lastValue;
|
|
76
|
+
notifyOffsetHasChanged(totalOffset);
|
|
77
|
+
requireNewOffset(totalOffset);
|
|
45
78
|
});
|
|
46
|
-
|
|
47
|
-
controlledTx.removeListener(subscriptionId);
|
|
48
|
-
};
|
|
49
|
-
}, [numberOfData, itemWidth]);
|
|
79
|
+
}, [requireNewOffset, translateX]);
|
|
50
80
|
const finalizeAnimation = useCallback(() => {
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
}
|
|
58
|
-
};
|
|
59
|
-
|
|
60
|
-
const resetBoundary = () => {
|
|
61
|
-
controlledTx.setOffset(toValueRef.current);
|
|
62
|
-
controlledTx.flattenOffset(); // FIXME: react-native-web bug maybe?
|
|
63
|
-
// `AnimatedValue.flattenOffset()` does not trigger any event listener.
|
|
64
|
-
// Accessing value directly via `_value` is dangerous but working on web (`useNativeDriver` always false).
|
|
65
|
-
// So setting same value with `value.setValue(value._value)` will trigger event listener.
|
|
66
|
-
|
|
67
|
-
if (Platform.OS === 'web') {
|
|
68
|
-
// @ts-ignore
|
|
69
|
-
controlledTx.setValue(controlledTx._value);
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
offsetTx.setValue(0);
|
|
73
|
-
toValueRef.current = 0;
|
|
74
|
-
};
|
|
75
|
-
|
|
76
|
-
stopUnfinishedSnapAnimation();
|
|
77
|
-
resetBoundary();
|
|
78
|
-
}, [controlledTx]);
|
|
81
|
+
isAnimatingRef.current = false;
|
|
82
|
+
const prevOffset = currentOffsetRef.current;
|
|
83
|
+
const toValue = toValueRef.current;
|
|
84
|
+
const totalOffset = prevOffset + toValue;
|
|
85
|
+
requireNewOffset(totalOffset);
|
|
86
|
+
}, [requireNewOffset]);
|
|
79
87
|
const startPagingAnimation = useCallback((type, config) => {
|
|
88
|
+
if (isAnimatingRef.current) {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
|
|
80
92
|
const configWithDefaults = {
|
|
81
93
|
animated: true,
|
|
82
94
|
...config
|
|
83
95
|
};
|
|
84
96
|
const currentIndex = getCurrentIndex();
|
|
85
97
|
const getValueByDirectionOnAllAdjacentItemsVisible = directionToValue(itemWidth);
|
|
98
|
+
const compensateToValue = toValueCompensator(itemWidth);
|
|
86
99
|
|
|
87
100
|
const getValueByDirectionalPagingOnLoopDisabled = _config => {
|
|
88
101
|
const {
|
|
@@ -122,14 +135,15 @@ export default function usePagingAnimation(params) {
|
|
|
122
135
|
return distance * direction;
|
|
123
136
|
};
|
|
124
137
|
|
|
125
|
-
const
|
|
138
|
+
const wantedToValue = type === 'directional' // @ts-ignore
|
|
126
139
|
? getValueByDirectionalPaging(configWithDefaults) // @ts-ignore
|
|
127
140
|
: getValueByIndexPaging(configWithDefaults);
|
|
141
|
+
const toValue = compensateToValue(wantedToValue, currentOffsetRef.current);
|
|
128
142
|
toValueRef.current = toValue;
|
|
143
|
+
isAnimatingRef.current = true;
|
|
129
144
|
|
|
130
145
|
if (configWithDefaults.animated) {
|
|
131
|
-
const animation = createScrollAnimation(
|
|
132
|
-
animationRef.current = animation;
|
|
146
|
+
const animation = createScrollAnimation(translateX, toValue);
|
|
133
147
|
animation.start(_ref2 => {
|
|
134
148
|
let {
|
|
135
149
|
finished
|
|
@@ -142,10 +156,11 @@ export default function usePagingAnimation(params) {
|
|
|
142
156
|
} else {
|
|
143
157
|
finalizeAnimation();
|
|
144
158
|
}
|
|
145
|
-
|
|
159
|
+
|
|
160
|
+
notifyOffsetHasChanged(currentOffsetRef.current + toValue);
|
|
161
|
+
}, [createScrollAnimation, getCurrentIndex, finalizeAnimation, itemWidth, lastIndex, loop, notifyOffsetHasChanged]);
|
|
146
162
|
return {
|
|
147
|
-
|
|
148
|
-
finalizeAnimation,
|
|
163
|
+
interruptAnimation,
|
|
149
164
|
startPagingAnimation
|
|
150
165
|
};
|
|
151
166
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useCallback","useEffect","useMemo","useRef","Animated","Platform","directionToValue","itemWidth","direction","usePagingAnimation","params","controlledTx","createScrollAnimation","getCurrentIndex","lastIndex","loop","numberOfData","offsetTx","animationRef","toValueRef","globalInterpolation","add","subscriptionId","addListener","value","currentTx","maxWidth","Math","abs","round","setValue","removeListener","finalizeAnimation","stopUnfinishedSnapAnimation","current","stop","resetBoundary","setOffset","flattenOffset","OS","_value","startPagingAnimation","type","config","configWithDefaults","animated","currentIndex","getValueByDirectionOnAllAdjacentItemsVisible","getValueByDirectionalPagingOnLoopDisabled","_config","isOriginatedFromGesture","getValueByDirectionalPaging","_configWithDefaults","getValueByIndexPaging","index","distance","toValue","animation","start","finished"],"sources":["usePagingAnimation.ts"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef } from 'react';\nimport { Animated, Platform } from 'react-native';\nimport type {\n CreateScrollAnimation,\n DirectionalPagingAnimationConfig,\n GetCurrentIndex,\n IndexPagingAnimationConfig,\n PagingAnimationConfig,\n PagingAnimationType,\n PagingDirection,\n StartPagingAnimation,\n} from '../types';\n\nexport interface PagingAnimationParameters {\n controlledTx: Animated.Value;\n createScrollAnimation: CreateScrollAnimation;\n getCurrentIndex: GetCurrentIndex;\n itemWidth: number;\n lastIndex: number;\n loop: boolean;\n numberOfData: number;\n offsetTx: Animated.Value;\n}\n\nexport interface UsePagingAnimation {\n finalizeAnimation: () => void;\n globalInterpolation: Animated.AnimatedInterpolation;\n startPagingAnimation: StartPagingAnimation;\n}\n\nfunction directionToValue(itemWidth: number) {\n return function (direction: PagingDirection): number {\n switch (direction) {\n case 'next':\n return -itemWidth;\n case 'prev':\n return itemWidth;\n case 'stay':\n return 0;\n }\n };\n}\n\nexport default function usePagingAnimation(params: PagingAnimationParameters): UsePagingAnimation {\n const {\n controlledTx,\n createScrollAnimation,\n getCurrentIndex,\n itemWidth,\n lastIndex,\n loop,\n numberOfData,\n offsetTx,\n } = params;\n\n const animationRef = useRef<Animated.CompositeAnimation | null>(null);\n const toValueRef = useRef<number>(0);\n\n const globalInterpolation = useMemo(\n () => Animated.add(controlledTx, offsetTx),\n [controlledTx, offsetTx],\n );\n\n useEffect(() => {\n const subscriptionId = controlledTx.addListener((value) => {\n const currentTx = value.value;\n\n // Prevent infinite loop\n if (currentTx !== 0) {\n const maxWidth = numberOfData * itemWidth;\n\n if (Math.abs(Math.round(currentTx)) === Math.round(maxWidth)) {\n // reset position\n controlledTx.setValue(0);\n }\n }\n });\n\n return () => {\n controlledTx.removeListener(subscriptionId);\n };\n }, [numberOfData, itemWidth]);\n\n const finalizeAnimation = useCallback(() => {\n const stopUnfinishedSnapAnimation = () => {\n if (animationRef.current) {\n animationRef.current?.stop();\n animationRef.current = null;\n }\n };\n\n const resetBoundary = () => {\n controlledTx.setOffset(toValueRef.current);\n controlledTx.flattenOffset();\n\n // FIXME: react-native-web bug maybe?\n // `AnimatedValue.flattenOffset()` does not trigger any event listener.\n // Accessing value directly via `_value` is dangerous but working on web (`useNativeDriver` always false).\n // So setting same value with `value.setValue(value._value)` will trigger event listener.\n if (Platform.OS === 'web') {\n // @ts-ignore\n controlledTx.setValue(controlledTx._value);\n }\n\n offsetTx.setValue(0);\n toValueRef.current = 0;\n };\n\n stopUnfinishedSnapAnimation();\n\n resetBoundary();\n }, [controlledTx]);\n\n const startPagingAnimation = useCallback((type: PagingAnimationType, config: PagingAnimationConfig) => {\n const configWithDefaults: PagingAnimationConfig = {\n animated: true,\n ...config,\n };\n\n const currentIndex = getCurrentIndex();\n\n const getValueByDirectionOnAllAdjacentItemsVisible = directionToValue(itemWidth);\n\n const getValueByDirectionalPagingOnLoopDisabled = (_config: DirectionalPagingAnimationConfig): number => {\n const { direction, isOriginatedFromGesture } = _config;\n\n if (currentIndex === 0 && direction === 'prev') {\n return isOriginatedFromGesture\n ? getValueByDirectionOnAllAdjacentItemsVisible('stay')\n : -lastIndex * itemWidth; // last position\n } else if (currentIndex === lastIndex && direction === 'next') {\n return isOriginatedFromGesture\n ? getValueByDirectionOnAllAdjacentItemsVisible('stay')\n : lastIndex * itemWidth; // first position\n }\n return getValueByDirectionOnAllAdjacentItemsVisible(direction);\n };\n\n const getValueByDirectionalPaging = (_config: DirectionalPagingAnimationConfig): number => {\n const _configWithDefaults: DirectionalPagingAnimationConfig = {\n isOriginatedFromGesture: false,\n ..._config,\n };\n\n return loop\n ? getValueByDirectionOnAllAdjacentItemsVisible(_configWithDefaults.direction)\n : getValueByDirectionalPagingOnLoopDisabled(_configWithDefaults);\n };\n\n const getValueByIndexPaging = ({ index }: IndexPagingAnimationConfig): number => {\n if (index < 0 || index > lastIndex || index === currentIndex) {\n // no animation if index is invalid or equals to current index\n return 0;\n }\n\n const distance = Math.abs(currentIndex - index) * itemWidth;\n const direction = index > currentIndex ? -1 : 1;\n\n return distance * direction;\n };\n\n const toValue = type === 'directional'\n // @ts-ignore\n ? getValueByDirectionalPaging(configWithDefaults)\n // @ts-ignore\n : getValueByIndexPaging(configWithDefaults);\n\n toValueRef.current = toValue;\n\n if (configWithDefaults.animated) {\n const animation = createScrollAnimation(offsetTx, toValue);\n animationRef.current = animation;\n animation.start(({ finished }) => {\n if (finished) {\n finalizeAnimation();\n }\n });\n } else {\n finalizeAnimation();\n }\n }, [\n createScrollAnimation,\n getCurrentIndex,\n finalizeAnimation,\n itemWidth,\n lastIndex,\n loop,\n ]);\n\n return {\n globalInterpolation,\n finalizeAnimation,\n startPagingAnimation,\n };\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["useCallback","useRef","directionToValue","itemWidth","direction","toValueCompensator","toValue","currentOffset","remainder","Math","abs","halfOfItemWidth","compensateVector","usePagingAnimation","params","createScrollAnimation","indexController","loop","numberOfData","offsetX","translateX","getCurrentIndex","lastIndex","notifyOffsetHasChanged","toValueRef","currentOffsetRef","isAnimatingRef","maxWidth","ensureOffsetBoundary","offset","isCloseToEnd","signOfOffset","requireNewOffset","newOffset","nextOffset","current","setValue","interruptAnimation","stopAnimation","lastValue","prevOffset","totalOffset","finalizeAnimation","startPagingAnimation","type","config","configWithDefaults","animated","currentIndex","getValueByDirectionOnAllAdjacentItemsVisible","compensateToValue","getValueByDirectionalPagingOnLoopDisabled","_config","isOriginatedFromGesture","getValueByDirectionalPaging","_configWithDefaults","getValueByIndexPaging","index","distance","wantedToValue","animation","start","finished"],"sources":["usePagingAnimation.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\nimport { Animated } from 'react-native';\nimport type {\n CreateScrollAnimation,\n DirectionalPagingAnimationConfig,\n IndexController,\n IndexPagingAnimationConfig,\n PagingAnimationConfig,\n PagingAnimationType,\n PagingDirection,\n StartPagingAnimation,\n} from '../types';\n\nexport interface PagingAnimationParameters {\n createScrollAnimation: CreateScrollAnimation;\n itemWidth: number;\n indexController: IndexController;\n loop: boolean;\n numberOfData: number;\n offsetX: Animated.Value;\n translateX: Animated.Value;\n}\n\nexport interface UsePagingAnimation {\n interruptAnimation: () => void;\n startPagingAnimation: StartPagingAnimation;\n}\n\nfunction directionToValue(itemWidth: number) {\n return function (direction: PagingDirection): number {\n switch (direction) {\n case 'next':\n return -itemWidth;\n case 'prev':\n return itemWidth;\n case 'stay':\n return 0;\n }\n };\n}\n\nfunction toValueCompensator(itemWidth: number) {\n return function (toValue: number, currentOffset: number): number {\n const remainder = Math.abs(currentOffset % itemWidth);\n\n const halfOfItemWidth = Math.abs(itemWidth / 2);\n const compensateVector = remainder > halfOfItemWidth\n ? remainder - itemWidth\n : remainder;\n\n const direction = currentOffset > 0 ? -1 : 1;\n\n return toValue + (direction * compensateVector);\n };\n}\n\nexport default function usePagingAnimation(params: PagingAnimationParameters): UsePagingAnimation {\n const {\n createScrollAnimation,\n itemWidth,\n indexController,\n loop,\n numberOfData,\n offsetX,\n translateX,\n } = params;\n\n const {\n getCurrentIndex,\n lastIndex,\n notifyOffsetHasChanged,\n } = indexController;\n\n const toValueRef = useRef<number>(0);\n const currentOffsetRef = useRef<number>(0);\n\n const isAnimatingRef = useRef<boolean>(false);\n\n const maxWidth = Math.abs(numberOfData * itemWidth);\n\n const ensureOffsetBoundary: (offset: number) => number = useCallback((offset: number) => {\n if (loop) {\n const isCloseToEnd = Math.abs(offset) >= (maxWidth - itemWidth);\n if (isCloseToEnd) {\n const signOfOffset = offset > 0 ? 1 : -1;\n return offset + (-signOfOffset * maxWidth);\n }\n }\n\n return offset % maxWidth;\n }, [itemWidth, loop, maxWidth]);\n\n const requireNewOffset = useCallback((newOffset: number) => {\n const nextOffset = ensureOffsetBoundary(newOffset);\n\n currentOffsetRef.current = nextOffset;\n offsetX.setValue(nextOffset);\n\n toValueRef.current = 0;\n translateX.setValue(0);\n }, [\n ensureOffsetBoundary,\n offsetX,\n translateX,\n ]);\n\n const interruptAnimation = useCallback(() => {\n if (toValueRef.current === 0) {\n // Performance optimization\n return;\n }\n\n translateX.stopAnimation(lastValue => {\n isAnimatingRef.current = false;\n\n const prevOffset = currentOffsetRef.current;\n const totalOffset = prevOffset + lastValue;\n\n notifyOffsetHasChanged(totalOffset);\n\n requireNewOffset(totalOffset);\n });\n }, [requireNewOffset, translateX]);\n\n const finalizeAnimation = useCallback(() => {\n isAnimatingRef.current = false;\n\n const prevOffset = currentOffsetRef.current;\n const toValue = toValueRef.current;\n const totalOffset = prevOffset + toValue;\n\n requireNewOffset(totalOffset);\n }, [requireNewOffset]);\n\n const startPagingAnimation = useCallback((type: PagingAnimationType, config: PagingAnimationConfig) => {\n if (isAnimatingRef.current) {\n return;\n }\n\n const configWithDefaults: PagingAnimationConfig = {\n animated: true,\n ...config,\n };\n\n const currentIndex = getCurrentIndex();\n\n const getValueByDirectionOnAllAdjacentItemsVisible = directionToValue(itemWidth);\n const compensateToValue = toValueCompensator(itemWidth);\n\n const getValueByDirectionalPagingOnLoopDisabled = (_config: DirectionalPagingAnimationConfig): number => {\n const { direction, isOriginatedFromGesture } = _config;\n\n if (currentIndex === 0 && direction === 'prev') {\n return isOriginatedFromGesture\n ? getValueByDirectionOnAllAdjacentItemsVisible('stay')\n : -lastIndex * itemWidth; // last position\n } else if (currentIndex === lastIndex && direction === 'next') {\n return isOriginatedFromGesture\n ? getValueByDirectionOnAllAdjacentItemsVisible('stay')\n : lastIndex * itemWidth; // first position\n }\n return getValueByDirectionOnAllAdjacentItemsVisible(direction);\n };\n\n const getValueByDirectionalPaging = (_config: DirectionalPagingAnimationConfig): number => {\n const _configWithDefaults: DirectionalPagingAnimationConfig = {\n isOriginatedFromGesture: false,\n ..._config,\n };\n\n return loop\n ? getValueByDirectionOnAllAdjacentItemsVisible(_configWithDefaults.direction)\n : getValueByDirectionalPagingOnLoopDisabled(_configWithDefaults);\n };\n\n const getValueByIndexPaging = ({ index }: IndexPagingAnimationConfig): number => {\n if (index < 0 || index > lastIndex || index === currentIndex) {\n // no animation if index is invalid or equals to current index\n return 0;\n }\n\n const distance = Math.abs(currentIndex - index) * itemWidth;\n const direction = index > currentIndex ? -1 : 1;\n\n return distance * direction;\n };\n\n const wantedToValue = type === 'directional'\n // @ts-ignore\n ? getValueByDirectionalPaging(configWithDefaults)\n // @ts-ignore\n : getValueByIndexPaging(configWithDefaults);\n\n const toValue = compensateToValue(wantedToValue, currentOffsetRef.current);\n\n toValueRef.current = toValue;\n isAnimatingRef.current = true;\n\n if (configWithDefaults.animated) {\n const animation = createScrollAnimation(translateX, toValue);\n\n animation.start(({ finished }) => {\n if (finished) {\n finalizeAnimation();\n }\n });\n } else {\n finalizeAnimation();\n }\n\n notifyOffsetHasChanged(currentOffsetRef.current + toValue);\n }, [\n createScrollAnimation,\n getCurrentIndex,\n finalizeAnimation,\n itemWidth,\n lastIndex,\n loop,\n notifyOffsetHasChanged,\n ]);\n\n return {\n interruptAnimation,\n startPagingAnimation,\n };\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["logger","enabled","__DEV__","format"],"sources":["tick.ts"],"sourcesContent":["import { logger } from '@fountain-ui/utils';\n\nexport default logger('Carousel', {\n enabled: __DEV__,\n format: 'diff',\n});\n"],"mappings":"AAAA,SAASA,MAAT,QAAuB,oBAAvB;AAEA,eAAeA,MAAM,CAAC,UAAD,EAAa;EAC9BC,OAAO,EAAEC,OADqB;EAE9BC,MAAM,EAAE;AAFsB,CAAb,CAArB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["directions"],"sources":["types.ts"],"sourcesContent":["import type { ReactElement } from 'react';\nimport type { Animated, ViewProps } from 'react-native';\n\nconst directions = ['next', 'prev', 'stay'] as const;\n\nexport type PagingDirection = (typeof directions)[number];\n\nexport type ItemHeight = number | 'auto';\n\nexport interface RenderItem<T> {\n (info: { item: T, index: number, interpolation: Animated.AnimatedInterpolation }): ReactElement | null;\n}\n\nexport interface CreateScrollAnimation {\n (aValue: Animated.AnimatedValue, toValue: number): Animated.CompositeAnimation;\n}\n\nexport interface CreateItemStyle {\n (itemInterpolation: Animated.AnimatedInterpolation, itemWidth: number): Animated.AnimatedProps<ViewProps['style']>;\n}\n\nexport interface GetCurrentIndex {\n (): number;\n}\n\nexport interface IndexController {\n
|
|
1
|
+
{"version":3,"names":["directions"],"sources":["types.ts"],"sourcesContent":["import type { ReactElement } from 'react';\nimport type { Animated, ViewProps } from 'react-native';\n\nconst directions = ['next', 'prev', 'stay'] as const;\n\nexport type PagingDirection = (typeof directions)[number];\n\nexport type ItemHeight = number | 'auto';\n\nexport interface RenderItem<T> {\n (info: { item: T, index: number, interpolation: Animated.AnimatedInterpolation }): ReactElement | null;\n}\n\nexport interface CreateScrollAnimation {\n (aValue: Animated.AnimatedValue, toValue: number): Animated.CompositeAnimation;\n}\n\nexport interface CreateItemStyle {\n (itemInterpolation: Animated.AnimatedInterpolation, itemWidth: number): Animated.AnimatedProps<ViewProps['style']>;\n}\n\nexport interface GetCurrentIndex {\n (): number;\n}\n\nexport interface IndexController {\n getCurrentIndex: GetCurrentIndex;\n lastIndex: number;\n notifyOffsetHasChanged: (offset: number) => void;\n}\n\nexport type PagingAnimationType = 'directional' | 'index';\n\nexport interface BasePagingAnimationConfig {\n animated?: boolean;\n}\n\nexport interface DirectionalPagingAnimationConfig extends BasePagingAnimationConfig {\n direction: PagingDirection;\n isOriginatedFromGesture?: boolean;\n}\n\nexport interface IndexPagingAnimationConfig extends BasePagingAnimationConfig {\n index: number;\n}\n\nexport type PagingAnimationConfig = DirectionalPagingAnimationConfig | IndexPagingAnimationConfig;\n\nexport interface StartPagingAnimation {\n (type: PagingAnimationType, config: PagingAnimationConfig): void;\n}\n\nexport type VisibleIndexRanges = Array<[number, number]>;\n\nexport interface StoreSubscription {\n (): void;\n}\n\nexport interface ItemVisibilityStore {\n dispatch: (ranges: VisibleIndexRanges) => void;\n subscribe: (listener: (ranges: VisibleIndexRanges) => void) => StoreSubscription;\n removeAllListeners: () => void;\n}\n\nexport interface AutoplayController {\n pause: () => void;\n resume: () => void;\n}\n\nexport interface ScrollToOption {\n index: number;\n animated?: boolean;\n}\n\nexport interface CarouselInstance {\n /**\n * Get current visible item index.\n */\n getCurrentIndex: GetCurrentIndex;\n\n /**\n * Scroll to next visible item.\n */\n next: () => void;\n\n /**\n * Scroll to previous visible item.\n */\n prev: () => void;\n\n /**\n * Scroll to desired indexed item.\n * Invalid index is ignored.\n */\n scrollTo: (option: ScrollToOption) => void;\n}\n"],"mappings":"AAGA,MAAMA,UAAU,GAAG,CAAC,MAAD,EAAS,MAAT,EAAiB,MAAjB,CAAnB"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { memo, useContext, useEffect, useMemo, useState } from 'react';
|
|
1
|
+
import React, { memo, useCallback, useContext, useEffect, useMemo, useReducer, useRef, useState } from 'react';
|
|
2
2
|
import { Platform, View } from 'react-native';
|
|
3
3
|
import { StyleSheet } from '@fountain-ui/core';
|
|
4
4
|
import PageStateContext from './PageStateContext';
|
|
@@ -24,55 +24,64 @@ function Page(props) {
|
|
|
24
24
|
const {
|
|
25
25
|
pageStore
|
|
26
26
|
} = useContext(InternalContext);
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
const activeIndex = initialPage;
|
|
27
|
+
const computePageDescription = useCallback(page => {
|
|
28
|
+
const activeIndex = page;
|
|
30
29
|
const isActive = index === activeIndex;
|
|
30
|
+
const shouldRerender = index >= activeIndex - offscreenPageRerenderLimit && index <= activeIndex + offscreenPageRerenderLimit;
|
|
31
|
+
const becomeNeighbor = shouldRerender && !isActive;
|
|
32
|
+
return {
|
|
33
|
+
isActive,
|
|
34
|
+
becomeNeighbor
|
|
35
|
+
};
|
|
36
|
+
}, [index]);
|
|
37
|
+
const [initialState] = useState(() => {
|
|
38
|
+
const {
|
|
39
|
+
isActive,
|
|
40
|
+
becomeNeighbor
|
|
41
|
+
} = computePageDescription(initialPage);
|
|
31
42
|
|
|
32
43
|
if (loading === 'eager') {
|
|
33
44
|
return {
|
|
34
|
-
isActive,
|
|
35
|
-
|
|
45
|
+
active: isActive,
|
|
46
|
+
loaded: true
|
|
36
47
|
};
|
|
37
48
|
}
|
|
38
49
|
|
|
39
|
-
const isLoaded = index >= activeIndex - offscreenPageRerenderLimit && index <= activeIndex + offscreenPageRerenderLimit;
|
|
40
50
|
return {
|
|
41
|
-
isActive,
|
|
42
|
-
|
|
51
|
+
active: isActive,
|
|
52
|
+
loaded: isActive || becomeNeighbor
|
|
43
53
|
};
|
|
44
|
-
};
|
|
54
|
+
}); // `Bailing out of a state update` is not working as expected.
|
|
45
55
|
|
|
46
|
-
const
|
|
47
|
-
const
|
|
56
|
+
const pageStateRef = useRef(initialState);
|
|
57
|
+
const [, forceRender] = useReducer(s => s + 1, 0);
|
|
58
|
+
const {
|
|
59
|
+
active,
|
|
60
|
+
loaded
|
|
61
|
+
} = pageStateRef.current;
|
|
62
|
+
const content = loaded ? children : null;
|
|
48
63
|
useEffect(() => {
|
|
49
64
|
return pageStore.subscribe(newPage => {
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
};
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
if (becomeNeighbor && !prevState.isLoaded) {
|
|
63
|
-
return { ...prevState,
|
|
64
|
-
isLoaded: true
|
|
65
|
-
};
|
|
66
|
-
}
|
|
65
|
+
const {
|
|
66
|
+
isActive,
|
|
67
|
+
becomeNeighbor
|
|
68
|
+
} = computePageDescription(newPage);
|
|
69
|
+
const currentState = pageStateRef.current;
|
|
70
|
+
const newState = {
|
|
71
|
+
active: isActive,
|
|
72
|
+
loaded: isActive || becomeNeighbor ? true : currentState.loaded
|
|
73
|
+
};
|
|
67
74
|
|
|
68
|
-
|
|
69
|
-
|
|
75
|
+
if (currentState.active !== newState.active || currentState.loaded !== newState.loaded) {
|
|
76
|
+
pageStateRef.current = newState;
|
|
77
|
+
forceRender();
|
|
78
|
+
}
|
|
70
79
|
});
|
|
71
|
-
}, [pageStore,
|
|
80
|
+
}, [pageStore, computePageDescription]);
|
|
72
81
|
const contextValue = useMemo(() => ({
|
|
73
|
-
isActive:
|
|
74
|
-
}), [
|
|
75
|
-
const style = Platform.OS === 'web' ?
|
|
82
|
+
isActive: active
|
|
83
|
+
}), [active]);
|
|
84
|
+
const style = Platform.OS === 'web' ? active ? StyleSheet.absoluteFill : styles.none : styles.fill;
|
|
76
85
|
return /*#__PURE__*/React.createElement(View, {
|
|
77
86
|
collapsable: false,
|
|
78
87
|
style: style
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","memo","useContext","useEffect","useMemo","useState","Platform","View","StyleSheet","PageStateContext","InternalContext","styles","create","fill","width","height","none","display","Page","props","index","initialPage","children","loading","offscreenPageRerenderLimit","pageStore","
|
|
1
|
+
{"version":3,"names":["React","memo","useCallback","useContext","useEffect","useMemo","useReducer","useRef","useState","Platform","View","StyleSheet","PageStateContext","InternalContext","styles","create","fill","width","height","none","display","Page","props","index","initialPage","children","loading","offscreenPageRerenderLimit","pageStore","computePageDescription","page","activeIndex","isActive","shouldRerender","becomeNeighbor","initialState","active","loaded","pageStateRef","forceRender","s","current","content","subscribe","newPage","currentState","newState","contextValue","style","OS","absoluteFill","prevProps","nextProps","rerenderKey"],"sources":["ChildrenMemoizedPage.tsx"],"sourcesContent":["import React, { memo, useCallback, useContext, useEffect, useMemo, useReducer, useRef, useState } from 'react';\nimport { Platform, View } from 'react-native';\nimport { StyleSheet } from '@fountain-ui/core';\nimport type { PageProps } from './types';\nimport PageStateContext from './PageStateContext';\nimport InternalContext from './InternalContext';\n\nconst styles = StyleSheet.create({\n fill: { width: '100%', height: '100%' },\n none: { display: 'none' },\n});\n\ninterface InternalPageDescription {\n isActive: boolean;\n becomeNeighbor: boolean;\n}\n\ninterface InternalPageState {\n active: boolean;\n loaded: boolean;\n}\n\nfunction Page(props: PageProps) {\n const {\n index,\n initialPage,\n children,\n loading,\n offscreenPageRerenderLimit,\n } = props;\n\n const { pageStore } = useContext(InternalContext);\n\n const computePageDescription: (page: number) => InternalPageDescription = useCallback((page: number) => {\n const activeIndex = page;\n\n const isActive = index === activeIndex;\n\n const shouldRerender = index >= activeIndex - offscreenPageRerenderLimit\n && index <= activeIndex + offscreenPageRerenderLimit;\n\n const becomeNeighbor = shouldRerender && !isActive;\n\n return { isActive, becomeNeighbor };\n }, [index]);\n\n const [initialState] = useState<InternalPageState>(() => {\n const { isActive, becomeNeighbor } = computePageDescription(initialPage);\n\n if (loading === 'eager') {\n return { active: isActive, loaded: true };\n }\n\n return { active: isActive, loaded: isActive || becomeNeighbor };\n });\n\n // `Bailing out of a state update` is not working as expected.\n const pageStateRef = useRef<InternalPageState>(initialState);\n const [, forceRender] = useReducer((s) => s + 1, 0);\n\n const { active, loaded } = pageStateRef.current;\n\n const content = loaded ? children : null;\n\n useEffect(() => {\n return pageStore.subscribe(newPage => {\n const { isActive, becomeNeighbor } = computePageDescription(newPage);\n\n const currentState = pageStateRef.current;\n\n const newState: InternalPageState = {\n active: isActive,\n loaded: isActive || becomeNeighbor ? true : currentState.loaded,\n };\n\n if (\n currentState.active !== newState.active\n || currentState.loaded !== newState.loaded\n ) {\n pageStateRef.current = newState;\n\n forceRender();\n }\n });\n }, [pageStore, computePageDescription]);\n\n const contextValue = useMemo(() => ({\n isActive: active,\n }), [active]);\n\n const style = Platform.OS === 'web'\n ? (active ? StyleSheet.absoluteFill : styles.none)\n : styles.fill;\n\n return (\n <View\n collapsable={false}\n style={style}\n >\n <PageStateContext.Provider value={contextValue}>\n {content}\n </PageStateContext.Provider>\n </View>\n );\n}\n\nexport default memo(Page, (prevProps, nextProps) => {\n if (prevProps.rerenderKey !== nextProps.rerenderKey) {\n return false;\n }\n\n return prevProps.index !== nextProps.index;\n});\n"],"mappings":"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"}
|
|
@@ -67,7 +67,7 @@ const ViewPager = /*#__PURE__*/forwardRef(function ViewPager(props, ref) {
|
|
|
67
67
|
return () => {
|
|
68
68
|
animatedValue.removeListener(id);
|
|
69
69
|
};
|
|
70
|
-
}, [sharedPage]);
|
|
70
|
+
}, [sharedPage, setPage]);
|
|
71
71
|
const handlePageSelected = useCallback(e => {
|
|
72
72
|
if (Number.isFinite(desiredPageRef.current)) {
|
|
73
73
|
// onPageSelected is called from outer controlling mechanism
|
|
@@ -91,9 +91,8 @@ const ViewPager = /*#__PURE__*/forwardRef(function ViewPager(props, ref) {
|
|
|
91
91
|
if (trustfulNextPage !== pageRef.current) {
|
|
92
92
|
desiredPageRef.current = trustfulNextPage;
|
|
93
93
|
sharedPage.animatedValue.setValue(trustfulNextPage);
|
|
94
|
+
onChange === null || onChange === void 0 ? void 0 : onChange(trustfulNextPage);
|
|
94
95
|
}
|
|
95
|
-
|
|
96
|
-
onChange === null || onChange === void 0 ? void 0 : onChange(trustfulNextPage);
|
|
97
96
|
}
|
|
98
97
|
}, [onChange, sharedPage]);
|
|
99
98
|
useImperativeHandle(ref, () => ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","Children","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","RNViewPager","useSyncAnimatedValue","defaultInitialPage","defaultLoading","defaultOffscreenPageRerenderLimit","defaultPageComponent","usePageStore","InternalContext","ViewPager","props","ref","children","initialPage","keyboardDismissMode","loading","offscreenPageRerenderLimit","onChange","pageComponent","pageForceRerenderKey","scrollEnabled","style","UNSTABLE_sharedPage","fallbackSharedPage","initialValue","sharedPage","pageRef","desiredPageRef","NaN","pagerRef","animationFrameRef","setPage","newPage","Number","isInteger","current","requestAnimationFrame","isFinite","cancelAnimationFrame","animatedValue","id","addListener","newValue","value","removeListener","handlePageSelected","e","desiredPage","setValue","trustfulNextPage","nativeEvent","position","pageStore","PageComponent","map","child","index"],"sources":["ViewPagerNative.tsx"],"sourcesContent":["import React, { Children, forwardRef, useCallback, useEffect, useImperativeHandle, useRef } from 'react';\nimport type { ViewPagerOnPageSelectedEvent } from 'react-native-pager-view';\nimport RNViewPager from 'react-native-pager-view';\nimport { useSyncAnimatedValue } from '@fountain-ui/core';\nimport type ViewPagerProps from './ViewPagerProps';\nimport type { ViewPagerInstance } from './types';\nimport { defaultInitialPage, defaultLoading, defaultOffscreenPageRerenderLimit, defaultPageComponent } from './utils';\nimport usePageStore from './usePageStore';\nimport InternalContext from './InternalContext';\n\nconst ViewPager = forwardRef<ViewPagerInstance, ViewPagerProps>(function ViewPager(props, ref) {\n const {\n children,\n initialPage = defaultInitialPage,\n keyboardDismissMode = 'on-drag',\n loading = defaultLoading,\n offscreenPageRerenderLimit = defaultOffscreenPageRerenderLimit,\n onChange,\n pageComponent = defaultPageComponent,\n pageForceRerenderKey,\n scrollEnabled = true,\n style,\n UNSTABLE_sharedPage,\n } = props;\n\n const fallbackSharedPage = useSyncAnimatedValue({ initialValue: initialPage });\n\n const sharedPage = UNSTABLE_sharedPage ?? fallbackSharedPage;\n\n const pageRef = useRef<number>(sharedPage.initialValue);\n\n const desiredPageRef = useRef<number>(NaN);\n\n const pagerRef = useRef<RNViewPager | null>(null);\n\n const animationFrameRef = useRef<number>(NaN);\n\n const setPage = useCallback((newPage: number) => {\n if (!Number.isInteger(newPage)) {\n return;\n }\n\n animationFrameRef.current = requestAnimationFrame(() => {\n if (Number.isFinite(desiredPageRef.current)) {\n if (pageRef.current === desiredPageRef.current) {\n // end of state machine. clear desired page.\n desiredPageRef.current = NaN;\n return;\n }\n\n if (newPage === desiredPageRef.current) {\n return;\n }\n }\n\n desiredPageRef.current = newPage;\n pagerRef.current?.setPage(newPage);\n });\n }, []);\n\n useEffect(() => {\n return () => {\n if (animationFrameRef.current) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n };\n }, []);\n\n useEffect(() => {\n const animatedValue = sharedPage.animatedValue;\n const id = animatedValue.addListener(newValue => {\n const newPage = newValue.value;\n pageRef.current = newPage;\n setPage(newPage);\n });\n\n return () => {\n animatedValue.removeListener(id);\n };\n }, [sharedPage]);\n\n const handlePageSelected = useCallback((e: ViewPagerOnPageSelectedEvent) => {\n if (Number.isFinite(desiredPageRef.current)) {\n // onPageSelected is called from outer controlling mechanism\n // e.g. sharedPage.value is changed, setPage() is called\n // Due to the onPageSelected bug,\n // we don't trust the value from event, (e.nativeEvent.position)\n // other than that trust the value from desiredPageRef.\n\n const desiredPage = desiredPageRef.current;\n\n if (pageRef.current === desiredPage) {\n // end of state machine. clear desired page.\n desiredPageRef.current = NaN;\n } else {\n sharedPage.animatedValue.setValue(desiredPage);\n }\n\n onChange?.(desiredPage);\n } else {\n const trustfulNextPage = e.nativeEvent.position;\n\n if (trustfulNextPage !== pageRef.current) {\n desiredPageRef.current = trustfulNextPage;\n sharedPage.animatedValue.setValue(trustfulNextPage);\n
|
|
1
|
+
{"version":3,"names":["React","Children","forwardRef","useCallback","useEffect","useImperativeHandle","useRef","RNViewPager","useSyncAnimatedValue","defaultInitialPage","defaultLoading","defaultOffscreenPageRerenderLimit","defaultPageComponent","usePageStore","InternalContext","ViewPager","props","ref","children","initialPage","keyboardDismissMode","loading","offscreenPageRerenderLimit","onChange","pageComponent","pageForceRerenderKey","scrollEnabled","style","UNSTABLE_sharedPage","fallbackSharedPage","initialValue","sharedPage","pageRef","desiredPageRef","NaN","pagerRef","animationFrameRef","setPage","newPage","Number","isInteger","current","requestAnimationFrame","isFinite","cancelAnimationFrame","animatedValue","id","addListener","newValue","value","removeListener","handlePageSelected","e","desiredPage","setValue","trustfulNextPage","nativeEvent","position","pageStore","PageComponent","map","child","index"],"sources":["ViewPagerNative.tsx"],"sourcesContent":["import React, { Children, forwardRef, useCallback, useEffect, useImperativeHandle, useRef } from 'react';\nimport type { ViewPagerOnPageSelectedEvent } from 'react-native-pager-view';\nimport RNViewPager from 'react-native-pager-view';\nimport { useSyncAnimatedValue } from '@fountain-ui/core';\nimport type ViewPagerProps from './ViewPagerProps';\nimport type { ViewPagerInstance } from './types';\nimport { defaultInitialPage, defaultLoading, defaultOffscreenPageRerenderLimit, defaultPageComponent } from './utils';\nimport usePageStore from './usePageStore';\nimport InternalContext from './InternalContext';\n\nconst ViewPager = forwardRef<ViewPagerInstance, ViewPagerProps>(function ViewPager(props, ref) {\n const {\n children,\n initialPage = defaultInitialPage,\n keyboardDismissMode = 'on-drag',\n loading = defaultLoading,\n offscreenPageRerenderLimit = defaultOffscreenPageRerenderLimit,\n onChange,\n pageComponent = defaultPageComponent,\n pageForceRerenderKey,\n scrollEnabled = true,\n style,\n UNSTABLE_sharedPage,\n } = props;\n\n const fallbackSharedPage = useSyncAnimatedValue({ initialValue: initialPage });\n\n const sharedPage = UNSTABLE_sharedPage ?? fallbackSharedPage;\n\n const pageRef = useRef<number>(sharedPage.initialValue);\n\n const desiredPageRef = useRef<number>(NaN);\n\n const pagerRef = useRef<RNViewPager | null>(null);\n\n const animationFrameRef = useRef<number>(NaN);\n\n const setPage = useCallback((newPage: number) => {\n if (!Number.isInteger(newPage)) {\n return;\n }\n\n animationFrameRef.current = requestAnimationFrame(() => {\n if (Number.isFinite(desiredPageRef.current)) {\n if (pageRef.current === desiredPageRef.current) {\n // end of state machine. clear desired page.\n desiredPageRef.current = NaN;\n return;\n }\n\n if (newPage === desiredPageRef.current) {\n return;\n }\n }\n\n desiredPageRef.current = newPage;\n pagerRef.current?.setPage(newPage);\n });\n }, []);\n\n useEffect(() => {\n return () => {\n if (animationFrameRef.current) {\n cancelAnimationFrame(animationFrameRef.current);\n }\n };\n }, []);\n\n useEffect(() => {\n const animatedValue = sharedPage.animatedValue;\n const id = animatedValue.addListener(newValue => {\n const newPage = newValue.value;\n pageRef.current = newPage;\n setPage(newPage);\n });\n\n return () => {\n animatedValue.removeListener(id);\n };\n }, [sharedPage, setPage]);\n\n const handlePageSelected = useCallback((e: ViewPagerOnPageSelectedEvent) => {\n if (Number.isFinite(desiredPageRef.current)) {\n // onPageSelected is called from outer controlling mechanism\n // e.g. sharedPage.value is changed, setPage() is called\n // Due to the onPageSelected bug,\n // we don't trust the value from event, (e.nativeEvent.position)\n // other than that trust the value from desiredPageRef.\n\n const desiredPage = desiredPageRef.current;\n\n if (pageRef.current === desiredPage) {\n // end of state machine. clear desired page.\n desiredPageRef.current = NaN;\n } else {\n sharedPage.animatedValue.setValue(desiredPage);\n }\n\n onChange?.(desiredPage);\n } else {\n const trustfulNextPage = e.nativeEvent.position;\n\n if (trustfulNextPage !== pageRef.current) {\n desiredPageRef.current = trustfulNextPage;\n sharedPage.animatedValue.setValue(trustfulNextPage);\n\n onChange?.(trustfulNextPage);\n }\n }\n }, [onChange, sharedPage]);\n\n useImperativeHandle(\n ref,\n () => ({ setPage }),\n [setPage],\n );\n\n const pageStore = usePageStore(sharedPage);\n\n const PageComponent = pageComponent;\n\n return (\n <InternalContext.Provider value={{ pageStore }}>\n <RNViewPager\n ref={pagerRef}\n initialPage={sharedPage.initialValue}\n keyboardDismissMode={keyboardDismissMode}\n onPageSelected={handlePageSelected}\n pageMargin={8}\n scrollEnabled={scrollEnabled}\n style={style}\n >\n {Children.map(children, (child, index) => (\n <PageComponent\n key={index}\n children={child}\n index={index}\n initialPage={sharedPage.initialValue}\n loading={loading}\n offscreenPageRerenderLimit={offscreenPageRerenderLimit}\n rerenderKey={pageForceRerenderKey}\n />\n ))}\n </RNViewPager>\n </InternalContext.Provider>\n );\n});\n\nexport default ViewPager;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useRef","SimpleStore","usePageStore","value","animatedValue","initialValue","store","current","id","addListener","newPage","dispatch","removeListener"],"sources":["usePageStore.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { MonoStore, SyncAnimatedValue } from '@fountain-ui/core';\nimport { SimpleStore } from '@fountain-ui/core';\n\nexport default function usePageStore(value: SyncAnimatedValue): MonoStore<number> {\n const {\n animatedValue,\n initialValue,\n } = value;\n\n const store = useRef(new SimpleStore(initialValue)).current;\n\n useEffect(() => {\n const id = animatedValue.addListener((newPage) => {\n store.dispatch(newPage.value);\n });\n\n return () => {\n animatedValue.removeListener(id);\n };\n }, [animatedValue]);\n\n return store;\n};\n"],"mappings":"AAAA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,OAAlC;AAEA,SAASC,WAAT,QAA4B,mBAA5B;AAEA,eAAe,SAASC,YAAT,CAAsBC,KAAtB,EAAmE;EAC9E,MAAM;IACFC,aADE;IAEFC;EAFE,IAGFF,KAHJ;EAKA,MAAMG,KAAK,GAAGN,MAAM,CAAC,IAAIC,WAAJ,CAAgBI,YAAhB,CAAD,CAAN,CAAsCE,OAApD;EAEAR,SAAS,CAAC,MAAM;IACZ,MAAMS,EAAE,GAAGJ,aAAa,CAACK,WAAd,CAA2BC,OAAD,IAAa;MAC9CJ,KAAK,CAACK,QAAN,CAAeD,OAAO,CAACP,KAAvB;IACH,CAFU,CAAX;IAIA,OAAO,MAAM;MACTC,aAAa,CAACQ,cAAd,CAA6BJ,EAA7B;IACH,CAFD;EAGH,CARQ,EAQN,CAACJ,aAAD,CARM,CAAT;
|
|
1
|
+
{"version":3,"names":["useEffect","useRef","SimpleStore","usePageStore","value","animatedValue","initialValue","store","current","id","addListener","newPage","dispatch","removeListener","removeAllListeners"],"sources":["usePageStore.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { MonoStore, SyncAnimatedValue } from '@fountain-ui/core';\nimport { SimpleStore } from '@fountain-ui/core';\n\nexport default function usePageStore(value: SyncAnimatedValue): MonoStore<number> {\n const {\n animatedValue,\n initialValue,\n } = value;\n\n const store = useRef(new SimpleStore(initialValue)).current;\n\n useEffect(() => {\n const id = animatedValue.addListener((newPage) => {\n store.dispatch(newPage.value);\n });\n\n return () => {\n animatedValue.removeListener(id);\n };\n }, [animatedValue]);\n\n useEffect(() => {\n return () => {\n store.removeAllListeners();\n };\n }, [store]);\n\n return store;\n};\n"],"mappings":"AAAA,SAASA,SAAT,EAAoBC,MAApB,QAAkC,OAAlC;AAEA,SAASC,WAAT,QAA4B,mBAA5B;AAEA,eAAe,SAASC,YAAT,CAAsBC,KAAtB,EAAmE;EAC9E,MAAM;IACFC,aADE;IAEFC;EAFE,IAGFF,KAHJ;EAKA,MAAMG,KAAK,GAAGN,MAAM,CAAC,IAAIC,WAAJ,CAAgBI,YAAhB,CAAD,CAAN,CAAsCE,OAApD;EAEAR,SAAS,CAAC,MAAM;IACZ,MAAMS,EAAE,GAAGJ,aAAa,CAACK,WAAd,CAA2BC,OAAD,IAAa;MAC9CJ,KAAK,CAACK,QAAN,CAAeD,OAAO,CAACP,KAAvB;IACH,CAFU,CAAX;IAIA,OAAO,MAAM;MACTC,aAAa,CAACQ,cAAd,CAA6BJ,EAA7B;IACH,CAFD;EAGH,CARQ,EAQN,CAACJ,aAAD,CARM,CAAT;EAUAL,SAAS,CAAC,MAAM;IACZ,OAAO,MAAM;MACTO,KAAK,CAACO,kBAAN;IACH,CAFD;EAGH,CAJQ,EAIN,CAACP,KAAD,CAJM,CAAT;EAMA,OAAOA,KAAP;AACH;AAAA"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
|
+
import { clamp } from '@fountain-ui/utils';
|
|
2
|
+
|
|
1
3
|
const computeRectSize = rect => (rect.bottom - rect.top) * (rect.right - rect.left);
|
|
2
4
|
|
|
3
5
|
const normalizePagePosition = value => value != null && Number.isFinite(value) ? value : Number.MAX_SAFE_INTEGER;
|
|
4
6
|
|
|
5
7
|
const normalizeViewSize = size => Number.isFinite(size) && size > 0 ? size : Number.MAX_SAFE_INTEGER;
|
|
6
8
|
|
|
7
|
-
const clamp = (value, min, max) => Math.min(Math.max(value, min), max);
|
|
8
|
-
|
|
9
9
|
export default function measureViewability(_ref) {
|
|
10
10
|
let {
|
|
11
11
|
view,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["computeRectSize","rect","bottom","top","right","left","normalizePagePosition","value","Number","isFinite","MAX_SAFE_INTEGER","normalizeViewSize","size","
|
|
1
|
+
{"version":3,"names":["clamp","computeRectSize","rect","bottom","top","right","left","normalizePagePosition","value","Number","isFinite","MAX_SAFE_INTEGER","normalizeViewSize","size","measureViewability","view","windowWidth","windowHeight","onViewabilityDetailMeasured","measure","x","y","width","height","pageX","pageY","safePageX","safePageY","visibleRect","visibleRectSize","viewSize","visiblePercent","Math","round"],"sources":["measureViewability.ts"],"sourcesContent":["import type { View } from 'react-native';\nimport { clamp } from '@fountain-ui/utils';\n\ninterface Rect {\n top: number,\n bottom: number;\n left: number;\n right: number;\n}\n\nexport interface ViewabilityDetail {\n visiblePercent: number;\n}\n\nexport interface MeasureViewabilityParameters {\n view: View;\n windowWidth: number;\n windowHeight: number;\n onViewabilityDetailMeasured: (detail: ViewabilityDetail) => void;\n}\n\nconst computeRectSize = (rect: Rect): number =>\n (rect.bottom - rect.top) * (rect.right - rect.left);\n\nconst normalizePagePosition = (value?: number): number =>\n (value != null && Number.isFinite(value)) ? value : Number.MAX_SAFE_INTEGER;\n\nconst normalizeViewSize = (size: number): number =>\n Number.isFinite(size) && size > 0 ? size : Number.MAX_SAFE_INTEGER;\n\nexport default function measureViewability({\n view,\n windowWidth,\n windowHeight,\n onViewabilityDetailMeasured,\n}: MeasureViewabilityParameters) {\n view.measure((x, y, width, height, pageX?: number, pageY?: number) => {\n const safePageX = normalizePagePosition(pageX);\n const safePageY = normalizePagePosition(pageY);\n\n const visibleRect: Rect = {\n top: clamp(safePageY, 0, windowHeight),\n bottom: clamp(safePageY + height, 0, windowHeight),\n left: clamp(safePageX, 0, windowWidth),\n right: clamp(safePageX + width, 0, windowWidth),\n };\n\n const visibleRectSize = computeRectSize(visibleRect);\n const viewSize = normalizeViewSize(width * height);\n const visiblePercent = Math.round(visibleRectSize / viewSize * 100);\n\n onViewabilityDetailMeasured?.({ visiblePercent });\n });\n};\n"],"mappings":"AACA,SAASA,KAAT,QAAsB,oBAAtB;;AAoBA,MAAMC,eAAe,GAAIC,IAAD,IACpB,CAACA,IAAI,CAACC,MAAL,GAAcD,IAAI,CAACE,GAApB,KAA4BF,IAAI,CAACG,KAAL,GAAaH,IAAI,CAACI,IAA9C,CADJ;;AAGA,MAAMC,qBAAqB,GAAIC,KAAD,IACzBA,KAAK,IAAI,IAAT,IAAiBC,MAAM,CAACC,QAAP,CAAgBF,KAAhB,CAAlB,GAA4CA,KAA5C,GAAoDC,MAAM,CAACE,gBAD/D;;AAGA,MAAMC,iBAAiB,GAAIC,IAAD,IACtBJ,MAAM,CAACC,QAAP,CAAgBG,IAAhB,KAAyBA,IAAI,GAAG,CAAhC,GAAoCA,IAApC,GAA2CJ,MAAM,CAACE,gBADtD;;AAGA,eAAe,SAASG,kBAAT,OAKkB;EAAA,IALU;IACvCC,IADuC;IAEvCC,WAFuC;IAGvCC,YAHuC;IAIvCC;EAJuC,CAKV;EAC7BH,IAAI,CAACI,OAAL,CAAa,CAACC,CAAD,EAAIC,CAAJ,EAAOC,KAAP,EAAcC,MAAd,EAAsBC,KAAtB,EAAsCC,KAAtC,KAAyD;IAClE,MAAMC,SAAS,GAAGnB,qBAAqB,CAACiB,KAAD,CAAvC;IACA,MAAMG,SAAS,GAAGpB,qBAAqB,CAACkB,KAAD,CAAvC;IAEA,MAAMG,WAAiB,GAAG;MACtBxB,GAAG,EAAEJ,KAAK,CAAC2B,SAAD,EAAY,CAAZ,EAAeV,YAAf,CADY;MAEtBd,MAAM,EAAEH,KAAK,CAAC2B,SAAS,GAAGJ,MAAb,EAAqB,CAArB,EAAwBN,YAAxB,CAFS;MAGtBX,IAAI,EAAEN,KAAK,CAAC0B,SAAD,EAAY,CAAZ,EAAeV,WAAf,CAHW;MAItBX,KAAK,EAAEL,KAAK,CAAC0B,SAAS,GAAGJ,KAAb,EAAoB,CAApB,EAAuBN,WAAvB;IAJU,CAA1B;IAOA,MAAMa,eAAe,GAAG5B,eAAe,CAAC2B,WAAD,CAAvC;IACA,MAAME,QAAQ,GAAGlB,iBAAiB,CAACU,KAAK,GAAGC,MAAT,CAAlC;IACA,MAAMQ,cAAc,GAAGC,IAAI,CAACC,KAAL,CAAWJ,eAAe,GAAGC,QAAlB,GAA6B,GAAxC,CAAvB;IAEAZ,2BAA2B,SAA3B,IAAAA,2BAA2B,WAA3B,YAAAA,2BAA2B,CAAG;MAAEa;IAAF,CAAH,CAA3B;EACH,CAhBD;AAiBH;AAAA"}
|
|
@@ -4,8 +4,8 @@ import type { AutoplayController, StartPagingAnimation } from '../types';
|
|
|
4
4
|
export interface ScrollViewGestureProps {
|
|
5
5
|
autoplayController: AutoplayController;
|
|
6
6
|
children: ReactNode;
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
interruptAnimation: () => void;
|
|
8
|
+
translateX: Animated.Value;
|
|
9
9
|
scrollEnabled: boolean;
|
|
10
10
|
startPagingAnimation: StartPagingAnimation;
|
|
11
11
|
}
|
|
File without changes
|
|
@@ -1,7 +1,5 @@
|
|
|
1
1
|
export { default as useAutoplayController } from './useAutoplayController';
|
|
2
|
-
export { default as useDimensionChangeReaction } from './useDimensionChangeReaction';
|
|
3
2
|
export { default as useIndexController } from './useIndexController';
|
|
4
|
-
export { default as useItemInterpolation } from './useItemInterpolation';
|
|
5
3
|
export { default as useLoopedData } from './useLoopedData';
|
|
6
4
|
export { default as usePagingAnimation } from './usePagingAnimation';
|
|
7
5
|
export { default as useItemVisibilityStore } from './useItemVisibilityStore';
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import type { ItemVisibilityStore } from '../types';
|
|
2
2
|
export interface Parameters {
|
|
3
|
-
|
|
3
|
+
initialIndex: number;
|
|
4
4
|
numberOfData: number;
|
|
5
5
|
windowSize: number;
|
|
6
6
|
}
|
|
7
|
-
export
|
|
7
|
+
export interface OnIndexChange {
|
|
8
|
+
(newIndex: number): void;
|
|
9
|
+
}
|
|
10
|
+
export default function useItemVisibilityStore(params: Parameters): [ItemVisibilityStore, OnIndexChange];
|
|
@@ -1,18 +1,16 @@
|
|
|
1
1
|
import { Animated } from 'react-native';
|
|
2
|
-
import type { CreateScrollAnimation,
|
|
2
|
+
import type { CreateScrollAnimation, IndexController, StartPagingAnimation } from '../types';
|
|
3
3
|
export interface PagingAnimationParameters {
|
|
4
|
-
controlledTx: Animated.Value;
|
|
5
4
|
createScrollAnimation: CreateScrollAnimation;
|
|
6
|
-
getCurrentIndex: GetCurrentIndex;
|
|
7
5
|
itemWidth: number;
|
|
8
|
-
|
|
6
|
+
indexController: IndexController;
|
|
9
7
|
loop: boolean;
|
|
10
8
|
numberOfData: number;
|
|
11
|
-
|
|
9
|
+
offsetX: Animated.Value;
|
|
10
|
+
translateX: Animated.Value;
|
|
12
11
|
}
|
|
13
12
|
export interface UsePagingAnimation {
|
|
14
|
-
|
|
15
|
-
globalInterpolation: Animated.AnimatedInterpolation;
|
|
13
|
+
interruptAnimation: () => void;
|
|
16
14
|
startPagingAnimation: StartPagingAnimation;
|
|
17
15
|
}
|
|
18
16
|
export default function usePagingAnimation(params: PagingAnimationParameters): UsePagingAnimation;
|