react-native-gesture-image-viewer 2.4.0 → 3.0.0-beta.0

package/src/useWebClickHandler.web.ts

@@ -0,0 +1,146 @@
+import { useMemo } from 'react';
+import type { SharedValue } from 'react-native-reanimated';
+
+import type { ScheduleWebSingleTap } from './useWebSingleTapTimer';
+import { applyTapZoomAtPoint } from './utils/tapZoom';
+
+export type WebTapTarget<ItemT> = {
+  index: number;
+  item: ItemT;
+};
+
+export type WebClickEvent = {
+  clientX: number;
+  clientY: number;
+  currentTarget: {
+    getBoundingClientRect: () => {
+      left: number;
+      top: number;
+    };
+  };
+  detail: number;
+};
+
+export type WebClickHandler = (event: WebClickEvent) => void;
+
+export type EmitSingleTap<ItemT> = (x: number, y: number, tapTarget?: WebTapTarget<ItemT>) => void;
+
+export type WebClickHandlerConfig<ItemT> = {
+  clearPendingWebSingleTap: () => void;
+  emitSingleTap: EmitSingleTap<ItemT>;
+  enableDoubleTapZoom: boolean;
+  getCurrentTapTarget: () => WebTapTarget<ItemT> | null;
+  height: number;
+  isInteractionLocked: () => boolean;
+  maxZoomScale: number;
+  scale: SharedValue<number>;
+  scheduleWebSingleTap: ScheduleWebSingleTap;
+  translateX: SharedValue<number>;
+  translateY: SharedValue<number>;
+  width: number;
+};
+
+export function createWebClickHandler<ItemT>({
+  clearPendingWebSingleTap,
+  emitSingleTap,
+  enableDoubleTapZoom,
+  getCurrentTapTarget,
+  height,
+  isInteractionLocked,
+  maxZoomScale,
+  scale,
+  scheduleWebSingleTap,
+  translateX,
+  translateY,
+  width,
+}: WebClickHandlerConfig<ItemT>): WebClickHandler {
+  return (event) => {
+    const rect = event.currentTarget.getBoundingClientRect();
+    const x = event.clientX - rect.left;
+    const y = event.clientY - rect.top;
+
+    if (isInteractionLocked()) {
+      clearPendingWebSingleTap();
+      return;
+    }
+
+    const tapTarget = getCurrentTapTarget();
+
+    if (!tapTarget) {
+      return;
+    }
+
+    if (!enableDoubleTapZoom) {
+      emitSingleTap(x, y, tapTarget);
+      return;
+    }
+
+    if (event.detail === 2) {
+      clearPendingWebSingleTap();
+      applyTapZoomAtPoint({
+        x,
+        y,
+        width,
+        height,
+        maxZoomScale,
+        scale,
+        translateX,
+        translateY,
+      });
+      return;
+    }
+
+    if (event.detail === 1) {
+      scheduleWebSingleTap(() => {
+        emitSingleTap(x, y, tapTarget);
+      });
+    }
+  };
+}
+
+export function useWebClickHandler<ItemT>({
+  clearPendingWebSingleTap,
+  emitSingleTap,
+  enableDoubleTapZoom,
+  getCurrentTapTarget,
+  height,
+  isInteractionLocked,
+  maxZoomScale,
+  scale,
+  scheduleWebSingleTap,
+  translateX,
+  translateY,
+  width,
+}: WebClickHandlerConfig<ItemT>): WebClickHandler {
+  return useMemo(
+    () =>
+      createWebClickHandler({
+        clearPendingWebSingleTap,
+        emitSingleTap,
+        enableDoubleTapZoom,
+        getCurrentTapTarget,
+        height,
+        isInteractionLocked,
+        maxZoomScale,
+        scale,
+        scheduleWebSingleTap,
+        translateX,
+        translateY,
+        width,
+      }),
+    [
+      clearPendingWebSingleTap,
+      emitSingleTap,
+      enableDoubleTapZoom,
+      getCurrentTapTarget,
+      height,
+      isInteractionLocked,
+      maxZoomScale,
+      scale,
+      scheduleWebSingleTap,
+      translateX,
+      translateY,
+      width,
+    ],
+  );
+}

package/src/useWebSingleTapTimer.ts

@@ -0,0 +1,10 @@
+import { useCallback } from 'react';
+
+export type ScheduleWebSingleTap = (callback: () => void, delay?: number) => void;
+
+export function useWebSingleTapTimer() {
+  const clearPendingWebSingleTap = useCallback(() => {}, []);
+  const scheduleWebSingleTap = useCallback<ScheduleWebSingleTap>(() => {}, []);
+
+  return { clearPendingWebSingleTap, scheduleWebSingleTap };
+}

package/src/useWebSingleTapTimer.web.ts

@@ -0,0 +1,30 @@
+import { useCallback, useEffect, useRef } from 'react';
+
+export type ScheduleWebSingleTap = (callback: () => void, delay?: number) => void;
+
+export function useWebSingleTapTimer() {
+  const webSingleTapTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+
+  const clearPendingWebSingleTap = useCallback(() => {
+    if (webSingleTapTimerRef.current) {
+      clearTimeout(webSingleTapTimerRef.current);
+      webSingleTapTimerRef.current = null;
+    }
+  }, []);
+
+  const scheduleWebSingleTap = useCallback<ScheduleWebSingleTap>(
+    (callback, delay = 250) => {
+      clearPendingWebSingleTap();
+
+      webSingleTapTimerRef.current = setTimeout(() => {
+        callback();
+        webSingleTapTimerRef.current = null;
+      }, delay);
+    },
+    [clearPendingWebSingleTap],
+  );
+
+  useEffect(() => clearPendingWebSingleTap, [clearPendingWebSingleTap]);
+
+  return { clearPendingWebSingleTap, scheduleWebSingleTap };
+}

package/src/utils/index.ts

@@ -1,52 +1,3 @@
-import {
-  FlatList as RNFlatList,
-  ScrollView as RNScrollView,
-  type PlatformOSType,
-} from 'react-native';
-import {
-  FlatList as GestureFlatList,
-  ScrollView as GestureScrollView,
-} from 'react-native-gesture-handler';
-
-import type { FlatListComponent, ScrollViewComponent } from '../types';
-
-import { FlashList } from './FlashList';
-
-export const isScrollViewLike = (
-  component: React.ComponentType<any>,
-): component is ScrollViewComponent =>
-  component === RNScrollView || component === GestureScrollView;
-
-export const isFlatListLike = (
-  component: React.ComponentType<any>,
-): component is FlatListComponent<any> => {
-  if (component === RNFlatList || component === GestureFlatList || isFlashListLike(component)) {
-    return true;
-  }
-
-  return false;
-};
-
-export const isFlashListLike = (component: React.ComponentType<any>): boolean => {
-  if (FlashList && component === FlashList) {
-    return true;
-  }
-
-  return component?.displayName === 'FlashList' || component?.name === 'FlashList';
-};
-
-/**
- * iOS needs the extra Native gesture wrapper so the dismiss pan can resolve before the scrollable claims touches.
- * We intentionally skip Android because the same require-to-fail relation regressed horizontal paging there,
- * and we also avoid wrapping RNGH-provided scrollables to prevent double-applying Gesture.Native() to components that already participate in RNGH.
- */
-export const shouldUseNativeScrollGesture = (
-  platformOS: PlatformOSType,
-  component: React.ComponentType<any>,
-): boolean => {
-  return platformOS === 'ios' && component !== GestureScrollView && component !== GestureFlatList;
-};
-
 export const createBoundsConstraint =
   ({ width, height }: { width: number; height: number }) =>
   ({
@@ -75,56 +26,3 @@ 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.at(-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 { needsJump: false, realIndex: scrollIndex };
-  }
-
-  if (scrollIndex === 0) {
-    return {
-      jumpToIndex: originalDataLength,
-      needsJump: true,
-      realIndex: originalDataLength - 1,
-    };
-  } else if (scrollIndex === originalDataLength + 1) {
-    return {
-      jumpToIndex: 1,
-      needsJump: true,
-      realIndex: 0,
-    };
-  }
-
-  return { needsJump: false, realIndex: scrollIndex - 1 };
-};
-
-export const createScrollAction = (listRef: any, width: number) => ({
-  scrollTo: (index: number, animated: boolean) => {
-    if (listRef?.scrollToIndex) {
-      listRef.scrollToIndex({ animated, index });
-    } else if (listRef?.scrollTo) {
-      listRef.scrollTo({ animated, x: index * width });
-    }
-  },
-});

package/src/utils/tapZoom.ts

@@ -35,10 +35,11 @@ export const applyTapZoomAtPoint = ({
     // NOTE 확대로 밀려난 거리만큼 반대로 이동해서 탭 지점을 제자리에 유지
     translateX.set(withTiming(-centerX * (nextScale - 1), timingConfig));
     translateY.set(withTiming(-centerY * (nextScale - 1), timingConfig));
-  } else {
-    translateX.set(withTiming(0, timingConfig));
-    translateY.set(withTiming(0, timingConfig));
+    scale.set(withTiming(nextScale, timingConfig));
+    return;
   }
 
+  translateX.set(withTiming(0, timingConfig));
+  translateY.set(withTiming(0, timingConfig));
   scale.set(withTiming(nextScale, timingConfig));
 };

package/lib/module/WebPagingFixStyle.js

@@ -1,25 +0,0 @@
-"use strict";
-
-import { Platform } from 'react-native';
-import { isFlashListLike, isFlatListLike } from "./utils/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-function WebPagingFixStyle({
-  Component
-}) {
-  if (Platform.OS !== 'web') {
-    return null;
-  }
-  if (isFlashListLike(Component)) {
-    return /*#__PURE__*/_jsx("style", {
-      children: `[data-flash-list-paging-enabled-fix] > div {height: 100%;}`
-    });
-  }
-  if (isFlatListLike(Component)) {
-    return /*#__PURE__*/_jsx("style", {
-      children: `[data-flat-list-paging-enabled-fix] > div > div > div {height: 100%;}`
-    });
-  }
-  return null;
-}
-export default WebPagingFixStyle;
-//# sourceMappingURL=WebPagingFixStyle.js.map

package/lib/module/WebPagingFixStyle.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["Platform","isFlashListLike","isFlatListLike","jsx","_jsx","WebPagingFixStyle","Component","OS","children"],"sourceRoot":"../../src","sources":["WebPagingFixStyle.tsx"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;AAEvC,SAASC,eAAe,EAAEC,cAAc,QAAQ,kBAAS;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAM1D,SAASC,iBAAiBA,CAAC;EAAEC;AAAkC,CAAC,EAAE;EAChE,IAAIN,QAAQ,CAACO,EAAE,KAAK,KAAK,EAAE;IACzB,OAAO,IAAI;EACb;EAEA,IAAIN,eAAe,CAACK,SAAS,CAAC,EAAE;IAC9B,oBAAOF,IAAA;MAAAI,QAAA,EAAQ;IAA4D,CAAQ,CAAC;EACtF;EAEA,IAAIN,cAAc,CAACI,SAAS,CAAC,EAAE;IAC7B,oBAAOF,IAAA;MAAAI,QAAA,EAAQ;IAAuE,CAAQ,CAAC;EACjG;EAEA,OAAO,IAAI;AACb;AAEA,eAAeH,iBAAiB","ignoreList":[]}

package/lib/module/scheduleInitialScroll.js

@@ -1,21 +0,0 @@
-"use strict";
-
-export const INITIAL_SCROLL_IDLE_TIMEOUT_MS = 100;
-export const scheduleInitialScroll = callback => {
-  const idleGlobal = globalThis;
-  const requestIdleCallback = idleGlobal.requestIdleCallback?.bind(idleGlobal);
-  const cancelIdleCallback = idleGlobal.cancelIdleCallback?.bind(idleGlobal);
-  if (requestIdleCallback && cancelIdleCallback) {
-    const idleCallbackId = requestIdleCallback(callback, {
-      timeout: INITIAL_SCROLL_IDLE_TIMEOUT_MS
-    });
-    return () => {
-      cancelIdleCallback(idleCallbackId);
-    };
-  }
-  const timeoutId = setTimeout(callback, 0);
-  return () => {
-    clearTimeout(timeoutId);
-  };
-};
-//# sourceMappingURL=scheduleInitialScroll.js.map

package/lib/module/scheduleInitialScroll.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["INITIAL_SCROLL_IDLE_TIMEOUT_MS","scheduleInitialScroll","callback","idleGlobal","globalThis","requestIdleCallback","bind","cancelIdleCallback","idleCallbackId","timeout","timeoutId","setTimeout","clearTimeout"],"sourceRoot":"../../src","sources":["scheduleInitialScroll.ts"],"mappings":";;AAAA,OAAO,MAAMA,8BAA8B,GAAG,GAAG;AAejD,OAAO,MAAMC,qBAAqB,GAAIC,QAAoB,IAAmB;EAC3E,MAAMC,UAAU,GAAGC,UAAiC;EACpD,MAAMC,mBAAmB,GAAGF,UAAU,CAACE,mBAAmB,EAAEC,IAAI,CAACH,UAAU,CAAC;EAC5E,MAAMI,kBAAkB,GAAGJ,UAAU,CAACI,kBAAkB,EAAED,IAAI,CAACH,UAAU,CAAC;EAE1E,IAAIE,mBAAmB,IAAIE,kBAAkB,EAAE;IAC7C,MAAMC,cAAc,GAAGH,mBAAmB,CAACH,QAAQ,EAAE;MACnDO,OAAO,EAAET;IACX,CAAC,CAAC;IAEF,OAAO,MAAM;MACXO,kBAAkB,CAACC,cAAc,CAAC;IACpC,CAAC;EACH;EAEA,MAAME,SAAS,GAAGC,UAAU,CAACT,QAAQ,EAAE,CAAC,CAAC;EAEzC,OAAO,MAAM;IACXU,YAAY,CAACF,SAAS,CAAC;EACzB,CAAC;AACH,CAAC","ignoreList":[]}

package/lib/module/useGestureViewerPaging.types.js

@@ -1,4 +0,0 @@
-"use strict";
-
-export {};
-//# sourceMappingURL=useGestureViewerPaging.types.js.map

package/lib/module/useGestureViewerPaging.types.js.map

@@ -1 +0,0 @@
-{"version":3,"names":[],"sourceRoot":"../../src","sources":["useGestureViewerPaging.types.ts"],"mappings":"","ignoreList":[]}

package/lib/module/useGestureViewerPaging.web.js

@@ -1,291 +0,0 @@
-"use strict";
-
-import { useCallback, useEffect, useRef, useState } from 'react';
-import { applyTapZoomAtPoint } from "./utils/tapZoom.js";
-import { getWebAutoPlayTargetPhysicalIndex, getWebScrollPhysicalIndex, resolveWebScrollFinalState } from "./utils/webScroll.js";
-export function useGestureViewerPaging({
-  adjustedInitialIndex,
-  autoPlay,
-  autoPlayInterval,
-  currentIndex,
-  dataLength,
-  enableDoubleTapZoom,
-  enableHorizontalSwipe,
-  enableLoop,
-  height,
-  onSingleTap,
-  isRotated,
-  isZoomed,
-  itemSpacing,
-  manager,
-  maxZoomScale,
-  scale,
-  scrollTo,
-  syncCurrentIndex,
-  syncPendingIndex,
-  translateX,
-  translateY,
-  width
-}) {
-  const [activeListIndex, setActiveListIndex] = useState(adjustedInitialIndex);
-  const activeResetItemSpacing = adjustedInitialIndex > 0 ? itemSpacing : 0;
-  const activeResetWidth = adjustedInitialIndex > 0 ? width : 0;
-  const webSingleTapTimerRef = useRef(null);
-  const webScrollRuntimeRef = useRef({
-    actor: 'idle',
-    isAutoplayPausedByUser: false,
-    lastSettledPhysicalIndex: adjustedInitialIndex,
-    latestOffsetX: adjustedInitialIndex * (width + itemSpacing),
-    latestRawPhysicalIndex: adjustedInitialIndex,
-    lastProgrammaticScrollVersion: 0,
-    settleTimer: null,
-    resumeAutoplayTimer: null
-  });
-  const clearWebSingleTapTimer = useCallback(() => {
-    if (webSingleTapTimerRef.current) {
-      clearTimeout(webSingleTapTimerRef.current);
-      webSingleTapTimerRef.current = null;
-    }
-  }, []);
-  const clearWebSettleTimer = useCallback(() => {
-    const runtime = webScrollRuntimeRef.current;
-    if (runtime.settleTimer) {
-      clearTimeout(runtime.settleTimer);
-      runtime.settleTimer = null;
-    }
-  }, []);
-  const clearWebAutoplayResumeTimer = useCallback(() => {
-    const runtime = webScrollRuntimeRef.current;
-    if (runtime.resumeAutoplayTimer) {
-      clearTimeout(runtime.resumeAutoplayTimer);
-      runtime.resumeAutoplayTimer = null;
-    }
-  }, []);
-  const scheduleWebAutoplayResume = useCallback(() => {
-    const runtime = webScrollRuntimeRef.current;
-    clearWebAutoplayResumeTimer();
-    runtime.resumeAutoplayTimer = setTimeout(() => {
-      runtime.isAutoplayPausedByUser = false;
-      runtime.resumeAutoplayTimer = null;
-    }, 800);
-  }, [clearWebAutoplayResumeTimer]);
-  const pauseWebAutoplayWithoutPagingInteraction = useCallback(() => {
-    const runtime = webScrollRuntimeRef.current;
-    runtime.isAutoplayPausedByUser = true;
-    runtime.actor = 'idle';
-    clearWebAutoplayResumeTimer();
-  }, [clearWebAutoplayResumeTimer]);
-  const beginWebUserInteraction = useCallback((force = false) => {
-    const runtime = webScrollRuntimeRef.current;
-    if (!force && runtime.actor === 'autoplay') {
-      return;
-    }
-    runtime.actor = 'user';
-    runtime.isAutoplayPausedByUser = true;
-    clearWebAutoplayResumeTimer();
-  }, [clearWebAutoplayResumeTimer]);
-  const beginWebAutoplayScroll = useCallback(() => {
-    const runtime = webScrollRuntimeRef.current;
-    runtime.actor = 'autoplay';
-    runtime.isAutoplayPausedByUser = false;
-    runtime.lastProgrammaticScrollVersion = manager?.getProgrammaticScrollVersion() ?? 0;
-    clearWebAutoplayResumeTimer();
-  }, [clearWebAutoplayResumeTimer, manager]);
-  const syncProgrammaticActorFromManager = useCallback(() => {
-    const runtime = webScrollRuntimeRef.current;
-    const nextVersion = manager?.getProgrammaticScrollVersion() ?? 0;
-    if (nextVersion === runtime.lastProgrammaticScrollVersion) {
-      return;
-    }
-    runtime.actor = 'autoplay';
-    runtime.isAutoplayPausedByUser = false;
-    runtime.lastProgrammaticScrollVersion = nextVersion;
-    clearWebAutoplayResumeTimer();
-  }, [clearWebAutoplayResumeTimer, manager]);
-  const finalizeWebScroll = useCallback((offsetX, source = 'scroll') => {
-    if (!enableHorizontalSwipe || dataLength <= 0) {
-      return;
-    }
-    const runtime = webScrollRuntimeRef.current;
-    const settledByActor = runtime.actor;
-    clearWebSettleTimer();
-    runtime.latestOffsetX = offsetX;
-    const settledState = resolveWebScrollFinalState({
-      dataLength,
-      enableLoop,
-      lastSettledPhysicalIndex: runtime.lastSettledPhysicalIndex,
-      offsetX,
-      pageWidth: width + itemSpacing
-    });
-    if (!settledState) {
-      return;
-    }
-    const {
-      logicalIndex,
-      rawPhysicalIndex,
-      settledPhysicalIndex
-    } = settledState;
-    if (source === 'scroll' && runtime.latestRawPhysicalIndex !== rawPhysicalIndex) {
-      return;
-    }
-    if (rawPhysicalIndex !== settledPhysicalIndex) {
-      const crossedLoopBoundary = enableLoop && dataLength > 1 && (rawPhysicalIndex === 0 || rawPhysicalIndex === dataLength + 1);
-      scrollTo(settledPhysicalIndex, !crossedLoopBoundary);
-    }
-    runtime.lastSettledPhysicalIndex = settledPhysicalIndex;
-    runtime.latestOffsetX = settledPhysicalIndex * (width + itemSpacing);
-    runtime.actor = 'idle';
-    manager?.cancelPendingLoopTransition();
-    setActiveListIndex(settledPhysicalIndex);
-    syncCurrentIndex(logicalIndex);
-    if (settledByActor === 'user') {
-      scheduleWebAutoplayResume();
-    }
-  }, [clearWebSettleTimer, dataLength, enableHorizontalSwipe, enableLoop, itemSpacing, manager, scheduleWebAutoplayResume, scrollTo, syncCurrentIndex, width]);
-  const scheduleWebScrollSettle = useCallback(offsetX => {
-    const runtime = webScrollRuntimeRef.current;
-    runtime.latestOffsetX = offsetX;
-    runtime.latestRawPhysicalIndex = getWebScrollPhysicalIndex(offsetX, width + itemSpacing);
-    clearWebSettleTimer();
-    runtime.settleTimer = setTimeout(() => {
-      finalizeWebScroll(runtime.latestOffsetX, 'scroll');
-    }, 180);
-  }, [clearWebSettleTimer, finalizeWebScroll, itemSpacing, width]);
-  useEffect(() => {
-    const runtime = webScrollRuntimeRef.current;
-    runtime.actor = 'idle';
-    runtime.isAutoplayPausedByUser = false;
-    runtime.lastSettledPhysicalIndex = adjustedInitialIndex;
-    runtime.latestOffsetX = adjustedInitialIndex * (activeResetWidth + activeResetItemSpacing);
-    runtime.latestRawPhysicalIndex = adjustedInitialIndex;
-    runtime.lastProgrammaticScrollVersion = manager?.getProgrammaticScrollVersion() ?? 0;
-    setActiveListIndex(adjustedInitialIndex);
-    clearWebSettleTimer();
-    clearWebAutoplayResumeTimer();
-  }, [activeResetItemSpacing, activeResetWidth, adjustedInitialIndex, clearWebAutoplayResumeTimer, clearWebSettleTimer, dataLength, manager]);
-  useEffect(() => {
-    const runtime = webScrollRuntimeRef.current;
-    runtime.actor = 'idle';
-    runtime.isAutoplayPausedByUser = false;
-    runtime.latestOffsetX = runtime.lastSettledPhysicalIndex * (width + itemSpacing);
-    runtime.latestRawPhysicalIndex = runtime.lastSettledPhysicalIndex;
-    runtime.lastProgrammaticScrollVersion = manager?.getProgrammaticScrollVersion() ?? 0;
-    clearWebSettleTimer();
-    clearWebAutoplayResumeTimer();
-  }, [clearWebAutoplayResumeTimer, clearWebSettleTimer, itemSpacing, manager, width]);
-  useEffect(() => {
-    return () => {
-      clearWebSingleTapTimer();
-      clearWebSettleTimer();
-      clearWebAutoplayResumeTimer();
-    };
-  }, [clearWebAutoplayResumeTimer, clearWebSettleTimer, clearWebSingleTapTimer]);
-  useEffect(() => {
-    if (!autoPlay || dataLength <= 1 || isZoomed || isRotated || !enableLoop && currentIndex === dataLength - 1) {
-      return;
-    }
-    const intervalMs = Math.max(250, Math.floor(autoPlayInterval || 0));
-    if (!Number.isFinite(intervalMs)) {
-      return;
-    }
-    const interval = setInterval(() => {
-      if (isZoomed || isRotated) {
-        return;
-      }
-      const runtime = webScrollRuntimeRef.current;
-      if (runtime.actor !== 'idle' || runtime.isAutoplayPausedByUser || runtime.settleTimer) {
-        return;
-      }
-      const targetPhysicalIndex = getWebAutoPlayTargetPhysicalIndex({
-        currentIndex,
-        dataLength,
-        enableLoop
-      });
-      if (targetPhysicalIndex === null) {
-        return;
-      }
-      beginWebAutoplayScroll();
-      runtime.latestOffsetX = targetPhysicalIndex * (width + itemSpacing);
-      scrollTo(targetPhysicalIndex, true);
-      scheduleWebScrollSettle(runtime.latestOffsetX);
-    }, intervalMs);
-    return () => clearInterval(interval);
-  }, [autoPlay, autoPlayInterval, beginWebAutoplayScroll, currentIndex, dataLength, enableLoop, isRotated, isZoomed, itemSpacing, scheduleWebScrollSettle, scrollTo, width]);
-  const onScroll = useCallback(event => {
-    if (!enableHorizontalSwipe) {
-      return;
-    }
-    const offsetX = event.nativeEvent.contentOffset.x;
-    const runtime = webScrollRuntimeRef.current;
-    const pendingState = resolveWebScrollFinalState({
-      dataLength,
-      enableLoop,
-      lastSettledPhysicalIndex: runtime.lastSettledPhysicalIndex,
-      offsetX,
-      pageWidth: width + itemSpacing
-    });
-    if (pendingState) {
-      syncPendingIndex(pendingState.logicalIndex);
-    }
-    syncProgrammaticActorFromManager();
-    beginWebUserInteraction();
-    scheduleWebScrollSettle(offsetX);
-  }, [beginWebUserInteraction, dataLength, enableHorizontalSwipe, enableLoop, itemSpacing, scheduleWebScrollSettle, syncPendingIndex, syncProgrammaticActorFromManager, width]);
-  const onMomentumScrollEnd = useCallback(event => {
-    if (!enableHorizontalSwipe) {
-      return;
-    }
-    finalizeWebScroll(event.nativeEvent.contentOffset.x, 'momentum');
-  }, [enableHorizontalSwipe, finalizeWebScroll]);
-  const onScrollBeginDrag = useCallback(() => {
-    beginWebUserInteraction(true);
-    clearWebSettleTimer();
-    manager?.handleScrollBeginDrag();
-  }, [beginWebUserInteraction, clearWebSettleTimer, manager]);
-  const onWebClick = useCallback(event => {
-    const detail = event.detail;
-    const rect = event.currentTarget.getBoundingClientRect();
-    const resolvedX = event.clientX - rect.left;
-    const resolvedY = event.clientY - rect.top;
-    if (!enableDoubleTapZoom) {
-      if (!onSingleTap) {
-        return;
-      }
-      clearWebSingleTapTimer();
-      onSingleTap(resolvedX, resolvedY);
-      return;
-    }
-    if (detail === 2) {
-      clearWebSingleTapTimer();
-      pauseWebAutoplayWithoutPagingInteraction();
-      scheduleWebAutoplayResume();
-      applyTapZoomAtPoint({
-        x: resolvedX,
-        y: resolvedY,
-        width,
-        height,
-        maxZoomScale,
-        scale,
-        translateX,
-        translateY
-      });
-      return;
-    }
-    if (detail !== 1 || !onSingleTap) {
-      return;
-    }
-    clearWebSingleTapTimer();
-    webSingleTapTimerRef.current = setTimeout(() => {
-      onSingleTap(resolvedX, resolvedY);
-      webSingleTapTimerRef.current = null;
-    }, 250);
-  }, [clearWebSingleTapTimer, enableDoubleTapZoom, height, maxZoomScale, onSingleTap, pauseWebAutoplayWithoutPagingInteraction, scale, scheduleWebAutoplayResume, translateX, translateY, width]);
-  return {
-    activeListIndex,
-    onMomentumScrollEnd,
-    onScroll,
-    onScrollBeginDrag,
-    onWebClick
-  };
-}
-//# sourceMappingURL=useGestureViewerPaging.web.js.map