react-native-reanimated-carousel 4.0.0-alpha.1 → 4.0.0-alpha.11
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/README.md +2 -3
- package/lib/commonjs/{layouts → components}/BaseLayout.js +5 -21
- package/lib/commonjs/components/BaseLayout.js.map +1 -0
- package/lib/commonjs/components/Carousel.js +28 -48
- package/lib/commonjs/components/Carousel.js.map +1 -1
- package/lib/commonjs/components/ItemRenderer.js +80 -0
- package/lib/commonjs/components/ItemRenderer.js.map +1 -0
- package/lib/commonjs/components/Pagination/Basic/PaginationItem.js +81 -0
- package/lib/commonjs/components/Pagination/Basic/PaginationItem.js.map +1 -0
- package/lib/commonjs/components/Pagination/Basic/index.js +57 -0
- package/lib/commonjs/components/Pagination/Basic/index.js.map +1 -0
- package/lib/commonjs/components/Pagination/index.js +14 -0
- package/lib/commonjs/components/Pagination/index.js.map +1 -0
- package/lib/commonjs/components/ScrollViewGesture.js +51 -33
- package/lib/commonjs/components/ScrollViewGesture.js.map +1 -1
- package/lib/commonjs/components/rnr-demo.test.js +45 -0
- package/lib/commonjs/components/rnr-demo.test.js.map +1 -0
- package/lib/commonjs/hooks/useCarouselController.js +12 -11
- package/lib/commonjs/hooks/useCarouselController.js.map +1 -1
- package/lib/commonjs/hooks/useCommonVariables.js +38 -12
- package/lib/commonjs/hooks/useCommonVariables.js.map +1 -1
- package/lib/commonjs/hooks/useCommonVariables.test.js +38 -0
- package/lib/commonjs/hooks/useCommonVariables.test.js.map +1 -0
- package/lib/commonjs/hooks/useLayoutConfig.js.map +1 -1
- package/lib/commonjs/hooks/useOffsetX.js +9 -6
- package/lib/commonjs/hooks/useOffsetX.js.map +1 -1
- package/lib/commonjs/hooks/useOffsetX.test.js +53 -0
- package/lib/commonjs/hooks/useOffsetX.test.js.map +1 -0
- package/lib/commonjs/hooks/useOnProgressChange.js +4 -1
- package/lib/commonjs/hooks/useOnProgressChange.js.map +1 -1
- package/lib/commonjs/hooks/usePanGestureProxy.js +84 -0
- package/lib/commonjs/hooks/usePanGestureProxy.js.map +1 -0
- package/lib/commonjs/hooks/usePanGestureProxy.test.js +397 -0
- package/lib/commonjs/hooks/usePanGestureProxy.test.js.map +1 -0
- package/lib/commonjs/hooks/useUpdateGestureConfig.js.map +1 -1
- package/lib/commonjs/hooks/useVisibleRanges.js +48 -19
- package/lib/commonjs/hooks/useVisibleRanges.js.map +1 -1
- package/lib/commonjs/hooks/useVisibleRanges.test.js +162 -0
- package/lib/commonjs/hooks/useVisibleRanges.test.js.map +1 -0
- package/lib/commonjs/index.js +8 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/utils/{computeNewIndexWhenDataChanges.js → compute-offset-if-data-changed.js} +3 -3
- package/lib/commonjs/utils/compute-offset-if-data-changed.js.map +1 -0
- package/lib/commonjs/utils/compute-offset-if-data-changed.test.js +30 -0
- package/lib/commonjs/utils/compute-offset-if-data-changed.test.js.map +1 -0
- package/lib/commonjs/utils/compute-offset-if-size-changed.js +18 -0
- package/lib/commonjs/utils/compute-offset-if-size-changed.js.map +1 -0
- package/lib/commonjs/utils/compute-offset-if-size-changed.test.js +72 -0
- package/lib/commonjs/utils/compute-offset-if-size-changed.test.js.map +1 -0
- package/lib/commonjs/utils/handleroffset-direction.js +5 -5
- package/lib/commonjs/utils/handleroffset-direction.js.map +1 -1
- package/lib/commonjs/utils/handleroffset-direction.test.js +46 -0
- package/lib/commonjs/utils/handleroffset-direction.test.js.map +1 -0
- package/lib/commonjs/utils/index.test.js +6 -6
- package/lib/commonjs/utils/index.test.js.map +1 -1
- package/lib/module/{layouts → components}/BaseLayout.js +6 -16
- package/lib/module/components/BaseLayout.js.map +1 -0
- package/lib/module/components/Carousel.js +27 -44
- package/lib/module/components/Carousel.js.map +1 -1
- package/lib/module/components/ItemRenderer.js +62 -0
- package/lib/module/components/ItemRenderer.js.map +1 -0
- package/lib/module/components/Pagination/Basic/PaginationItem.js +63 -0
- package/lib/module/components/Pagination/Basic/PaginationItem.js.map +1 -0
- package/lib/module/components/Pagination/Basic/index.js +42 -0
- package/lib/module/components/Pagination/Basic/index.js.map +1 -0
- package/lib/module/components/Pagination/index.js +5 -0
- package/lib/module/components/Pagination/index.js.map +1 -0
- package/lib/module/components/ScrollViewGesture.js +53 -34
- package/lib/module/components/ScrollViewGesture.js.map +1 -1
- package/lib/module/components/rnr-demo.test.js +33 -0
- package/lib/module/components/rnr-demo.test.js.map +1 -0
- package/lib/module/hooks/useCarouselController.js +12 -11
- package/lib/module/hooks/useCarouselController.js.map +1 -1
- package/lib/module/hooks/useCommonVariables.js +38 -8
- package/lib/module/hooks/useCommonVariables.js.map +1 -1
- package/lib/module/hooks/useCommonVariables.test.js +34 -0
- package/lib/module/hooks/useCommonVariables.test.js.map +1 -0
- package/lib/module/hooks/useLayoutConfig.js.map +1 -1
- package/lib/module/hooks/useOffsetX.js +9 -6
- package/lib/module/hooks/useOffsetX.js.map +1 -1
- package/lib/module/hooks/useOffsetX.test.js +48 -0
- package/lib/module/hooks/useOffsetX.test.js.map +1 -0
- package/lib/module/hooks/useOnProgressChange.js +4 -1
- package/lib/module/hooks/useOnProgressChange.js.map +1 -1
- package/lib/module/hooks/usePanGestureProxy.js +71 -0
- package/lib/module/hooks/usePanGestureProxy.js.map +1 -0
- package/lib/module/hooks/usePanGestureProxy.test.js +383 -0
- package/lib/module/hooks/usePanGestureProxy.test.js.map +1 -0
- package/lib/module/hooks/useUpdateGestureConfig.js.map +1 -1
- package/lib/module/hooks/useVisibleRanges.js +47 -19
- package/lib/module/hooks/useVisibleRanges.js.map +1 -1
- package/lib/module/hooks/useVisibleRanges.test.js +157 -0
- package/lib/module/hooks/useVisibleRanges.test.js.map +1 -0
- package/lib/module/index.js +1 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/utils/{computeNewIndexWhenDataChanges.js → compute-offset-if-data-changed.js} +2 -2
- package/lib/module/utils/compute-offset-if-data-changed.js.map +1 -0
- package/lib/module/utils/compute-offset-if-data-changed.test.js +27 -0
- package/lib/module/utils/compute-offset-if-data-changed.test.js.map +1 -0
- package/lib/module/utils/compute-offset-if-size-changed.js +11 -0
- package/lib/module/utils/compute-offset-if-size-changed.js.map +1 -0
- package/lib/module/utils/compute-offset-if-size-changed.test.js +69 -0
- package/lib/module/utils/compute-offset-if-size-changed.test.js.map +1 -0
- package/lib/module/utils/handleroffset-direction.js +5 -5
- package/lib/module/utils/handleroffset-direction.js.map +1 -1
- package/lib/module/utils/handleroffset-direction.test.js +41 -0
- package/lib/module/utils/handleroffset-direction.test.js.map +1 -0
- package/lib/module/utils/index.test.js +6 -6
- package/lib/module/utils/index.test.js.map +1 -1
- package/lib/typescript/components/ItemRenderer.d.ts +22 -0
- package/lib/typescript/components/Pagination/Basic/PaginationItem.d.ts +17 -0
- package/lib/typescript/components/Pagination/Basic/index.d.ts +16 -0
- package/lib/typescript/components/Pagination/index.d.ts +3 -0
- package/lib/typescript/components/ScrollViewGesture.d.ts +1 -1
- package/lib/typescript/components/rnr-demo.test.d.ts +1 -0
- package/lib/typescript/hooks/useCarouselController.d.ts +3 -2
- package/lib/typescript/hooks/useCommonVariables.test.d.ts +1 -0
- package/lib/typescript/hooks/useLayoutConfig.d.ts +1 -1
- package/lib/typescript/hooks/useOffsetX.test.d.ts +1 -0
- package/lib/typescript/hooks/usePanGestureProxy.d.ts +9 -0
- package/lib/typescript/hooks/usePanGestureProxy.test.d.ts +1 -0
- package/lib/typescript/hooks/useUpdateGestureConfig.d.ts +3 -2
- package/lib/typescript/hooks/useVisibleRanges.d.ts +8 -4
- package/lib/typescript/hooks/useVisibleRanges.test.d.ts +1 -0
- package/lib/typescript/index.d.ts +2 -0
- package/lib/typescript/types.d.ts +27 -16
- package/lib/typescript/utils/{computeNewIndexWhenDataChanges.d.ts → compute-offset-if-data-changed.d.ts} +1 -1
- package/lib/typescript/utils/compute-offset-if-data-changed.test.d.ts +1 -0
- package/lib/typescript/utils/compute-offset-if-size-changed.d.ts +5 -0
- package/lib/typescript/utils/compute-offset-if-size-changed.test.d.ts +1 -0
- package/lib/typescript/utils/handleroffset-direction.d.ts +2 -1
- package/lib/typescript/utils/handleroffset-direction.test.d.ts +1 -0
- package/package.json +18 -60
- package/src/{layouts → components}/BaseLayout.tsx +7 -35
- package/src/components/Carousel.tsx +33 -71
- package/src/components/ItemRenderer.tsx +105 -0
- package/src/components/Pagination/Basic/PaginationItem.tsx +111 -0
- package/src/components/Pagination/Basic/index.tsx +81 -0
- package/src/components/Pagination/index.tsx +5 -0
- package/src/components/ScrollViewGesture.tsx +74 -49
- package/src/components/rnr-demo.test.tsx +43 -0
- package/src/hooks/useCarouselController.tsx +24 -21
- package/src/hooks/useCommonVariables.test.tsx +41 -0
- package/src/hooks/useCommonVariables.ts +35 -10
- package/src/hooks/useLayoutConfig.ts +1 -1
- package/src/hooks/useOffsetX.test.ts +54 -0
- package/src/hooks/useOffsetX.ts +33 -31
- package/src/hooks/useOnProgressChange.ts +7 -2
- package/src/hooks/usePanGestureProxy.test.tsx +376 -0
- package/src/hooks/usePanGestureProxy.ts +110 -0
- package/src/hooks/useUpdateGestureConfig.ts +4 -2
- package/src/hooks/useVisibleRanges.test.tsx +179 -0
- package/src/hooks/useVisibleRanges.tsx +72 -24
- package/src/index.tsx +3 -0
- package/src/types.ts +28 -17
- package/src/utils/compute-offset-if-data-changed.test.ts +30 -0
- package/src/utils/{computeNewIndexWhenDataChanges.ts → compute-offset-if-data-changed.ts} +1 -1
- package/src/utils/compute-offset-if-size-changed.test.ts +78 -0
- package/src/utils/compute-offset-if-size-changed.ts +11 -0
- package/src/utils/handleroffset-direction.test.ts +52 -0
- package/src/utils/handleroffset-direction.ts +12 -9
- package/src/utils/index.test.ts +6 -6
- package/lib/commonjs/layouts/BaseLayout.js.map +0 -1
- package/lib/commonjs/layouts/ParallaxLayout.js +0 -84
- package/lib/commonjs/layouts/ParallaxLayout.js.map +0 -1
- package/lib/commonjs/utils/computeNewIndexWhenDataChanges.js.map +0 -1
- package/lib/module/layouts/BaseLayout.js.map +0 -1
- package/lib/module/layouts/ParallaxLayout.js +0 -61
- package/lib/module/layouts/ParallaxLayout.js.map +0 -1
- package/lib/module/utils/computeNewIndexWhenDataChanges.js.map +0 -1
- package/lib/typescript/layouts/ParallaxLayout.d.ts +0 -13
- package/src/layouts/ParallaxLayout.tsx +0 -141
- /package/lib/typescript/{layouts → components}/BaseLayout.d.ts +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useVisibleRanges.tsx"],"names":["useDerivedValue","useVisibleRanges","options","total","viewSize","translation","windowSize","_windowSize","ranges","positiveCount","Math","round","negativeCount","
|
|
1
|
+
{"version":3,"sources":["useVisibleRanges.tsx"],"names":["useRef","useDerivedValue","useVisibleRanges","options","total","viewSize","translation","windowSize","_windowSize","loop","cachedRanges","ranges","positiveCount","Math","round","negativeCount","currentIndex","value","newRanges","negativeRange","positiveRange","isArraysEqual","current","a","b","length","every","index"],"mappings":"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","sourcesContent":["import { useRef } from \"react\";\nimport type Animated from \"react-native-reanimated\";\nimport { useDerivedValue } from \"react-native-reanimated\";\n\ntype Range = [number, number];\n\nexport interface VisibleRanges {\n negativeRange: Range\n positiveRange: Range\n}\n\nexport type IVisibleRanges = Animated.SharedValue<VisibleRanges>;\n\nexport function useVisibleRanges(options: {\n total: number\n viewSize: number\n windowSize?: number\n translation: Animated.SharedValue<number>\n loop?: boolean\n}): IVisibleRanges {\n const {\n total = 0,\n viewSize,\n translation,\n windowSize: _windowSize,\n loop,\n } = options;\n\n const windowSize = _windowSize ?? total;\n const cachedRanges = useRef<VisibleRanges>(null!);\n\n const ranges = useDerivedValue(() => {\n const positiveCount = Math.round(windowSize / 2);\n const negativeCount = windowSize - positiveCount;\n\n let currentIndex = Math.round(-translation.value / viewSize);\n currentIndex = currentIndex < 0 ? (currentIndex % total) + total : currentIndex;\n\n let newRanges: VisibleRanges;\n\n if (!loop) {\n // Adjusting negative range if the carousel is not loopable.\n // So, It will be only displayed the positive items.\n newRanges = {\n negativeRange: [0 + currentIndex - (windowSize - 1), 0 + currentIndex],\n positiveRange: [0 + currentIndex, currentIndex + (windowSize - 1)],\n };\n }\n else {\n const negativeRange: Range = [\n (currentIndex - negativeCount + total) % total,\n (currentIndex - 1 + total) % total,\n ];\n\n const positiveRange: Range = [\n (currentIndex + total) % total,\n (currentIndex + positiveCount + total) % total,\n ];\n\n if (negativeRange[0] < total && negativeRange[0] > negativeRange[1]) {\n negativeRange[1] = total - 1;\n positiveRange[0] = 0;\n }\n if (positiveRange[0] > positiveRange[1]) {\n negativeRange[1] = total - 1;\n positiveRange[0] = 0;\n }\n\n // console.log({ negativeRange, positiveRange ,total,windowSize,a:total <= _windowSize})\n newRanges = { negativeRange, positiveRange };\n }\n\n if (\n isArraysEqual(\n cachedRanges.current?.negativeRange ?? [],\n newRanges.negativeRange,\n )\n && isArraysEqual(\n cachedRanges.current?.positiveRange ?? [],\n newRanges.positiveRange,\n )\n )\n return cachedRanges.current;\n\n cachedRanges.current = newRanges;\n return cachedRanges.current;\n }, [loop, total, windowSize, translation]);\n\n return ranges;\n}\n\nfunction isArraysEqual(a: number[], b: number[]): boolean {\n \"worklet\";\n if (a.length !== b.length) return false;\n\n return a.every((value, index) => value === b[index]);\n}\n"]}
|
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
import { useSharedValue } from "react-native-reanimated";
|
|
2
|
+
import { renderHook } from "@testing-library/react-hooks";
|
|
3
|
+
import { useVisibleRanges } from "./useVisibleRanges";
|
|
4
|
+
const viewSize = 393;
|
|
5
|
+
describe("useVisibleRanges", () => {
|
|
6
|
+
it("should only display the front of the list when loop is false", async () => {
|
|
7
|
+
const hook = renderHook(() => {
|
|
8
|
+
const translation = useSharedValue(-0);
|
|
9
|
+
const range = useVisibleRanges({
|
|
10
|
+
total: 10,
|
|
11
|
+
translation,
|
|
12
|
+
viewSize,
|
|
13
|
+
windowSize: 4,
|
|
14
|
+
loop: false
|
|
15
|
+
});
|
|
16
|
+
return range;
|
|
17
|
+
});
|
|
18
|
+
const expected = hook.result.current.value;
|
|
19
|
+
expect(expected).toMatchInlineSnapshot(`
|
|
20
|
+
{
|
|
21
|
+
"negativeRange": [
|
|
22
|
+
-3,
|
|
23
|
+
0,
|
|
24
|
+
],
|
|
25
|
+
"positiveRange": [
|
|
26
|
+
0,
|
|
27
|
+
3,
|
|
28
|
+
],
|
|
29
|
+
}
|
|
30
|
+
`);
|
|
31
|
+
});
|
|
32
|
+
it("should display the rear of the list and the front of the list when loop is true", async () => {
|
|
33
|
+
const hook = renderHook(() => {
|
|
34
|
+
const translation = useSharedValue(-0);
|
|
35
|
+
const range = useVisibleRanges({
|
|
36
|
+
total: 10,
|
|
37
|
+
translation,
|
|
38
|
+
viewSize,
|
|
39
|
+
windowSize: 4,
|
|
40
|
+
loop: true
|
|
41
|
+
});
|
|
42
|
+
return range;
|
|
43
|
+
});
|
|
44
|
+
const expected = hook.result.current.value;
|
|
45
|
+
expect(expected).toMatchInlineSnapshot(`
|
|
46
|
+
{
|
|
47
|
+
"negativeRange": [
|
|
48
|
+
8,
|
|
49
|
+
9,
|
|
50
|
+
],
|
|
51
|
+
"positiveRange": [
|
|
52
|
+
0,
|
|
53
|
+
2,
|
|
54
|
+
],
|
|
55
|
+
}
|
|
56
|
+
`);
|
|
57
|
+
});
|
|
58
|
+
it("should shows the increased range of the list when the loop is false and swiped the carousel.", async () => {
|
|
59
|
+
const slide0hook = renderHook(() => {
|
|
60
|
+
const translation = useSharedValue(-0 * viewSize);
|
|
61
|
+
const range = useVisibleRanges({
|
|
62
|
+
total: 10,
|
|
63
|
+
translation,
|
|
64
|
+
viewSize,
|
|
65
|
+
windowSize: 4,
|
|
66
|
+
loop: false
|
|
67
|
+
});
|
|
68
|
+
return range;
|
|
69
|
+
}).result.current.value;
|
|
70
|
+
const slide1hook = renderHook(() => {
|
|
71
|
+
const translation = useSharedValue(-1 * viewSize);
|
|
72
|
+
const range = useVisibleRanges({
|
|
73
|
+
total: 10,
|
|
74
|
+
translation,
|
|
75
|
+
viewSize,
|
|
76
|
+
windowSize: 4,
|
|
77
|
+
loop: false
|
|
78
|
+
});
|
|
79
|
+
return range;
|
|
80
|
+
}).result.current.value;
|
|
81
|
+
const slide2hook = renderHook(() => {
|
|
82
|
+
const translation = useSharedValue(-2 * viewSize);
|
|
83
|
+
const range = useVisibleRanges({
|
|
84
|
+
total: 10,
|
|
85
|
+
translation,
|
|
86
|
+
viewSize,
|
|
87
|
+
windowSize: 4,
|
|
88
|
+
loop: false
|
|
89
|
+
});
|
|
90
|
+
return range;
|
|
91
|
+
}).result.current.value;
|
|
92
|
+
const slide3hook = renderHook(() => {
|
|
93
|
+
const translation = useSharedValue(-3 * viewSize);
|
|
94
|
+
const range = useVisibleRanges({
|
|
95
|
+
total: 10,
|
|
96
|
+
translation,
|
|
97
|
+
viewSize,
|
|
98
|
+
windowSize: 4,
|
|
99
|
+
loop: false
|
|
100
|
+
});
|
|
101
|
+
return range;
|
|
102
|
+
}).result.current.value; // [0,3] Display the 0,1,2,3 items.
|
|
103
|
+
|
|
104
|
+
expect(slide0hook).toMatchInlineSnapshot(`
|
|
105
|
+
{
|
|
106
|
+
"negativeRange": [
|
|
107
|
+
-3,
|
|
108
|
+
0,
|
|
109
|
+
],
|
|
110
|
+
"positiveRange": [
|
|
111
|
+
0,
|
|
112
|
+
3,
|
|
113
|
+
],
|
|
114
|
+
}
|
|
115
|
+
`); // [1,4] Display the 1,2,3,4 items.
|
|
116
|
+
|
|
117
|
+
expect(slide1hook).toMatchInlineSnapshot(`
|
|
118
|
+
{
|
|
119
|
+
"negativeRange": [
|
|
120
|
+
-2,
|
|
121
|
+
1,
|
|
122
|
+
],
|
|
123
|
+
"positiveRange": [
|
|
124
|
+
1,
|
|
125
|
+
4,
|
|
126
|
+
],
|
|
127
|
+
}
|
|
128
|
+
`); // [2,5] Display the 2,3,4,5 items.
|
|
129
|
+
|
|
130
|
+
expect(slide2hook).toMatchInlineSnapshot(`
|
|
131
|
+
{
|
|
132
|
+
"negativeRange": [
|
|
133
|
+
-1,
|
|
134
|
+
2,
|
|
135
|
+
],
|
|
136
|
+
"positiveRange": [
|
|
137
|
+
2,
|
|
138
|
+
5,
|
|
139
|
+
],
|
|
140
|
+
}
|
|
141
|
+
`); // [3.6] Display the 3,4,5,6 items.
|
|
142
|
+
|
|
143
|
+
expect(slide3hook).toMatchInlineSnapshot(`
|
|
144
|
+
{
|
|
145
|
+
"negativeRange": [
|
|
146
|
+
0,
|
|
147
|
+
3,
|
|
148
|
+
],
|
|
149
|
+
"positiveRange": [
|
|
150
|
+
3,
|
|
151
|
+
6,
|
|
152
|
+
],
|
|
153
|
+
}
|
|
154
|
+
`);
|
|
155
|
+
});
|
|
156
|
+
});
|
|
157
|
+
//# sourceMappingURL=useVisibleRanges.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["useVisibleRanges.test.tsx"],"names":["useSharedValue","renderHook","useVisibleRanges","viewSize","describe","it","hook","translation","range","total","windowSize","loop","expected","result","current","value","expect","toMatchInlineSnapshot","slide0hook","slide1hook","slide2hook","slide3hook"],"mappings":"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","sourcesContent":["import { useSharedValue } from \"react-native-reanimated\";\n\nimport { renderHook } from \"@testing-library/react-hooks\";\n\nimport { useVisibleRanges } from \"./useVisibleRanges\";\n\nconst viewSize = 393;\n\ndescribe(\"useVisibleRanges\", () => {\n it(\"should only display the front of the list when loop is false\", async () => {\n const hook = renderHook(() => {\n const translation = useSharedValue(-0);\n const range = useVisibleRanges({\n total: 10,\n translation,\n viewSize,\n windowSize: 4,\n loop: false,\n });\n\n return range;\n });\n\n const expected = hook.result.current.value;\n\n expect(expected).toMatchInlineSnapshot(`\n {\n \"negativeRange\": [\n -3,\n 0,\n ],\n \"positiveRange\": [\n 0,\n 3,\n ],\n }\n `);\n });\n\n it(\"should display the rear of the list and the front of the list when loop is true\", async () => {\n const hook = renderHook(() => {\n const translation = useSharedValue(-0);\n const range = useVisibleRanges({\n total: 10,\n translation,\n viewSize,\n windowSize: 4,\n loop: true,\n });\n\n return range;\n });\n\n const expected = hook.result.current.value;\n\n expect(expected).toMatchInlineSnapshot(`\n {\n \"negativeRange\": [\n 8,\n 9,\n ],\n \"positiveRange\": [\n 0,\n 2,\n ],\n }\n `);\n });\n\n it(\"should shows the increased range of the list when the loop is false and swiped the carousel.\", async () => {\n const slide0hook = renderHook(() => {\n const translation = useSharedValue(-0 * viewSize);\n const range = useVisibleRanges({\n total: 10,\n translation,\n viewSize,\n windowSize: 4,\n loop: false,\n });\n\n return range;\n }).result.current.value;\n\n const slide1hook = renderHook(() => {\n const translation = useSharedValue(-1 * viewSize);\n const range = useVisibleRanges({\n total: 10,\n translation,\n viewSize,\n windowSize: 4,\n loop: false,\n });\n\n return range;\n }).result.current.value;\n\n const slide2hook = renderHook(() => {\n const translation = useSharedValue(-2 * viewSize);\n const range = useVisibleRanges({\n total: 10,\n translation,\n viewSize,\n windowSize: 4,\n loop: false,\n });\n\n return range;\n }).result.current.value;\n\n const slide3hook = renderHook(() => {\n const translation = useSharedValue(-3 * viewSize);\n const range = useVisibleRanges({\n total: 10,\n translation,\n viewSize,\n windowSize: 4,\n loop: false,\n });\n\n return range;\n }).result.current.value;\n\n // [0,3] Display the 0,1,2,3 items.\n expect(slide0hook).toMatchInlineSnapshot(`\n {\n \"negativeRange\": [\n -3,\n 0,\n ],\n \"positiveRange\": [\n 0,\n 3,\n ],\n }\n `);\n\n // [1,4] Display the 1,2,3,4 items.\n expect(slide1hook).toMatchInlineSnapshot(`\n {\n \"negativeRange\": [\n -2,\n 1,\n ],\n \"positiveRange\": [\n 1,\n 4,\n ],\n }\n `);\n\n // [2,5] Display the 2,3,4,5 items.\n expect(slide2hook).toMatchInlineSnapshot(`\n {\n \"negativeRange\": [\n -1,\n 2,\n ],\n \"positiveRange\": [\n 2,\n 5,\n ],\n }\n `);\n\n // [3.6] Display the 3,4,5,6 items.\n expect(slide3hook).toMatchInlineSnapshot(`\n {\n \"negativeRange\": [\n 0,\n 3,\n ],\n \"positiveRange\": [\n 3,\n 6,\n ],\n }\n `);\n });\n});\n"]}
|
package/lib/module/index.js
CHANGED
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.tsx"],"names":["Carousel"],"mappings":"AAAA,OAAOA,QAAP,MAAqB,uBAArB;
|
|
1
|
+
{"version":3,"sources":["index.tsx"],"names":["Carousel","Pagination"],"mappings":"AAAA,OAAOA,QAAP,MAAqB,uBAArB;AACA,SAASC,UAAT,QAA2B,yBAA3B;AAWA,eAAeD,QAAf","sourcesContent":["import Carousel from \"./components/Carousel\";\nexport { Pagination } from \"./components/Pagination\";\n\nexport type {\n TCarouselProps,\n ICarouselInstance,\n IComputedDirectionTypes,\n CarouselRenderItem,\n} from \"./types\";\nexport type { TAnimationStyle } from \"./components/BaseLayout\";\nexport type { ILayoutConfig } from \"./layouts/stack\";\n\nexport default Carousel;\n"]}
|
package/lib/module/utils/{computeNewIndexWhenDataChanges.js → compute-offset-if-data-changed.js}
RENAMED
|
@@ -4,7 +4,7 @@ export function omitZero(a, b) {
|
|
|
4
4
|
if (a === 0) return 0;
|
|
5
5
|
return b;
|
|
6
6
|
}
|
|
7
|
-
export function
|
|
7
|
+
export function computeOffsetIfDataChanged(params) {
|
|
8
8
|
"worklet";
|
|
9
9
|
|
|
10
10
|
const {
|
|
@@ -40,4 +40,4 @@ export function computeNewIndexWhenDataChanges(params) {
|
|
|
40
40
|
|
|
41
41
|
return handlerOffset;
|
|
42
42
|
}
|
|
43
|
-
//# sourceMappingURL=
|
|
43
|
+
//# sourceMappingURL=compute-offset-if-data-changed.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["compute-offset-if-data-changed.ts"],"names":["omitZero","a","b","computeOffsetIfDataChanged","params","direction","handlerOffset","_handlerOffset","size","previousLength","currentLength","positionIndex","round","isPositive","Math","abs","parseInt","String","prevOffset","prevIndex","changedLength","changedOffset"],"mappings":"AAAA,OAAO,SAASA,QAAT,CAAkBC,CAAlB,EAA6BC,CAA7B,EAAwC;AAC7C;;AACA,MAAID,CAAC,KAAK,CAAV,EACE,OAAO,CAAP;AAEF,SAAOC,CAAP;AACD;AAED,OAAO,SAASC,0BAAT,CAAoCC,MAApC,EAMJ;AACD;;AACA,QAAM;AAAEC,IAAAA,SAAF;AAAaC,IAAAA,aAAa,EAAEC,cAA5B;AAA4CC,IAAAA,IAA5C;AAAkDC,IAAAA,cAAlD;AAAkEC,IAAAA;AAAlE,MAAoFN,MAA1F;AAEA,MAAIE,aAAa,GAAGC,cAApB;AACA,MAAII,aAAJ;AACA,MAAIC,KAAJ;AAEA,QAAMC,UAAU,GAAGR,SAAS,GAAG,CAA/B;;AAEA,MAAIQ,UAAJ,EAAgB;AACdF,IAAAA,aAAa,GAAIG,IAAI,CAACC,GAAL,CAAST,aAAT,CAAD,GAA4BE,IAA5C;AACAI,IAAAA,KAAK,GAAGI,QAAQ,CAACC,MAAM,CAACjB,QAAQ,CAACS,cAAD,EAAiBE,aAAa,GAAGF,cAAjC,CAAT,CAAP,CAAhB;AACD,GAHD,MAIK;AACHE,IAAAA,aAAa,GAAG,CAACG,IAAI,CAACC,GAAL,CAAST,aAAT,IAA0BE,IAA3B,IAAmCA,IAAnD;AACAI,IAAAA,KAAK,GAAGI,QAAQ,CAACC,MAAM,CAACjB,QAAQ,CAACS,cAAD,EAAiBE,aAAa,GAAGF,cAAjC,CAAT,CAAP,CAAR,GAA6E,CAArF;AACD;;AAED,QAAMS,UAAU,GAAGlB,QAAQ,CAACS,cAAD,EAAiBE,aAAa,GAAGF,cAAjC,CAA3B;AACA,QAAMU,SAAS,GAAGN,UAAU,GAAGK,UAAH,GAAgBT,cAAc,GAAGS,UAAjB,GAA8B,CAA1E;AACA,QAAME,aAAa,GAAGR,KAAK,IAAIF,aAAa,GAAGD,cAApB,CAA3B;AACA,QAAMY,aAAa,GAAGD,aAAa,GAAGZ,IAAtC;;AACA,MAAIW,SAAS,GAAGT,aAAa,GAAG,CAA5B,IAAiCA,aAAa,GAAGD,cAArD,EAAqE;AACnE,QAAII,UAAJ,EACEP,aAAa,GAAG,CAACI,aAAa,GAAG,CAAjB,IAAsBF,IAAtB,GAA6BH,SAA7C,CADF,KAIEC,aAAa,GAAG,CAACI,aAAa,GAAG,CAAjB,IAAsBF,IAAtB,GAA6B,CAAC,CAA9C;AACH,GAND,MAOK;AACHF,IAAAA,aAAa,IAAIe,aAAa,GAAGhB,SAAjC;AACD;;AAED,SAAOC,aAAP;AACD","sourcesContent":["export function omitZero(a: number, b: number) {\n \"worklet\";\n if (a === 0)\n return 0;\n\n return b;\n}\n\nexport function computeOffsetIfDataChanged(params: {\n direction: number\n handlerOffset: number\n size: number\n previousLength: number\n currentLength: number\n}) {\n \"worklet\";\n const { direction, handlerOffset: _handlerOffset, size, previousLength, currentLength } = params;\n\n let handlerOffset = _handlerOffset;\n let positionIndex;\n let round;\n\n const isPositive = direction < 0;\n\n if (isPositive) {\n positionIndex = (Math.abs(handlerOffset)) / size;\n round = parseInt(String(omitZero(previousLength, positionIndex / previousLength)));\n }\n else {\n positionIndex = (Math.abs(handlerOffset) - size) / size;\n round = parseInt(String(omitZero(previousLength, positionIndex / previousLength))) + 1;\n }\n\n const prevOffset = omitZero(previousLength, positionIndex % previousLength);\n const prevIndex = isPositive ? prevOffset : previousLength - prevOffset - 1;\n const changedLength = round * (currentLength - previousLength);\n const changedOffset = changedLength * size;\n if (prevIndex > currentLength - 1 && currentLength < previousLength) {\n if (isPositive)\n handlerOffset = (currentLength - 1) * size * direction;\n\n else\n handlerOffset = (currentLength - 1) * size * -1;\n }\n else {\n handlerOffset += changedOffset * direction;\n }\n\n return handlerOffset;\n}\n\n"]}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { computeOffsetIfDataChanged } from "./compute-offset-if-data-changed";
|
|
2
|
+
describe("computeOffsetIfDataChanged", () => {
|
|
3
|
+
const size = 634;
|
|
4
|
+
it("should return the correct values, if index is 0", () => {
|
|
5
|
+
const index = 0;
|
|
6
|
+
const result = computeOffsetIfDataChanged({
|
|
7
|
+
direction: -1,
|
|
8
|
+
previousLength: 4,
|
|
9
|
+
currentLength: 6,
|
|
10
|
+
size,
|
|
11
|
+
handlerOffset: index * size
|
|
12
|
+
});
|
|
13
|
+
expect(result).toMatchInlineSnapshot("0");
|
|
14
|
+
});
|
|
15
|
+
it("should return the correct values, if index is 1", () => {
|
|
16
|
+
const index = 1;
|
|
17
|
+
const result = computeOffsetIfDataChanged({
|
|
18
|
+
direction: -1,
|
|
19
|
+
previousLength: 4,
|
|
20
|
+
currentLength: 6,
|
|
21
|
+
size,
|
|
22
|
+
handlerOffset: index * size
|
|
23
|
+
});
|
|
24
|
+
expect(result).toMatchInlineSnapshot("634");
|
|
25
|
+
});
|
|
26
|
+
});
|
|
27
|
+
//# sourceMappingURL=compute-offset-if-data-changed.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["compute-offset-if-data-changed.test.ts"],"names":["computeOffsetIfDataChanged","describe","size","it","index","result","direction","previousLength","currentLength","handlerOffset","expect","toMatchInlineSnapshot"],"mappings":"AAAA,SAASA,0BAAT,QAA2C,kCAA3C;AAEAC,QAAQ,CAAC,4BAAD,EAA+B,MAAM;AAC3C,QAAMC,IAAI,GAAG,GAAb;AACAC,EAAAA,EAAE,CAAC,iDAAD,EAAoD,MAAM;AAC1D,UAAMC,KAAK,GAAG,CAAd;AACA,UAAMC,MAAM,GAAGL,0BAA0B,CAAC;AACxCM,MAAAA,SAAS,EAAE,CAAC,CAD4B;AAExCC,MAAAA,cAAc,EAAE,CAFwB;AAGxCC,MAAAA,aAAa,EAAE,CAHyB;AAIxCN,MAAAA,IAJwC;AAKxCO,MAAAA,aAAa,EAAEL,KAAK,GAAGF;AALiB,KAAD,CAAzC;AAQAQ,IAAAA,MAAM,CAACL,MAAD,CAAN,CAAeM,qBAAf,CAAqC,GAArC;AACD,GAXC,CAAF;AAaAR,EAAAA,EAAE,CAAC,iDAAD,EAAoD,MAAM;AAC1D,UAAMC,KAAK,GAAG,CAAd;AACA,UAAMC,MAAM,GAAGL,0BAA0B,CAAC;AACxCM,MAAAA,SAAS,EAAE,CAAC,CAD4B;AAExCC,MAAAA,cAAc,EAAE,CAFwB;AAGxCC,MAAAA,aAAa,EAAE,CAHyB;AAIxCN,MAAAA,IAJwC;AAKxCO,MAAAA,aAAa,EAAEL,KAAK,GAAGF;AALiB,KAAD,CAAzC;AAQAQ,IAAAA,MAAM,CAACL,MAAD,CAAN,CAAeM,qBAAf,CAAqC,KAArC;AACD,GAXC,CAAF;AAYD,CA3BO,CAAR","sourcesContent":["import { computeOffsetIfDataChanged } from \"./compute-offset-if-data-changed\";\n\ndescribe(\"computeOffsetIfDataChanged\", () => {\n const size = 634;\n it(\"should return the correct values, if index is 0\", () => {\n const index = 0;\n const result = computeOffsetIfDataChanged({\n direction: -1,\n previousLength: 4,\n currentLength: 6,\n size,\n handlerOffset: index * size,\n });\n\n expect(result).toMatchInlineSnapshot(\"0\");\n });\n\n it(\"should return the correct values, if index is 1\", () => {\n const index = 1;\n const result = computeOffsetIfDataChanged({\n direction: -1,\n previousLength: 4,\n currentLength: 6,\n size,\n handlerOffset: index * size,\n });\n\n expect(result).toMatchInlineSnapshot(\"634\");\n });\n});\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["compute-offset-if-size-changed.ts"],"names":["computeOffsetIfSizeChanged","params","handlerOffset","prevSize","size"],"mappings":"AAAA,OAAO,SAASA,0BAAT,CAAoCC,MAApC,EAIJ;AACD;;AACA,QAAM;AAAEC,IAAAA,aAAF;AAAiBC,IAAAA,QAAjB;AAA2BC,IAAAA;AAA3B,MAAoCH,MAA1C;AAEA,SAAOC,aAAa,GAAGC,QAAhB,GAA2BC,IAAlC;AACD","sourcesContent":["export function computeOffsetIfSizeChanged(params: {\n handlerOffset: number\n prevSize: number\n size: number\n}) {\n \"worklet\";\n const { handlerOffset, prevSize, size } = params;\n\n return handlerOffset / prevSize * size;\n}\n\n"]}
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
import { computeOffsetIfSizeChanged } from "./compute-offset-if-size-changed";
|
|
2
|
+
describe("computeOffsetIfSizeChanged", () => {
|
|
3
|
+
it("[CASE 1] should return the correct values when size does not change", () => {
|
|
4
|
+
const prevIndex = 1;
|
|
5
|
+
const prevSize = 500;
|
|
6
|
+
const size = 500;
|
|
7
|
+
const handlerOffset = prevIndex * size;
|
|
8
|
+
const result = computeOffsetIfSizeChanged({
|
|
9
|
+
prevSize,
|
|
10
|
+
size,
|
|
11
|
+
handlerOffset
|
|
12
|
+
});
|
|
13
|
+
const finallyIndex = result / size;
|
|
14
|
+
expect(finallyIndex).toEqual(prevIndex);
|
|
15
|
+
});
|
|
16
|
+
it("[CASE 2] should return the correct values when size changes from 500 to 400", () => {
|
|
17
|
+
const prevIndex = 1;
|
|
18
|
+
const prevSize = 500;
|
|
19
|
+
const size = 400;
|
|
20
|
+
const handlerOffset = prevIndex * prevSize;
|
|
21
|
+
const result = computeOffsetIfSizeChanged({
|
|
22
|
+
prevSize,
|
|
23
|
+
size,
|
|
24
|
+
handlerOffset
|
|
25
|
+
});
|
|
26
|
+
const finallyIndex = result / size;
|
|
27
|
+
expect(finallyIndex).toEqual(prevIndex);
|
|
28
|
+
});
|
|
29
|
+
it("[CASE 3] should return the correct values when size changes from 500 to 499", () => {
|
|
30
|
+
const prevIndex = 1;
|
|
31
|
+
const prevSize = 500;
|
|
32
|
+
const size = 499;
|
|
33
|
+
const handlerOffset = prevIndex * prevSize;
|
|
34
|
+
const result = computeOffsetIfSizeChanged({
|
|
35
|
+
prevSize,
|
|
36
|
+
size,
|
|
37
|
+
handlerOffset
|
|
38
|
+
});
|
|
39
|
+
const finallyIndex = result / size;
|
|
40
|
+
expect(finallyIndex).toEqual(prevIndex);
|
|
41
|
+
});
|
|
42
|
+
it("[CASE 4] should return the correct values when size changes from 500 to 501", () => {
|
|
43
|
+
const prevIndex = 1;
|
|
44
|
+
const prevSize = 500;
|
|
45
|
+
const size = 501;
|
|
46
|
+
const handlerOffset = prevIndex * prevSize;
|
|
47
|
+
const result = computeOffsetIfSizeChanged({
|
|
48
|
+
prevSize,
|
|
49
|
+
size,
|
|
50
|
+
handlerOffset
|
|
51
|
+
});
|
|
52
|
+
const finallyIndex = result / size;
|
|
53
|
+
expect(finallyIndex).toEqual(prevIndex);
|
|
54
|
+
});
|
|
55
|
+
it("[CASE 5] should return the correct values when size changes from 224 to 524", () => {
|
|
56
|
+
const prevIndex = 1;
|
|
57
|
+
const prevSize = 224;
|
|
58
|
+
const size = 524;
|
|
59
|
+
const handlerOffset = prevIndex * prevSize;
|
|
60
|
+
const result = computeOffsetIfSizeChanged({
|
|
61
|
+
prevSize,
|
|
62
|
+
size,
|
|
63
|
+
handlerOffset
|
|
64
|
+
});
|
|
65
|
+
const finallyIndex = result / size;
|
|
66
|
+
expect(finallyIndex).toEqual(prevIndex);
|
|
67
|
+
});
|
|
68
|
+
});
|
|
69
|
+
//# sourceMappingURL=compute-offset-if-size-changed.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["compute-offset-if-size-changed.test.ts"],"names":["computeOffsetIfSizeChanged","describe","it","prevIndex","prevSize","size","handlerOffset","result","finallyIndex","expect","toEqual"],"mappings":"AAAA,SAASA,0BAAT,QAA2C,kCAA3C;AAEAC,QAAQ,CAAC,4BAAD,EAA+B,MAAM;AAC3CC,EAAAA,EAAE,CAAC,qEAAD,EAAwE,MAAM;AAC9E,UAAMC,SAAS,GAAG,CAAlB;AACA,UAAMC,QAAQ,GAAG,GAAjB;AACA,UAAMC,IAAI,GAAG,GAAb;AACA,UAAMC,aAAa,GAAGH,SAAS,GAAGE,IAAlC;AACA,UAAME,MAAM,GAAGP,0BAA0B,CAAC;AACxCI,MAAAA,QADwC;AAExCC,MAAAA,IAFwC;AAGxCC,MAAAA;AAHwC,KAAD,CAAzC;AAMA,UAAME,YAAY,GAAGD,MAAM,GAAGF,IAA9B;AACAI,IAAAA,MAAM,CAACD,YAAD,CAAN,CAAqBE,OAArB,CAA6BP,SAA7B;AACD,GAbC,CAAF;AAeAD,EAAAA,EAAE,CAAC,6EAAD,EAAgF,MAAM;AACtF,UAAMC,SAAS,GAAG,CAAlB;AACA,UAAMC,QAAQ,GAAG,GAAjB;AACA,UAAMC,IAAI,GAAG,GAAb;AACA,UAAMC,aAAa,GAAGH,SAAS,GAAGC,QAAlC;AACA,UAAMG,MAAM,GAAGP,0BAA0B,CAAC;AACxCI,MAAAA,QADwC;AAExCC,MAAAA,IAFwC;AAGxCC,MAAAA;AAHwC,KAAD,CAAzC;AAMA,UAAME,YAAY,GAAGD,MAAM,GAAGF,IAA9B;AACAI,IAAAA,MAAM,CAACD,YAAD,CAAN,CAAqBE,OAArB,CAA6BP,SAA7B;AACD,GAbC,CAAF;AAeAD,EAAAA,EAAE,CAAC,6EAAD,EAAgF,MAAM;AACtF,UAAMC,SAAS,GAAG,CAAlB;AACA,UAAMC,QAAQ,GAAG,GAAjB;AACA,UAAMC,IAAI,GAAG,GAAb;AACA,UAAMC,aAAa,GAAGH,SAAS,GAAGC,QAAlC;AACA,UAAMG,MAAM,GAAGP,0BAA0B,CAAC;AACxCI,MAAAA,QADwC;AAExCC,MAAAA,IAFwC;AAGxCC,MAAAA;AAHwC,KAAD,CAAzC;AAMA,UAAME,YAAY,GAAGD,MAAM,GAAGF,IAA9B;AACAI,IAAAA,MAAM,CAACD,YAAD,CAAN,CAAqBE,OAArB,CAA6BP,SAA7B;AACD,GAbC,CAAF;AAeAD,EAAAA,EAAE,CAAC,6EAAD,EAAgF,MAAM;AACtF,UAAMC,SAAS,GAAG,CAAlB;AACA,UAAMC,QAAQ,GAAG,GAAjB;AACA,UAAMC,IAAI,GAAG,GAAb;AACA,UAAMC,aAAa,GAAGH,SAAS,GAAGC,QAAlC;AACA,UAAMG,MAAM,GAAGP,0BAA0B,CAAC;AACxCI,MAAAA,QADwC;AAExCC,MAAAA,IAFwC;AAGxCC,MAAAA;AAHwC,KAAD,CAAzC;AAMA,UAAME,YAAY,GAAGD,MAAM,GAAGF,IAA9B;AACAI,IAAAA,MAAM,CAACD,YAAD,CAAN,CAAqBE,OAArB,CAA6BP,SAA7B;AACD,GAbC,CAAF;AAeAD,EAAAA,EAAE,CAAC,6EAAD,EAAgF,MAAM;AACtF,UAAMC,SAAS,GAAG,CAAlB;AACA,UAAMC,QAAQ,GAAG,GAAjB;AACA,UAAMC,IAAI,GAAG,GAAb;AACA,UAAMC,aAAa,GAAGH,SAAS,GAAGC,QAAlC;AACA,UAAMG,MAAM,GAAGP,0BAA0B,CAAC;AACxCI,MAAAA,QADwC;AAExCC,MAAAA,IAFwC;AAGxCC,MAAAA;AAHwC,KAAD,CAAzC;AAMA,UAAME,YAAY,GAAGD,MAAM,GAAGF,IAA9B;AACAI,IAAAA,MAAM,CAACD,YAAD,CAAN,CAAqBE,OAArB,CAA6BP,SAA7B;AACD,GAbC,CAAF;AAcD,CA3EO,CAAR","sourcesContent":["import { computeOffsetIfSizeChanged } from \"./compute-offset-if-size-changed\";\n\ndescribe(\"computeOffsetIfSizeChanged\", () => {\n it(\"[CASE 1] should return the correct values when size does not change\", () => {\n const prevIndex = 1;\n const prevSize = 500;\n const size = 500;\n const handlerOffset = prevIndex * size;\n const result = computeOffsetIfSizeChanged({\n prevSize,\n size,\n handlerOffset,\n });\n\n const finallyIndex = result / size;\n expect(finallyIndex).toEqual(prevIndex);\n });\n\n it(\"[CASE 2] should return the correct values when size changes from 500 to 400\", () => {\n const prevIndex = 1;\n const prevSize = 500;\n const size = 400;\n const handlerOffset = prevIndex * prevSize;\n const result = computeOffsetIfSizeChanged({\n prevSize,\n size,\n handlerOffset,\n });\n\n const finallyIndex = result / size;\n expect(finallyIndex).toEqual(prevIndex);\n });\n\n it(\"[CASE 3] should return the correct values when size changes from 500 to 499\", () => {\n const prevIndex = 1;\n const prevSize = 500;\n const size = 499;\n const handlerOffset = prevIndex * prevSize;\n const result = computeOffsetIfSizeChanged({\n prevSize,\n size,\n handlerOffset,\n });\n\n const finallyIndex = result / size;\n expect(finallyIndex).toEqual(prevIndex);\n });\n\n it(\"[CASE 4] should return the correct values when size changes from 500 to 501\", () => {\n const prevIndex = 1;\n const prevSize = 500;\n const size = 501;\n const handlerOffset = prevIndex * prevSize;\n const result = computeOffsetIfSizeChanged({\n prevSize,\n size,\n handlerOffset,\n });\n\n const finallyIndex = result / size;\n expect(finallyIndex).toEqual(prevIndex);\n });\n\n it(\"[CASE 5] should return the correct values when size changes from 224 to 524\", () => {\n const prevIndex = 1;\n const prevSize = 224;\n const size = 524;\n const handlerOffset = prevIndex * prevSize;\n const result = computeOffsetIfSizeChanged({\n prevSize,\n size,\n handlerOffset,\n });\n\n const finallyIndex = result / size;\n expect(finallyIndex).toEqual(prevIndex);\n });\n});\n"]}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
export function handlerOffsetDirection(handlerOffset) {
|
|
1
|
+
export function handlerOffsetDirection(handlerOffset, fixedDirection) {
|
|
2
2
|
"worklet";
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
return
|
|
4
|
+
if (fixedDirection === "negative") return -1;
|
|
5
|
+
if (fixedDirection === "positive") return 1;
|
|
6
|
+
if (handlerOffset.value === 0) return -1;
|
|
7
|
+
return Math.sign(handlerOffset.value);
|
|
8
8
|
}
|
|
9
9
|
//# sourceMappingURL=handleroffset-direction.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["handleroffset-direction.ts"],"names":["handlerOffsetDirection","handlerOffset","
|
|
1
|
+
{"version":3,"sources":["handleroffset-direction.ts"],"names":["handlerOffsetDirection","handlerOffset","fixedDirection","value","Math","sign"],"mappings":"AAIA,OAAO,SAASA,sBAAT,CAAgCC,aAAhC,EAAoEC,cAApE,EAA+H;AACpI;;AAEA,MAAIA,cAAc,KAAK,UAAvB,EACE,OAAO,CAAC,CAAR;AAEF,MAAIA,cAAc,KAAK,UAAvB,EACE,OAAO,CAAP;AAEF,MAAID,aAAa,CAACE,KAAd,KAAwB,CAA5B,EACE,OAAO,CAAC,CAAR;AAEF,SAAOC,IAAI,CAACC,IAAL,CAAUJ,aAAa,CAACE,KAAxB,CAAP;AACD","sourcesContent":["import type { SharedValue } from \"react-native-reanimated\";\n\nimport type { TCarouselProps } from \"../types\";\n\nexport function handlerOffsetDirection(handlerOffset: SharedValue<number>, fixedDirection?: TCarouselProps[\"fixedDirection\"]): -1 | 1 {\n \"worklet\";\n\n if (fixedDirection === \"negative\")\n return -1;\n\n if (fixedDirection === \"positive\")\n return 1;\n\n if (handlerOffset.value === 0)\n return -1;\n\n return Math.sign(handlerOffset.value) as -1 | 1;\n}\n"]}
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import { useSharedValue } from "react-native-reanimated";
|
|
2
|
+
import { renderHook } from "@testing-library/react-hooks";
|
|
3
|
+
import { handlerOffsetDirection } from "./handleroffset-direction";
|
|
4
|
+
describe("handlerOffsetDirection", () => {
|
|
5
|
+
it("should return -1 when default value equals to zero", () => {
|
|
6
|
+
const result = renderHook(() => {
|
|
7
|
+
const handlerOffsetAnimVal = useSharedValue(0);
|
|
8
|
+
return handlerOffsetDirection(handlerOffsetAnimVal);
|
|
9
|
+
});
|
|
10
|
+
expect(result.result.current).toBe(-1);
|
|
11
|
+
});
|
|
12
|
+
it("should return 1 when default value is greater than zero", () => {
|
|
13
|
+
const result = renderHook(() => {
|
|
14
|
+
const handlerOffsetAnimVal = useSharedValue(1);
|
|
15
|
+
return handlerOffsetDirection(handlerOffsetAnimVal);
|
|
16
|
+
});
|
|
17
|
+
expect(result.result.current).toBe(1);
|
|
18
|
+
});
|
|
19
|
+
it("should return -1 when default value is less than zero", () => {
|
|
20
|
+
const result = renderHook(() => {
|
|
21
|
+
const handlerOffsetAnimVal = useSharedValue(-1);
|
|
22
|
+
return handlerOffsetDirection(handlerOffsetAnimVal);
|
|
23
|
+
});
|
|
24
|
+
expect(result.result.current).toBe(-1);
|
|
25
|
+
});
|
|
26
|
+
it("should return 1 when default value equals to zero and fixedDirection is negative", () => {
|
|
27
|
+
const result = renderHook(() => {
|
|
28
|
+
const handlerOffsetAnimVal = useSharedValue(-1);
|
|
29
|
+
return handlerOffsetDirection(handlerOffsetAnimVal, "positive");
|
|
30
|
+
});
|
|
31
|
+
expect(result.result.current).toBe(1);
|
|
32
|
+
});
|
|
33
|
+
it("should return -1 when default value is greater than zero and fixedDirection is negative", () => {
|
|
34
|
+
const result = renderHook(() => {
|
|
35
|
+
const handlerOffsetAnimVal = useSharedValue(1);
|
|
36
|
+
return handlerOffsetDirection(handlerOffsetAnimVal, "negative");
|
|
37
|
+
});
|
|
38
|
+
expect(result.result.current).toBe(-1);
|
|
39
|
+
});
|
|
40
|
+
});
|
|
41
|
+
//# sourceMappingURL=handleroffset-direction.test.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["handleroffset-direction.test.ts"],"names":["useSharedValue","renderHook","handlerOffsetDirection","describe","it","result","handlerOffsetAnimVal","expect","current","toBe"],"mappings":"AAAA,SAASA,cAAT,QAA+B,yBAA/B;AAEA,SAASC,UAAT,QAA2B,8BAA3B;AAEA,SAASC,sBAAT,QAAuC,2BAAvC;AAEAC,QAAQ,CAAC,wBAAD,EAA2B,MAAM;AACvCC,EAAAA,EAAE,CAAC,oDAAD,EAAuD,MAAM;AAC7D,UAAMC,MAAM,GAAGJ,UAAU,CAAC,MAAM;AAC9B,YAAMK,oBAAoB,GAAGN,cAAc,CAAC,CAAD,CAA3C;AACA,aAAOE,sBAAsB,CAACI,oBAAD,CAA7B;AACD,KAHwB,CAAzB;AAKAC,IAAAA,MAAM,CAACF,MAAM,CAACA,MAAP,CAAcG,OAAf,CAAN,CAA8BC,IAA9B,CAAmC,CAAC,CAApC;AACD,GAPC,CAAF;AASAL,EAAAA,EAAE,CAAC,yDAAD,EAA4D,MAAM;AAClE,UAAMC,MAAM,GAAGJ,UAAU,CAAC,MAAM;AAC9B,YAAMK,oBAAoB,GAAGN,cAAc,CAAC,CAAD,CAA3C;AACA,aAAOE,sBAAsB,CAACI,oBAAD,CAA7B;AACD,KAHwB,CAAzB;AAKAC,IAAAA,MAAM,CAACF,MAAM,CAACA,MAAP,CAAcG,OAAf,CAAN,CAA8BC,IAA9B,CAAmC,CAAnC;AACD,GAPC,CAAF;AASAL,EAAAA,EAAE,CAAC,uDAAD,EAA0D,MAAM;AAChE,UAAMC,MAAM,GAAGJ,UAAU,CAAC,MAAM;AAC9B,YAAMK,oBAAoB,GAAGN,cAAc,CAAC,CAAC,CAAF,CAA3C;AACA,aAAOE,sBAAsB,CAACI,oBAAD,CAA7B;AACD,KAHwB,CAAzB;AAKAC,IAAAA,MAAM,CAACF,MAAM,CAACA,MAAP,CAAcG,OAAf,CAAN,CAA8BC,IAA9B,CAAmC,CAAC,CAApC;AACD,GAPC,CAAF;AASAL,EAAAA,EAAE,CAAC,kFAAD,EAAqF,MAAM;AAC3F,UAAMC,MAAM,GAAGJ,UAAU,CAAC,MAAM;AAC9B,YAAMK,oBAAoB,GAAGN,cAAc,CAAC,CAAC,CAAF,CAA3C;AACA,aAAOE,sBAAsB,CAACI,oBAAD,EAAuB,UAAvB,CAA7B;AACD,KAHwB,CAAzB;AAKAC,IAAAA,MAAM,CAACF,MAAM,CAACA,MAAP,CAAcG,OAAf,CAAN,CAA8BC,IAA9B,CAAmC,CAAnC;AACD,GAPC,CAAF;AASAL,EAAAA,EAAE,CAAC,yFAAD,EAA4F,MAAM;AAClG,UAAMC,MAAM,GAAGJ,UAAU,CAAC,MAAM;AAC9B,YAAMK,oBAAoB,GAAGN,cAAc,CAAC,CAAD,CAA3C;AACA,aAAOE,sBAAsB,CAACI,oBAAD,EAAuB,UAAvB,CAA7B;AACD,KAHwB,CAAzB;AAKAC,IAAAA,MAAM,CAACF,MAAM,CAACA,MAAP,CAAcG,OAAf,CAAN,CAA8BC,IAA9B,CAAmC,CAAC,CAApC;AACD,GAPC,CAAF;AAQD,CA7CO,CAAR","sourcesContent":["import { useSharedValue } from \"react-native-reanimated\";\n\nimport { renderHook } from \"@testing-library/react-hooks\";\n\nimport { handlerOffsetDirection } from \"./handleroffset-direction\";\n\ndescribe(\"handlerOffsetDirection\", () => {\n it(\"should return -1 when default value equals to zero\", () => {\n const result = renderHook(() => {\n const handlerOffsetAnimVal = useSharedValue(0);\n return handlerOffsetDirection(handlerOffsetAnimVal);\n });\n\n expect(result.result.current).toBe(-1);\n });\n\n it(\"should return 1 when default value is greater than zero\", () => {\n const result = renderHook(() => {\n const handlerOffsetAnimVal = useSharedValue(1);\n return handlerOffsetDirection(handlerOffsetAnimVal);\n });\n\n expect(result.result.current).toBe(1);\n });\n\n it(\"should return -1 when default value is less than zero\", () => {\n const result = renderHook(() => {\n const handlerOffsetAnimVal = useSharedValue(-1);\n return handlerOffsetDirection(handlerOffsetAnimVal);\n });\n\n expect(result.result.current).toBe(-1);\n });\n\n it(\"should return 1 when default value equals to zero and fixedDirection is negative\", () => {\n const result = renderHook(() => {\n const handlerOffsetAnimVal = useSharedValue(-1);\n return handlerOffsetDirection(handlerOffsetAnimVal, \"positive\");\n });\n\n expect(result.result.current).toBe(1);\n });\n\n it(\"should return -1 when default value is greater than zero and fixedDirection is negative\", () => {\n const result = renderHook(() => {\n const handlerOffsetAnimVal = useSharedValue(1);\n return handlerOffsetDirection(handlerOffsetAnimVal, \"negative\");\n });\n\n expect(result.result.current).toBe(-1);\n });\n});\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { computeOffsetIfDataChanged } from "./compute-offset-if-data-changed";
|
|
2
2
|
describe("should work as expected", () => {
|
|
3
3
|
const size = 375;
|
|
4
4
|
const positive = -1;
|
|
@@ -23,7 +23,7 @@ describe("should work as expected", () => {
|
|
|
23
23
|
|
|
24
24
|
it("The direction is negative, And changing length of data set from 4 to 3, the new index will to be 2.", async () => {
|
|
25
25
|
const currentIndex = 1;
|
|
26
|
-
const handlerOffset =
|
|
26
|
+
const handlerOffset = computeOffsetIfDataChanged(params({
|
|
27
27
|
currentIndex,
|
|
28
28
|
direction: "negative",
|
|
29
29
|
previousLength: 4,
|
|
@@ -32,7 +32,7 @@ describe("should work as expected", () => {
|
|
|
32
32
|
expect(handlerOffset / size).toBe(2 * positive);
|
|
33
33
|
});
|
|
34
34
|
it("The direction is negative, Changing length of data set from 4 to 3, the index remains original.", async () => {
|
|
35
|
-
const handlerOffset =
|
|
35
|
+
const handlerOffset = computeOffsetIfDataChanged(params({
|
|
36
36
|
currentIndex: 2,
|
|
37
37
|
direction: "negative",
|
|
38
38
|
previousLength: 4,
|
|
@@ -41,7 +41,7 @@ describe("should work as expected", () => {
|
|
|
41
41
|
expect(handlerOffset / size).toBe(1 * negative);
|
|
42
42
|
});
|
|
43
43
|
it("The direction is positive, Changing length of data set from 4 to 5, the index remains original.", async () => {
|
|
44
|
-
const handlerOffset =
|
|
44
|
+
const handlerOffset = computeOffsetIfDataChanged(params({
|
|
45
45
|
currentIndex: 3,
|
|
46
46
|
direction: "positive",
|
|
47
47
|
previousLength: 4,
|
|
@@ -50,7 +50,7 @@ describe("should work as expected", () => {
|
|
|
50
50
|
expect(handlerOffset / size).toBe(3 * positive);
|
|
51
51
|
});
|
|
52
52
|
it("The direction is negative, Changing length of data set from 4 to 5, the index remains original.", async () => {
|
|
53
|
-
const handlerOffset =
|
|
53
|
+
const handlerOffset = computeOffsetIfDataChanged(params({
|
|
54
54
|
currentIndex: 3,
|
|
55
55
|
direction: "negative",
|
|
56
56
|
previousLength: 4,
|
|
@@ -59,7 +59,7 @@ describe("should work as expected", () => {
|
|
|
59
59
|
expect(handlerOffset / size).toBe(4 * negative);
|
|
60
60
|
});
|
|
61
61
|
it("Changing length of data set from 0 to 3, the index remains original.", async () => {
|
|
62
|
-
const handlerOffset =
|
|
62
|
+
const handlerOffset = computeOffsetIfDataChanged(params({
|
|
63
63
|
currentIndex: 0,
|
|
64
64
|
direction: "positive",
|
|
65
65
|
previousLength: 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.test.ts"],"names":["
|
|
1
|
+
{"version":3,"sources":["index.test.ts"],"names":["computeOffsetIfDataChanged","describe","size","positive","negative","params","currentIndex","direction","_direction","previousLength","currentLength","handlerOffset","it","expect","toBe"],"mappings":"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","sourcesContent":["import { computeOffsetIfDataChanged } from \"./compute-offset-if-data-changed\";\n\ndescribe(\"should work as expected\", () => {\n const size = 375;\n const positive = -1;\n const negative = 1;\n\n const params = (params: {\n direction: \"positive\" | \"negative\"\n currentIndex: number\n previousLength: number\n currentLength: number\n }) => {\n const { currentIndex, direction: _direction, previousLength, currentLength } = params;\n const direction = _direction === \"negative\" ? negative : positive;\n return {\n direction,\n handlerOffset: size * currentIndex * direction,\n size,\n previousLength,\n currentLength,\n };\n };\n\n it(\"The direction is negative, And changing length of data set from 4 to 3, the new index will to be 2.\", async () => {\n const currentIndex = 1;\n const handlerOffset = computeOffsetIfDataChanged(params({\n currentIndex,\n direction: \"negative\",\n previousLength: 4,\n currentLength: 3,\n }));\n\n expect(handlerOffset / size).toBe(2 * positive);\n });\n\n it(\"The direction is negative, Changing length of data set from 4 to 3, the index remains original.\", async () => {\n const handlerOffset = computeOffsetIfDataChanged(params({\n currentIndex: 2,\n direction: \"negative\",\n previousLength: 4,\n currentLength: 3,\n }));\n\n expect(handlerOffset / size).toBe(1 * negative);\n });\n\n it(\"The direction is positive, Changing length of data set from 4 to 5, the index remains original.\", async () => {\n const handlerOffset = computeOffsetIfDataChanged(params({\n currentIndex: 3,\n direction: \"positive\",\n previousLength: 4,\n currentLength: 5,\n }));\n\n expect(handlerOffset / size).toBe(3 * positive);\n });\n\n it(\"The direction is negative, Changing length of data set from 4 to 5, the index remains original.\", async () => {\n const handlerOffset = computeOffsetIfDataChanged(params({\n currentIndex: 3,\n direction: \"negative\",\n previousLength: 4,\n currentLength: 5,\n }));\n\n expect(handlerOffset / size).toBe(4 * negative);\n });\n\n it(\"Changing length of data set from 0 to 3, the index remains original.\", async () => {\n const handlerOffset = computeOffsetIfDataChanged(params({\n currentIndex: 0,\n direction: \"positive\",\n previousLength: 0,\n currentLength: 3,\n }));\n\n expect(handlerOffset / size).toBe(0 * positive);\n });\n});\n"]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import type { FC } from "react";
|
|
2
|
+
import type { ViewStyle } from "react-native";
|
|
3
|
+
import type Animated from "react-native-reanimated";
|
|
4
|
+
import { type AnimatedStyleProp } from "react-native-reanimated";
|
|
5
|
+
import type { TAnimationStyle } from "./BaseLayout";
|
|
6
|
+
import type { CarouselRenderItem } from "../types";
|
|
7
|
+
interface Props {
|
|
8
|
+
data: any[];
|
|
9
|
+
dataLength: number;
|
|
10
|
+
rawDataLength: number;
|
|
11
|
+
loop: boolean;
|
|
12
|
+
size: number;
|
|
13
|
+
windowSize?: number;
|
|
14
|
+
autoFillData: boolean;
|
|
15
|
+
offsetX: Animated.SharedValue<number>;
|
|
16
|
+
handlerOffset: Animated.SharedValue<number>;
|
|
17
|
+
layoutConfig: TAnimationStyle;
|
|
18
|
+
renderItem: CarouselRenderItem<any>;
|
|
19
|
+
customAnimation?: ((value: number) => AnimatedStyleProp<ViewStyle>);
|
|
20
|
+
}
|
|
21
|
+
export declare const ItemRenderer: FC<Props>;
|
|
22
|
+
export {};
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import type { PropsWithChildren } from "react";
|
|
2
|
+
import React from "react";
|
|
3
|
+
import type { ViewStyle } from "react-native";
|
|
4
|
+
import Animated from "react-native-reanimated";
|
|
5
|
+
export declare type DotStyle = Omit<ViewStyle, "width" | "height"> & {
|
|
6
|
+
width?: number;
|
|
7
|
+
height?: number;
|
|
8
|
+
};
|
|
9
|
+
export declare const PaginationItem: React.FC<PropsWithChildren<{
|
|
10
|
+
index: number;
|
|
11
|
+
count: number;
|
|
12
|
+
size?: number;
|
|
13
|
+
animValue: Animated.SharedValue<number>;
|
|
14
|
+
horizontal?: boolean;
|
|
15
|
+
dotStyle?: DotStyle;
|
|
16
|
+
activeDotStyle?: DotStyle;
|
|
17
|
+
}>>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
import type { StyleProp, ViewStyle } from "react-native";
|
|
3
|
+
import type { SharedValue } from "react-native-reanimated";
|
|
4
|
+
import type { DotStyle } from "./PaginationItem";
|
|
5
|
+
export interface BasicProps<T extends {} = {}> {
|
|
6
|
+
progress: SharedValue<number>;
|
|
7
|
+
horizontal?: boolean;
|
|
8
|
+
data: Array<T>;
|
|
9
|
+
renderItem?: (item: T, index: number) => React.ReactNode;
|
|
10
|
+
containerStyle?: StyleProp<ViewStyle>;
|
|
11
|
+
dotStyle?: DotStyle;
|
|
12
|
+
activeDotStyle?: DotStyle;
|
|
13
|
+
size?: number;
|
|
14
|
+
onPress?: (index: number) => void;
|
|
15
|
+
}
|
|
16
|
+
export declare const Basic: <T extends {}>(props: BasicProps<T>) => React.JSX.Element;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -4,12 +4,13 @@ interface IOpts {
|
|
|
4
4
|
loop: boolean;
|
|
5
5
|
size: number;
|
|
6
6
|
dataLength: number;
|
|
7
|
-
autoFillData: TCarouselProps["autoFillData"];
|
|
8
7
|
handlerOffset: Animated.SharedValue<number>;
|
|
8
|
+
autoFillData: TCarouselProps["autoFillData"];
|
|
9
9
|
withAnimation?: TCarouselProps["withAnimation"];
|
|
10
|
+
fixedDirection?: TCarouselProps["fixedDirection"];
|
|
10
11
|
duration?: number;
|
|
11
12
|
defaultIndex?: number;
|
|
12
|
-
|
|
13
|
+
onScrollStart?: () => void;
|
|
13
14
|
onScrollEnd?: () => void;
|
|
14
15
|
}
|
|
15
16
|
export interface ICarouselController {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|