react-native-gesture-image-viewer 2.3.2 → 2.4.0
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 +1 -1
- package/lib/module/GestureViewer.js +11 -5
- package/lib/module/GestureViewer.js.map +1 -1
- package/lib/module/index.js.map +1 -1
- package/lib/module/scheduleInitialScroll.js +21 -0
- package/lib/module/scheduleInitialScroll.js.map +1 -0
- package/lib/module/useGestureViewer.js +11 -7
- package/lib/module/useGestureViewer.js.map +1 -1
- package/lib/module/useGestureViewerPaging.js +19 -5
- package/lib/module/useGestureViewerPaging.js.map +1 -1
- package/lib/module/useGestureViewerPaging.web.js +19 -3
- package/lib/module/useGestureViewerPaging.web.js.map +1 -1
- package/lib/typescript/src/GestureViewer.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +1 -1
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/scheduleInitialScroll.d.ts +3 -0
- package/lib/typescript/src/scheduleInitialScroll.d.ts.map +1 -0
- package/lib/typescript/src/types.d.ts +11 -1
- package/lib/typescript/src/types.d.ts.map +1 -1
- package/lib/typescript/src/useGestureViewer.d.ts +5 -4
- package/lib/typescript/src/useGestureViewer.d.ts.map +1 -1
- package/lib/typescript/src/useGestureViewerPaging.d.ts +1 -1
- package/lib/typescript/src/useGestureViewerPaging.d.ts.map +1 -1
- package/lib/typescript/src/useGestureViewerPaging.types.d.ts +1 -0
- package/lib/typescript/src/useGestureViewerPaging.types.d.ts.map +1 -1
- package/lib/typescript/src/useGestureViewerPaging.web.d.ts.map +1 -1
- package/package.json +42 -48
- package/src/GestureViewer.tsx +20 -5
- package/src/index.tsx +1 -0
- package/src/scheduleInitialScroll.ts +36 -0
- package/src/types.ts +12 -1
- package/src/useGestureViewer.ts +41 -31
- package/src/useGestureViewerPaging.ts +23 -7
- package/src/useGestureViewerPaging.types.ts +1 -0
- package/src/useGestureViewerPaging.web.ts +23 -4
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import type { GestureViewerProps } from './types';
|
|
2
2
|
type UseGestureViewerProps<ItemT, LC> = Omit<GestureViewerProps<ItemT, LC>, 'renderItem' | 'renderContainer' | 'ListComponent' | 'listProps' | 'containerStyle' | 'backdropStyle' | 'enableSnapMode'>;
|
|
3
3
|
export declare const useGestureViewer: <ItemT, LC>({ data, initialIndex, onDismiss, onSingleTap, width: customWidth, dismiss, enableDoubleTapZoom, enablePinchZoom, enableHorizontalSwipe, enablePanWhenZoomed, enableLoop, maxZoomScale, itemSpacing, height: customHeight, id, onDismissStart, triggerAnimation, autoPlay, autoPlayInterval, }: UseGestureViewerProps<ItemT, LC>) => {
|
|
4
|
-
|
|
4
|
+
activeListIndex: number;
|
|
5
|
+
animatedStyle: import("react-native-reanimated/lib/typescript/hook/commonTypes").AnimatedStyleHandle<{
|
|
5
6
|
opacity: number;
|
|
6
7
|
transform: ({
|
|
7
8
|
translateX: number;
|
|
@@ -24,10 +25,10 @@ export declare const useGestureViewer: <ItemT, LC>({ data, initialIndex, onDismi
|
|
|
24
25
|
translateY?: undefined;
|
|
25
26
|
scale?: undefined;
|
|
26
27
|
})[];
|
|
27
|
-
}
|
|
28
|
-
backdropStyle: {
|
|
28
|
+
}>;
|
|
29
|
+
backdropStyle: import("react-native-reanimated/lib/typescript/hook/commonTypes").AnimatedStyleHandle<{
|
|
29
30
|
opacity: number;
|
|
30
|
-
}
|
|
31
|
+
}>;
|
|
31
32
|
dataLength: number;
|
|
32
33
|
dismissGesture: import("react-native-gesture-handler/lib/typescript/handlers/gestures/panGesture").PanGesture;
|
|
33
34
|
handleDismiss: () => void;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGestureViewer.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewer.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"useGestureViewer.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewer.ts"],"names":[],"mappings":"AAiBA,OAAO,KAAK,EAAE,kBAAkB,EAAe,MAAM,SAAS,CAAC;AAO/D,KAAK,qBAAqB,CAAC,KAAK,EAAE,EAAE,IAAI,IAAI,CAC1C,kBAAkB,CAAC,KAAK,EAAE,EAAE,CAAC,EAC3B,YAAY,GACZ,iBAAiB,GACjB,eAAe,GACf,WAAW,GACX,gBAAgB,GAChB,eAAe,GACf,gBAAgB,CACnB,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,KAAK,EAAE,EAAE,EAAE,+RAoBzC,qBAAqB,CAAC,KAAK,EAAE,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+yBlC,CAAC"}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import type { UseGestureViewerPagingArgs, UseGestureViewerPagingResult } from './useGestureViewerPaging.types';
|
|
2
|
-
export declare function useGestureViewerPaging({ autoPlay, autoPlayInterval, currentIndex, dataLength, enableHorizontalSwipe, enableLoop, isRotated, isZoomed, itemSpacing, manager, scrollTo, syncCurrentIndex, syncPendingIndex, width, }: UseGestureViewerPagingArgs): UseGestureViewerPagingResult;
|
|
2
|
+
export declare function useGestureViewerPaging({ adjustedInitialIndex, autoPlay, autoPlayInterval, currentIndex, dataLength, enableHorizontalSwipe, enableLoop, isRotated, isZoomed, itemSpacing, manager, scrollTo, syncCurrentIndex, syncPendingIndex, width, }: UseGestureViewerPagingArgs): UseGestureViewerPagingResult;
|
|
3
3
|
//# sourceMappingURL=useGestureViewerPaging.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGestureViewerPaging.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerPaging.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,0BAA0B,EAC1B,4BAA4B,EAC7B,MAAM,gCAAgC,CAAC;AAGxC,wBAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,qBAAqB,EACrB,UAAU,EACV,SAAS,EACT,QAAQ,EACR,WAAW,EACX,OAAO,EACP,QAAQ,EACR,gBAAgB,EAChB,gBAAgB,EAChB,KAAK,GACN,EAAE,0BAA0B,GAAG,4BAA4B,
|
|
1
|
+
{"version":3,"file":"useGestureViewerPaging.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerPaging.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,0BAA0B,EAC1B,4BAA4B,EAC7B,MAAM,gCAAgC,CAAC;AAGxC,wBAAgB,sBAAsB,CAAC,EACrC,oBAAoB,EACpB,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,qBAAqB,EACrB,UAAU,EACV,SAAS,EACT,QAAQ,EACR,WAAW,EACX,OAAO,EACP,QAAQ,EACR,gBAAgB,EAChB,gBAAgB,EAChB,KAAK,GACN,EAAE,0BAA0B,GAAG,4BAA4B,CAsH3D"}
|
|
@@ -33,6 +33,7 @@ export type WebClickTarget = {
|
|
|
33
33
|
};
|
|
34
34
|
};
|
|
35
35
|
export type UseGestureViewerPagingResult = {
|
|
36
|
+
activeListIndex: number;
|
|
36
37
|
onMomentumScrollEnd?: ScrollViewProps['onMomentumScrollEnd'];
|
|
37
38
|
onScroll?: ScrollViewProps['onScroll'];
|
|
38
39
|
onScrollBeginDrag?: ScrollViewProps['onScrollBeginDrag'];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGestureViewerPaging.types.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerPaging.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAO,KAAK,oBAAoB,MAAM,wBAAwB,CAAC;AAE/D,MAAM,MAAM,0BAA0B,GAAG;IACvC,oBAAoB,EAAE,MAAM,CAAC;IAC7B,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,qBAAqB,EAAE,OAAO,CAAC;IAC/B,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACrC,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACrD,gBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,gBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAChC,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,qBAAqB,EAAE,MAAM;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5D,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG;IACzC,mBAAmB,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC,CAAC;IAC7D,QAAQ,CAAC,EAAE,eAAe,CAAC,UAAU,CAAC,CAAC;IACvC,iBAAiB,CAAC,EAAE,eAAe,CAAC,mBAAmB,CAAC,CAAC;IACzD,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC1D,CAAC"}
|
|
1
|
+
{"version":3,"file":"useGestureViewerPaging.types.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerPaging.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AACpD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D,OAAO,KAAK,oBAAoB,MAAM,wBAAwB,CAAC;AAE/D,MAAM,MAAM,0BAA0B,GAAG;IACvC,oBAAoB,EAAE,MAAM,CAAC;IAC7B,QAAQ,EAAE,OAAO,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,qBAAqB,EAAE,OAAO,CAAC;IAC/B,UAAU,EAAE,OAAO,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACrC,YAAY,EAAE,MAAM,CAAC;IACrB,WAAW,CAAC,EAAE,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAC7C,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3B,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACrD,gBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,gBAAgB,EAAE,CAAC,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAChC,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAChC,KAAK,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,qBAAqB,EAAE,MAAM;QAAE,IAAI,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5D,CAAC;AAEF,MAAM,MAAM,4BAA4B,GAAG;IACzC,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC,CAAC;IAC7D,QAAQ,CAAC,EAAE,eAAe,CAAC,UAAU,CAAC,CAAC;IACvC,iBAAiB,CAAC,EAAE,eAAe,CAAC,mBAAmB,CAAC,CAAC;IACzD,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,UAAU,CAAC,cAAc,CAAC,KAAK,IAAI,CAAC;CAC1D,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useGestureViewerPaging.web.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerPaging.web.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,0BAA0B,EAC1B,4BAA4B,EAE7B,MAAM,gCAAgC,CAAC;AAqBxC,wBAAgB,sBAAsB,CAAC,EACrC,oBAAoB,EACpB,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,mBAAmB,EACnB,qBAAqB,EACrB,UAAU,EACV,MAAM,EACN,WAAW,EACX,SAAS,EACT,QAAQ,EACR,WAAW,EACX,OAAO,EACP,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,KAAK,GACN,EAAE,0BAA0B,GAAG,4BAA4B,
|
|
1
|
+
{"version":3,"file":"useGestureViewerPaging.web.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerPaging.web.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EACV,0BAA0B,EAC1B,4BAA4B,EAE7B,MAAM,gCAAgC,CAAC;AAqBxC,wBAAgB,sBAAsB,CAAC,EACrC,oBAAoB,EACpB,QAAQ,EACR,gBAAgB,EAChB,YAAY,EACZ,UAAU,EACV,mBAAmB,EACnB,qBAAqB,EACrB,UAAU,EACV,MAAM,EACN,WAAW,EACX,SAAS,EACT,QAAQ,EACR,WAAW,EACX,OAAO,EACP,YAAY,EACZ,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,KAAK,GACN,EAAE,0BAA0B,GAAG,4BAA4B,CAiZ3D"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-gesture-image-viewer",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.4.0",
|
|
4
4
|
"description": "🖼️ React Native Image Viewer - Reanimated-powered image gestures with full control",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"android",
|
|
@@ -46,11 +46,6 @@
|
|
|
46
46
|
"type": "git",
|
|
47
47
|
"url": "git+https://github.com/saseungmin/react-native-gesture-image-viewer.git"
|
|
48
48
|
},
|
|
49
|
-
"workspaces": [
|
|
50
|
-
".",
|
|
51
|
-
"example",
|
|
52
|
-
"docs"
|
|
53
|
-
],
|
|
54
49
|
"files": [
|
|
55
50
|
"lib",
|
|
56
51
|
"src",
|
|
@@ -83,41 +78,32 @@
|
|
|
83
78
|
"publishConfig": {
|
|
84
79
|
"registry": "https://registry.npmjs.org/"
|
|
85
80
|
},
|
|
86
|
-
"scripts": {
|
|
87
|
-
"build": "bob build",
|
|
88
|
-
"changeset": "changeset",
|
|
89
|
-
"clean": "del-cli lib",
|
|
90
|
-
"example": "yarn workspace react-native-gesture-image-viewer-example run",
|
|
91
|
-
"format": "oxfmt",
|
|
92
|
-
"format:check": "oxfmt --check",
|
|
93
|
-
"lint": "oxlint",
|
|
94
|
-
"lint:ci": "oxlint --format=github",
|
|
95
|
-
"lint:fix": "oxlint --fix",
|
|
96
|
-
"test": "jest",
|
|
97
|
-
"typecheck": "tsc"
|
|
98
|
-
},
|
|
99
81
|
"devDependencies": {
|
|
100
|
-
"@babel/core": "^7.
|
|
101
|
-
"@changesets/changelog-github": "^0.
|
|
102
|
-
"@changesets/cli": "^2.
|
|
103
|
-
"@commitlint/config-conventional": "^
|
|
104
|
-
"@evilmartians/lefthook": "^1.
|
|
105
|
-
"@react-native/babel-preset": "0.
|
|
106
|
-
"@
|
|
107
|
-
"@
|
|
108
|
-
"@
|
|
109
|
-
"
|
|
110
|
-
"
|
|
82
|
+
"@babel/core": "^7.29.7",
|
|
83
|
+
"@changesets/changelog-github": "^0.7.0",
|
|
84
|
+
"@changesets/cli": "^2.31.0",
|
|
85
|
+
"@commitlint/config-conventional": "^21.0.2",
|
|
86
|
+
"@evilmartians/lefthook": "^2.1.9",
|
|
87
|
+
"@react-native/babel-preset": "0.85.3",
|
|
88
|
+
"@react-native/jest-preset": "0.85.3",
|
|
89
|
+
"@react-native/metro-config": "0.85.3",
|
|
90
|
+
"@testing-library/react-native": "^14.0.1",
|
|
91
|
+
"@types/babel__core": "^7.20.5",
|
|
92
|
+
"@types/jest": "^29.5.14",
|
|
93
|
+
"@types/react": "^19.2.15",
|
|
94
|
+
"commitlint": "^21.0.2",
|
|
95
|
+
"del-cli": "^7.0.0",
|
|
111
96
|
"jest": "^29.7.0",
|
|
112
|
-
"oxfmt": "^0.
|
|
113
|
-
"oxlint": "^1.
|
|
114
|
-
"react": "19.
|
|
115
|
-
"react-native": "0.
|
|
116
|
-
"react-native-builder-bob": "^0.
|
|
117
|
-
"react-native-gesture-handler": "^2.
|
|
118
|
-
"react-native-reanimated": "
|
|
119
|
-
"react-native-worklets": "
|
|
120
|
-
"
|
|
97
|
+
"oxfmt": "^0.56.0",
|
|
98
|
+
"oxlint": "^1.71.0",
|
|
99
|
+
"react": "19.2.3",
|
|
100
|
+
"react-native": "0.85.3",
|
|
101
|
+
"react-native-builder-bob": "^0.41.0",
|
|
102
|
+
"react-native-gesture-handler": "^2.31.2",
|
|
103
|
+
"react-native-reanimated": "4.3.1",
|
|
104
|
+
"react-native-worklets": "0.8.3",
|
|
105
|
+
"test-renderer": "^1.2.0",
|
|
106
|
+
"typescript": "^5.9.3"
|
|
121
107
|
},
|
|
122
108
|
"peerDependencies": {
|
|
123
109
|
"react": ">=18.0.0",
|
|
@@ -131,14 +117,6 @@
|
|
|
131
117
|
"@commitlint/config-conventional"
|
|
132
118
|
]
|
|
133
119
|
},
|
|
134
|
-
"jest": {
|
|
135
|
-
"modulePathIgnorePatterns": [
|
|
136
|
-
"<rootDir>/example/node_modules",
|
|
137
|
-
"<rootDir>/lib/"
|
|
138
|
-
],
|
|
139
|
-
"preset": "react-native"
|
|
140
|
-
},
|
|
141
|
-
"packageManager": "yarn@4.12.0",
|
|
142
120
|
"create-react-native-library": {
|
|
143
121
|
"languages": "js",
|
|
144
122
|
"type": "library",
|
|
@@ -161,5 +139,21 @@
|
|
|
161
139
|
}
|
|
162
140
|
]
|
|
163
141
|
]
|
|
142
|
+
},
|
|
143
|
+
"scripts": {
|
|
144
|
+
"build": "bob build",
|
|
145
|
+
"changeset": "changeset",
|
|
146
|
+
"clean": "del-cli lib",
|
|
147
|
+
"docs:build": "pnpm -C docs build",
|
|
148
|
+
"docs:typecheck": "pnpm -C docs typecheck",
|
|
149
|
+
"example": "pnpm -C example run",
|
|
150
|
+
"example:build": "pnpm -C example build",
|
|
151
|
+
"format": "oxfmt",
|
|
152
|
+
"format:check": "oxfmt --check",
|
|
153
|
+
"lint": "oxlint",
|
|
154
|
+
"lint:ci": "oxlint --format=github",
|
|
155
|
+
"lint:fix": "oxlint --fix",
|
|
156
|
+
"test": "jest",
|
|
157
|
+
"typecheck": "tsc"
|
|
164
158
|
}
|
|
165
|
-
}
|
|
159
|
+
}
|
package/src/GestureViewer.tsx
CHANGED
|
@@ -50,8 +50,10 @@ export function GestureViewer<ItemT, LC>({
|
|
|
50
50
|
const loopData = useMemo(() => createLoopData(dataRef, enableLoop), [enableLoop]);
|
|
51
51
|
|
|
52
52
|
const isScrollView = isScrollViewLike(Component);
|
|
53
|
+
const isFlashList = isFlashListLike(Component);
|
|
53
54
|
|
|
54
55
|
const {
|
|
56
|
+
activeListIndex,
|
|
55
57
|
listRef,
|
|
56
58
|
isZoomed,
|
|
57
59
|
isRotated,
|
|
@@ -89,7 +91,9 @@ export function GestureViewer<ItemT, LC>({
|
|
|
89
91
|
);
|
|
90
92
|
|
|
91
93
|
const renderItem = useCallback(
|
|
92
|
-
({ item, index }: { item: ItemT; index: number }) => {
|
|
94
|
+
({ item, index, target }: { item: ItemT; index: number; target?: string }) => {
|
|
95
|
+
const isFlashListCell = !isFlashList || target === undefined || target === 'Cell';
|
|
96
|
+
|
|
93
97
|
return (
|
|
94
98
|
<View
|
|
95
99
|
key={isScrollView ? keyExtractor(item, index) : undefined}
|
|
@@ -102,11 +106,22 @@ export function GestureViewer<ItemT, LC>({
|
|
|
102
106
|
styles.item,
|
|
103
107
|
]}
|
|
104
108
|
>
|
|
105
|
-
{renderItemProp(item, index
|
|
109
|
+
{renderItemProp(item, index, {
|
|
110
|
+
isActive: index === activeListIndex && isFlashListCell,
|
|
111
|
+
})}
|
|
106
112
|
</View>
|
|
107
113
|
);
|
|
108
114
|
},
|
|
109
|
-
[
|
|
115
|
+
[
|
|
116
|
+
activeListIndex,
|
|
117
|
+
width,
|
|
118
|
+
itemSpacing,
|
|
119
|
+
renderItemProp,
|
|
120
|
+
keyExtractor,
|
|
121
|
+
isScrollView,
|
|
122
|
+
isFlashList,
|
|
123
|
+
height,
|
|
124
|
+
],
|
|
110
125
|
);
|
|
111
126
|
|
|
112
127
|
const getItemLayout = useCallback(
|
|
@@ -195,7 +210,7 @@ export function GestureViewer<ItemT, LC>({
|
|
|
195
210
|
onClick: onWebClick,
|
|
196
211
|
})}
|
|
197
212
|
{...(Platform.OS === 'web' &&
|
|
198
|
-
|
|
213
|
+
isFlashList && { dataSet: { 'flash-list-paging-enabled-fix': true } })}
|
|
199
214
|
>
|
|
200
215
|
{isScrollView
|
|
201
216
|
? maybeWrapWithNativeScrollGesture(
|
|
@@ -214,7 +229,7 @@ export function GestureViewer<ItemT, LC>({
|
|
|
214
229
|
enableLoop && data.length > 1 ? initialIndex + 1 : initialIndex
|
|
215
230
|
}
|
|
216
231
|
keyExtractor={keyExtractor}
|
|
217
|
-
{...(
|
|
232
|
+
{...(isFlashList
|
|
218
233
|
? // NOTE - Deprecated estimatedItemSize for FlashList V2 (https://shopify.github.io/flash-list/docs/v2-changes#deprecated)
|
|
219
234
|
{ estimatedItemSize: width + itemSpacing }
|
|
220
235
|
: { windowSize: 3, maxToRenderPerBatch: 3, getItemLayout })}
|
package/src/index.tsx
CHANGED
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
export const INITIAL_SCROLL_IDLE_TIMEOUT_MS = 100;
|
|
2
|
+
|
|
3
|
+
type IdleCallbackOptions = {
|
|
4
|
+
timeout?: number;
|
|
5
|
+
};
|
|
6
|
+
|
|
7
|
+
type IdleSchedulerGlobal = typeof globalThis & {
|
|
8
|
+
requestIdleCallback?: (
|
|
9
|
+
this: IdleSchedulerGlobal,
|
|
10
|
+
callback: () => void,
|
|
11
|
+
options?: IdleCallbackOptions,
|
|
12
|
+
) => number;
|
|
13
|
+
cancelIdleCallback?: (this: IdleSchedulerGlobal, handle: number) => void;
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
export const scheduleInitialScroll = (callback: () => void): (() => void) => {
|
|
17
|
+
const idleGlobal = globalThis as IdleSchedulerGlobal;
|
|
18
|
+
const requestIdleCallback = idleGlobal.requestIdleCallback?.bind(idleGlobal);
|
|
19
|
+
const cancelIdleCallback = idleGlobal.cancelIdleCallback?.bind(idleGlobal);
|
|
20
|
+
|
|
21
|
+
if (requestIdleCallback && cancelIdleCallback) {
|
|
22
|
+
const idleCallbackId = requestIdleCallback(callback, {
|
|
23
|
+
timeout: INITIAL_SCROLL_IDLE_TIMEOUT_MS,
|
|
24
|
+
});
|
|
25
|
+
|
|
26
|
+
return () => {
|
|
27
|
+
cancelIdleCallback(idleCallbackId);
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
const timeoutId = setTimeout(callback, 0);
|
|
32
|
+
|
|
33
|
+
return () => {
|
|
34
|
+
clearTimeout(timeoutId);
|
|
35
|
+
};
|
|
36
|
+
};
|
package/src/types.ts
CHANGED
|
@@ -82,6 +82,14 @@ export type GestureViewerSingleTapEvent<ItemT> = {
|
|
|
82
82
|
item: ItemT;
|
|
83
83
|
};
|
|
84
84
|
|
|
85
|
+
export type GestureViewerRenderItemInfo = {
|
|
86
|
+
/**
|
|
87
|
+
* Whether the rendered item is currently active.
|
|
88
|
+
* @remarks The current item remains active during a page transition. When the transition finishes on another item, that item becomes active.
|
|
89
|
+
*/
|
|
90
|
+
readonly isActive: boolean;
|
|
91
|
+
};
|
|
92
|
+
|
|
85
93
|
export type GestureViewerDismissDirection = 'down' | 'up' | 'both';
|
|
86
94
|
|
|
87
95
|
export interface TriggerAnimationConfig extends WithTimingConfig {
|
|
@@ -128,8 +136,11 @@ export interface GestureViewerProps<ItemT, LC> {
|
|
|
128
136
|
onDismissStart?: () => void;
|
|
129
137
|
/**
|
|
130
138
|
* A callback function that is called to render the item.
|
|
139
|
+
* @param item - The item to render.
|
|
140
|
+
* @param index - The list index of the rendered item.
|
|
141
|
+
* @param info - Render state for this list cell.
|
|
131
142
|
*/
|
|
132
|
-
renderItem: (item: ItemT, index: number) => React.ReactElement;
|
|
143
|
+
renderItem: (item: ItemT, index: number, info: GestureViewerRenderItemInfo) => React.ReactElement;
|
|
133
144
|
/**
|
|
134
145
|
* A callback function that is called when a single tap is confirmed on the viewer content.
|
|
135
146
|
* @remarks
|
package/src/useGestureViewer.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { Platform, type View, useWindowDimensions } from 'react-native';
|
|
3
3
|
import { Gesture, type GestureType } from 'react-native-gesture-handler';
|
|
4
4
|
import {
|
|
5
5
|
Easing,
|
|
@@ -14,6 +14,7 @@ import { scheduleOnRN } from 'react-native-worklets';
|
|
|
14
14
|
|
|
15
15
|
import type GestureViewerManager from './GestureViewerManager';
|
|
16
16
|
import { registry } from './GestureViewerRegistry';
|
|
17
|
+
import { scheduleInitialScroll } from './scheduleInitialScroll';
|
|
17
18
|
import type { GestureViewerProps, TriggerRect } from './types';
|
|
18
19
|
import { useGestureViewerPaging } from './useGestureViewerPaging';
|
|
19
20
|
import { createBoundsConstraint, createScrollAction } from './utils';
|
|
@@ -101,6 +102,7 @@ export const useGestureViewer = <ItemT, LC>({
|
|
|
101
102
|
const hasActiveFocal = useSharedValue(false);
|
|
102
103
|
|
|
103
104
|
const dataLength = data?.length || 0;
|
|
105
|
+
const previousDataLengthRef = useRef(dataLength);
|
|
104
106
|
|
|
105
107
|
const animationConfig = useMemo(
|
|
106
108
|
() => ({
|
|
@@ -290,6 +292,10 @@ export const useGestureViewer = <ItemT, LC>({
|
|
|
290
292
|
}, [manager]);
|
|
291
293
|
|
|
292
294
|
useEffect(() => {
|
|
295
|
+
const hasDataLengthChanged = previousDataLengthRef.current !== dataLength;
|
|
296
|
+
const hasValidInitialIndex = initialIndex >= 0 && initialIndex < dataLength;
|
|
297
|
+
|
|
298
|
+
previousDataLengthRef.current = dataLength;
|
|
293
299
|
translateY.set(0);
|
|
294
300
|
translateX.set(0);
|
|
295
301
|
scale.set(1);
|
|
@@ -297,19 +303,21 @@ export const useGestureViewer = <ItemT, LC>({
|
|
|
297
303
|
startScale.set(1);
|
|
298
304
|
rotation.set(0);
|
|
299
305
|
|
|
300
|
-
if (
|
|
306
|
+
if (
|
|
307
|
+
!hasValidInitialIndex ||
|
|
308
|
+
(!hasDataLengthChanged && adjustedInitialIndex <= 0) ||
|
|
309
|
+
!listRef.current
|
|
310
|
+
) {
|
|
301
311
|
return;
|
|
302
312
|
}
|
|
303
313
|
|
|
304
|
-
|
|
314
|
+
return scheduleInitialScroll(() => {
|
|
305
315
|
scrollTo(adjustedInitialIndex, false);
|
|
306
316
|
});
|
|
307
|
-
|
|
308
|
-
return () => {
|
|
309
|
-
runAfterInteractions?.cancel();
|
|
310
|
-
};
|
|
311
317
|
}, [
|
|
312
318
|
adjustedInitialIndex,
|
|
319
|
+
dataLength,
|
|
320
|
+
initialIndex,
|
|
313
321
|
translateY,
|
|
314
322
|
backdropOpacity,
|
|
315
323
|
translateX,
|
|
@@ -814,32 +822,34 @@ export const useGestureViewer = <ItemT, LC>({
|
|
|
814
822
|
return Gesture.Native().requireExternalGestureToFail(dismissGestureRef);
|
|
815
823
|
}, []);
|
|
816
824
|
|
|
817
|
-
const { onMomentumScrollEnd, onScroll, onScrollBeginDrag, onWebClick } =
|
|
818
|
-
|
|
819
|
-
|
|
820
|
-
|
|
821
|
-
|
|
822
|
-
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
|
|
826
|
-
|
|
827
|
-
|
|
828
|
-
|
|
829
|
-
|
|
830
|
-
|
|
831
|
-
|
|
832
|
-
|
|
833
|
-
|
|
834
|
-
|
|
835
|
-
|
|
836
|
-
|
|
837
|
-
|
|
838
|
-
|
|
839
|
-
|
|
840
|
-
|
|
825
|
+
const { activeListIndex, onMomentumScrollEnd, onScroll, onScrollBeginDrag, onWebClick } =
|
|
826
|
+
useGestureViewerPaging({
|
|
827
|
+
adjustedInitialIndex,
|
|
828
|
+
autoPlay,
|
|
829
|
+
autoPlayInterval,
|
|
830
|
+
currentIndex,
|
|
831
|
+
dataLength,
|
|
832
|
+
enableDoubleTapZoom,
|
|
833
|
+
enableHorizontalSwipe,
|
|
834
|
+
enableLoop,
|
|
835
|
+
height,
|
|
836
|
+
isRotated,
|
|
837
|
+
isZoomed,
|
|
838
|
+
itemSpacing,
|
|
839
|
+
manager,
|
|
840
|
+
maxZoomScale,
|
|
841
|
+
onSingleTap: emitSingleTap,
|
|
842
|
+
scale,
|
|
843
|
+
scrollTo,
|
|
844
|
+
syncCurrentIndex,
|
|
845
|
+
syncPendingIndex,
|
|
846
|
+
translateX,
|
|
847
|
+
translateY,
|
|
848
|
+
width,
|
|
849
|
+
});
|
|
841
850
|
|
|
842
851
|
return {
|
|
852
|
+
activeListIndex,
|
|
843
853
|
animatedStyle,
|
|
844
854
|
backdropStyle,
|
|
845
855
|
dataLength,
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useCallback, useEffect } from 'react';
|
|
1
|
+
import { useCallback, useEffect, useState } from 'react';
|
|
2
2
|
import type { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';
|
|
3
3
|
|
|
4
4
|
import type {
|
|
@@ -8,6 +8,7 @@ import type {
|
|
|
8
8
|
import { getLoopAdjustedIndex } from './utils';
|
|
9
9
|
|
|
10
10
|
export function useGestureViewerPaging({
|
|
11
|
+
adjustedInitialIndex,
|
|
11
12
|
autoPlay,
|
|
12
13
|
autoPlayInterval,
|
|
13
14
|
currentIndex,
|
|
@@ -23,6 +24,14 @@ export function useGestureViewerPaging({
|
|
|
23
24
|
syncPendingIndex,
|
|
24
25
|
width,
|
|
25
26
|
}: UseGestureViewerPagingArgs): UseGestureViewerPagingResult {
|
|
27
|
+
const [activeListIndex, setActiveListIndex] = useState(adjustedInitialIndex);
|
|
28
|
+
const activeResetItemSpacing = adjustedInitialIndex > 0 ? itemSpacing : 0;
|
|
29
|
+
const activeResetWidth = adjustedInitialIndex > 0 ? width : 0;
|
|
30
|
+
|
|
31
|
+
useEffect(() => {
|
|
32
|
+
setActiveListIndex(adjustedInitialIndex);
|
|
33
|
+
}, [adjustedInitialIndex, activeResetItemSpacing, activeResetWidth, dataLength]);
|
|
34
|
+
|
|
26
35
|
useEffect(() => {
|
|
27
36
|
if (
|
|
28
37
|
!autoPlay ||
|
|
@@ -69,24 +78,30 @@ export function useGestureViewerPaging({
|
|
|
69
78
|
|
|
70
79
|
const { contentOffset } = event.nativeEvent;
|
|
71
80
|
const scrollIndex = Math.round(contentOffset.x / (width + itemSpacing));
|
|
81
|
+
const { realIndex, needsJump, jumpToIndex } = getLoopAdjustedIndex(
|
|
82
|
+
scrollIndex,
|
|
83
|
+
dataLength,
|
|
84
|
+
enableLoop,
|
|
85
|
+
);
|
|
72
86
|
|
|
73
87
|
const isLoopHandled = manager?.handleMomentumScrollEnd(scrollIndex);
|
|
74
88
|
|
|
75
|
-
if (
|
|
89
|
+
if (realIndex < 0 || realIndex >= dataLength) {
|
|
76
90
|
return;
|
|
77
91
|
}
|
|
78
92
|
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
93
|
+
if (isLoopHandled) {
|
|
94
|
+
syncCurrentIndex(realIndex);
|
|
95
|
+
setActiveListIndex(jumpToIndex ?? scrollIndex);
|
|
96
|
+
return;
|
|
97
|
+
}
|
|
84
98
|
|
|
85
99
|
if (needsJump && jumpToIndex !== undefined) {
|
|
86
100
|
scrollTo(jumpToIndex, false);
|
|
87
101
|
}
|
|
88
102
|
|
|
89
103
|
syncCurrentIndex(realIndex);
|
|
104
|
+
setActiveListIndex(jumpToIndex ?? scrollIndex);
|
|
90
105
|
},
|
|
91
106
|
[
|
|
92
107
|
dataLength,
|
|
@@ -120,6 +135,7 @@ export function useGestureViewerPaging({
|
|
|
120
135
|
}, [manager]);
|
|
121
136
|
|
|
122
137
|
return {
|
|
138
|
+
activeListIndex,
|
|
123
139
|
onMomentumScrollEnd,
|
|
124
140
|
onScroll,
|
|
125
141
|
onScrollBeginDrag,
|
|
@@ -34,6 +34,7 @@ export type WebClickTarget = {
|
|
|
34
34
|
};
|
|
35
35
|
|
|
36
36
|
export type UseGestureViewerPagingResult = {
|
|
37
|
+
activeListIndex: number;
|
|
37
38
|
onMomentumScrollEnd?: ScrollViewProps['onMomentumScrollEnd'];
|
|
38
39
|
onScroll?: ScrollViewProps['onScroll'];
|
|
39
40
|
onScrollBeginDrag?: ScrollViewProps['onScrollBeginDrag'];
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { useCallback, useEffect, useRef, type MouseEvent } from 'react';
|
|
1
|
+
import { useCallback, useEffect, useRef, useState, type MouseEvent } from 'react';
|
|
2
2
|
import type { NativeScrollEvent, NativeSyntheticEvent } from 'react-native';
|
|
3
3
|
|
|
4
4
|
import type {
|
|
@@ -50,6 +50,9 @@ export function useGestureViewerPaging({
|
|
|
50
50
|
translateY,
|
|
51
51
|
width,
|
|
52
52
|
}: UseGestureViewerPagingArgs): UseGestureViewerPagingResult {
|
|
53
|
+
const [activeListIndex, setActiveListIndex] = useState(adjustedInitialIndex);
|
|
54
|
+
const activeResetItemSpacing = adjustedInitialIndex > 0 ? itemSpacing : 0;
|
|
55
|
+
const activeResetWidth = adjustedInitialIndex > 0 ? width : 0;
|
|
53
56
|
const webSingleTapTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
|
|
54
57
|
|
|
55
58
|
const webScrollRuntimeRef = useRef<WebScrollRuntime>({
|
|
@@ -187,6 +190,7 @@ export function useGestureViewerPaging({
|
|
|
187
190
|
runtime.latestOffsetX = settledPhysicalIndex * (width + itemSpacing);
|
|
188
191
|
runtime.actor = 'idle';
|
|
189
192
|
manager?.cancelPendingLoopTransition();
|
|
193
|
+
setActiveListIndex(settledPhysicalIndex);
|
|
190
194
|
syncCurrentIndex(logicalIndex);
|
|
191
195
|
|
|
192
196
|
if (settledByActor === 'user') {
|
|
@@ -227,20 +231,34 @@ export function useGestureViewerPaging({
|
|
|
227
231
|
runtime.actor = 'idle';
|
|
228
232
|
runtime.isAutoplayPausedByUser = false;
|
|
229
233
|
runtime.lastSettledPhysicalIndex = adjustedInitialIndex;
|
|
230
|
-
runtime.latestOffsetX = adjustedInitialIndex * (
|
|
234
|
+
runtime.latestOffsetX = adjustedInitialIndex * (activeResetWidth + activeResetItemSpacing);
|
|
231
235
|
runtime.latestRawPhysicalIndex = adjustedInitialIndex;
|
|
232
236
|
runtime.lastProgrammaticScrollVersion = manager?.getProgrammaticScrollVersion() ?? 0;
|
|
237
|
+
setActiveListIndex(adjustedInitialIndex);
|
|
233
238
|
clearWebSettleTimer();
|
|
234
239
|
clearWebAutoplayResumeTimer();
|
|
235
240
|
}, [
|
|
241
|
+
activeResetItemSpacing,
|
|
242
|
+
activeResetWidth,
|
|
236
243
|
adjustedInitialIndex,
|
|
237
244
|
clearWebAutoplayResumeTimer,
|
|
238
245
|
clearWebSettleTimer,
|
|
239
|
-
|
|
246
|
+
dataLength,
|
|
240
247
|
manager,
|
|
241
|
-
width,
|
|
242
248
|
]);
|
|
243
249
|
|
|
250
|
+
useEffect(() => {
|
|
251
|
+
const runtime = webScrollRuntimeRef.current;
|
|
252
|
+
|
|
253
|
+
runtime.actor = 'idle';
|
|
254
|
+
runtime.isAutoplayPausedByUser = false;
|
|
255
|
+
runtime.latestOffsetX = runtime.lastSettledPhysicalIndex * (width + itemSpacing);
|
|
256
|
+
runtime.latestRawPhysicalIndex = runtime.lastSettledPhysicalIndex;
|
|
257
|
+
runtime.lastProgrammaticScrollVersion = manager?.getProgrammaticScrollVersion() ?? 0;
|
|
258
|
+
clearWebSettleTimer();
|
|
259
|
+
clearWebAutoplayResumeTimer();
|
|
260
|
+
}, [clearWebAutoplayResumeTimer, clearWebSettleTimer, itemSpacing, manager, width]);
|
|
261
|
+
|
|
244
262
|
useEffect(() => {
|
|
245
263
|
return () => {
|
|
246
264
|
clearWebSingleTapTimer();
|
|
@@ -426,6 +444,7 @@ export function useGestureViewerPaging({
|
|
|
426
444
|
);
|
|
427
445
|
|
|
428
446
|
return {
|
|
447
|
+
activeListIndex,
|
|
429
448
|
onMomentumScrollEnd,
|
|
430
449
|
onScroll,
|
|
431
450
|
onScrollBeginDrag,
|