react-native-gesture-image-viewer 1.5.0 → 1.6.0

package/lib/typescript/src/GestureViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GestureViewer.d.ts","sourceRoot":"","sources":["../../../src/GestureViewer.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,QAAQ,EAAyE,MAAM,cAAc,CAAC;AAIpH,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAKlD,wBAAgB,aAAa,CAAC,CAAC,GAAG,GAAG,EAAE,EAAE,GAAG,OAAO,QAAQ,EAAE,EAC3D,EAAc,EACd,IAAI,EACJ,UAAU,EAAE,cAAc,EAC1B,eAAe,EACf,aAAa,EACb,KAAK,EAAE,WAAW,EAClB,SAAS,EACT,aAAa,EAAE,kBAAkB,EACjC,cAAc,EACd,YAAgB,EAChB,WAAe,EACf,OAAe,EACf,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,CAAC,EAAE,EAAE,CAAC,2CAuI3B"}
+{"version":3,"file":"GestureViewer.d.ts","sourceRoot":"","sources":["../../../src/GestureViewer.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,QAAQ,EAAyE,MAAM,cAAc,CAAC;AAIpH,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAKlD,wBAAgB,aAAa,CAAC,CAAC,GAAG,GAAG,EAAE,EAAE,GAAG,OAAO,QAAQ,EAAE,EAC3D,EAAc,EACd,IAAI,EACJ,UAAU,EAAE,cAAc,EAC1B,eAAe,EACf,aAAa,EACb,KAAK,EAAE,WAAW,EAClB,SAAS,EACT,aAAa,EAAE,kBAAkB,EACjC,cAAc,EACd,YAAgB,EAChB,WAAe,EACf,OAAe,EACf,UAAkB,EAClB,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,CAAC,EAAE,EAAE,CAAC,2CAsJ3B"}

package/lib/typescript/src/GestureViewerManager.d.ts

@@ -11,9 +11,12 @@ declare class GestureViewerManager {
     private maxZoomScale;
     private listRef;
     private enableSwipeGesture;
+    private enableLoop;
     private listeners;
     private rotation;
     private eventListeners;
+    private animationTimeout;
+    private static readonly LOOP_ANIMATION_DURATION;
     private notifyListeners;
     subscribe(listener: (state: GestureViewerControllerState) => void): () => void;
     addEventListener<T extends GestureViewerEventType>(eventType: T, callback: GestureViewerEventCallback<T>): () => void;
@@ -24,6 +27,7 @@ declare class GestureViewerManager {
         currentIndex: number;
         totalCount: number;
     };
+    setEnableLoop(enabled: boolean): void;
     setWidth(width: number): void;
     setHeight(height: number): void;
     setListRef(ref: any): void;
@@ -38,9 +42,11 @@ declare class GestureViewerManager {
     zoomOut: (multiplier?: number) => void;
     resetZoom: (scale?: number) => void;
     goToIndex: (index: number) => void;
+    cancelAnimation: () => void;
     goToPrevious: () => void;
     goToNext: () => void;
     cleanUp(): void;
+    private updateCurrentIndex;
 }
 export default GestureViewerManager;
 //# sourceMappingURL=GestureViewerManager.d.ts.map

package/lib/typescript/src/GestureViewerManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"GestureViewerManager.d.ts","sourceRoot":"","sources":["../../../src/GestureViewerManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAc,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EACV,4BAA4B,EAC5B,0BAA0B,EAE1B,sBAAsB,EACvB,MAAM,SAAS,CAAC;AAGjB,cAAM,oBAAoB;IACxB,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,MAAM,CAAK;IACnB,OAAO,CAAC,KAAK,CAAoC;IACjD,OAAO,CAAC,UAAU,CAAoC;IACtD,OAAO,CAAC,UAAU,CAAoC;IACtD,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,OAAO,CAAoB;IACnC,OAAO,CAAC,kBAAkB,CAAQ;IAClC,OAAO,CAAC,SAAS,CAA4D;IAC7E,OAAO,CAAC,QAAQ,CAAoC;IACpD,OAAO,CAAC,cAAc,CAA+D;IAErF,OAAO,CAAC,eAAe;IAMvB,SAAS,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,4BAA4B,KAAK,IAAI;IAQjE,gBAAgB,CAAC,CAAC,SAAS,sBAAsB,EAAE,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,0BAA0B,CAAC,CAAC,CAAC;IAoBxG,OAAO,CAAC,SAAS;IAQjB,cAAc,GAAI,OAAO,MAAM,EAAE,eAAe,MAAM,GAAG,IAAI,UAE3D;IAEF,kBAAkB,GAAI,UAAU,MAAM,EAAE,kBAAkB,MAAM,GAAG,IAAI,UAErE;IAEF,QAAQ;;;;IAOR,QAAQ,CAAC,KAAK,EAAE,MAAM;IAItB,SAAS,CAAC,MAAM,EAAE,MAAM;IAIxB,UAAU,CAAC,GAAG,EAAE,GAAG;IAInB,aAAa,CAAC,MAAM,EAAE,MAAM;IAI5B,qBAAqB,CAAC,OAAO,EAAE,OAAO;IAItC,eAAe,CAAC,KAAK,EAAE,MAAM;IAM7B,mBAAmB,CACjB,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,EAC1B,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,EAC/B,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,EAC/B,YAAY,EAAE,MAAM;IAQtB,iBAAiB;IAIjB,WAAW,CAAC,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC;IAIzC,MAAM,GAAI,QAAO,CAAC,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAQ,EAAE,mBAAgB,UA2B9D;IAEF,MAAM,GAAI,mBAAiB,UAoBzB;IAEF,OAAO,GAAI,mBAAiB,UA0B1B;IAEF,SAAS,GAAI,cAAS,UAQpB;IAEF,SAAS,GAAI,OAAO,MAAM,UAcxB;IAEF,YAAY,aAIV;IAEF,QAAQ,aAIN;IAEF,OAAO;CAcR;AAED,eAAe,oBAAoB,CAAC"}
+{"version":3,"file":"GestureViewerManager.d.ts","sourceRoot":"","sources":["../../../src/GestureViewerManager.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,WAAW,EAAc,MAAM,yBAAyB,CAAC;AACvE,OAAO,KAAK,EACV,4BAA4B,EAC5B,0BAA0B,EAE1B,sBAAsB,EACvB,MAAM,SAAS,CAAC;AAGjB,cAAM,oBAAoB;IACxB,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,UAAU,CAAK;IACvB,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,MAAM,CAAK;IACnB,OAAO,CAAC,KAAK,CAAoC;IACjD,OAAO,CAAC,UAAU,CAAoC;IACtD,OAAO,CAAC,UAAU,CAAoC;IACtD,OAAO,CAAC,YAAY,CAAK;IACzB,OAAO,CAAC,OAAO,CAAoB;IACnC,OAAO,CAAC,kBAAkB,CAAQ;IAClC,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,SAAS,CAA4D;IAC7E,OAAO,CAAC,QAAQ,CAAoC;IACpD,OAAO,CAAC,cAAc,CAA+D;IACrF,OAAO,CAAC,gBAAgB,CAA+B;IAEvD,OAAO,CAAC,MAAM,CAAC,QAAQ,CAAC,uBAAuB,CAAO;IAEtD,OAAO,CAAC,eAAe;IAMvB,SAAS,CAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,4BAA4B,KAAK,IAAI;IAQjE,gBAAgB,CAAC,CAAC,SAAS,sBAAsB,EAAE,SAAS,EAAE,CAAC,EAAE,QAAQ,EAAE,0BAA0B,CAAC,CAAC,CAAC;IAoBxG,OAAO,CAAC,SAAS;IAQjB,cAAc,GAAI,OAAO,MAAM,EAAE,eAAe,MAAM,GAAG,IAAI,UAE3D;IAEF,kBAAkB,GAAI,UAAU,MAAM,EAAE,kBAAkB,MAAM,GAAG,IAAI,UAErE;IAEF,QAAQ;;;;IAOR,aAAa,CAAC,OAAO,EAAE,OAAO;IAI9B,QAAQ,CAAC,KAAK,EAAE,MAAM;IAItB,SAAS,CAAC,MAAM,EAAE,MAAM;IAIxB,UAAU,CAAC,GAAG,EAAE,GAAG;IAInB,aAAa,CAAC,MAAM,EAAE,MAAM;IAI5B,qBAAqB,CAAC,OAAO,EAAE,OAAO;IAItC,eAAe,CAAC,KAAK,EAAE,MAAM;IAM7B,mBAAmB,CACjB,KAAK,EAAE,WAAW,CAAC,MAAM,CAAC,EAC1B,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,EAC/B,UAAU,EAAE,WAAW,CAAC,MAAM,CAAC,EAC/B,YAAY,EAAE,MAAM;IAQtB,iBAAiB;IAIjB,WAAW,CAAC,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC;IAIzC,MAAM,GAAI,QAAO,CAAC,GAAG,EAAE,GAAG,GAAG,GAAG,GAAG,GAAG,GAAQ,EAAE,mBAAgB,UA2B9D;IAEF,MAAM,GAAI,mBAAiB,UAoBzB;IAEF,OAAO,GAAI,mBAAiB,UA0B1B;IAEF,SAAS,GAAI,cAAS,UAQpB;IAEF,SAAS,GAAI,OAAO,MAAM,UA4CxB;IAEF,eAAe,aAKb;IAEF,YAAY,aAEV;IAEF,QAAQ,aAEN;IAEF,OAAO;IAeP,OAAO,CAAC,kBAAkB,CAGxB;CACH;AAED,eAAe,oBAAoB,CAAC"}

package/lib/typescript/src/types.d.ts

@@ -120,6 +120,11 @@ export interface GestureViewerProps<T = any, LC = typeof RNFlatList> {
      * @defaultValue true
      */
     enableDoubleTapGesture?: boolean;
+    /**
+     * Enables infinite loop navigation.
+     * @defaultValue false
+     */
+    enableLoop?: boolean;
     /**
      * The maximum zoom scale.
      * @defaultValue 2

package/lib/typescript/src/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}

package/lib/typescript/src/useGestureViewer.d.ts

@@ -1,7 +1,7 @@
 import { type NativeScrollEvent, type NativeSyntheticEvent } from 'react-native';
 import type { GestureViewerProps } from './types';
 type UseGestureViewerProps<T = any> = Omit<GestureViewerProps<T>, 'renderItem' | 'renderContainer' | 'ListComponent' | 'listProps' | 'containerStyle' | 'backdropStyle'>;
-export declare const useGestureViewer: <T = any>({ data, initialIndex, onIndexChange, onDismiss, width: customWidth, dismissThreshold, resistance, animateBackdrop, enableDismissGesture, enableSwipeGesture, enableZoomGesture, enableDoubleTapGesture, enableZoomPanGesture, maxZoomScale, itemSpacing, useSnap, id, }: UseGestureViewerProps<T>) => {
+export declare const useGestureViewer: <T = any>({ data, initialIndex, onIndexChange, onDismiss, width: customWidth, dismissThreshold, resistance, animateBackdrop, enableDismissGesture, enableSwipeGesture, enableZoomGesture, enableDoubleTapGesture, enableZoomPanGesture, enableLoop, maxZoomScale, itemSpacing, useSnap, id, }: UseGestureViewerProps<T>) => {
     currentIndex: number;
     dataLength: number;
     translateY: import("react-native-reanimated").SharedValue<number>;
@@ -11,6 +11,7 @@ export declare const useGestureViewer: <T = any>({ data, initialIndex, onIndexCh
     dismissGesture: import("react-native-gesture-handler/lib/typescript/handlers/gestures/panGesture").PanGesture;
     zoomGesture: import("react-native-gesture-handler/lib/typescript/handlers/gestures/gestureComposition").ComposedGesture;
     onMomentumScrollEnd: (event: NativeSyntheticEvent<NativeScrollEvent>) => void;
+    onScrollBeginDrag: () => void;
     animatedStyle: {
         transform: ({
             translateY: number;

package/lib/typescript/src/useGestureViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGestureViewer.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewer.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAE1B,MAAM,cAAc,CAAC;AActB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAGlD,KAAK,qBAAqB,CAAC,CAAC,GAAG,GAAG,IAAI,IAAI,CACxC,kBAAkB,CAAC,CAAC,CAAC,EACrB,YAAY,GAAG,iBAAiB,GAAG,eAAe,GAAG,WAAW,GAAG,gBAAgB,GAAG,eAAe,CACtG,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,CAAC,GAAG,GAAG,EAAE,yQAoBvC,qBAAqB,CAAC,CAAC,CAAC;;;;;;;;;iCAoKf,oBAAoB,CAAC,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4QlD,CAAC"}
+{"version":3,"file":"useGestureViewer.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewer.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAE1B,MAAM,cAAc,CAAC;AActB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAGlD,KAAK,qBAAqB,CAAC,CAAC,GAAG,GAAG,IAAI,IAAI,CACxC,kBAAkB,CAAC,CAAC,CAAC,EACrB,YAAY,GAAG,iBAAiB,GAAG,eAAe,GAAG,WAAW,GAAG,gBAAgB,GAAG,eAAe,CACtG,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,CAAC,GAAG,GAAG,EAAE,qRAqBvC,qBAAqB,CAAC,CAAC,CAAC;;;;;;;;;iCA6Kf,oBAAoB,CAAC,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyRlD,CAAC"}

package/lib/typescript/src/utils.d.ts

@@ -13,4 +13,13 @@ export declare const createBoundsConstraint: ({ width, height }: {
     translateX: number;
     translateY: number;
 };
+export declare const createLoopData: <T>(dataRef: React.RefObject<T[]>, enableLoop: boolean) => T[];
+export declare const getLoopAdjustedIndex: (scrollIndex: number, originalDataLength: number, enableLoop: boolean) => {
+    realIndex: number;
+    needsJump: boolean;
+    jumpToIndex?: number;
+};
+export declare const createScrollAction: (listRef: any, width: number) => {
+    scrollTo: (index: number, animated: boolean) => void;
+};
 //# sourceMappingURL=utils.d.ts.map

package/lib/typescript/src/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/utils.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEtE,eAAO,MAAM,gBAAgB,GAAI,WAAW,GAAG,KAAG,SAAS,IAAI,mBAE9D,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,WAAW,GAAG,KAAG,SAAS,IAAI,iBAM5D,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,WAAW,GAAG,KAAG,SAAS,IAAI,GAY7D,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAChC,mBAAmB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,MACpD,mCAAmC;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE;;;CAiB5F,CAAC"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/utils.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEtE,eAAO,MAAM,gBAAgB,GAAI,WAAW,GAAG,KAAG,SAAS,IAAI,mBAE9D,CAAC;AAEF,eAAO,MAAM,cAAc,GAAI,WAAW,GAAG,KAAG,SAAS,IAAI,iBAM5D,CAAC;AAEF,eAAO,MAAM,eAAe,GAAI,WAAW,GAAG,KAAG,SAAS,IAAI,GAY7D,CAAC;AAEF,eAAO,MAAM,sBAAsB,GAChC,mBAAmB;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,MACpD,mCAAmC;IAAE,UAAU,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE;;;CAiB5F,CAAC;AAEJ,eAAO,MAAM,cAAc,GAAI,CAAC,EAAE,SAAS,KAAK,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,EAAE,YAAY,OAAO,KAAG,CAAC,EAevF,CAAC;AAEF,eAAO,MAAM,oBAAoB,GAC/B,aAAa,MAAM,EACnB,oBAAoB,MAAM,EAC1B,YAAY,OAAO,KAClB;IAAE,SAAS,EAAE,MAAM,CAAC;IAAC,SAAS,EAAE,OAAO,CAAC;IAAC,WAAW,CAAC,EAAE,MAAM,CAAA;CAoB/D,CAAC;AAEF,eAAO,MAAM,kBAAkB,GAAI,SAAS,GAAG,EAAE,OAAO,MAAM;sBAC1C,MAAM,YAAY,OAAO;CAO3C,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-gesture-image-viewer",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "description": "🖼️ A highly customizable and easy-to-use React Native image viewer with gesture support and external controls",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/GestureViewer.tsx

@@ -1,11 +1,11 @@
-import { useCallback, useEffect, useMemo } from 'react';
+import { useCallback, useEffect, useMemo, useRef } from 'react';
 import { type FlatList, Platform, type ScrollViewProps, StyleSheet, useWindowDimensions, View } from 'react-native';
 import { Gesture, GestureDetector, GestureHandlerRootView } from 'react-native-gesture-handler';
 import Animated from 'react-native-reanimated';
 import { registry } from './GestureViewerRegistry';
 import type { GestureViewerProps } from './types';
 import { useGestureViewer } from './useGestureViewer';
-import { isFlashListLike, isFlatListLike, isScrollViewLike } from './utils';
+import { createLoopData, isFlashListLike, isFlatListLike, isScrollViewLike } from './utils';
 import WebPagingFixStyle from './WebPagingFixStyle';
 
 export function GestureViewer<T = any, LC = typeof FlatList>({
@@ -21,14 +21,20 @@ export function GestureViewer<T = any, LC = typeof FlatList>({
   initialIndex = 0,
   itemSpacing = 0,
   useSnap = false,
+  enableLoop = false,
   ...props
 }: GestureViewerProps<T, LC>) {
   const Component = ListComponent as React.ComponentType<any>;
 
+  const dataRef = useRef(data);
+  dataRef.current = data;
+
   const { width: screenWidth } = useWindowDimensions();
 
   const width = useSnap ? customWidth || screenWidth : screenWidth;
 
+  const loopData = useMemo(() => createLoopData(dataRef, enableLoop), [enableLoop]);
+
   const {
     listRef,
     isZoomed,
@@ -36,6 +42,7 @@ export function GestureViewer<T = any, LC = typeof FlatList>({
     dismissGesture,
     zoomGesture,
     onMomentumScrollEnd,
+    onScrollBeginDrag,
     animatedStyle,
     backdropStyle,
   } = useGestureViewer({
@@ -45,14 +52,26 @@ export function GestureViewer<T = any, LC = typeof FlatList>({
     initialIndex,
     itemSpacing,
     useSnap,
+    enableLoop,
     ...props,
   });
 
+  const keyExtractor = useCallback(
+    (item: T, index: number) => {
+      if (enableLoop) {
+        return typeof item === 'string' ? `${item}-${index}` : `item-${index}`;
+      }
+
+      return typeof item === 'string' ? item : `image-${index}`;
+    },
+    [enableLoop],
+  );
+
   const renderItem = useCallback(
     ({ item, index }: { item: T; index: number }) => {
       return (
         <View
-          key={typeof item === 'string' ? item : index}
+          key={keyExtractor(item, index)}
           style={[
             {
               width,
@@ -67,7 +86,7 @@ export function GestureViewer<T = any, LC = typeof FlatList>({
         </View>
       );
     },
-    [width, itemSpacing, renderItemProp],
+    [width, itemSpacing, renderItemProp, keyExtractor],
   );
 
   const getItemLayout = useCallback(
@@ -79,11 +98,6 @@ export function GestureViewer<T = any, LC = typeof FlatList>({
     [width, itemSpacing],
   );
 
-  const keyExtractor = useCallback(
-    (item: T, index: number) => (typeof item === 'string' ? item : `image-${index}`),
-    [],
-  );
-
   const gesture = useMemo(() => {
     return Gesture.Race(dismissGesture, zoomGesture);
   }, [zoomGesture, dismissGesture]);
@@ -94,25 +108,27 @@ export function GestureViewer<T = any, LC = typeof FlatList>({
     return () => registry.deleteManager(id);
   }, [id]);
 
-  const commonProps: ScrollViewProps = useMemo(
-    () => ({
-      horizontal: true,
-      scrollEnabled: !isZoomed && !isRotated,
-      showsHorizontalScrollIndicator: false,
-      onMomentumScrollEnd: onMomentumScrollEnd,
-      ...(useSnap
-        ? {
-            snapToInterval: width + itemSpacing,
-            snapToAlignment: 'center',
-            decelerationRate: 'fast',
-          }
-        : {
-            pagingEnabled: true,
-          }),
-      scrollEventThrottle: 16,
-      removeClippedSubviews: true,
-    }),
-    [width, itemSpacing, isZoomed, isRotated, onMomentumScrollEnd, useSnap],
+  const commonProps = useMemo(
+    () =>
+      ({
+        horizontal: true,
+        scrollEnabled: !isZoomed && !isRotated,
+        showsHorizontalScrollIndicator: false,
+        onMomentumScrollEnd: onMomentumScrollEnd,
+        onScrollBeginDrag,
+        ...(useSnap
+          ? {
+              snapToInterval: width + itemSpacing,
+              snapToAlignment: 'center',
+              decelerationRate: 'fast',
+            }
+          : {
+              pagingEnabled: true,
+            }),
+        scrollEventThrottle: 16,
+        removeClippedSubviews: true,
+      }) satisfies ScrollViewProps,
+    [width, itemSpacing, isZoomed, isRotated, onMomentumScrollEnd, onScrollBeginDrag, useSnap],
   );
 
   const listComponent = (
@@ -127,16 +143,16 @@ export function GestureViewer<T = any, LC = typeof FlatList>({
           >
             {isScrollViewLike(Component) ? (
               <Component ref={listRef} {...commonProps} {...listProps}>
-                {data.map((item, index) => renderItem({ item, index }))}
+                {loopData.map((item, index) => renderItem({ item, index }))}
               </Component>
             ) : (
               isFlatListLike(Component) && (
                 <Component
                   ref={listRef}
                   {...commonProps}
-                  data={data}
+                  data={loopData}
                   renderItem={renderItem}
-                  initialScrollIndex={initialIndex}
+                  initialScrollIndex={enableLoop && data.length > 1 ? initialIndex + 1 : initialIndex}
                   keyExtractor={keyExtractor}
                   windowSize={3}
                   maxToRenderPerBatch={3}

package/src/GestureViewerManager.ts

@@ -5,7 +5,7 @@ import type {
   GestureViewerEventData,
   GestureViewerEventType,
 } from './types';
-import { createBoundsConstraint } from './utils';
+import { createBoundsConstraint, createScrollAction } from './utils';
 
 class GestureViewerManager {
   private currentIndex = 0;
@@ -18,9 +18,13 @@ class GestureViewerManager {
   private maxZoomScale = 2;
   private listRef: any | null = null;
   private enableSwipeGesture = true;
+  private enableLoop = false;
   private listeners = new Set<(state: GestureViewerControllerState) => void>();
   private rotation: SharedValue<number> | null = null;
   private eventListeners = new Map<GestureViewerEventType, Set<(data: any) => void>>();
+  private animationTimeout: NodeJS.Timeout | null = null;
+
+  private static readonly LOOP_ANIMATION_DURATION = 300;
 
   private notifyListeners() {
     const state = this.getState();
@@ -79,6 +83,10 @@ class GestureViewerManager {
     };
   }
 
+  setEnableLoop(enabled: boolean) {
+    this.enableLoop = enabled;
+  }
+
   setWidth(width: number) {
     this.width = width;
   }
@@ -215,40 +223,73 @@ class GestureViewerManager {
   };
 
   goToIndex = (index: number) => {
-    if (index < 0 || index >= this.dataLength || !this.enableSwipeGesture || !this.listRef) {
+    if (!this.enableSwipeGesture || !this.listRef) {
       return;
     }
 
-    this.currentIndex = index;
+    this.cancelAnimation();
+
+    const { scrollTo } = createScrollAction(this.listRef, this.width);
+
+    if (this.enableLoop && this.dataLength > 1) {
+      if (index < 0) {
+        scrollTo(0, true);
+
+        this.animationTimeout = setTimeout(() => {
+          scrollTo(this.dataLength, false);
+          this.updateCurrentIndex(this.dataLength - 1);
+        }, GestureViewerManager.LOOP_ANIMATION_DURATION);
+        return;
+      }
+
+      if (index >= this.dataLength) {
+        scrollTo(this.dataLength + 1, true);
+
+        this.animationTimeout = setTimeout(() => {
+          scrollTo(1, false);
+          this.updateCurrentIndex(0);
+        }, GestureViewerManager.LOOP_ANIMATION_DURATION);
+        return;
+      }
+
+      const scrollIndex = index + 1;
+
+      scrollTo(scrollIndex, true);
+      this.updateCurrentIndex(index);
+
+      return;
+    }
 
-    if (this.listRef.scrollToIndex) {
-      this.listRef.scrollToIndex({ index, animated: true });
-    } else if (this.listRef.scrollTo) {
-      this.listRef.scrollTo({ x: index * this.width, animated: true });
+    if (index < 0 || index >= this.dataLength) {
+      return;
     }
 
-    this.notifyListeners();
+    scrollTo(index, true);
+    this.updateCurrentIndex(index);
   };
 
-  goToPrevious = () => {
-    if (this.currentIndex > 0) {
-      this.goToIndex(this.currentIndex - 1);
+  cancelAnimation = () => {
+    if (this.animationTimeout) {
+      clearTimeout(this.animationTimeout);
+      this.animationTimeout = null;
     }
   };
 
+  goToPrevious = () => {
+    this.goToIndex(this.currentIndex - 1);
+  };
+
   goToNext = () => {
-    if (this.currentIndex < this.dataLength - 1) {
-      this.goToIndex(this.currentIndex + 1);
-    }
+    this.goToIndex(this.currentIndex + 1);
   };
 
   cleanUp() {
+    this.cancelAnimation();
     this.listeners.clear();
     this.listRef = null;
     this.enableSwipeGesture = true;
     this.currentIndex = 0;
     this.dataLength = 0;
-
     this.maxZoomScale = 2;
     this.scale = null;
     this.translateX = null;
@@ -256,6 +297,11 @@ class GestureViewerManager {
     this.rotation = null;
     this.eventListeners.clear();
   }
+
+  private updateCurrentIndex = (targetIndex: number) => {
+    this.currentIndex = targetIndex;
+    this.notifyListeners();
+  };
 }
 
 export default GestureViewerManager;

package/src/types.ts

@@ -130,6 +130,11 @@ export interface GestureViewerProps<T = any, LC = typeof RNFlatList> {
    * @defaultValue true
    */
   enableDoubleTapGesture?: boolean;
+  /**
+   * Enables infinite loop navigation.
+   * @defaultValue false
+   */
+  enableLoop?: boolean;
   /**
    * The maximum zoom scale.
    * @defaultValue 2

package/src/useGestureViewer.ts

@@ -19,7 +19,7 @@ import {
 import type GestureViewerManager from './GestureViewerManager';
 import { registry } from './GestureViewerRegistry';
 import type { GestureViewerProps } from './types';
-import { createBoundsConstraint } from './utils';
+import { createBoundsConstraint, createScrollAction, getLoopAdjustedIndex } from './utils';
 
 type UseGestureViewerProps<T = any> = Omit<
   GestureViewerProps<T>,
@@ -42,6 +42,7 @@ export const useGestureViewer = <T = any>({
   enableZoomGesture = true,
   enableDoubleTapGesture = true,
   enableZoomPanGesture = true,
+  enableLoop = false,
   maxZoomScale = 2,
   itemSpacing = 0,
   useSnap = false,
@@ -71,11 +72,28 @@ export const useGestureViewer = <T = any>({
 
   const dataLength = data?.length || 0;
 
+  const adjustedInitialIndex = useMemo(() => {
+    if (enableLoop && data.length > 1) {
+      return initialIndex + 1;
+    }
+
+    return initialIndex;
+  }, [enableLoop, data.length, initialIndex]);
+
   const constrainTranslation = useMemo(
     () => createBoundsConstraint({ width, height: screenHeight }),
     [width, screenHeight],
   );
 
+  const scrollTo = useCallback(
+    (index: number, animated: boolean) => {
+      const scrollAction = createScrollAction(listRef.current, width + itemSpacing);
+
+      return scrollAction.scrollTo(index, animated);
+    },
+    [width, itemSpacing],
+  );
+
   const emitZoomChange = useCallback(
     (currentScale: number, prevScale: number | null) => {
       manager?.emitZoomChange(currentScale, prevScale);
@@ -150,6 +168,7 @@ export const useGestureViewer = <T = any>({
     manager.setHeight(screenHeight);
     manager.setZoomSharedValues(scale, translateX, translateY, maxZoomScale);
     manager.setRotation(rotation);
+    manager.setEnableLoop(enableLoop);
     manager.notifyStateChange();
   }, [
     dataLength,
@@ -159,6 +178,7 @@ export const useGestureViewer = <T = any>({
     width,
     itemSpacing,
     maxZoomScale,
+    enableLoop,
     scale,
     screenHeight,
     translateX,
@@ -186,28 +206,18 @@ export const useGestureViewer = <T = any>({
     startScale.value = 1;
     rotation.value = 0;
 
-    if (initialIndex <= 0 || !listRef.current) {
+    if (adjustedInitialIndex <= 0 || !listRef.current) {
       return;
     }
 
     const runAfterInteractions = InteractionManager.runAfterInteractions(() => {
-      if (listRef.current.scrollToIndex) {
-        listRef.current.scrollToIndex({
-          index: initialIndex,
-          animated: false,
-        });
-      } else if (listRef.current.scrollTo) {
-        listRef.current.scrollTo({
-          x: initialIndex * (width + itemSpacing),
-          animated: false,
-        });
-      }
+      scrollTo(adjustedInitialIndex, false);
     });
 
     return () => {
       runAfterInteractions?.cancel();
     };
-  }, [initialIndex, translateY, backdropOpacity, translateX, scale, startScale, width, itemSpacing, rotation]);
+  }, [adjustedInitialIndex, translateY, backdropOpacity, translateX, scale, startScale, rotation, scrollTo]);
 
   const onMomentumScrollEnd = useCallback(
     (event: NativeSyntheticEvent<NativeScrollEvent>) => {
@@ -216,12 +226,18 @@ export const useGestureViewer = <T = any>({
       }
 
       const contentOffset = event.nativeEvent.contentOffset;
-      const newIndex = Math.round(contentOffset.x / (width + itemSpacing));
+      const scrollIndex = Math.round(contentOffset.x / (width + itemSpacing));
 
-      if (newIndex !== currentIndex && newIndex >= 0 && newIndex < dataLength) {
+      const { realIndex, needsJump, jumpToIndex } = getLoopAdjustedIndex(scrollIndex, dataLength, enableLoop);
+
+      if (needsJump && jumpToIndex !== undefined) {
+        scrollTo(jumpToIndex, false);
+      }
+
+      if (realIndex !== currentIndex && realIndex >= 0 && realIndex < dataLength) {
         if (manager) {
-          manager.setCurrentIndex(newIndex);
-          setCurrentIndex(newIndex);
+          manager.setCurrentIndex(realIndex);
+          setCurrentIndex(realIndex);
           manager.notifyStateChange();
         }
 
@@ -235,12 +251,14 @@ export const useGestureViewer = <T = any>({
       }
     },
     [
+      scrollTo,
       manager,
       currentIndex,
       dataLength,
       width,
       itemSpacing,
       enableSwipeGesture,
+      enableLoop,
       translateX,
       translateY,
       scale,
@@ -463,6 +481,10 @@ export const useGestureViewer = <T = any>({
     return { opacity };
   }, [animateBackdrop]);
 
+  const onScrollBeginDrag = useCallback(() => {
+    manager?.cancelAnimation();
+  }, [manager]);
+
   return {
     currentIndex,
     dataLength,
@@ -474,6 +496,7 @@ export const useGestureViewer = <T = any>({
     zoomGesture,
 
     onMomentumScrollEnd,
+    onScrollBeginDrag,
 
     animatedStyle,
     backdropStyle,

package/src/utils.ts

@@ -48,3 +48,56 @@ export const createBoundsConstraint =
       translateY: Math.max(-maxTranslateY, Math.min(maxTranslateY, translateY)),
     };
   };
+
+export const createLoopData = <T>(dataRef: React.RefObject<T[]>, enableLoop: boolean): T[] => {
+  const data = dataRef.current;
+
+  if (!enableLoop || !data?.length || data.length <= 1) {
+    return data;
+  }
+
+  const lastItem = data[data.length - 1];
+  const firstItem = data[0];
+
+  if (lastItem === undefined || firstItem === undefined) {
+    return data;
+  }
+
+  return [lastItem, ...data, firstItem];
+};
+
+export const getLoopAdjustedIndex = (
+  scrollIndex: number,
+  originalDataLength: number,
+  enableLoop: boolean,
+): { realIndex: number; needsJump: boolean; jumpToIndex?: number } => {
+  if (!enableLoop || originalDataLength <= 1) {
+    return { realIndex: scrollIndex, needsJump: false };
+  }
+
+  if (scrollIndex === 0) {
+    return {
+      realIndex: originalDataLength - 1,
+      needsJump: true,
+      jumpToIndex: originalDataLength,
+    };
+  } else if (scrollIndex === originalDataLength + 1) {
+    return {
+      realIndex: 0,
+      needsJump: true,
+      jumpToIndex: 1,
+    };
+  }
+
+  return { realIndex: scrollIndex - 1, needsJump: false };
+};
+
+export const createScrollAction = (listRef: any, width: number) => ({
+  scrollTo: (index: number, animated: boolean) => {
+    if (listRef?.scrollToIndex) {
+      listRef.scrollToIndex({ index, animated });
+    } else if (listRef?.scrollTo) {
+      listRef.scrollTo({ x: index * width, animated });
+    }
+  },
+});