@papyrus-sdk/ui-react-native 0.2.11 → 0.2.12

package/dist/index.mjs

@@ -1,7 +1,22 @@
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __commonJS = (cb, mod) => function __require() {
-  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
-};
+import {
+  DEFAULT_PINCH_ZOOM_BOUNDS,
+  resolveAnchoredViewportOffset,
+  resolveClampedScrollOffset,
+  resolvePinchGestureZoom,
+  resolvePinchPreviewScale,
+  sanitizePinchPreviewScale,
+  shouldSuppressPressAfterPinch
+} from "./chunk-PE5U4ZWV.mjs";
+import {
+  getSelectionEdgeAutoscroll,
+  getToolDockDismissState,
+  isToolDockToolSelected,
+  shouldEnableSelectionDrag,
+  shouldEnableViewerScroll
+} from "./chunk-GCVUTXFR.mjs";
+import {
+  __commonJS
+} from "./chunk-ZD7AOCMD.mjs";
 
 // runtime/index.html
 var require_runtime = __commonJS({
@@ -21004,6 +21019,7 @@ import {
   View as View3,
   useWindowDimensions as useWindowDimensions2
 } from "react-native";
+import { Gesture as Gesture2, GestureDetector as GestureDetector2 } from "react-native-gesture-handler";
 import { useViewerStore as useViewerStore3 } from "@papyrus-sdk/core";
 
 // components/PageRenderer.tsx
@@ -21025,6 +21041,7 @@ import {
   findNodeHandle,
   useWindowDimensions
 } from "react-native";
+import { Gesture, GestureDetector } from "react-native-gesture-handler";
 import Svg, { Path as SvgPath } from "react-native-svg";
 import { useViewerStore } from "@papyrus-sdk/core";
 import {
@@ -21275,6 +21292,9 @@ var buildSquigglyPath = (segments = 16) => {
   return path;
 };
 var SQUIGGLY_PATH = buildSquigglyPath();
+var SELECTION_EDGE_THRESHOLD_PX = 48;
+var SELECTION_EDGE_MAX_STEP_PX = 24;
+var SELECTION_AUTOSCROLL_INTERVAL_MS = 16;
 var PageRenderer = ({
   engine,
   pageIndex,
@@ -21282,26 +21302,37 @@ var PageRenderer = ({
   PageViewComponent = PapyrusPageView,
   availableWidth,
   horizontalPadding = 16,
-  spacing = 24
+  spacing = 24,
+  onSelectionDragActiveChange,
+  gestureScrollLockActive = false,
+  lastPinchEndedAt = null,
+  onHorizontalScrollOffsetChange,
+  horizontalScrollRestore = null,
+  requestSelectionVerticalAutoscroll
 }) => {
   const viewRef = useRef(null);
+  const pageScrollRef = useRef(null);
   const [layout, setLayout] = useState({ width: 0, height: 0 });
   const [pageSize, setPageSize] = useState(null);
   const { width: windowWidth } = useWindowDimensions();
   const isNative = Platform.OS === "android" || Platform.OS === "ios";
   const perfEnabled = isMobilePerfEnabled();
   const renderCountRef = useRef(0);
-  const setStateBurstRef = useRef(
-    createBurstMonitor("PageRenderer", "setDocumentState", 18, 700)
-  );
+  const inkDrawingActiveRef = useRef(false);
+  const horizontalScrollOffsetRef = useRef(0);
+  const selectionDragActiveRef = useRef(false);
+  const selectionDragPointRef = useRef(null);
+  const lastAppliedHorizontalRestoreRef = useRef(null);
+  const selectionAutoscrollIntervalRef = useRef(null);
+  const rawTouchMoveLoggedAtRef = useRef(0);
   const zoom = useViewerStore((state) => state.zoom);
   const rotation = useViewerStore((state) => state.rotation);
   const pageTheme = useViewerStore((state) => state.pageTheme);
   const annotations = useViewerStore((state) => state.annotations);
   const annotationColor = useViewerStore((state) => state.annotationColor);
   const addAnnotation = useViewerStore((state) => state.addAnnotation);
-  const setDocumentState = useViewerStore((state) => state.setDocumentState);
   const activeTool = useViewerStore((state) => state.activeTool);
+  const interactionMode = useViewerStore((state) => state.interactionMode);
   const accentColor = useViewerStore((state) => state.accentColor);
   const selectedAnnotationId = useViewerStore(
     (state) => state.selectedAnnotationId
@@ -21315,19 +21346,6 @@ var PageRenderer = ({
   const setSelectionActive = useViewerStore(
     (state) => state.setSelectionActive
   );
-  const setDocumentStateTracked = useCallback(
-    (state, reason) => {
-      if (perfEnabled) {
-        setStateBurstRef.current({
-          reason,
-          page: pageIndex + 1,
-          keys: Object.keys(state).join(",")
-        });
-      }
-      setDocumentState(state);
-    },
-    [pageIndex, perfEnabled, setDocumentState]
-  );
   const logSelectionPerf = useCallback(
     (event, payload) => {
       if (!perfEnabled) return;
@@ -21338,6 +21356,56 @@ var PageRenderer = ({
     },
     [pageIndex, perfEnabled]
   );
+  const logGestureDebug = useCallback(
+    (event, payload) => {
+      if (!perfEnabled || !isNative) return;
+      logPerfEvent("PageRenderer", `gesture.${event}`, {
+        page: pageIndex + 1,
+        activeTool,
+        interactionMode,
+        pinchActive: gestureScrollLockActive,
+        gestureLockActive: gestureScrollLockActive,
+        selectionEnabled: Platform.OS === "web" || isNative && shouldEnableSelectionDrag({
+          activeTool,
+          interactionMode
+        }),
+        zoom: Math.round(zoom * 100) / 100,
+        ...payload
+      });
+    },
+    [activeTool, interactionMode, isNative, pageIndex, perfEnabled, zoom]
+  );
+  const logRawTouchDebug = useCallback(
+    (phase, event) => {
+      if (!perfEnabled || !isNative) return;
+      const touches = Array.isArray(event?.nativeEvent?.touches) ? event.nativeEvent.touches.length : 0;
+      const changedTouches = Array.isArray(event?.nativeEvent?.changedTouches) ? event.nativeEvent.changedTouches.length : 0;
+      if (phase === "move") {
+        if (touches < 2 && !gestureScrollLockActive) return;
+        const now = Date.now();
+        if (now - rawTouchMoveLoggedAtRef.current < 120) return;
+        rawTouchMoveLoggedAtRef.current = now;
+      }
+      logGestureDebug(`touch.${phase}`, {
+        touches,
+        changedTouches,
+        target: event?.nativeEvent?.target ?? null,
+        locationX: Math.round((event?.nativeEvent?.locationX ?? 0) * 100) / 100,
+        locationY: Math.round((event?.nativeEvent?.locationY ?? 0) * 100) / 100,
+        pageX: Math.round((event?.nativeEvent?.pageX ?? 0) * 100) / 100,
+        pageY: Math.round((event?.nativeEvent?.pageY ?? 0) * 100) / 100
+      });
+    },
+    [isNative, logGestureDebug, perfEnabled]
+  );
+  const setSelectionDragState = useCallback(
+    (active) => {
+      if (selectionDragActiveRef.current === active) return;
+      selectionDragActiveRef.current = active;
+      onSelectionDragActiveChange?.(active);
+    },
+    [onSelectionDragActiveChange]
+  );
   const pageAnnotations = useMemo(
     () => annotations.filter((ann) => ann.pageIndex === pageIndex),
     [annotations, pageIndex]
@@ -21366,12 +21434,6 @@ var PageRenderer = ({
   const selectionRectRef = useRef(null);
   const selectionBoundsRef = useRef(null);
   const selectionBoundsStart = useRef(null);
-  const lastTapRef = useRef(
-    null
-  );
-  const pinchRef = useRef(null);
-  const isPinchingRef = useRef(false);
-  const pinchLogZoomRef = useRef(zoom);
   const [isInkDrawing, setIsInkDrawing] = useState(false);
   const [inkPoints, setInkPoints] = useState(
     []
@@ -21494,11 +21556,30 @@ var PageRenderer = ({
   }, [inkPoints]);
   useEffect(() => {
     if (activeTool === "ink") return;
+    inkDrawingActiveRef.current = false;
     setIsInkDrawing(false);
     setInkPoints([]);
     inkPointsRef.current = [];
   }, [activeTool]);
-  const clearSelection = () => {
+  const pageViewportWidth = Math.max(
+    0,
+    (availableWidth ?? windowWidth) - horizontalPadding * 2
+  );
+  const selectionEnabled = Platform.OS === "web" || isNative && shouldEnableSelectionDrag({
+    activeTool,
+    interactionMode
+  });
+  const inkEnabled = isNative && activeTool === "ink";
+  const stopSelectionAutoscroll = useCallback(() => {
+    if (selectionAutoscrollIntervalRef.current) {
+      clearInterval(selectionAutoscrollIntervalRef.current);
+      selectionAutoscrollIntervalRef.current = null;
+    }
+  }, []);
+  const clearSelection = useCallback(() => {
+    stopSelectionAutoscroll();
+    selectionDragPointRef.current = null;
+    setSelectionDragState(false);
     setSelectionRect(null);
     selectionRectRef.current = null;
     setSelectionRects([]);
@@ -21508,13 +21589,19 @@ var PageRenderer = ({
     setIsSelecting(false);
     selectionStart.current = null;
     selectionBoundsStart.current = null;
-    lastTapRef.current = null;
     setSelectionActive(false);
-  };
+  }, [setSelectionActive, setSelectionDragState, stopSelectionAutoscroll]);
   useEffect(() => {
     if (activeTool === "select") return;
     clearSelection();
   }, [activeTool]);
+  useEffect(
+    () => () => {
+      stopSelectionAutoscroll();
+      setSelectionDragState(false);
+    },
+    [setSelectionDragState, stopSelectionAutoscroll]
+  );
   const stopPressPropagation = (event) => {
     event.stopPropagation?.();
   };
@@ -21591,50 +21678,193 @@ var PageRenderer = ({
     };
     await selectFromBounds(bounds);
   };
-  const getTouchDistance = (touches) => {
-    if (touches.length < 2) return 0;
-    const [a, b] = touches;
-    return Math.hypot(b.pageX - a.pageX, b.pageY - a.pageY);
-  };
-  const shouldHandlePinch = (touches) => isNative && touches.length === 2;
-  const handlePinchStart = (touches) => {
-    if (!shouldHandlePinch(touches)) return;
-    const distance = getTouchDistance(touches);
-    pinchRef.current = { distance, zoom };
-    pinchLogZoomRef.current = zoom;
-    logSelectionPerf("pinch.start", {
-      tool: activeTool,
-      distance: Math.round(distance * 100) / 100,
-      zoom: Math.round(zoom * 100) / 100
+  const cancelSelectionDrag = useCallback(() => {
+    stopSelectionAutoscroll();
+    selectionDragPointRef.current = null;
+    setSelectionDragState(false);
+    setIsSelecting(false);
+    selectionStart.current = null;
+    selectionRectRef.current = null;
+    setSelectionRect(null);
+  }, [setSelectionDragState, stopSelectionAutoscroll]);
+  const updateSelectionRectFromPoint = useCallback(
+    (x, y) => {
+      const start = selectionStart.current;
+      if (!start || !layout.width || !layout.height) return;
+      const left = Math.max(0, Math.min(start.x, x));
+      const top = Math.max(0, Math.min(start.y, y));
+      const right = Math.min(layout.width, Math.max(start.x, x));
+      const bottom = Math.min(layout.height, Math.max(start.y, y));
+      const rect = {
+        x: left,
+        y: top,
+        width: right - left,
+        height: bottom - top
+      };
+      selectionRectRef.current = rect;
+      setSelectionRect(rect);
+    },
+    [layout.height, layout.width]
+  );
+  const applySelectionEdgeAutoscroll = useCallback(() => {
+    const point = selectionDragPointRef.current;
+    if (!point || !selectionStart.current || !layout.width || !layout.height) {
+      stopSelectionAutoscroll();
+      return;
+    }
+    const visibleX = point.x - horizontalScrollOffsetRef.current;
+    const { dx } = getSelectionEdgeAutoscroll({
+      x: visibleX,
+      y: SELECTION_EDGE_THRESHOLD_PX,
+      width: pageViewportWidth,
+      height: SELECTION_EDGE_THRESHOLD_PX * 2,
+      threshold: SELECTION_EDGE_THRESHOLD_PX,
+      maxStep: SELECTION_EDGE_MAX_STEP_PX
     });
-  };
-  const handlePinchMove = (touches) => {
-    if (!shouldHandlePinch(touches) || !pinchRef.current) return;
-    const distance = getTouchDistance(touches);
-    if (!distance) return;
-    const scale2 = distance / pinchRef.current.distance;
-    const nextZoom = clamp(pinchRef.current.zoom * scale2, 0.5, 4);
-    setDocumentStateTracked({ zoom: nextZoom }, "pinchMove");
-    engine.setZoom(nextZoom);
-    if (Math.abs(nextZoom - pinchLogZoomRef.current) >= 0.12) {
-      pinchLogZoomRef.current = nextZoom;
-      logSelectionPerf("pinch.move", {
-        tool: activeTool,
-        distance: Math.round(distance * 100) / 100,
-        zoom: Math.round(nextZoom * 100) / 100
-      });
+    let appliedDx = 0;
+    if (dx !== 0 && pageViewportWidth > 0) {
+      const maxOffsetX = Math.max(0, layout.width - pageViewportWidth);
+      const nextOffsetX = clamp(
+        horizontalScrollOffsetRef.current + dx,
+        0,
+        maxOffsetX
+      );
+      appliedDx = nextOffsetX - horizontalScrollOffsetRef.current;
+      if (appliedDx !== 0) {
+        horizontalScrollOffsetRef.current = nextOffsetX;
+        pageScrollRef.current?.scrollTo({ x: nextOffsetX, animated: false });
+      }
     }
-  };
-  const handlePinchEnd = () => {
-    if (isPinchingRef.current || pinchRef.current) {
-      logSelectionPerf("pinch.end", {
-        tool: activeTool,
-        zoom: Math.round(zoom * 100) / 100
-      });
+    const appliedDy = requestSelectionVerticalAutoscroll?.(point.absoluteY) ?? 0;
+    if (appliedDx === 0 && appliedDy === 0) {
+      stopSelectionAutoscroll();
+      return;
     }
-    pinchRef.current = null;
-  };
+    const nextX = clamp(point.x + appliedDx, 0, layout.width);
+    const nextY = clamp(point.y + appliedDy, 0, layout.height);
+    selectionDragPointRef.current = {
+      absoluteY: point.absoluteY,
+      x: nextX,
+      y: nextY
+    };
+    updateSelectionRectFromPoint(nextX, nextY);
+  }, [
+    layout.height,
+    layout.width,
+    pageViewportWidth,
+    requestSelectionVerticalAutoscroll,
+    stopSelectionAutoscroll,
+    updateSelectionRectFromPoint
+  ]);
+  const ensureSelectionAutoscroll = useCallback(() => {
+    if (selectionAutoscrollIntervalRef.current) return;
+    selectionAutoscrollIntervalRef.current = setInterval(
+      applySelectionEdgeAutoscroll,
+      SELECTION_AUTOSCROLL_INTERVAL_MS
+    );
+  }, [applySelectionEdgeAutoscroll]);
+  const beginSelectionDrag = useCallback(
+    (x, y, absoluteY) => {
+      if (!selectionEnabled || !layout.width || !layout.height || selectionRects.length > 0 || selectionBounds) {
+        return;
+      }
+      const start = {
+        x: clamp(x, 0, layout.width),
+        y: clamp(y, 0, layout.height)
+      };
+      selectionStart.current = start;
+      selectionDragPointRef.current = { absoluteY, ...start };
+      setSelectionDragState(true);
+      setIsSelecting(true);
+      const rect = { x: start.x, y: start.y, width: 0, height: 0 };
+      selectionRectRef.current = rect;
+      setSelectionRect(rect);
+    },
+    [
+      layout.height,
+      layout.width,
+      selectionBounds,
+      selectionEnabled,
+      selectionRects.length,
+      setSelectionDragState
+    ]
+  );
+  const updateSelectionDrag = useCallback(
+    (x, y, absoluteY) => {
+      if (!selectionEnabled || !selectionStart.current) return;
+      const nextX = clamp(x, 0, layout.width);
+      const nextY = clamp(y, 0, layout.height);
+      selectionDragPointRef.current = {
+        absoluteY,
+        x: nextX,
+        y: nextY
+      };
+      updateSelectionRectFromPoint(nextX, nextY);
+      ensureSelectionAutoscroll();
+    },
+    [
+      ensureSelectionAutoscroll,
+      layout.height,
+      layout.width,
+      selectionEnabled,
+      updateSelectionRectFromPoint
+    ]
+  );
+  const finishSelectionDrag = useCallback(async () => {
+    stopSelectionAutoscroll();
+    selectionDragPointRef.current = null;
+    setSelectionDragState(false);
+    const rect = selectionRectRef.current;
+    if (!selectionEnabled || !rect || !layout.width || !layout.height) {
+      setIsSelecting(false);
+      selectionStart.current = null;
+      return;
+    }
+    setIsSelecting(false);
+    selectionStart.current = null;
+    const minSize = 6;
+    if (rect.width < minSize || rect.height < minSize) {
+      clearSelection();
+      return;
+    }
+    const normalized = {
+      x: rect.x / layout.width,
+      y: rect.y / layout.height,
+      width: rect.width / layout.width,
+      height: rect.height / layout.height
+    };
+    await selectFromBounds(normalized);
+    setSelectionRect(null);
+  }, [
+    clearSelection,
+    layout.height,
+    layout.width,
+    selectionEnabled,
+    setSelectionDragState,
+    stopSelectionAutoscroll
+  ]);
+  const handleDoubleTap = useCallback(
+    (x, y) => {
+      if (shouldSuppressPressAfterPinch(lastPinchEndedAt)) {
+        return;
+      }
+      if (!isNative || activeTool !== "select" || selectionRects.length > 0 || selectionBounds) {
+        return;
+      }
+      void selectAtPoint(x, y);
+    },
+    [
+      activeTool,
+      isNative,
+      lastPinchEndedAt,
+      selectionBounds,
+      selectionRects.length
+    ]
+  );
   const handlePress = (event) => {
+    if (shouldSuppressPressAfterPinch(lastPinchEndedAt)) {
+      return;
+    }
     if (!layout.width || !layout.height) return;
     const { locationX, locationY } = event.nativeEvent;
     if (selectionRects.length > 0 || selectionBounds) {
@@ -21655,20 +21885,7 @@ var PageRenderer = ({
       return;
     }
     setSelectedAnnotation(null);
-    if (!isNative || activeTool === "ink") return;
-    const now = Date.now();
-    const lastTap = lastTapRef.current;
-    lastTapRef.current = { time: now, x: locationX, y: locationY };
-    if (!lastTap) return;
-    const timeDelta = now - lastTap.time;
-    const distance = Math.hypot(locationX - lastTap.x, locationY - lastTap.y);
-    if (timeDelta < 280 && distance < 24 && activeTool === "select") {
-      void selectAtPoint(locationX, locationY);
-    }
   };
-  const selectionEnabled = Platform.OS === "web" || isNative && (activeTool === "select" || TEXT_MARKUP_TOOLS.has(activeTool));
-  const inkEnabled = isNative && activeTool === "ink";
-  const pinchEnabled = isNative;
   const toNormalizedPoint = (x, y) => {
     if (!layout.width || !layout.height) return null;
     return {
@@ -21680,6 +21897,7 @@ var PageRenderer = ({
     const point = toNormalizedPoint(x, y);
     if (!point) return;
     clearSelection();
+    inkDrawingActiveRef.current = true;
     setIsInkDrawing(true);
     setInkPoints([point]);
     inkPointsRef.current = [point];
@@ -21698,6 +21916,7 @@ var PageRenderer = ({
   const finishInkDrawing = () => {
     const points = inkPointsRef.current;
     if (points.length === 0) return;
+    inkDrawingActiveRef.current = false;
     setIsInkDrawing(false);
     setInkPoints([]);
     inkPointsRef.current = [];
@@ -21720,31 +21939,18 @@ var PageRenderer = ({
   const panResponder = useMemo(
     () => PanResponder.create({
       onStartShouldSetPanResponder: (event) => {
+        if (isNative) return false;
         const touches = event.nativeEvent.touches ?? [];
-        return pinchEnabled && shouldHandlePinch(touches) || selectionEnabled || inkEnabled;
+        if (touches.length !== 1) return false;
+        return inkEnabled;
       },
       onMoveShouldSetPanResponder: (event) => {
+        if (isNative) return false;
         const touches = event.nativeEvent.touches ?? [];
-        return pinchEnabled && shouldHandlePinch(touches) || selectionEnabled || inkEnabled;
-      },
-      onStartShouldSetPanResponderCapture: (event) => {
-        const touches = event.nativeEvent.touches ?? [];
-        return pinchEnabled && shouldHandlePinch(touches);
-      },
-      onMoveShouldSetPanResponderCapture: (event) => {
-        const touches = event.nativeEvent.touches ?? [];
-        return pinchEnabled && shouldHandlePinch(touches);
+        if (touches.length !== 1) return false;
+        return selectionEnabled || inkEnabled;
       },
       onPanResponderGrant: (event) => {
-        const touches = event.nativeEvent.touches ?? [];
-        if (pinchEnabled && shouldHandlePinch(touches)) {
-          isPinchingRef.current = true;
-          setIsSelecting(false);
-          selectionStart.current = null;
-          handlePinchStart(touches);
-          return;
-        }
-        isPinchingRef.current = false;
         if (inkEnabled) {
           beginInkDrawing(
             event.nativeEvent.locationX,
@@ -21752,26 +21958,13 @@ var PageRenderer = ({
           );
           return;
         }
-        if (!selectionEnabled || !layout.width || !layout.height) return;
-        const { locationX, locationY } = event.nativeEvent;
-        selectionStart.current = { x: locationX, y: locationY };
-        setIsSelecting(true);
-        const rect = { x: locationX, y: locationY, width: 0, height: 0 };
-        selectionRectRef.current = rect;
-        setSelectionRect(rect);
+        beginSelectionDrag(
+          event.nativeEvent.locationX,
+          event.nativeEvent.locationY,
+          event.nativeEvent.pageY ?? event.nativeEvent.locationY
+        );
       },
-      onPanResponderMove: (event, gestureState) => {
-        const touches = event.nativeEvent.touches ?? [];
-        if (pinchEnabled && (shouldHandlePinch(touches) || isPinchingRef.current)) {
-          if (shouldHandlePinch(touches)) {
-            if (!isPinchingRef.current) {
-              isPinchingRef.current = true;
-              handlePinchStart(touches);
-            }
-            handlePinchMove(touches);
-          }
-          return;
-        }
+      onPanResponderMove: (event) => {
         if (inkEnabled) {
           pushInkPoint(
             event.nativeEvent.locationX,
@@ -21779,79 +21972,90 @@ var PageRenderer = ({
           );
           return;
         }
-        if (!selectionEnabled || !selectionStart.current) return;
-        const start = selectionStart.current;
-        const currentX = start.x + gestureState.dx;
-        const currentY = start.y + gestureState.dy;
-        const left = Math.max(0, Math.min(start.x, currentX));
-        const top = Math.max(0, Math.min(start.y, currentY));
-        const right = Math.min(layout.width, Math.max(start.x, currentX));
-        const bottom = Math.min(layout.height, Math.max(start.y, currentY));
-        const rect = {
-          x: left,
-          y: top,
-          width: right - left,
-          height: bottom - top
-        };
-        selectionRectRef.current = rect;
-        setSelectionRect(rect);
+        updateSelectionDrag(
+          event.nativeEvent.locationX,
+          event.nativeEvent.locationY,
+          event.nativeEvent.pageY ?? event.nativeEvent.locationY
+        );
       },
       onPanResponderRelease: async () => {
-        if (isPinchingRef.current) {
-          isPinchingRef.current = false;
-          handlePinchEnd();
-          return;
-        }
         if (inkEnabled) {
           finishInkDrawing();
           return;
         }
-        const rect = selectionRectRef.current;
-        if (!selectionEnabled || !rect || !layout.width || !layout.height) {
-          setIsSelecting(false);
-          selectionStart.current = null;
-          return;
-        }
-        setIsSelecting(false);
-        selectionStart.current = null;
-        const minSize = 6;
-        if (rect.width < minSize || rect.height < minSize) {
-          clearSelection();
-          return;
-        }
-        const normalized = {
-          x: rect.x / layout.width,
-          y: rect.y / layout.height,
-          width: rect.width / layout.width,
-          height: rect.height / layout.height
-        };
-        await selectFromBounds(normalized);
-        setSelectionRect(null);
+        await finishSelectionDrag();
       },
       onPanResponderTerminate: () => {
-        if (isPinchingRef.current) {
-          isPinchingRef.current = false;
-          handlePinchEnd();
-          return;
-        }
         if (inkEnabled) {
           finishInkDrawing();
           return;
         }
-        setIsSelecting(false);
-        selectionStart.current = null;
+        cancelSelectionDrag();
       }
     }),
     [
-      selectionEnabled,
+      beginSelectionDrag,
+      cancelSelectionDrag,
+      finishSelectionDrag,
+      isNative,
       inkEnabled,
-      pinchEnabled,
-      layout.width,
-      layout.height,
-      annotationColor,
-      zoom
+      beginInkDrawing,
+      finishInkDrawing,
+      pushInkPoint,
+      selectionEnabled,
+      updateSelectionDrag
+    ]
+  );
+  const selectionGesture = useMemo(
+    () => Gesture.Pan().enabled(
+      isNative && selectionEnabled && selectionRects.length === 0 && !selectionBounds
+    ).maxPointers(1).minDistance(4).runOnJS(true).onStart((event) => {
+      beginSelectionDrag(event.x, event.y, event.absoluteY);
+    }).onUpdate((event) => {
+      updateSelectionDrag(event.x, event.y, event.absoluteY);
+    }).onEnd(() => {
+      void finishSelectionDrag();
+    }).onFinalize(() => {
+      if (selectionDragActiveRef.current) {
+        cancelSelectionDrag();
+      }
+    }),
+    [
+      beginSelectionDrag,
+      cancelSelectionDrag,
+      finishSelectionDrag,
+      isNative,
+      selectionBounds,
+      selectionEnabled,
+      selectionRects.length,
+      updateSelectionDrag
     ]
   );
+  const inkGesture = useMemo(
+    () => Gesture.Pan().enabled(isNative && inkEnabled).maxPointers(1).minDistance(0).runOnJS(true).onStart((event) => {
+      beginInkDrawing(event.x, event.y);
+    }).onUpdate((event) => {
+      pushInkPoint(event.x, event.y);
+    }).onEnd(() => {
+      finishInkDrawing();
+    }).onFinalize(() => {
+      if (inkDrawingActiveRef.current) {
+        finishInkDrawing();
+      }
+    }),
+    [beginInkDrawing, finishInkDrawing, inkEnabled, isNative, pushInkPoint]
+  );
+  const doubleTapGesture = useMemo(
+    () => Gesture.Tap().enabled(isNative && activeTool === "select").numberOfTaps(2).maxDistance(24).maxDelay(280).maxDuration(250).runOnJS(true).onEnd((event, success) => {
+      if (!success) return;
+      handleDoubleTap(event.x, event.y);
+    }),
+    [activeTool, handleDoubleTap, isNative]
+  );
+  const contentGesture = useMemo(
+    () => Gesture.Simultaneous(selectionGesture, inkGesture, doubleTapGesture),
+    [doubleTapGesture, inkGesture, selectionGesture]
+  );
   const selectionBoundsPx = useMemo(() => {
     if (!selectionBounds || !layout.width || !layout.height) return null;
     return {
@@ -21959,29 +22163,83 @@ var PageRenderer = ({
   const pageWidth = isNative ? baseWidth * zoom : baseWidth;
   const pageHeight = pageWidth / aspectRatio;
   const hasActiveSelection = selectionRects.length > 0 || !!selectionBounds || isSelecting;
-  const scrollEnabled = isNative && zoom > 1 && !hasActiveSelection && !isInkDrawing;
+  const scrollEnabled = isNative && zoom > 1 && !hasActiveSelection && !isInkDrawing && !gestureScrollLockActive;
+  useEffect(() => {
+    if (!horizontalScrollRestore) return;
+    if (lastAppliedHorizontalRestoreRef.current === horizontalScrollRestore.requestId) {
+      return;
+    }
+    const nextOffsetX = resolveClampedScrollOffset(
+      horizontalScrollRestore.offsetX,
+      pageWidth,
+      pageViewportWidth
+    );
+    lastAppliedHorizontalRestoreRef.current = horizontalScrollRestore.requestId;
+    horizontalScrollOffsetRef.current = nextOffsetX;
+    pageScrollRef.current?.scrollTo({ x: nextOffsetX, animated: false });
+    onHorizontalScrollOffsetChange?.(pageIndex, nextOffsetX);
+  }, [
+    horizontalScrollRestore,
+    onHorizontalScrollOffsetChange,
+    pageIndex,
+    pageViewportWidth,
+    pageWidth
+  ]);
   return /* @__PURE__ */ jsx(
     ScrollView,
     {
+      ref: pageScrollRef,
       horizontal: true,
       scrollEnabled,
       showsHorizontalScrollIndicator: false,
+      onScroll: (event) => {
+        const nextOffsetX = event.nativeEvent.contentOffset?.x ?? 0;
+        horizontalScrollOffsetRef.current = nextOffsetX;
+      },
+      onScrollEndDrag: () => {
+        onHorizontalScrollOffsetChange?.(
+          pageIndex,
+          horizontalScrollOffsetRef.current
+        );
+      },
+      onMomentumScrollEnd: () => {
+        onHorizontalScrollOffsetChange?.(
+          pageIndex,
+          horizontalScrollOffsetRef.current
+        );
+      },
+      scrollEventThrottle: 16,
       contentContainerStyle: [
         styles.scrollContent,
         { paddingHorizontal: horizontalPadding }
       ],
-      children: /* @__PURE__ */ jsxs(
+      children: /* @__PURE__ */ jsx(GestureDetector, { gesture: contentGesture, children: /* @__PURE__ */ jsxs(
         Pressable,
         {
           ...panResponder.panHandlers,
           style: [
             styles.container,
-            { width: pageWidth, height: pageHeight, marginBottom: spacing }
+            {
+              width: pageWidth,
+              height: pageHeight,
+              marginBottom: spacing
+            }
           ],
           onLayout: handleLayout,
+          onTouchStart: (event) => logRawTouchDebug("start", event),
+          onTouchMove: (event) => logRawTouchDebug("move", event),
+          onTouchEnd: (event) => logRawTouchDebug("end", event),
+          onTouchCancel: (event) => logRawTouchDebug("cancel", event),
           onPress: handlePress,
           children: [
-            /* @__PURE__ */ jsx(PageViewComponent, { ref: viewRef, style: styles.page }),
+            /* @__PURE__ */ jsx(
+              PageViewComponent,
+              {
+                ref: viewRef,
+                pointerEvents: "none",
+                style: styles.page
+              }
+            ),
             /* @__PURE__ */ jsx(
               View,
               {
@@ -22118,7 +22376,9 @@ var PageRenderer = ({
               const isSelected = selectedAnnotationId === ann.id;
               const isText = ann.type === "comment" || ann.type === "text";
               const isInk = ann.type === "ink" && Array.isArray(ann.path) && ann.path.length > 1;
-              const isMarkup = TEXT_MARKUP_TOOLS.has(ann.type);
+              const isMarkup = TEXT_MARKUP_TOOLS.has(
+                ann.type
+              );
               const rects = ann.rects && ann.rects.length > 0 ? ann.rects : [ann.rect];
               const hitTargetStyle = {
                 left: `${ann.rect.x * 100}%`,
@@ -22158,7 +22418,10 @@ var PageRenderer = ({
                           View,
                           {
                             pointerEvents: "none",
-                            style: [styles.annotationLineContainer, rectStyle],
+                            style: [
+                              styles.annotationLineContainer,
+                              rectStyle
+                            ],
                             children: /* @__PURE__ */ jsx(
                               View,
                               {
@@ -22177,7 +22440,10 @@ var PageRenderer = ({
                           View,
                           {
                             pointerEvents: "none",
-                            style: [styles.annotationLineContainer, rectStyle],
+                            style: [
+                              styles.annotationLineContainer,
+                              rectStyle
+                            ],
                             children: /* @__PURE__ */ jsx(
                               View,
                               {
@@ -22410,7 +22676,7 @@ var PageRenderer = ({
             ) : null
           ]
         }
-      )
+      ) })
     }
   );
 };
@@ -22637,7 +22903,7 @@ var styles = StyleSheet.create({
     borderRadius: 3
   }
 });
-var arePageRendererPropsEqual = (previous, next) => previous.engine === next.engine && previous.pageIndex === next.pageIndex && previous.scale === next.scale && previous.PageViewComponent === next.PageViewComponent && previous.availableWidth === next.availableWidth && previous.horizontalPadding === next.horizontalPadding && previous.spacing === next.spacing;
+var arePageRendererPropsEqual = (previous, next) => previous.engine === next.engine && previous.pageIndex === next.pageIndex && previous.scale === next.scale && previous.PageViewComponent === next.PageViewComponent && previous.availableWidth === next.availableWidth && previous.horizontalPadding === next.horizontalPadding && previous.spacing === next.spacing && previous.onSelectionDragActiveChange === next.onSelectionDragActiveChange && previous.gestureScrollLockActive === next.gestureScrollLockActive && previous.lastPinchEndedAt === next.lastPinchEndedAt && previous.onHorizontalScrollOffsetChange === next.onHorizontalScrollOffsetChange && previous.horizontalScrollRestore?.requestId === next.horizontalScrollRestore?.requestId && previous.horizontalScrollRestore?.offsetX === next.horizontalScrollRestore?.offsetX && previous.requestSelectionVerticalAutoscroll === next.requestSelectionVerticalAutoscroll;
 var PageRenderer_default = memo(PageRenderer, arePageRendererPropsEqual);
 
 // components/WebViewViewer.tsx
@@ -22789,6 +23055,8 @@ var MOBILE_CHROME_HIDE_DELTA = 28;
 var MOBILE_CHROME_SHOW_DELTA = 22;
 var MOBILE_CHROME_SHOW_DELAY_MS = 180;
 var MOBILE_CHROME_TOP_RESET = 16;
+var SELECTION_EDGE_THRESHOLD_PX2 = 48;
+var SELECTION_EDGE_MAX_STEP_PX2 = 24;
 var resolvePositiveInt = (value, fallback, min, max) => {
   if (typeof value !== "number" || !Number.isFinite(value)) return fallback;
   const rounded = Math.round(value);
@@ -22846,6 +23114,26 @@ var Viewer = ({
   const scrollDownAccumRef = useRef3(0);
   const scrollUpAccumRef = useRef3(0);
   const [layoutRevision, setLayoutRevision] = useState2(0);
+  const [selectionDragActive, setSelectionDragActive] = useState2(false);
+  const selectionDragActiveRef = useRef3(false);
+  const [gestureScrollLockActive, setGestureScrollLockActive] = useState2(false);
+  const gestureScrollLockActiveRef = useRef3(false);
+  const [pinchPreviewScale, setPinchPreviewScale] = useState2(1);
+  const [lastPinchEndedAt, setLastPinchEndedAt] = useState2(null);
+  const [horizontalScrollRestore, setHorizontalScrollRestore] = useState2(null);
+  const pinchGestureActiveRef = useRef3(false);
+  const pinchStartZoomRef = useRef3(1);
+  const pinchPreviewZoomRef = useRef3(1);
+  const pinchFocalPointRef = useRef3({ x: 0, y: 0 });
+  const pinchUpdateLoggedAtRef = useRef3(0);
+  const horizontalScrollOffsetsRef = useRef3(/* @__PURE__ */ new Map());
+  const pendingPinchAnchorRestoreRef = useRef3(
+    null
+  );
+  const pinchAnchorRestoreFrameRef = useRef3(null);
+  const nextHorizontalRestoreRequestIdRef = useRef3(0);
+  const viewerFrameRef = useRef3({ y: 0, height: 0 });
+  const viewerContentHeightRef = useRef3(0);
   const resolvedWindowSize = useMemo3(
     () => resolvePositiveInt(virtualWindowSize, FLATLIST_WINDOW_SIZE, 2, 30),
     [virtualWindowSize]
@@ -22944,6 +23232,9 @@ var Viewer = ({
       if (layoutRefreshTimeoutRef.current) {
         clearTimeout(layoutRefreshTimeoutRef.current);
       }
+      if (pinchAnchorRestoreFrameRef.current !== null) {
+        cancelAnimationFrame(pinchAnchorRestoreFrameRef.current);
+      }
       clearPendingScrollRetry();
       clearPendingChromeShow();
     },
@@ -23110,6 +23401,513 @@ var Viewer = ({
   const columnGap = 12;
   const horizontalPadding = 16;
   const columnWidth = isDouble ? (windowWidth - horizontalPadding * 2 - columnGap) / 2 : windowWidth;
+  const getPageWidthForZoom = useCallback2(
+    (pageIndex, zoomValue) => {
+      const safeZoom = Math.max(zoomValue, 0.25);
+      const baseWidth = isDouble ? columnWidth * 0.92 : windowWidth * 0.92;
+      return baseWidth * safeZoom;
+    },
+    [columnWidth, isDouble, windowWidth]
+  );
+  const getPageHeightForZoom = useCallback2(
+    (pageIndex, zoomValue) => getPageWidthForZoom(pageIndex, zoomValue) / getPageAspectRatio(pageIndex),
+    [getPageAspectRatio, getPageWidthForZoom]
+  );
+  const getPageViewportMetrics = useCallback2(
+    (pageIndex) => {
+      if (isDouble) {
+        const isRight = pageIndex % 2 === 1;
+        return {
+          viewportWidth: columnWidth,
+          horizontalPadding: 8,
+          viewportOffsetX: horizontalPadding + (isRight ? columnWidth + columnGap : 0)
+        };
+      }
+      return {
+        viewportWidth: windowWidth,
+        horizontalPadding: 16,
+        viewportOffsetX: 0
+      };
+    },
+    [columnGap, columnWidth, horizontalPadding, isDouble, windowWidth]
+  );
+  const getPageLayoutForZoom = useCallback2(
+    (pageIndex, zoomValue) => {
+      if (isSingle) {
+        const pageHeight = getPageHeightForZoom(pageIndex, zoomValue);
+        return {
+          pageOffsetY: 18,
+          pageHeight,
+          totalContentHeight: 18 + pageHeight + 140
+        };
+      }
+      if (isDouble) {
+        let offsetY2 = LIST_TOP_PADDING;
+        for (let rowIndex = 0; rowIndex < rows.length; rowIndex += 1) {
+          const row = rows[rowIndex];
+          const leftHeight = getPageHeightForZoom(row.left, zoomValue);
+          const rightHeight = row.right === null ? leftHeight : getPageHeightForZoom(row.right, zoomValue);
+          const rowLength = Math.max(leftHeight, rightHeight) + DOUBLE_PAGE_SPACING;
+          if (row.left === pageIndex || row.right === pageIndex) {
+            let totalContentHeight = LIST_TOP_PADDING;
+            for (let totalRowIndex = 0; totalRowIndex < rows.length; totalRowIndex += 1) {
+              const totalRow = rows[totalRowIndex];
+              const totalLeftHeight = getPageHeightForZoom(
+                totalRow.left,
+                zoomValue
+              );
+              const totalRightHeight = totalRow.right === null ? totalLeftHeight : getPageHeightForZoom(totalRow.right, zoomValue);
+              totalContentHeight += Math.max(totalLeftHeight, totalRightHeight) + DOUBLE_PAGE_SPACING;
+            }
+            totalContentHeight += LIST_BOTTOM_PADDING;
+            return {
+              pageOffsetY: offsetY2,
+              pageHeight: getPageHeightForZoom(pageIndex, zoomValue),
+              totalContentHeight
+            };
+          }
+          offsetY2 += rowLength;
+        }
+      }
+      let offsetY = LIST_TOP_PADDING;
+      for (let currentPageIndex = 0; currentPageIndex < pageCount; currentPageIndex += 1) {
+        const currentPageHeight = getPageHeightForZoom(
+          currentPageIndex,
+          zoomValue
+        );
+        if (currentPageIndex === pageIndex) {
+          let totalContentHeight = LIST_TOP_PADDING;
+          for (let totalPageIndex = 0; totalPageIndex < pageCount; totalPageIndex += 1) {
+            totalContentHeight += getPageHeightForZoom(totalPageIndex, zoomValue) + CONTINUOUS_PAGE_SPACING;
+          }
+          totalContentHeight += LIST_BOTTOM_PADDING;
+          return {
+            pageOffsetY: offsetY,
+            pageHeight: currentPageHeight,
+            totalContentHeight
+          };
+        }
+        offsetY += currentPageHeight + CONTINUOUS_PAGE_SPACING;
+      }
+      return {
+        pageOffsetY: LIST_TOP_PADDING,
+        pageHeight: getPageHeightForZoom(pageIndex, zoomValue),
+        totalContentHeight: LIST_TOP_PADDING + getPageHeightForZoom(pageIndex, zoomValue) + CONTINUOUS_PAGE_SPACING + LIST_BOTTOM_PADDING
+      };
+    },
+    [getPageHeightForZoom, isDouble, isSingle, pageCount, rows]
+  );
+  const resolvePinchAnchorPageIndex = useCallback2(
+    (focalX, focalY, zoomValue, scrollOffsetY = lastScrollOffsetYRef.current) => {
+      if (isSingle) {
+        return Math.max(0, currentPage - 1);
+      }
+      const contentY = Math.max(0, scrollOffsetY + focalY);
+      if (isDouble) {
+        let offsetY2 = LIST_TOP_PADDING;
+        for (let rowIndex = 0; rowIndex < rows.length; rowIndex += 1) {
+          const row = rows[rowIndex];
+          const leftHeight = getPageHeightForZoom(row.left, zoomValue);
+          const rightHeight = row.right === null ? leftHeight : getPageHeightForZoom(row.right, zoomValue);
+          const rowLength = Math.max(leftHeight, rightHeight) + DOUBLE_PAGE_SPACING;
+          if (contentY <= offsetY2 + rowLength || rowIndex === rows.length - 1) {
+            const isRight = row.right !== null && focalX > horizontalPadding + columnWidth + columnGap / 2;
+            return isRight ? row.right : row.left;
+          }
+          offsetY2 += rowLength;
+        }
+        return rows[rows.length - 1]?.left ?? 0;
+      }
+      let offsetY = LIST_TOP_PADDING;
+      for (let pageIndex = 0; pageIndex < pageCount; pageIndex += 1) {
+        const pageLength = getPageHeightForZoom(pageIndex, zoomValue) + CONTINUOUS_PAGE_SPACING;
+        if (contentY <= offsetY + pageLength || pageIndex === pageCount - 1) {
+          return pageIndex;
+        }
+        offsetY += pageLength;
+      }
+      return Math.max(0, pageCount - 1);
+    },
+    [
+      columnGap,
+      columnWidth,
+      currentPage,
+      getPageHeightForZoom,
+      horizontalPadding,
+      isDouble,
+      isSingle,
+      pageCount,
+      rows
+    ]
+  );
+  const resolvedViewerScrollEnabled = shouldEnableViewerScroll({
+    selectionDragActive,
+    gestureScrollLockActive
+  });
+  const setViewerScrollEnabledNative = useCallback2((enabled) => {
+    const scrollNode = listRef.current;
+    scrollNode?.setNativeProps?.({ scrollEnabled: enabled });
+  }, []);
+  const syncViewerScrollEnabled = useCallback2(
+    (nextSelectionDragActive = selectionDragActiveRef.current, nextGestureScrollLockActive = gestureScrollLockActiveRef.current) => {
+      setViewerScrollEnabledNative(
+        shouldEnableViewerScroll({
+          selectionDragActive: nextSelectionDragActive,
+          gestureScrollLockActive: nextGestureScrollLockActive
+        })
+      );
+    },
+    [setViewerScrollEnabledNative]
+  );
+  const handleGestureScrollLockChange = useCallback2(
+    (active) => {
+      if (gestureScrollLockActiveRef.current === active) return;
+      gestureScrollLockActiveRef.current = active;
+      setGestureScrollLockActive(active);
+      syncViewerScrollEnabled(selectionDragActiveRef.current, active);
+    },
+    [syncViewerScrollEnabled]
+  );
+  const handlePinchPreviewScaleChange = useCallback2((scale) => {
+    const nextScale = sanitizePinchPreviewScale(scale);
+    setPinchPreviewScale((current) => {
+      if (Math.abs(current - nextScale) < 5e-4) {
+        return current;
+      }
+      return nextScale;
+    });
+  }, []);
+  const resetViewerPinchPreview = useCallback2(() => {
+    pinchPreviewZoomRef.current = pinchStartZoomRef.current;
+    handlePinchPreviewScaleChange(1);
+  }, [handlePinchPreviewScaleChange]);
+  const beginViewerPinch = useCallback2(
+    (focalX, focalY) => {
+      pinchGestureActiveRef.current = true;
+      pinchStartZoomRef.current = zoom;
+      pinchPreviewZoomRef.current = zoom;
+      pinchFocalPointRef.current = { x: focalX, y: focalY };
+      pinchUpdateLoggedAtRef.current = 0;
+      setLastPinchEndedAt(null);
+      handlePinchPreviewScaleChange(1);
+      handleGestureScrollLockChange(true);
+      if (perfEnabled) {
+        logPerfEvent("Viewer", "pinch.start", {
+          zoom: Math.round(zoom * 100) / 100
+        });
+      }
+    },
+    [
+      handleGestureScrollLockChange,
+      handlePinchPreviewScaleChange,
+      perfEnabled,
+      zoom
+    ]
+  );
+  const updateViewerPinch = useCallback2(
+    (scaleFactor, focalX, focalY) => {
+      if (!pinchGestureActiveRef.current) return;
+      pinchFocalPointRef.current = { x: focalX, y: focalY };
+      const nextZoom = resolvePinchGestureZoom(
+        pinchStartZoomRef.current,
+        scaleFactor
+      );
+      pinchPreviewZoomRef.current = nextZoom;
+      handlePinchPreviewScaleChange(
+        resolvePinchPreviewScale(pinchStartZoomRef.current, nextZoom)
+      );
+      if (!perfEnabled) return;
+      const now = Date.now();
+      if (now - pinchUpdateLoggedAtRef.current < 120) return;
+      pinchUpdateLoggedAtRef.current = now;
+      logPerfEvent("Viewer", "pinch.update", {
+        scale: Math.round(scaleFactor * 1e3) / 1e3,
+        nextZoom: Math.round(nextZoom * 100) / 100
+      });
+    },
+    [handlePinchPreviewScaleChange, perfEnabled]
+  );
+  const finishViewerPinch = useCallback2(() => {
+    if (!pinchGestureActiveRef.current) return;
+    pinchGestureActiveRef.current = false;
+    const focalX = pinchFocalPointRef.current.x;
+    const focalY = pinchFocalPointRef.current.y;
+    const viewerScrollOffsetY = lastScrollOffsetYRef.current;
+    const finalZoom = resolvePinchGestureZoom(
+      pinchPreviewZoomRef.current || pinchStartZoomRef.current,
+      1,
+      DEFAULT_PINCH_ZOOM_BOUNDS
+    );
+    setLastPinchEndedAt(Date.now());
+    if (Math.abs(finalZoom - zoom) >= 1e-3) {
+      const anchorPageIndex = resolvePinchAnchorPageIndex(
+        focalX,
+        focalY,
+        zoom,
+        viewerScrollOffsetY
+      );
+      const { pageOffsetY: startPageOffsetY, pageHeight: startPageHeight } = getPageLayoutForZoom(anchorPageIndex, zoom);
+      const startPageWidth = getPageWidthForZoom(anchorPageIndex, zoom);
+      const {
+        viewportWidth: pageViewportWidth,
+        horizontalPadding: pageHorizontalPadding,
+        viewportOffsetX
+      } = getPageViewportMetrics(anchorPageIndex);
+      const pageViewportContentWidth = Math.max(
+        0,
+        pageViewportWidth - pageHorizontalPadding * 2
+      );
+      pendingPinchAnchorRestoreRef.current = {
+        finalZoom,
+        focalY,
+        viewerScrollOffsetY,
+        pageIndex: anchorPageIndex,
+        startPageOffsetY,
+        startPageHeight,
+        startPageWidth,
+        startPageScrollX: horizontalScrollOffsetsRef.current.get(anchorPageIndex) ?? 0,
+        pageViewportWidth,
+        pageHorizontalPadding,
+        pageViewportContentOffsetX: Math.max(
+          0,
+          Math.min(
+            pageViewportContentWidth,
+            focalX - viewportOffsetX - pageHorizontalPadding
+          )
+        )
+      };
+      setDocumentStateTracked({ zoom: finalZoom }, "pinch.viewerEnd");
+      engine.setZoom(finalZoom);
+    } else {
+      pendingPinchAnchorRestoreRef.current = null;
+    }
+    resetViewerPinchPreview();
+    handleGestureScrollLockChange(false);
+    if (perfEnabled) {
+      logPerfEvent("Viewer", "pinch.end", {
+        finalZoom: Math.round(finalZoom * 100) / 100,
+        page: pendingPinchAnchorRestoreRef.current?.pageIndex ?? null
+      });
+    }
+  }, [
+    engine,
+    getPageLayoutForZoom,
+    getPageViewportMetrics,
+    getPageWidthForZoom,
+    handleGestureScrollLockChange,
+    perfEnabled,
+    resetViewerPinchPreview,
+    resolvePinchAnchorPageIndex,
+    setDocumentStateTracked,
+    zoom
+  ]);
+  const handlePageHorizontalScrollOffsetChange = useCallback2(
+    (pageIndex, offsetX) => {
+      horizontalScrollOffsetsRef.current.set(pageIndex, Math.max(0, offsetX));
+      const pageWidth = getPageWidthForZoom(pageIndex, zoom);
+      const { viewportWidth, horizontalPadding: horizontalPadding2 } = getPageViewportMetrics(pageIndex);
+      const pageViewportWidth = Math.max(
+        0,
+        viewportWidth - horizontalPadding2 * 2
+      );
+      const nextOffsetX = resolveClampedScrollOffset(
+        offsetX,
+        pageWidth,
+        pageViewportWidth
+      );
+      setHorizontalScrollRestore((current) => {
+        if (current && Math.abs(current.offsetX - nextOffsetX) < 0.5) {
+          return current;
+        }
+        const requestId = nextHorizontalRestoreRequestIdRef.current + 1;
+        nextHorizontalRestoreRequestIdRef.current = requestId;
+        return {
+          pageIndex,
+          requestId,
+          offsetX: nextOffsetX
+        };
+      });
+    },
+    [getPageViewportMetrics, getPageWidthForZoom, zoom]
+  );
+  const viewerPinchGesture = useMemo3(
+    () => Gesture2.Pinch().enabled(!isWebView && pageCount > 0).onTouchesDown((event) => {
+      if ((event.allTouches?.length ?? 0) >= 2) {
+        handleGestureScrollLockChange(true);
+      }
+    }).onTouchesUp((event) => {
+      if ((event.allTouches?.length ?? 0) < 2 && !pinchGestureActiveRef.current) {
+        handleGestureScrollLockChange(false);
+      }
+    }).runOnJS(true).onStart((event) => {
+      beginViewerPinch(event.focalX, event.focalY);
+    }).onUpdate((event) => {
+      updateViewerPinch(event.scale, event.focalX, event.focalY);
+    }).onEnd(() => {
+      finishViewerPinch();
+    }).onFinalize(() => {
+      finishViewerPinch();
+      resetViewerPinchPreview();
+      handleGestureScrollLockChange(false);
+    }),
+    [
+      beginViewerPinch,
+      finishViewerPinch,
+      handleGestureScrollLockChange,
+      isWebView,
+      pageCount,
+      resetViewerPinchPreview,
+      updateViewerPinch
+    ]
+  );
+  useEffect3(() => {
+    selectionDragActiveRef.current = selectionDragActive;
+    syncViewerScrollEnabled(
+      selectionDragActive,
+      gestureScrollLockActiveRef.current
+    );
+  }, [selectionDragActive, syncViewerScrollEnabled]);
+  useEffect3(() => {
+    const pendingRestore = pendingPinchAnchorRestoreRef.current;
+    if (!pendingRestore) return;
+    if (Math.abs(pendingRestore.finalZoom - zoom) >= 1e-3) return;
+    if (pinchAnchorRestoreFrameRef.current !== null) {
+      cancelAnimationFrame(pinchAnchorRestoreFrameRef.current);
+    }
+    pinchAnchorRestoreFrameRef.current = requestAnimationFrame(() => {
+      pinchAnchorRestoreFrameRef.current = null;
+      const {
+        pageOffsetY: endPageOffsetY,
+        pageHeight: endPageHeight,
+        totalContentHeight: endContentHeight
+      } = getPageLayoutForZoom(pendingRestore.pageIndex, zoom);
+      const viewerViewportHeight = viewerFrameRef.current.height;
+      const nextScrollY = resolveAnchoredViewportOffset({
+        viewportOffset: pendingRestore.focalY,
+        startScrollOffset: pendingRestore.viewerScrollOffsetY,
+        startItemOffset: pendingRestore.startPageOffsetY,
+        startItemLength: pendingRestore.startPageHeight,
+        endItemOffset: endPageOffsetY,
+        endItemLength: endPageHeight,
+        viewportLength: viewerViewportHeight,
+        endContentLength: endContentHeight
+      });
+      if (isSingle) {
+        listRef.current?.scrollTo?.({
+          y: nextScrollY,
+          animated: false
+        });
+      } else {
+        listRef.current?.scrollToOffset({
+          offset: nextScrollY,
+          animated: false
+        });
+      }
+      lastScrollOffsetYRef.current = nextScrollY;
+      const endPageWidth = getPageWidthForZoom(pendingRestore.pageIndex, zoom);
+      const pageViewportContentWidth = Math.max(
+        0,
+        pendingRestore.pageViewportWidth - pendingRestore.pageHorizontalPadding * 2
+      );
+      const nextOffsetX = resolveAnchoredViewportOffset({
+        viewportOffset: pendingRestore.pageViewportContentOffsetX,
+        startScrollOffset: pendingRestore.startPageScrollX,
+        startItemOffset: 0,
+        startItemLength: pendingRestore.startPageWidth,
+        endItemOffset: 0,
+        endItemLength: endPageWidth,
+        viewportLength: pageViewportContentWidth,
+        endContentLength: endPageWidth
+      });
+      const requestId = nextHorizontalRestoreRequestIdRef.current + 1;
+      nextHorizontalRestoreRequestIdRef.current = requestId;
+      setHorizontalScrollRestore({
+        pageIndex: pendingRestore.pageIndex,
+        requestId,
+        offsetX: nextOffsetX
+      });
+      pendingPinchAnchorRestoreRef.current = null;
+      if (perfEnabled) {
+        logPerfEvent("Viewer", "pinch.anchorRestore", {
+          page: pendingRestore.pageIndex + 1,
+          scrollY: Math.round(nextScrollY * 100) / 100,
+          scrollX: Math.round(nextOffsetX * 100) / 100,
+          zoom: Math.round(zoom * 100) / 100
+        });
+      }
+    });
+    return () => {
+      if (pinchAnchorRestoreFrameRef.current !== null) {
+        cancelAnimationFrame(pinchAnchorRestoreFrameRef.current);
+        pinchAnchorRestoreFrameRef.current = null;
+      }
+    };
+  }, [getPageLayoutForZoom, getPageWidthForZoom, isSingle, perfEnabled, zoom]);
+  useEffect3(() => {
+    if (zoom > 1) return;
+    setHorizontalScrollRestore((current) => {
+      if (!current || Math.abs(current.offsetX) < 0.5) {
+        return current;
+      }
+      const requestId = nextHorizontalRestoreRequestIdRef.current + 1;
+      nextHorizontalRestoreRequestIdRef.current = requestId;
+      return {
+        pageIndex: current.pageIndex,
+        requestId,
+        offsetX: 0
+      };
+    });
+  }, [zoom]);
+  const captureViewerFrame = useCallback2((node) => {
+    const measurable = node;
+    measurable?.measureInWindow?.((_, y, __, height) => {
+      viewerFrameRef.current = { y, height };
+    });
+  }, []);
+  const scrollViewerBy = useCallback2(
+    (deltaY) => {
+      if (!Number.isFinite(deltaY) || deltaY === 0) return 0;
+      const viewportHeight = viewerFrameRef.current.height;
+      const maxOffset = Math.max(
+        0,
+        viewerContentHeightRef.current - viewportHeight
+      );
+      const nextOffset = Math.max(
+        0,
+        Math.min(maxOffset, lastScrollOffsetYRef.current + deltaY)
+      );
+      const appliedDelta = nextOffset - lastScrollOffsetYRef.current;
+      if (appliedDelta === 0) return 0;
+      lastScrollOffsetYRef.current = nextOffset;
+      if (isSingle) {
+        listRef.current?.scrollTo?.({
+          y: nextOffset,
+          animated: false
+        });
+        return appliedDelta;
+      }
+      listRef.current?.scrollToOffset({ offset: nextOffset, animated: false });
+      return appliedDelta;
+    },
+    [isSingle]
+  );
+  const handleSelectionVerticalAutoscroll = useCallback2(
+    (absoluteY) => {
+      const frame = viewerFrameRef.current;
+      if (!Number.isFinite(absoluteY) || frame.height <= 0) return 0;
+      const relativeY = absoluteY - frame.y;
+      const { dy } = getSelectionEdgeAutoscroll({
+        x: SELECTION_EDGE_THRESHOLD_PX2,
+        y: relativeY,
+        width: SELECTION_EDGE_THRESHOLD_PX2 * 2,
+        height: frame.height,
+        threshold: SELECTION_EDGE_THRESHOLD_PX2,
+        maxStep: SELECTION_EDGE_MAX_STEP_PX2
+      });
+      return scrollViewerBy(dy);
+    },
+    [scrollViewerBy]
+  );
   const listLayoutMetrics = useMemo3(() => {
     const offsets = [];
     const lengths = [];
@@ -23350,7 +24148,13 @@ var Viewer = ({
               pageIndex: row.left,
               availableWidth: columnWidth,
               horizontalPadding: 8,
-              spacing: DOUBLE_PAGE_SPACING
+              spacing: DOUBLE_PAGE_SPACING,
+              onSelectionDragActiveChange: setSelectionDragActive,
+              gestureScrollLockActive,
+              lastPinchEndedAt,
+              onHorizontalScrollOffsetChange: handlePageHorizontalScrollOffsetChange,
+              horizontalScrollRestore,
+              requestSelectionVerticalAutoscroll: handleSelectionVerticalAutoscroll
             }
           ) }),
           row.right !== null ? /* @__PURE__ */ jsx3(View3, { style: { width: columnWidth }, children: /* @__PURE__ */ jsx3(
@@ -23360,7 +24164,13 @@ var Viewer = ({
               pageIndex: row.right,
               availableWidth: columnWidth,
               horizontalPadding: 8,
-              spacing: DOUBLE_PAGE_SPACING
+              spacing: DOUBLE_PAGE_SPACING,
+              onSelectionDragActiveChange: setSelectionDragActive,
+              gestureScrollLockActive,
+              lastPinchEndedAt,
+              onHorizontalScrollOffsetChange: handlePageHorizontalScrollOffsetChange,
+              horizontalScrollRestore,
+              requestSelectionVerticalAutoscroll: handleSelectionVerticalAutoscroll
             }
           ) }) : /* @__PURE__ */ jsx3(View3, { style: { width: columnWidth } })
         ] });
@@ -23370,114 +24180,170 @@ var Viewer = ({
         {
           engine,
           pageIndex: item,
-          spacing: CONTINUOUS_PAGE_SPACING
+          spacing: CONTINUOUS_PAGE_SPACING,
+          onSelectionDragActiveChange: setSelectionDragActive,
+          gestureScrollLockActive,
+          lastPinchEndedAt,
+          onHorizontalScrollOffsetChange: handlePageHorizontalScrollOffsetChange,
+          horizontalScrollRestore,
+          requestSelectionVerticalAutoscroll: handleSelectionVerticalAutoscroll
         }
       );
     },
-    [columnWidth, engine, horizontalPadding, isDouble]
+    [
+      columnWidth,
+      engine,
+      handlePageHorizontalScrollOffsetChange,
+      handleSelectionVerticalAutoscroll,
+      gestureScrollLockActive,
+      horizontalScrollRestore,
+      horizontalPadding,
+      isDouble,
+      lastPinchEndedAt
+    ]
   );
   if (isWebView) {
     return /* @__PURE__ */ jsx3(View3, { style: [styles3.container, isDark && styles3.containerDark], children: /* @__PURE__ */ jsx3(WebViewViewer_default, { engine }) });
   }
   if (isSingle) {
-    return /* @__PURE__ */ jsx3(View3, { style: [styles3.container, isDark && styles3.containerDark], children: /* @__PURE__ */ jsx3(
-      ScrollView2,
+    return /* @__PURE__ */ jsx3(View3, { style: [styles3.container, isDark && styles3.containerDark], children: /* @__PURE__ */ jsx3(GestureDetector2, { gesture: viewerPinchGesture, children: /* @__PURE__ */ jsx3(
+      View3,
       {
-        contentContainerStyle: styles3.singleContent,
-        showsVerticalScrollIndicator: false,
-        scrollEnabled: true,
-        onScroll: (event) => handleViewerScroll(event, "single"),
-        onScrollBeginDrag: perfEnabled ? () => {
-          scrollMonitorRef.current.begin("single.beginDrag");
-        } : void 0,
-        onMomentumScrollBegin: perfEnabled ? () => {
-          scrollMonitorRef.current.begin("single.momentumBegin");
-        } : void 0,
-        onScrollEndDrag: perfEnabled ? () => {
-          scrollMonitorRef.current.end("single.endDrag");
-          sampleMemory("Viewer", "single.endDrag", { pageCount });
-        } : void 0,
-        onMomentumScrollEnd: perfEnabled ? () => {
-          scrollMonitorRef.current.end("single.momentumEnd");
-          sampleMemory("Viewer", "single.momentumEnd", { pageCount });
-        } : void 0,
-        scrollEventThrottle: 16,
+        style: [
+          styles3.gestureSurface,
+          { transform: [{ scale: pinchPreviewScale }] }
+        ],
         children: /* @__PURE__ */ jsx3(
-          PageRenderer_default,
+          ScrollView2,
           {
-            engine,
-            pageIndex: Math.max(0, currentPage - 1),
-            spacing: 32
+            ref: (node) => {
+              captureViewerFrame(node);
+              listRef.current = node;
+            },
+            contentContainerStyle: styles3.singleContent,
+            showsVerticalScrollIndicator: false,
+            scrollEnabled: resolvedViewerScrollEnabled,
+            onLayout: () => captureViewerFrame(listRef.current),
+            onContentSizeChange: (_, height) => {
+              viewerContentHeightRef.current = height;
+            },
+            onScroll: (event) => handleViewerScroll(event, "single"),
+            onScrollBeginDrag: perfEnabled ? () => {
+              scrollMonitorRef.current.begin("single.beginDrag");
+            } : void 0,
+            onMomentumScrollBegin: perfEnabled ? () => {
+              scrollMonitorRef.current.begin("single.momentumBegin");
+            } : void 0,
+            onScrollEndDrag: perfEnabled ? () => {
+              scrollMonitorRef.current.end("single.endDrag");
+              sampleMemory("Viewer", "single.endDrag", { pageCount });
+            } : void 0,
+            onMomentumScrollEnd: perfEnabled ? () => {
+              scrollMonitorRef.current.end("single.momentumEnd");
+              sampleMemory("Viewer", "single.momentumEnd", {
+                pageCount
+              });
+            } : void 0,
+            scrollEventThrottle: 16,
+            children: /* @__PURE__ */ jsx3(
+              PageRenderer_default,
+              {
+                engine,
+                pageIndex: Math.max(0, currentPage - 1),
+                spacing: 32,
+                onSelectionDragActiveChange: setSelectionDragActive,
+                gestureScrollLockActive,
+                lastPinchEndedAt,
+                onHorizontalScrollOffsetChange: handlePageHorizontalScrollOffsetChange,
+                horizontalScrollRestore,
+                requestSelectionVerticalAutoscroll: handleSelectionVerticalAutoscroll
+              }
+            )
           }
         )
       }
-    ) });
+    ) }) });
   }
-  return /* @__PURE__ */ jsx3(View3, { style: [styles3.container, isDark && styles3.containerDark], children: /* @__PURE__ */ jsx3(
-    FlatList,
+  return /* @__PURE__ */ jsx3(View3, { style: [styles3.container, isDark && styles3.containerDark], children: /* @__PURE__ */ jsx3(GestureDetector2, { gesture: viewerPinchGesture, children: /* @__PURE__ */ jsx3(
+    View3,
     {
-      ref: listRef,
-      data: isDouble ? rows : pages,
-      initialNumToRender: FLATLIST_INITIAL_NUM_TO_RENDER,
-      windowSize: resolvedWindowSize,
-      maxToRenderPerBatch: resolvedMaxToRenderPerBatch,
-      updateCellsBatchingPeriod: FLATLIST_UPDATE_CELLS_BATCHING_PERIOD,
-      removeClippedSubviews: resolvedRemoveClippedSubviews,
-      getItemLayout,
-      keyExtractor,
-      contentContainerStyle: styles3.listContent,
-      renderItem,
-      onViewableItemsChanged,
-      viewabilityConfig: { itemVisiblePercentThreshold: 60 },
-      scrollEnabled: true,
-      onScrollToIndexFailed: ({ index, averageItemLength }) => {
-        const dataLength = isDouble ? rows.length : pages.length;
-        if (index < 0 || index >= dataLength) return;
-        pendingScrollIndexRef.current = index;
-        const offset = Math.max(0, getFallbackOffsetForIndex(index));
-        listRef.current?.scrollToOffset({ offset, animated: false });
-        if (!isDouble) {
-          ensurePageDimensions(index);
-        } else {
-          const row = rows[index];
-          if (row) {
-            ensurePageDimensions(row.left);
-            if (row.right !== null) {
-              ensurePageDimensions(row.right);
+      style: [
+        styles3.gestureSurface,
+        { transform: [{ scale: pinchPreviewScale }] }
+      ],
+      children: /* @__PURE__ */ jsx3(
+        FlatList,
+        {
+          ref: listRef,
+          data: isDouble ? rows : pages,
+          initialNumToRender: FLATLIST_INITIAL_NUM_TO_RENDER,
+          windowSize: resolvedWindowSize,
+          maxToRenderPerBatch: resolvedMaxToRenderPerBatch,
+          updateCellsBatchingPeriod: FLATLIST_UPDATE_CELLS_BATCHING_PERIOD,
+          removeClippedSubviews: resolvedRemoveClippedSubviews,
+          getItemLayout,
+          keyExtractor,
+          contentContainerStyle: styles3.listContent,
+          renderItem,
+          onViewableItemsChanged,
+          viewabilityConfig: { itemVisiblePercentThreshold: 60 },
+          scrollEnabled: resolvedViewerScrollEnabled,
+          onLayout: () => captureViewerFrame(listRef.current),
+          onContentSizeChange: (_, height) => {
+            viewerContentHeightRef.current = height;
+          },
+          onScrollToIndexFailed: ({ index, averageItemLength }) => {
+            const dataLength = isDouble ? rows.length : pages.length;
+            if (index < 0 || index >= dataLength) return;
+            pendingScrollIndexRef.current = index;
+            const offset = Math.max(0, getFallbackOffsetForIndex(index));
+            listRef.current?.scrollToOffset({ offset, animated: false });
+            if (!isDouble) {
+              ensurePageDimensions(index);
+            } else {
+              const row = rows[index];
+              if (row) {
+                ensurePageDimensions(row.left);
+                if (row.right !== null) {
+                  ensurePageDimensions(row.right);
+                }
+              }
             }
-          }
-        }
-        scheduleScrollRetry("onScrollToIndexFailed");
-        if (perfEnabled) {
-          logPerfEvent("Viewer", "scrollToIndexFailed", {
-            index,
-            averageItemLength,
-            fallbackOffset: offset,
-            fallbackSource: "cached-item-layout",
-            itemCount: dataLength,
-            retryAttempt: pendingScrollAttemptsRef.current
-          });
+            scheduleScrollRetry("onScrollToIndexFailed");
+            if (perfEnabled) {
+              logPerfEvent("Viewer", "scrollToIndexFailed", {
+                index,
+                averageItemLength,
+                fallbackOffset: offset,
+                fallbackSource: "cached-item-layout",
+                itemCount: dataLength,
+                retryAttempt: pendingScrollAttemptsRef.current
+              });
+            }
+          },
+          onScroll: (event) => handleViewerScroll(event, "continuous"),
+          onScrollBeginDrag: perfEnabled ? () => {
+            scrollMonitorRef.current.begin("continuous.beginDrag");
+          } : void 0,
+          onMomentumScrollBegin: perfEnabled ? () => {
+            scrollMonitorRef.current.begin("continuous.momentumBegin");
+          } : void 0,
+          onScrollEndDrag: perfEnabled ? () => {
+            scrollMonitorRef.current.end("continuous.endDrag");
+            sampleMemory("Viewer", "continuous.endDrag", { pageCount });
+          } : void 0,
+          onMomentumScrollEnd: perfEnabled ? () => {
+            scrollMonitorRef.current.end("continuous.momentumEnd");
+            sampleMemory("Viewer", "continuous.momentumEnd", {
+              pageCount
+            });
+          } : void 0,
+          scrollEventThrottle: 16,
+          showsVerticalScrollIndicator: false
         }
-      },
-      onScroll: (event) => handleViewerScroll(event, "continuous"),
-      onScrollBeginDrag: perfEnabled ? () => {
-        scrollMonitorRef.current.begin("continuous.beginDrag");
-      } : void 0,
-      onMomentumScrollBegin: perfEnabled ? () => {
-        scrollMonitorRef.current.begin("continuous.momentumBegin");
-      } : void 0,
-      onScrollEndDrag: perfEnabled ? () => {
-        scrollMonitorRef.current.end("continuous.endDrag");
-        sampleMemory("Viewer", "continuous.endDrag", { pageCount });
-      } : void 0,
-      onMomentumScrollEnd: perfEnabled ? () => {
-        scrollMonitorRef.current.end("continuous.momentumEnd");
-        sampleMemory("Viewer", "continuous.momentumEnd", { pageCount });
-      } : void 0,
-      scrollEventThrottle: 16,
-      showsVerticalScrollIndicator: false
+      )
     }
-  ) });
+  ) }) });
 };
 var styles3 = StyleSheet3.create({
   container: {
@@ -23487,6 +24353,9 @@ var styles3 = StyleSheet3.create({
   containerDark: {
     backgroundColor: "#0f1115"
   },
+  gestureSurface: {
+    flex: 1
+  },
   listContent: {
     paddingTop: LIST_TOP_PADDING,
     paddingBottom: LIST_BOTTOM_PADDING
@@ -24166,6 +25035,7 @@ var ToolDock = () => {
     setAnnotationColor,
     accentColor,
     activeTool,
+    interactionMode,
     toolDockOpen,
     setDocumentState
   } = useViewerStore5();
@@ -24177,7 +25047,12 @@ var ToolDock = () => {
       /* @__PURE__ */ jsx6(
         Pressable3,
         {
-          onPress: () => setDocumentState({ toolDockOpen: false }),
+          onPress: () => setDocumentState(
+            getToolDockDismissState({
+              activeTool,
+              interactionMode
+            })
+          ),
           style: [styles5.closeButton, isDark && styles5.closeButtonDark],
           children: /* @__PURE__ */ jsx6(
             Text2,
@@ -24190,12 +25065,29 @@ var ToolDock = () => {
       )
     ] }),
     /* @__PURE__ */ jsx6(View5, { style: styles5.toolsRow, children: TOOL_OPTIONS.map((tool) => {
-      const isSelected = activeTool === tool.id;
+      const isSelected = isToolDockToolSelected({
+        toolId: tool.id,
+        activeTool,
+        interactionMode
+      });
       const label = tool.label === "note" ? t.note : tool.label === "select" ? t.select : tool.label === "underline" ? t.underline : tool.label === "squiggly" ? t.squiggly : tool.label === "strikeout" ? t.strikeout : tool.label === "ink" ? t.ink : t.highlight;
       return /* @__PURE__ */ jsx6(
         Pressable3,
         {
-          onPress: () => setDocumentState({ activeTool: tool.id }),
+          onPress: () => {
+            if (tool.id === "select") {
+              const shouldArmSelection = activeTool !== "select" || interactionMode !== "select";
+              setDocumentState({
+                activeTool: "select",
+                interactionMode: shouldArmSelection ? "select" : "pan"
+              });
+              return;
+            }
+            setDocumentState({
+              activeTool: tool.id,
+              interactionMode: "pan"
+            });
+          },
           style: [
             styles5.toolButton,
             isDark && styles5.toolButtonDark,