@anaralabs/lector 3.14.11 → 3.14.13

package/dist/index.js

@@ -1,6 +1,6 @@
 'use client';
 
-import React, { createContext, memo, forwardRef, useMemo, cloneElement, useEffect, useRef, useState, useCallback, useContext, useLayoutEffect, createRef, useSyncExternalStore, useImperativeHandle } from 'react';
+import React, { createContext, memo, forwardRef, useMemo, cloneElement, useEffect, useRef, useLayoutEffect, useContext, useState, useCallback, useSyncExternalStore, createRef, useImperativeHandle } from 'react';
 import { createPortal } from 'react-dom';
 import { useFloating, autoUpdate, offset, flip, shift, useDismiss, useInteractions, inline } from '@floating-ui/react';
 import { useStore, createStore } from 'zustand';
@@ -9,7 +9,7 @@ import { useShallow } from 'zustand/react/shallow';
 import { useDebounce } from 'use-debounce';
 import { v4 } from 'uuid';
 import { Slot } from '@radix-ui/react-slot';
-import { useVirtualizer, elementScroll, debounce } from '@tanstack/react-virtual';
+import { useVirtualizer, elementScroll, observeElementRect } from '@tanstack/react-virtual';
 
 // src/lib/clamp.ts
 var clamp = (value, minimum, maximum) => {
@@ -219,6 +219,19 @@ function createDarkModeColorMap(colors) {
   return map;
 }
 
+// src/lib/viewport-zoom.ts
+var viewportZoomHandlers = /* @__PURE__ */ new WeakMap();
+function applyViewportZoom(viewport, zoom) {
+  if (viewport) viewportZoomHandlers.get(viewport)?.(zoom);
+}
+function registerViewportZoom(viewport, apply) {
+  viewportZoomHandlers.set(viewport, apply);
+  return () => {
+    if (viewportZoomHandlers.get(viewport) === apply)
+      viewportZoomHandlers.delete(viewport);
+  };
+}
+
 // src/lib/zoom.ts
 var USE_LAYOUT_ZOOM = typeof navigator !== "undefined" && /AppleWebKit/i.test(navigator.userAgent) && !/Chrome|Chromium|Android/i.test(navigator.userAgent);
 var getFitWidthZoom = (containerWidth, viewports, zoomOptions) => {
@@ -271,6 +284,7 @@ var PDFStore = createZustandContext(
             minZoom,
             maxZoom
           );
+          applyViewportZoom(state.viewportRef.current, newZoom);
           return newZoom === state.zoom && isZoomFitWidth === state.isZoomFitWidth ? state : { zoom: newZoom, isZoomFitWidth };
         });
       },
@@ -285,7 +299,8 @@ var PDFStore = createZustandContext(
         get().updateZoom(clampedZoom, true);
         return clampedZoom;
       },
-      currentPage: 1,
+      currentPage: initialState.initialPage ?? 1,
+      initialPage: initialState.initialPage ?? 1,
       setCurrentPage: (val) => {
         set(
           (state) => state.currentPage === val ? state : { currentPage: val }
@@ -310,9 +325,18 @@ var PDFStore = createZustandContext(
         );
       },
       pageProxies: initialState.pageProxies,
+      pagesLoaded: initialState.pageProxies.length === initialState.pdfDocumentProxy.numPages,
+      loadPdfPageProxies: () => initialState.pageResources ? initialState.pageResources.loadAll() : Promise.resolve(get().pageProxies),
+      isPageLoaded: (pageNumber) => Boolean(
+        initialState.pageResources?.get(pageNumber) ?? get().pageProxies[pageNumber - 1]
+      ),
+      loadPdfPageProxy: (pageNumber) => initialState.pageResources ? initialState.pageResources.load(pageNumber) : Promise.resolve().then(() => get().getPdfPageProxy(pageNumber)),
       getPdfPageProxy: (pageNumber) => {
-        const proxy = get().pageProxies[pageNumber - 1];
-        if (!proxy) throw new Error(`Page ${pageNumber} does not exist`);
+        const proxy = initialState.pageResources?.get(pageNumber) ?? get().pageProxies[pageNumber - 1];
+        if (!proxy)
+          throw new Error(
+            initialState.pageResources && Number.isInteger(pageNumber) && pageNumber >= 1 && pageNumber <= initialState.pdfDocumentProxy.numPages ? `Page ${pageNumber} is not loaded. Await loadPdfPageProxy(${pageNumber}) first.` : `Page ${pageNumber} does not exist`
+          );
         return proxy;
       },
       textContent: [],
@@ -665,23 +689,44 @@ var AnnotationTooltip = ({
 };
 var createAnnotationStore = () => createStore((set) => ({
   annotations: [],
-  addAnnotation: (annotation) => set((state) => ({
-    annotations: [...state.annotations, annotation]
-  })),
-  updateAnnotation: (id, updates) => set((state) => ({
-    annotations: state.annotations.map(
-      (annotation) => annotation.id === id ? {
+  addAnnotation: (annotation) => set((state) => {
+    const annotations = [...state.annotations, annotation];
+    updatePageIndex(state.annotations, annotations, /* @__PURE__ */ new Map(), [
+      annotation
+    ]);
+    return { annotations };
+  }),
+  updateAnnotation: (id, updates) => set((state) => {
+    const changes = /* @__PURE__ */ new Map();
+    const keys = Object.keys(updates);
+    const annotations = state.annotations.map((annotation) => {
+      if (annotation.id !== id || keys.every((key) => Object.is(annotation[key], updates[key])))
+        return annotation;
+      const updated = changes.get(annotation) ?? {
         ...annotation,
         ...updates
-      } : annotation
-    )
-  })),
-  deleteAnnotation: (id) => set((state) => ({
-    annotations: state.annotations.filter(
-      (annotation) => annotation.id !== id
-    )
-  })),
-  setAnnotations: (annotations) => set({ annotations })
+      };
+      changes.set(annotation, updated);
+      return updated;
+    });
+    if (!changes.size) return state;
+    updatePageIndex(state.annotations, annotations, changes);
+    return { annotations };
+  }),
+  deleteAnnotation: (id) => set((state) => {
+    const changes = /* @__PURE__ */ new Map();
+    const annotations = state.annotations.filter((annotation) => {
+      if (annotation.id !== id) return true;
+      changes.set(annotation, null);
+      return false;
+    });
+    if (!changes.size) return state;
+    updatePageIndex(state.annotations, annotations, changes);
+    return { annotations };
+  }),
+  setAnnotations: (annotations) => set(
+    (state) => state.annotations === annotations ? state : { annotations }
+  )
 }));
 var AnnotationsStore = createZustandContext(
   () => createAnnotationStore()
@@ -713,9 +758,7 @@ function annotationsByPage(annotations) {
   if (index) return index;
   index = /* @__PURE__ */ new Map();
   for (const annotation of annotations) {
-    const pages = /* @__PURE__ */ new Set([annotation.pageNumber]);
-    for (const rect of annotation.highlights) pages.add(rect.pageNumber);
-    for (const rect of annotation.underlines ?? []) pages.add(rect.pageNumber);
+    const pages = annotationPages(annotation);
     for (const page of pages) {
       let values = index.get(page);
       if (!values) {
@@ -728,6 +771,45 @@ function annotationsByPage(annotations) {
   indexes.set(annotations, index);
   return index;
 }
+function annotationPages(annotation) {
+  const pages = /* @__PURE__ */ new Set([annotation.pageNumber]);
+  for (const rect of annotation.highlights) pages.add(rect.pageNumber);
+  for (const rect of annotation.underlines ?? []) pages.add(rect.pageNumber);
+  return pages;
+}
+function isOnPage(annotation, page) {
+  return annotation.pageNumber === page || annotation.highlights.some((rect) => rect.pageNumber === page) || annotation.underlines?.some((rect) => rect.pageNumber === page);
+}
+function updatePageIndex(previous, next, changes, appended = []) {
+  const previousIndex = indexes.get(previous);
+  if (!previousIndex) return;
+  const index = new Map(previousIndex);
+  const affected = /* @__PURE__ */ new Set();
+  const movedTo = /* @__PURE__ */ new Set();
+  for (const [before, after] of changes) {
+    const oldPages = annotationPages(before);
+    for (const page of oldPages) affected.add(page);
+    if (after)
+      for (const page of annotationPages(after)) {
+        affected.add(page);
+        if (!oldPages.has(page)) movedTo.add(page);
+      }
+  }
+  for (const page of affected) {
+    const values = movedTo.has(page) ? next.filter((annotation) => isOnPage(annotation, page)) : (previousIndex.get(page) ?? []).flatMap((annotation) => {
+      if (!changes.has(annotation)) return [annotation];
+      const updated = changes.get(annotation);
+      return updated && isOnPage(updated, page) ? [updated] : [];
+    });
+    if (values.length) index.set(page, values);
+    else index.delete(page);
+  }
+  for (const annotation of appended)
+    for (const page of annotationPages(annotation)) {
+      index.set(page, [...index.get(page) ?? [], annotation]);
+    }
+  indexes.set(next, index);
+}
 function usePageAnnotations(pageNumber) {
   return useAnnotations(
     useShallow(
@@ -1035,7 +1117,7 @@ var usePdfJump = () => {
       }
       let scrollOffset;
       if (align === "center") {
-        const viewportHeight = virtualizer.scrollElement?.clientHeight || 0;
+        const viewportHeight = virtualizer.scrollRect?.height ?? 0;
         const rectCenter = pageStart + rectTop + rectHeight / 2;
         scrollOffset = rectCenter - viewportHeight / 2;
       } else {
@@ -2108,6 +2190,69 @@ function applyContextRecolor(ctx, map, options) {
 function removeContextRecolor(ctx) {
   ctx[RECOLOR_CLEANUP]?.();
 }
+
+// src/lib/viewport-invalidation.ts
+var viewportInvalidationRegistry = /* @__PURE__ */ new WeakMap();
+var notifyCallbacks = (entry) => {
+  entry.rafId = null;
+  entry.callbacks.forEach((callback) => {
+    callback();
+  });
+};
+var scheduleInvalidation = (entry) => {
+  if (entry.rafId !== null) {
+    return;
+  }
+  entry.rafId = requestAnimationFrame(() => {
+    notifyCallbacks(entry);
+  });
+};
+var subscribeToViewportInvalidation = (viewport, callback) => {
+  let entry = viewportInvalidationRegistry.get(viewport);
+  if (!entry) {
+    const callbacks = /* @__PURE__ */ new Set();
+    const schedule = () => {
+      const currentEntry = viewportInvalidationRegistry.get(viewport);
+      if (!currentEntry) {
+        return;
+      }
+      scheduleInvalidation(currentEntry);
+    };
+    entry = {
+      callbacks,
+      scrollListener: schedule,
+      windowResizeListener: schedule,
+      resizeObserver: typeof ResizeObserver === "undefined" ? void 0 : new ResizeObserver(schedule),
+      rafId: null
+    };
+    viewport.addEventListener("scroll", entry.scrollListener, {
+      passive: true
+    });
+    window.addEventListener("resize", entry.windowResizeListener, {
+      passive: true
+    });
+    entry.resizeObserver?.observe(viewport);
+    viewportInvalidationRegistry.set(viewport, entry);
+  }
+  entry.callbacks.add(callback);
+  return () => {
+    const currentEntry = viewportInvalidationRegistry.get(viewport);
+    if (!currentEntry) {
+      return;
+    }
+    currentEntry.callbacks.delete(callback);
+    if (currentEntry.callbacks.size > 0) {
+      return;
+    }
+    if (currentEntry.rafId !== null) {
+      cancelAnimationFrame(currentEntry.rafId);
+    }
+    viewport.removeEventListener("scroll", currentEntry.scrollListener);
+    window.removeEventListener("resize", currentEntry.windowResizeListener);
+    currentEntry.resizeObserver?.disconnect();
+    viewportInvalidationRegistry.delete(viewport);
+  };
+};
 var listeners = /* @__PURE__ */ new Set();
 var media;
 var getSnapshot = () => Math.min(window.devicePixelRatio || 1, 3);
@@ -2369,7 +2514,53 @@ var useCanvasLayer = ({ background }) => {
       releaseBuffer();
       throw error;
     }
+    let continuation = null;
+    let idleTimer = null;
+    let unsubscribeViewport = null;
+    let priorityStopped = false;
+    const clearPriorityWait = () => {
+      if (idleTimer !== null) clearTimeout(idleTimer);
+      idleTimer = null;
+      unsubscribeViewport?.();
+      unsubscribeViewport = null;
+    };
+    const resumeWhenVisible = () => {
+      if (priorityStopped || !continuation) return;
+      const { virtualizer, viewportRef } = store.getState();
+      const item = virtualizer?.getVirtualItems().find((candidate) => candidate.index === pageNumber - 1);
+      const offset3 = virtualizer?.scrollOffset;
+      const height = virtualizer?.scrollRect?.height;
+      if (virtualizer?.isScrolling && item && offset3 != null && height && (item.end < offset3 || item.start > offset3 + height)) {
+        if (!unsubscribeViewport && viewportRef.current) {
+          unsubscribeViewport = subscribeToViewportInvalidation(
+            viewportRef.current,
+            resumeWhenVisible
+          );
+        }
+        if (idleTimer === null) {
+          idleTimer = setTimeout(() => {
+            idleTimer = null;
+            resumeWhenVisible();
+          }, 160);
+        }
+        return;
+      }
+      clearPriorityWait();
+      const proceed = continuation;
+      continuation = null;
+      proceed();
+    };
+    const stopPriority = () => {
+      priorityStopped = true;
+      continuation = null;
+      clearPriorityWait();
+    };
+    renderingTask.onContinue = (proceed) => {
+      continuation = proceed;
+      resumeWhenVisible();
+    };
     renderingTask.promise.then(() => {
+      stopPriority();
       if (cancelled) {
         restoreRecolor?.();
         releaseBuffer();
@@ -2414,6 +2605,7 @@ var useCanvasLayer = ({ background }) => {
         releaseBuffer();
       }
     }).catch((error) => {
+      stopPriority();
       restoreRecolor?.();
       releaseBuffer();
       if (cancelled) return;
@@ -2423,6 +2615,7 @@ var useCanvasLayer = ({ background }) => {
     });
     return () => {
       cancelled = true;
+      stopPriority();
       void renderingTask.cancel();
     };
   }, [
@@ -2454,71 +2647,6 @@ var useCanvasLayer = ({ background }) => {
     canvasRef
   };
 };
-
-// src/lib/viewport-invalidation.ts
-var viewportInvalidationRegistry = /* @__PURE__ */ new WeakMap();
-var notifyCallbacks = (entry) => {
-  entry.rafId = null;
-  entry.callbacks.forEach((callback) => {
-    callback();
-  });
-};
-var scheduleInvalidation = (entry) => {
-  if (entry.rafId !== null) {
-    return;
-  }
-  entry.rafId = requestAnimationFrame(() => {
-    notifyCallbacks(entry);
-  });
-};
-var subscribeToViewportInvalidation = (viewport, callback) => {
-  let entry = viewportInvalidationRegistry.get(viewport);
-  if (!entry) {
-    const callbacks = /* @__PURE__ */ new Set();
-    const schedule = () => {
-      const currentEntry = viewportInvalidationRegistry.get(viewport);
-      if (!currentEntry) {
-        return;
-      }
-      scheduleInvalidation(currentEntry);
-    };
-    entry = {
-      callbacks,
-      scrollListener: schedule,
-      windowResizeListener: schedule,
-      resizeObserver: typeof ResizeObserver === "undefined" ? void 0 : new ResizeObserver(schedule),
-      rafId: null
-    };
-    viewport.addEventListener("scroll", entry.scrollListener, {
-      passive: true
-    });
-    window.addEventListener("resize", entry.windowResizeListener, {
-      passive: true
-    });
-    entry.resizeObserver?.observe(viewport);
-    viewportInvalidationRegistry.set(viewport, entry);
-  }
-  entry.callbacks.add(callback);
-  return () => {
-    const currentEntry = viewportInvalidationRegistry.get(viewport);
-    if (!currentEntry) {
-      return;
-    }
-    currentEntry.callbacks.delete(callback);
-    if (currentEntry.callbacks.size > 0) {
-      return;
-    }
-    if (currentEntry.rafId !== null) {
-      cancelAnimationFrame(currentEntry.rafId);
-    }
-    viewport.removeEventListener("scroll", currentEntry.scrollListener);
-    window.removeEventListener("resize", currentEntry.windowResizeListener);
-    currentEntry.resizeObserver?.disconnect();
-    viewportInvalidationRegistry.delete(viewport);
-  };
-};
-
-// src/hooks/layers/useDetailCanvasLayer.tsx
 var DETAIL_RENDER_IDLE_MS = 80;
 var SCROLL_POLL_MS = 160;
 var ZOOM_DEBOUNCE_MS = 200;
@@ -2894,9 +3022,7 @@ var CanvasLayer = memo(
 );
 CanvasLayer.displayName = "CanvasLayer";
 
-// src/hooks/useSelectionDimensions.tsx
-var MERGE_THRESHOLD = 2;
-var LAYER_ATTRIBUTION_TOLERANCE_PX = 4;
+// src/lib/selection-rects.ts
 var getTextNodeClientRects = (range) => {
   const root = range.commonAncestorContainer;
   const ownerDoc = root.ownerDocument ?? document;
@@ -2948,6 +3074,39 @@ var getTextNodeClientRects = (range) => {
   }
   return results;
 };
+var connected = (a, b) => {
+  const overlap = Math.min(a.top + a.height, b.top + b.height) - Math.max(a.top, b.top);
+  const gap = Math.max(a.left, b.left) - Math.min(a.left + a.width, b.left + b.width);
+  return overlap >= Math.min(a.height, b.height) / 2 && gap <= Math.min(a.height, b.height) * 0.5;
+};
+var mergeTextRuns = (rects) => {
+  const groups = [];
+  for (const rect of rects) {
+    const group = [rect];
+    for (let i = groups.length - 1; i >= 0; i--) {
+      if (groups[i].some((member) => connected(member, rect))) {
+        group.push(...groups[i]);
+        groups.splice(i, 1);
+      }
+    }
+    groups.push(group);
+  }
+  return groups.map((group) => {
+    const left = Math.min(...group.map((rect) => rect.left));
+    const top = Math.min(...group.map((rect) => rect.top));
+    return {
+      ...group[0],
+      left,
+      top,
+      width: Math.max(...group.map((rect) => rect.left + rect.width)) - left,
+      height: Math.max(...group.map((rect) => rect.top + rect.height)) - top
+    };
+  });
+};
+
+// src/hooks/useSelectionDimensions.tsx
+var MERGE_THRESHOLD = 2;
+var LAYER_ATTRIBUTION_TOLERANCE_PX = 4;
 var mapSelectionRectsToLayers = (range) => {
   const clientRects = getTextNodeClientRects(range).filter(
     ({ rect }) => rect.width > 2 && rect.height > 2
@@ -2990,122 +3149,6 @@ var mapSelectionRectsToLayers = (range) => {
   }
   return result;
 };
-var shouldMergeRects = (rect1, rect2) => {
-  const verticalOverlap = !(rect1.top > rect2.top + rect2.height || rect2.top > rect1.top + rect1.height);
-  const horizontallyConnected = Math.abs(rect1.left + rect1.width - rect2.left) <= MERGE_THRESHOLD || Math.abs(rect2.left + rect2.width - rect1.left) <= MERGE_THRESHOLD || rect1.left < rect2.left + rect2.width && rect2.left < rect1.left + rect1.width;
-  return verticalOverlap && horizontallyConnected;
-};
-var consolidateHighlightRects = (rects) => {
-  if (rects.length <= 1) return rects;
-  const consolidated = [];
-  const sorted = [...rects].sort((a, b) => {
-    const pageCompare = a.pageNumber - b.pageNumber;
-    if (pageCompare !== 0) return pageCompare;
-    const topDiff = a.top - b.top;
-    return Math.abs(topDiff) < 2 ? a.left - b.left : topDiff;
-  });
-  let current = sorted[0];
-  if (!current) return rects;
-  for (let i = 1; i < sorted.length; i++) {
-    const next = sorted[i];
-    if (!next) continue;
-    const samePageAndLine = current.pageNumber === next.pageNumber && Math.abs(current.top - next.top) < Math.max(current.height, next.height) * 0.5;
-    const horizontallyConnected = samePageAndLine && // Adjacent (touching or very close)
-    (Math.abs(current.left + current.width - next.left) <= MERGE_THRESHOLD || Math.abs(next.left + next.width - current.left) <= MERGE_THRESHOLD || // Overlapping
-    current.left < next.left + next.width && next.left < current.left + current.width || // Very close (small gap)
-    Math.abs(current.left + current.width - next.left) <= current.height * 0.2);
-    if (horizontallyConnected) {
-      const newLeft = Math.min(current.left, next.left);
-      const newRight = Math.max(
-        current.left + current.width,
-        next.left + next.width
-      );
-      const newTop = Math.min(current.top, next.top);
-      const newBottom = Math.max(
-        current.top + current.height,
-        next.top + next.height
-      );
-      current = {
-        left: newLeft,
-        top: newTop,
-        width: newRight - newLeft,
-        height: newBottom - newTop,
-        pageNumber: current.pageNumber
-      };
-    } else {
-      consolidated.push(current);
-      current = next;
-    }
-  }
-  if (current) {
-    consolidated.push(current);
-  }
-  return consolidated;
-};
-var consolidateRects = (rects) => {
-  if (rects.length <= 1) return rects;
-  const result = [];
-  const visited = /* @__PURE__ */ new Set();
-  for (let i = 0; i < rects.length; i++) {
-    if (visited.has(i)) continue;
-    const currentRect = rects[i];
-    if (!currentRect) continue;
-    const currentGroup = [currentRect];
-    visited.add(i);
-    let foundNew = true;
-    while (foundNew) {
-      foundNew = false;
-      for (let j = 0; j < rects.length; j++) {
-        if (visited.has(j)) continue;
-        const candidateRect = rects[j];
-        if (!candidateRect) continue;
-        const shouldMergeWithGroup = currentGroup.some(
-          (groupRect) => doRectsOverlap(groupRect, candidateRect)
-        );
-        if (shouldMergeWithGroup) {
-          currentGroup.push(candidateRect);
-          visited.add(j);
-          foundNew = true;
-        }
-      }
-    }
-    result.push(mergeRectGroup(currentGroup));
-  }
-  return result;
-};
-var doRectsOverlap = (rect1, rect2) => {
-  const horizontalOverlap = rect1.left < rect2.left + rect2.width && rect2.left < rect1.left + rect1.width;
-  const verticalOverlap = rect1.top < rect2.top + rect2.height && rect2.top < rect1.top + rect1.height;
-  const closeEnough = shouldMergeRects(rect1, rect2);
-  return horizontalOverlap && verticalOverlap || closeEnough;
-};
-var mergeRectGroup = (rects) => {
-  if (rects.length === 1) {
-    const rect = rects[0];
-    if (!rect) throw new Error("Invalid rect in group");
-    return rect;
-  }
-  const firstRect = rects[0];
-  if (!firstRect) throw new Error("Invalid first rect in group");
-  let minLeft = firstRect.left;
-  let minTop = firstRect.top;
-  let maxRight = firstRect.left + firstRect.width;
-  let maxBottom = firstRect.top + firstRect.height;
-  rects.forEach((rect) => {
-    if (!rect) return;
-    minLeft = Math.min(minLeft, rect.left);
-    minTop = Math.min(minTop, rect.top);
-    maxRight = Math.max(maxRight, rect.left + rect.width);
-    maxBottom = Math.max(maxBottom, rect.top + rect.height);
-  });
-  return {
-    left: minLeft,
-    top: minTop,
-    width: maxRight - minLeft,
-    height: maxBottom - minTop,
-    pageNumber: firstRect.pageNumber
-  };
-};
 var useSelectionDimensions = () => {
   const store = PDFStore.useContext();
   const getAnnotationDimension = () => {
@@ -3178,14 +3221,7 @@ var useSelectionDimensions = () => {
       }
     });
     textLayerMapHighlight.forEach((rects) => {
-      if (rects.length > 0) {
-        if (rects.length === 1) {
-          highlightRects.push(...rects);
-        } else {
-          const consolidated = consolidateHighlightRects(rects);
-          highlightRects.push(...consolidated);
-        }
-      }
+      highlightRects.push(...mergeTextRuns(rects));
     });
     textLayerMapUnderline.forEach((rects) => {
       if (rects.length > 0) {
@@ -3332,7 +3368,7 @@ var useSelectionDimensions = () => {
     });
     textLayerMap.forEach((rects) => {
       if (rects.length > 0) {
-        const consolidated = consolidateRects(rects);
+        const consolidated = mergeTextRuns(rects);
         highlights.push(...consolidated);
       }
     });
@@ -3777,13 +3813,110 @@ var HighlightLayer = forwardRef(({ asChild, className, style, ...props }, ref) =
   }) });
 });
 HighlightLayer.displayName = "HighlightLayer";
+
+// src/lib/selection-background.ts
+var SVG_NS = "http://www.w3.org/2000/svg";
+var createSelectionBackground = () => {
+  const overlays = /* @__PURE__ */ new Map();
+  let style;
+  const clear = (layer) => {
+    overlays.get(layer)?.remove();
+    overlays.delete(layer);
+    layer.removeAttribute("data-lector-selection-active");
+    if (overlays.size === 0) {
+      style?.remove();
+      style = void 0;
+    }
+  };
+  const update = (selection, layers) => {
+    const registered = new Set(layers);
+    const byLayer = /* @__PURE__ */ new Map();
+    if (selection && !selection.isCollapsed) {
+      for (let i = 0; i < selection.rangeCount; i++) {
+        for (const { rect, element } of getTextNodeClientRects(
+          selection.getRangeAt(i)
+        )) {
+          const layer = element?.closest(".textLayer");
+          if (!layer || !element || !registered.has(layer) || rect.width <= 0 || rect.height <= 0)
+            continue;
+          let entry = byLayer.get(layer);
+          if (!entry) {
+            entry = { rects: [], element };
+            byLayer.set(layer, entry);
+          }
+          entry.rects.push(rect);
+        }
+      }
+    }
+    for (const layer of registered) {
+      const entry = byLayer.get(layer);
+      if (!entry) {
+        clear(layer);
+        continue;
+      }
+      layer.removeAttribute("data-lector-selection-active");
+      const color = getComputedStyle(
+        entry.element,
+        "::selection"
+      ).backgroundColor;
+      if (!color || color === "transparent" || color === "rgba(0, 0, 0, 0)") {
+        clear(layer);
+        continue;
+      }
+      const bounds = layer.getBoundingClientRect();
+      if (!bounds.width || !bounds.height || !layer.clientWidth || !layer.clientHeight) {
+        clear(layer);
+        continue;
+      }
+      const scaleX = bounds.width / layer.clientWidth;
+      const scaleY = bounds.height / layer.clientHeight;
+      const rects = mergeTextRuns(
+        entry.rects.map((rect) => ({
+          left: (rect.left - bounds.left) / scaleX,
+          top: (rect.top - bounds.top) / scaleY,
+          width: rect.width / scaleX,
+          height: rect.height / scaleY
+        }))
+      );
+      let overlay = overlays.get(layer);
+      if (!overlay) {
+        overlay = document.createElementNS(SVG_NS, "svg");
+        overlay.dataset.lectorSelection = "";
+        overlay.setAttribute("aria-hidden", "true");
+        overlay.style.cssText = "position:absolute;inset:0;width:100%;height:100%;pointer-events:none;user-select:none;transform:none;z-index:0;overflow:visible";
+        overlay.append(document.createElementNS(SVG_NS, "path"));
+        layer.append(overlay);
+        overlays.set(layer, overlay);
+      }
+      const path = overlay.firstElementChild;
+      path.setAttribute(
+        "d",
+        rects.map(
+          (rect) => `M${rect.left} ${rect.top}h${rect.width}v${rect.height}h${-rect.width}Z`
+        ).join(" ")
+      );
+      path.setAttribute("fill", color);
+      if (!style) {
+        style = document.createElement("style");
+        style.textContent = ".textLayer[data-lector-selection-active] ::selection { background-color: transparent !important; }";
+        document.head.append(style);
+      }
+      layer.setAttribute("data-lector-selection-active", "");
+    }
+  };
+  return { update, clear };
+};
+
+// src/hooks/layers/useTextLayer.tsx
 var createTextSelectionManager = () => {
   const textLayers = /* @__PURE__ */ new Map();
+  const selectionBackground = createSelectionBackground();
   let selectionChangeAbortController = null;
   let isPointerDown = false;
   let prevRange = null;
   let isFirefox;
   const removeGlobalSelectionListener = (textLayerDiv) => {
+    selectionBackground.clear(textLayerDiv);
     textLayers.delete(textLayerDiv);
     if (textLayers.size === 0) {
       selectionChangeAbortController?.abort();
@@ -3840,6 +3973,7 @@ var createTextSelectionManager = () => {
       "selectionchange",
       () => {
         const selection = document.getSelection();
+        selectionBackground.update(selection, textLayers.keys());
         if (!selection || selection.rangeCount === 0) {
           textLayers.forEach(reset);
           return;
@@ -4305,6 +4439,37 @@ var Outline = ({
     });
   }) });
 };
+function PageLoadingBoundary({
+  pageNumber,
+  children,
+  fallback = null
+}) {
+  const loaded = usePdf((state) => state.isPageLoaded(pageNumber));
+  const loadPage = usePdf((state) => state.loadPdfPageProxy);
+  const [failure, setFailure] = useState(null);
+  const [attempt, setAttempt] = useState(0);
+  useEffect(() => {
+    if (loaded) return;
+    let disposed = false;
+    setFailure(null);
+    void loadPage(pageNumber).catch((error) => {
+      if (!disposed) setFailure({ pageNumber, error });
+    });
+    return () => {
+      disposed = true;
+    };
+  }, [pageNumber, loaded, loadPage, attempt]);
+  if (loaded) return children;
+  if (failure?.pageNumber === pageNumber)
+    return /* @__PURE__ */ jsxs("div", { role: "alert", children: [
+      "Unable to load page ",
+      pageNumber,
+      ".",
+      " ",
+      /* @__PURE__ */ jsx("button", { type: "button", onClick: () => setAttempt((value) => value + 1), children: "Retry" })
+    ] });
+  return fallback;
+}
 var Page = memo(
   ({
     children,
@@ -4312,14 +4477,16 @@ var Page = memo(
     style,
     ...props
   }) => {
-    const pdfPageProxy = usePdf((state) => state.getPdfPageProxy(pageNumber));
+    const loaded = usePdf((state) => state.isPageLoaded(pageNumber));
+    const getPage = usePdf((state) => state.getPdfPageProxy);
+    const proxy = loaded ? getPage(pageNumber) : void 0;
     const viewport = usePdf((state) => state.viewports[pageNumber - 1]);
     const colorScheme = usePdf((state) => state.colorScheme);
     const darkModeColors = usePdf((state) => state.darkModeColors);
     const pageBackground = colorScheme === "dark" ? createDarkModeColorMap(darkModeColors)("#ffffff") : "white";
-    const width = viewport?.width ?? (pdfPageProxy.view[2] ?? 0) - (pdfPageProxy.view[0] ?? 0);
-    const height = viewport?.height ?? (pdfPageProxy.view[3] ?? 0) - (pdfPageProxy.view[1] ?? 0);
-    return /* @__PURE__ */ jsx(PDFPageNumberContext.Provider, { value: pdfPageProxy.pageNumber, children: /* @__PURE__ */ jsx(
+    const width = viewport?.width ?? (proxy?.view[2] ?? 0) - (proxy?.view[0] ?? 0);
+    const height = viewport?.height ?? (proxy?.view[3] ?? 0) - (proxy?.view[1] ?? 0);
+    return /* @__PURE__ */ jsx(PDFPageNumberContext.Provider, { value: pageNumber, children: /* @__PURE__ */ jsx(
       Primitive.div,
       {
         style: {
@@ -4337,8 +4504,9 @@ var Page = memo(
               height,
               ...style
             },
+            "aria-busy": !loaded || void 0,
             ...props,
-            children
+            children: /* @__PURE__ */ jsx(PageLoadingBoundary, { pageNumber, children })
           }
         )
       }
@@ -4459,6 +4627,28 @@ var addEventListenerOptions = {
 };
 var useObserveElement = () => {
   const store = PDFStore.useContext();
+  const observeElementRect$1 = (instance, cb) => {
+    let physicalRect;
+    const publish = () => {
+      if (!physicalRect) return;
+      const zoom = store.getState().zoom;
+      cb({
+        width: physicalRect.width / zoom,
+        height: physicalRect.height / zoom
+      });
+    };
+    const stopObserving = observeElementRect(instance, (rect) => {
+      physicalRect = rect;
+      publish();
+    });
+    const unsubscribe = store.subscribe((state, previous) => {
+      if (state.zoom !== previous.zoom) publish();
+    });
+    return () => {
+      stopObserving?.();
+      unsubscribe();
+    };
+  };
   const observeElementOffset = (instance, cb) => {
     const element = instance.scrollElement;
     if (!element) {
@@ -4468,33 +4658,46 @@ var useObserveElement = () => {
     if (!targetWindow) {
       return;
     }
-    let offset3 = 0;
-    const fallback = instance.options.useScrollendEvent && supportsScrollend ? () => void 0 : debounce(
-      targetWindow,
-      () => {
-        cb(offset3, false);
-      },
-      instance.options.isScrollingResetDelay
-    );
-    const createHandler = (isScrolling) => () => {
+    let isScrolling = false;
+    let idleTimer;
+    const needsIdleFallback = !instance.options.useScrollendEvent || !supportsScrollend;
+    const publish = (scrolling) => {
+      isScrolling = scrolling;
       const { horizontal, isRtl } = instance.options;
-      offset3 = horizontal ? element.scrollLeft * (isRtl && -1 || 1) : element.scrollTop;
-      const zoom = store.getState().zoom;
-      offset3 = offset3 / zoom;
-      fallback();
-      cb(offset3, isScrolling);
+      const physicalOffset = horizontal ? element.scrollLeft * (isRtl ? -1 : 1) : element.scrollTop;
+      cb(physicalOffset / store.getState().zoom, isScrolling);
+    };
+    const clearIdleTimer = () => {
+      if (idleTimer !== void 0) targetWindow.clearTimeout(idleTimer);
+      idleTimer = void 0;
+    };
+    const createHandler = (scrolling) => () => {
+      clearIdleTimer();
+      publish(scrolling);
+      if (scrolling && needsIdleFallback) {
+        idleTimer = targetWindow.setTimeout(() => {
+          idleTimer = void 0;
+          publish(false);
+        }, instance.options.isScrollingResetDelay);
+      }
     };
     const handler = createHandler(true);
     const endHandler = createHandler(false);
     endHandler();
+    const unsubscribe = store.subscribe((state, previous) => {
+      if (state.zoom !== previous.zoom) publish(isScrolling);
+    });
     element.addEventListener("scroll", handler, addEventListenerOptions);
     element.addEventListener("scrollend", endHandler, addEventListenerOptions);
     return () => {
+      unsubscribe();
+      clearIdleTimer();
       element.removeEventListener("scroll", handler);
       element.removeEventListener("scrollend", endHandler);
     };
   };
   return {
+    observeElementRect: observeElementRect$1,
     observeElementOffset
   };
 };
@@ -4504,7 +4707,11 @@ var useScrollFn = () => {
     (_offset, canSmooth, instance) => {
       const zoom = store.getState().zoom;
       const offset3 = _offset * zoom;
-      elementScroll(offset3, canSmooth, instance);
+      elementScroll(
+        offset3,
+        { ...canSmooth, adjustments: (canSmooth.adjustments ?? 0) * zoom },
+        instance
+      );
     },
     [store]
   );
@@ -4622,7 +4829,7 @@ function _toPrimitive(input, hint) {
   if (typeof input !== "object" || input === null) return input;
   var prim = input[Symbol.toPrimitive];
   if (prim !== void 0) {
-    var res = prim.call(input, hint || "default");
+    var res = prim.call(input, hint);
     if (typeof res !== "object") return res;
     throw new TypeError("@@toPrimitive must return a primitive value.");
   }
@@ -6479,6 +6686,8 @@ var useViewportContainer = ({
   });
   const zoomRafRef = useRef(null);
   const lastPushedZoomRef = useRef(null);
+  const initializedZoomRef = useRef(false);
+  const appliedZoomRef = useRef(1);
   const updateTransform = useCallback(
     (zoomUpdate) => {
       if (!elementRef.current || !containerRef.current || !elementWrapperRef.current) {
@@ -6508,17 +6717,36 @@ var useViewportContainer = ({
       elementWrapperRef.current.style.height = `${naturalHeight * zoom2}px`;
       containerRef.current.scrollTop = translateY;
       containerRef.current.scrollLeft = translateX;
-      if (zoomUpdate && zoomRafRef.current === null) {
-        zoomRafRef.current = requestAnimationFrame(() => {
-          zoomRafRef.current = null;
-          const z = transformations.current.zoom;
-          lastPushedZoomRef.current = z;
-          updateZoom(() => z);
-        });
+      appliedZoomRef.current = zoom2;
+      if (zoomUpdate) {
+        lastPushedZoomRef.current = zoom2;
+        updateZoom(() => zoom2);
       }
     },
     [containerRef, elementRef, elementWrapperRef, updateZoom, store]
   );
+  useLayoutEffect(() => {
+    const viewport = containerRef.current;
+    if (!viewport) return;
+    return registerViewportZoom(viewport, (nextZoom) => {
+      if (initializedZoomRef.current && appliedZoomRef.current === nextZoom && zoomRafRef.current === null)
+        return;
+      if (zoomRafRef.current !== null) {
+        cancelAnimationFrame(zoomRafRef.current);
+        zoomRafRef.current = null;
+      }
+      lastPushedZoomRef.current = null;
+      const previousZoom = initializedZoomRef.current ? appliedZoomRef.current : store.getState().zoom;
+      const ratio = previousZoom > 0 && Number.isFinite(previousZoom) ? nextZoom / previousZoom : 1;
+      transformations.current = {
+        zoom: nextZoom,
+        translateX: viewport.scrollLeft * ratio,
+        translateY: viewport.scrollTop * ratio
+      };
+      initializedZoomRef.current = true;
+      updateTransform();
+    });
+  }, [containerRef, store, updateTransform]);
   useEffect(() => {
     if (USE_LAYOUT_ZOOM && gestureTransformAppliedRef.current && !isPinching)
       updateTransform();
@@ -6531,6 +6759,16 @@ var useViewportContainer = ({
     };
   }, []);
   useEffect(() => {
+    if (!initializedZoomRef.current && containerRef.current) {
+      initializedZoomRef.current = true;
+      transformations.current = {
+        zoom,
+        translateX: containerRef.current.scrollLeft,
+        translateY: containerRef.current.scrollTop
+      };
+      updateTransform();
+      return;
+    }
     if (transformations.current.zoom === zoom || !containerRef.current) {
       return;
     }
@@ -6543,7 +6781,7 @@ var useViewportContainer = ({
       zoomRafRef.current = null;
     }
     lastPushedZoomRef.current = null;
-    const prevZoom = transformations.current.zoom;
+    const prevZoom = appliedZoomRef.current;
     if (!prevZoom || !Number.isFinite(prevZoom)) {
       transformations.current = {
         translateX: containerRef.current.scrollLeft,
@@ -6683,11 +6921,26 @@ var useViewportContainer = ({
           translateY: newTranslateY
         };
         newMemo.lastZoom = newZoom;
-        updateTransform(true);
+        if (zoomRafRef.current === null) {
+          zoomRafRef.current = requestAnimationFrame(() => {
+            zoomRafRef.current = null;
+            updateTransform(true);
+          });
+        }
         return newMemo;
       },
       onPinchStart: () => setIsPinching(true),
-      onPinchEnd: () => setIsPinching(false)
+      onPinchEnd: () => {
+        const pendingFrame = zoomRafRef.current !== null;
+        if (zoomRafRef.current !== null) {
+          cancelAnimationFrame(zoomRafRef.current);
+          zoomRafRef.current = null;
+        }
+        setIsPinching(false);
+        if (pendingFrame || gestureTransformAppliedRef.current) {
+          updateTransform(pendingFrame);
+        }
+      }
     },
     {
       target: containerRef
@@ -6740,6 +6993,7 @@ var Pages = ({
   const [tempItems, setTempItems] = useState([]);
   const viewports = usePdf((state) => state.viewports);
   const numPages = usePdf((state) => state.pdfDocumentProxy.numPages);
+  const initialPage = usePdf((state) => state.initialPage);
   const isPinching = usePdf((state) => state.isPinching);
   const elementWrapperRef = useRef(null);
   const elementRef = useRef(null);
@@ -6751,7 +7005,7 @@ var Pages = ({
   });
   const setVirtualizer = usePdf((state) => state.setVirtualizer);
   const { scrollToFn } = useScrollFn();
-  const { observeElementOffset } = useObserveElement();
+  const { observeElementOffset, observeElementRect } = useObserveElement();
   const viewportsRef = useRef(viewports);
   viewportsRef.current = viewports;
   const estimateSize = useCallback(
@@ -6763,15 +7017,22 @@ var Pages = ({
     []
     // Stable — reads from ref
   );
+  const [startingOffset] = useState(
+    () => initialOffset ?? viewports.slice(0, initialPage - 1).reduce(
+      (offset3, viewport) => offset3 + viewport.height + EXTRA_HEIGHT + gap,
+      0
+    )
+  );
   const virtualizer = useVirtualizer({
     count: numPages || 0,
     getScrollElement: () => containerRef.current,
     estimateSize,
     observeElementOffset,
+    observeElementRect,
     overscan: virtualizerOptions?.overscan ?? 0,
     scrollToFn,
     gap,
-    initialOffset,
+    initialOffset: startingOffset,
     // Never trust scrollend alone to reset isScrolling: a single missed
     // event (a documented browser flake — TanStack flipped this default to
     // false in later 3.x) would pin isScrolling=true forever, and every
@@ -6779,6 +7040,21 @@ var Pages = ({
     // false keeps the isScrollingResetDelay debounce active as a fallback.
     useScrollendEvent: false
   });
+  const previousViewports = useRef(viewports);
+  useLayoutEffect(() => {
+    if (isPinching) return;
+    const previous = previousViewports.current;
+    previousViewports.current = viewports;
+    if (previous === viewports) return;
+    let resized = false;
+    for (let index = 0; index < viewports.length; index++) {
+      if (previous[index]?.height !== viewports[index]?.height) {
+        virtualizer.resizeItem(index, viewports[index].height + EXTRA_HEIGHT);
+        resized = true;
+      }
+    }
+    if (resized) setTempItems([]);
+  }, [viewports, virtualizer, isPinching]);
   useEffect(() => {
     if (onOffsetChange && virtualizer.scrollOffset)
       onOffsetChange(virtualizer.scrollOffset);
@@ -6925,6 +7201,164 @@ async function mapConcurrent(items, concurrency, map, isCancelled = () => false)
   return results;
 }
 
+// src/lib/page-resources.ts
+var PageResources = class {
+  constructor(document2, firstPage, rotation, onError, concurrency = 16) {
+    this.document = document2;
+    this.rotation = rotation;
+    this.onError = onError;
+    this.concurrency = concurrency;
+    this.pages.set(firstPage.pageNumber, firstPage);
+    const viewport = this.viewportFor(firstPage);
+    this.viewports = Array.from({ length: document2.numPages }, () => viewport);
+    if (document2.numPages === 1) this.completePages = [firstPage];
+  }
+  pages = /* @__PURE__ */ new Map();
+  requests = /* @__PURE__ */ new Map();
+  queue = [];
+  active = 0;
+  disposed = false;
+  listeners = /* @__PURE__ */ new Set();
+  notification;
+  viewports;
+  completePages;
+  viewportUpdates = /* @__PURE__ */ new Map();
+  viewportFor(page) {
+    return page.getViewport({
+      scale: 1,
+      rotation: this.rotation + (page.rotate || 0)
+    });
+  }
+  get(pageNumber) {
+    return this.pages.get(pageNumber);
+  }
+  getSnapshot = () => ({
+    viewports: this.viewports,
+    pageProxies: this.completePages
+  });
+  subscribe = (listener) => {
+    this.listeners.add(listener);
+    return () => {
+      this.listeners.delete(listener);
+    };
+  };
+  /** Visible pages move ahead of the background queue; in-flight requests are shared. */
+  load = (pageNumber) => {
+    if (this.disposed)
+      return Promise.reject(new Error("Document page loading was cancelled"));
+    if (!Number.isInteger(pageNumber) || pageNumber < 1 || pageNumber > this.document.numPages)
+      return Promise.reject(
+        new RangeError(`Page ${pageNumber} does not exist`)
+      );
+    const page = this.pages.get(pageNumber);
+    if (page) return Promise.resolve(page);
+    const existing = this.requests.get(pageNumber);
+    if (existing) {
+      const queued = this.queue.indexOf(pageNumber);
+      if (queued > 0) {
+        this.queue.splice(queued, 1);
+        this.queue.unshift(pageNumber);
+      }
+      return existing.promise;
+    }
+    const request = this.createRequest(pageNumber);
+    this.queue.unshift(pageNumber);
+    this.pump();
+    return request.promise;
+  };
+  createRequest(pageNumber) {
+    let resolve;
+    let reject;
+    const promise = new Promise((res, rej) => {
+      resolve = res;
+      reject = rej;
+    });
+    const request = { promise, resolve, reject };
+    this.requests.set(pageNumber, request);
+    return request;
+  }
+  /** Start after the reader mounts, so unrelated page metadata cannot delay its first render. */
+  start = () => {
+    if (this.disposed) return;
+    for (let pageNumber = 1; pageNumber <= this.document.numPages; pageNumber++) {
+      if (this.pages.has(pageNumber) || this.requests.has(pageNumber)) continue;
+      const request = this.createRequest(pageNumber);
+      void request.promise.catch(() => {
+      });
+      this.queue.push(pageNumber);
+    }
+    this.pump();
+  };
+  loadAll = async () => {
+    if (this.disposed) throw new Error("Document page loading was cancelled");
+    if (this.completePages) return this.completePages;
+    this.start();
+    await Promise.all(
+      Array.from({ length: this.document.numPages }, (_, index) => {
+        const pageNumber = index + 1;
+        return this.pages.get(pageNumber) ?? this.requests.get(pageNumber).promise;
+      })
+    );
+    return this.completePages;
+  };
+  pump() {
+    while (!this.disposed && this.active < this.concurrency && this.queue.length) {
+      const pageNumber = this.queue.shift();
+      const request = this.requests.get(pageNumber);
+      this.active++;
+      void Promise.resolve().then(() => {
+        if (this.disposed)
+          throw new Error("Document page loading was cancelled");
+        return this.document.getPage(pageNumber);
+      }).then((page) => {
+        if (this.disposed) return;
+        const viewport = this.viewportFor(page);
+        this.pages.set(pageNumber, page);
+        this.viewportUpdates.set(pageNumber - 1, viewport);
+        if (this.pages.size === this.document.numPages) {
+          this.completePages = Array.from(
+            { length: this.document.numPages },
+            (_, index) => this.pages.get(index + 1)
+          );
+        }
+        this.requests.delete(pageNumber);
+        request.resolve(page);
+        this.notify();
+      }).catch((error) => {
+        if (!this.disposed) {
+          this.requests.delete(pageNumber);
+          request.reject(error);
+          this.onError(error);
+        }
+      }).finally(() => {
+        this.active--;
+        this.pump();
+      });
+    }
+  }
+  notify() {
+    if (this.notification !== void 0) return;
+    this.notification = setTimeout(() => {
+      this.notification = void 0;
+      if (this.disposed) return;
+      this.viewports = this.viewports.slice();
+      for (const [index, viewport] of this.viewportUpdates)
+        this.viewports[index] = viewport;
+      this.viewportUpdates.clear();
+      for (const listener of this.listeners) listener();
+    }, 0);
+  }
+  dispose = () => {
+    this.disposed = true;
+    clearTimeout(this.notification);
+    this.listeners.clear();
+    this.queue = [];
+    for (const request of this.requests.values())
+      request.reject(new Error("Document page loading was cancelled"));
+    this.requests.clear();
+  };
+};
+
 // src/lib/pdfjs.ts
 var pdfJsPromise = null;
 var loadPdfJs = () => {
@@ -7050,6 +7484,8 @@ var usePDFDocumentContext = ({
   onError,
   source,
   initialRotation = 0,
+  progressive = false,
+  initialPage = 1,
   isZoomFitWidth,
   zoom = 1,
   zoomOptions,
@@ -7072,7 +7508,32 @@ var usePDFDocumentContext = ({
   darkModeColorsRef.current = darkModeColors;
   useEffect(() => {
     let isDisposed = false;
+    let pageResources;
     const generateViewports = async (pdf) => {
+      const firstPageNumber = Number.isFinite(initialPage) ? Math.max(1, Math.min(pdf.numPages, Math.trunc(initialPage))) : 1;
+      if (progressive) {
+        const firstPage = await pdf.getPage(firstPageNumber);
+        if (isDisposed) return;
+        pageResources = new PageResources(pdf, firstPage, rotation, (error) => {
+          if (isDisposed) return;
+          console.error("Error generating PDF viewports", error);
+          onErrorRef.current?.({ error, phase: "viewport-generation", source });
+        });
+        setInitialState({
+          isZoomFitWidth,
+          viewports: pageResources.getSnapshot().viewports,
+          pageProxies: pageResources.getSnapshot().pageProxies ?? [],
+          pdfDocumentProxy: pdf,
+          zoom,
+          zoomOptions,
+          pageResources,
+          initialPage: firstPageNumber,
+          colorScheme: colorSchemeRef.current,
+          darkModeColors: darkModeColorsRef.current,
+          renderColorMapRef
+        });
+        return;
+      }
       const pageProxies = [];
       const viewports = await mapConcurrent(
         Array.from({ length: pdf.numPages }, (_, index) => index),
@@ -7098,6 +7559,7 @@ var usePDFDocumentContext = ({
         pdfDocumentProxy: pdf,
         zoom,
         zoomOptions,
+        initialPage: firstPageNumber,
         colorScheme: colorSchemeRef.current,
         darkModeColors: darkModeColorsRef.current,
         renderColorMapRef
@@ -7160,6 +7622,7 @@ var usePDFDocumentContext = ({
       });
       return () => {
         isDisposed = true;
+        pageResources?.dispose();
         void loadingTask?.destroy();
       };
     };
@@ -7201,6 +7664,28 @@ var ColorSchemeSync = ({
   ]);
   return null;
 };
+var PageResourcesSync = ({ resources }) => {
+  const store = PDFStore.useContext();
+  useEffect(() => {
+    if (!resources) return;
+    const update = () => {
+      const snapshot = resources.getSnapshot();
+      store.setState((state) => ({
+        viewports: snapshot.viewports,
+        pageProxies: snapshot.pageProxies ?? state.pageProxies,
+        pagesLoaded: Boolean(snapshot.pageProxies)
+      }));
+    };
+    const unsubscribe = resources.subscribe(update);
+    update();
+    const timer = setTimeout(resources.start, 0);
+    return () => {
+      clearTimeout(timer);
+      unsubscribe();
+    };
+  }, [resources, store]);
+  return null;
+};
 var Root = forwardRef(
   ({
     children,
@@ -7212,6 +7697,8 @@ var Root = forwardRef(
     zoom,
     zoomOptions,
     documentOptions,
+    progressive,
+    initialPage,
     colorScheme,
     darkModeColors,
     ...props
@@ -7224,6 +7711,8 @@ var Root = forwardRef(
       zoom,
       zoomOptions,
       documentOptions,
+      progressive,
+      initialPage,
       colorScheme,
       darkModeColors
     });
@@ -7239,6 +7728,7 @@ var Root = forwardRef(
       };
     }, [documentId]);
     return /* @__PURE__ */ jsx(Primitive.div, { ref, ...props, children: initialState ? /* @__PURE__ */ jsxs(PDFStore.Provider, { initialValue: initialState, children: [
+      /* @__PURE__ */ jsx(PageResourcesSync, { resources: initialState.pageResources }),
       /* @__PURE__ */ jsx(
         ColorSchemeSync,
         {
@@ -7333,7 +7823,10 @@ var Search = ({
 }) => {
   const [result, setResult] = useState(null);
   const [attempt, setAttempt] = useState(0);
+  const document2 = usePdf((state) => state.pdfDocumentProxy);
   const proxies = usePdf((state) => state.pageProxies);
+  const pagesLoaded = usePdf((state) => state.pagesLoaded);
+  const loadPages = usePdf((state) => state.loadPdfPageProxies);
   const setTextContent = usePdf((state) => state.setTextContent);
   const retry = useCallback(() => {
     setResult(null);
@@ -7342,22 +7835,27 @@ var Search = ({
   useEffect(() => {
     let disposed = false;
     setResult(null);
-    const task = acquireDocumentText(proxies);
-    void task.promise.then((text) => {
-      if (disposed) return;
+    let task;
+    void loadPages().then((pages) => {
+      if (disposed || !pagesLoaded) return;
+      task = acquireDocumentText(pages);
+      return task.promise;
+    }).then((text) => {
+      if (disposed || !text) return;
       setTextContent(text);
-      setResult({ pages: proxies, status: "ready" });
+      setResult({ document: document2, pages: proxies, status: "ready" });
     }).catch((error) => {
       if (disposed) return;
       console.error("Error extracting PDF text", error);
-      setResult({ pages: proxies, status: "error", error });
+      setResult({ document: document2, pages: proxies, status: "error", error });
     });
     return () => {
       disposed = true;
-      task.release();
+      task?.release();
     };
-  }, [proxies, setTextContent, attempt]);
-  if (!result || result.pages !== proxies) return loading;
+  }, [document2, proxies, pagesLoaded, loadPages, setTextContent, attempt]);
+  if (!result || result.document !== document2 || result.pages !== proxies)
+    return loading;
   if (result.status === "error") {
     if (errorFallback) return errorFallback({ error: result.error, retry });
     return /* @__PURE__ */ jsxs("div", { role: "alert", children: [
@@ -7457,7 +7955,7 @@ var useThumbnail = (pageNumber, config = {}) => {
     isVisible
   };
 };
-var Thumbnail = ({
+var LoadedThumbnail = ({
   pageNumber = 1,
   eager = false,
   ...props
@@ -7466,30 +7964,65 @@ var Thumbnail = ({
     isFirstPage: eager || pageNumber < 5
   });
   const { jumpToPage } = usePdfJump();
+  const isCurrentPage = usePdf((state) => state.currentPage === pageNumber);
+  const spacePressed = useRef(false);
   return /* @__PURE__ */ jsx("div", { ref: containerRef, style: { minHeight: "150px", minWidth: "10px" }, children: isVisible && /* @__PURE__ */ jsx(
     Primitive.canvas,
     {
+      "aria-label": `Page ${pageNumber}`,
+      "aria-current": isCurrentPage ? "page" : void 0,
       ...props,
       role: "button",
       tabIndex: 0,
-      onClick: (e) => {
-        if (props.onClick) {
-          props.onClick(e);
-        }
-        jumpToPage(pageNumber, { behavior: "auto" });
+      onClick: (event) => {
+        props.onClick?.(event);
+        if (!event.defaultPrevented)
+          jumpToPage(pageNumber, { behavior: "auto" });
       },
-      onKeyDown: (e) => {
-        if (props.onKeyDown) {
-          props.onKeyDown(e);
+      onKeyDown: (event) => {
+        props.onKeyDown?.(event);
+        if (event.defaultPrevented) return;
+        if (event.key === "Enter") {
+          event.preventDefault();
+          jumpToPage(pageNumber, { behavior: "auto" });
+        } else if (event.key === " ") {
+          event.preventDefault();
+          spacePressed.current = true;
         }
-        if (e.key === "Enter") {
+      },
+      onKeyUp: (event) => {
+        props.onKeyUp?.(event);
+        if (event.key !== " ") return;
+        const activate = spacePressed.current && !event.defaultPrevented;
+        spacePressed.current = false;
+        if (activate) {
+          event.preventDefault();
           jumpToPage(pageNumber, { behavior: "auto" });
         }
       },
+      onBlur: (event) => {
+        spacePressed.current = false;
+        props.onBlur?.(event);
+      },
       ref: canvasRef
     }
   ) });
 };
+var Thumbnail = (props) => /* @__PURE__ */ jsx(
+  PageLoadingBoundary,
+  {
+    pageNumber: props.pageNumber ?? 1,
+    fallback: /* @__PURE__ */ jsx(
+      "div",
+      {
+        "aria-label": `Loading page ${props.pageNumber ?? 1}`,
+        "aria-busy": "true",
+        style: { minHeight: 150 }
+      }
+    ),
+    children: /* @__PURE__ */ jsx(LoadedThumbnail, { ...props })
+  }
+);
 function VirtualizedThumbnails({
   children,
   count,
@@ -7502,6 +8035,9 @@ function VirtualizedThumbnails({
   const containerRef = useRef(null);
   useImperativeHandle(ref, () => containerRef.current);
   const [focusPage, setFocusPage] = useState(null);
+  const focusPageLoaded = usePdf(
+    (state) => focusPage === null ? false : state.isPageLoaded(focusPage)
+  );
   const itemHeight = Number.isFinite(virtualize.itemHeight) ? Math.max(1, virtualize.itemHeight) : 150;
   const virtualizer = useVirtualizer({
     count,
@@ -7519,7 +8055,7 @@ function VirtualizedThumbnails({
       canvas.focus({ preventScroll: true });
       setFocusPage(null);
     }
-  }, [focusPage, items]);
+  }, [focusPage, focusPageLoaded, items]);
   return /* @__PURE__ */ jsx(
     Primitive.div,
     {
@@ -7652,12 +8188,42 @@ var CurrentZoom = ({ ...props }) => {
 // src/lib/search.ts
 var normalizedPages = /* @__PURE__ */ new WeakMap();
 function normalize(page) {
-  let cached = normalizedPages.get(page);
-  if (!cached || cached.text !== page.text) {
-    cached = { text: page.text, lower: page.text.toLowerCase() };
-    normalizedPages.set(page, cached);
-  }
-  return cached.lower;
+  const cached = normalizedPages.get(page);
+  if (cached?.text === page.text) return cached;
+  const lower = page.text.toLowerCase();
+  const result = { text: page.text, lower };
+  if (lower.length !== page.text.length) {
+    result.starts = new Uint32Array(lower.length);
+    result.ends = new Uint32Array(lower.length);
+    let original = 0;
+    let normalized = 0;
+    for (const character of page.text) {
+      const length = character.toLowerCase().length;
+      for (let i = 0; i < length; i++) {
+        result.starts[normalized + i] = original + (length === character.length ? i : 0);
+        result.ends[normalized + i] = original + (length === character.length ? i + 1 : character.length);
+      }
+      original += character.length;
+      normalized += length;
+    }
+  }
+  normalizedPages.set(page, result);
+  return result;
+}
+function createMatch(page, normalized, start, length, searchText, textSize, score) {
+  const end = Math.min(normalized.lower.length, start + length);
+  const matchIndex = normalized.starts?.[start] ?? start;
+  const matchEnd = normalized.ends?.[end - 1] ?? end;
+  const matchLength = matchEnd - matchIndex;
+  return {
+    pageNumber: page.pageNumber,
+    text: page.text.slice(matchIndex, matchEnd + textSize),
+    score,
+    matchIndex,
+    isExactMatch: score === 1,
+    searchText,
+    ...matchLength !== searchText.length ? { matchLength } : {}
+  };
 }
 function createBoundedDistance(query, maxDistance) {
   const length = query.length;
@@ -7720,7 +8286,8 @@ function* runSearch(pages, searchText, options = {}, cooperative = false, budget
   let steps = 0;
   let deadline = cooperative ? performance.now() + budget : 0;
   for (const page of pages) {
-    const lower = normalize(page);
+    const normalized = normalize(page);
+    const lower = normalized.lower;
     const exactStarts = [];
     let index = 0;
     while (true) {
@@ -7733,16 +8300,19 @@ function* runSearch(pages, searchText, options = {}, cooperative = false, budget
       exactCount++;
       if (maxDistance > 0) exactStarts.push(matchIndex);
       if (exactMatches.length < limit) {
-        exactMatches.push({
-          pageNumber: page.pageNumber,
-          text: page.text.substr(matchIndex, searchText.length + textSize),
-          score: 1,
-          matchIndex,
-          isExactMatch: true,
-          searchText
-        });
+        exactMatches.push(
+          createMatch(
+            page,
+            normalized,
+            matchIndex,
+            query.length,
+            searchText,
+            textSize,
+            1
+          )
+        );
       }
-      index = matchIndex + searchText.length;
+      index = matchIndex + query.length;
     }
     if (!(maxDistance > 0)) continue;
     index = 0;
@@ -7752,11 +8322,11 @@ function* runSearch(pages, searchText, options = {}, cooperative = false, budget
         yield;
         deadline = performance.now() + budget;
       }
-      while (exactIndex < exactStarts.length && exactStarts[exactIndex] + searchText.length <= index)
+      while (exactIndex < exactStarts.length && exactStarts[exactIndex] + query.length <= index)
         exactIndex++;
       const exactStart = exactStarts[exactIndex];
       if (exactStart !== void 0 && index >= exactStart) {
-        index = exactStart + searchText.length;
+        index = exactStart + query.length;
         continue;
       }
       const edits = distance(lower, index);
@@ -7766,14 +8336,15 @@ function* runSearch(pages, searchText, options = {}, cooperative = false, budget
         if (fuzzyMatches.length < limit || score > (fuzzyMatches[limit - 1]?.score ?? Infinity)) {
           insertMatch(
             fuzzyMatches,
-            {
-              pageNumber: page.pageNumber,
-              text: page.text.substr(index, query.length + textSize),
-              score,
-              matchIndex: index,
-              isExactMatch: false,
-              searchText
-            },
+            createMatch(
+              page,
+              normalized,
+              index,
+              query.length,
+              searchText,
+              textSize,
+              score
+            ),
             limit
           );
         }
@@ -7879,32 +8450,37 @@ var useSearch = () => {
 
 // src/hooks/search/useSearchPosition.tsx
 async function calculateHighlightRects(pageProxy, textMatch) {
-  const matchLength = textMatch.searchText ? textMatch.searchText.length : textMatch.text.length;
-  if (matchLength === 0 || !Number.isFinite(textMatch.matchIndex) || textMatch.matchIndex < 0)
+  const matchLength = textMatch.matchLength ?? (textMatch.searchText ? textMatch.searchText.length : textMatch.text.length);
+  if (!Number.isFinite(matchLength) || matchLength <= 0 || !Number.isFinite(textMatch.matchIndex) || textMatch.matchIndex < 0)
     return [];
   const matchEnd = textMatch.matchIndex + matchLength;
   const reader = pageProxy.streamTextContent().getReader();
   const matchRects = [];
   const viewport = pageProxy.getViewport({ scale: 1 });
+  const styles = {};
   let offset3 = 0;
   let foundEnd = false;
   try {
     read: while (true) {
       const { value, done } = await reader.read();
       if (done) break;
+      Object.assign(styles, value.styles);
       for (const item of value.items) {
         if (!("str" in item) || item.str.length === 0) continue;
         const length = item.str.length;
         const start = Math.max(0, textMatch.matchIndex - offset3);
         const end = Math.min(length, matchEnd - offset3);
-        if (end > start) {
-          matchRects.push({
-            pageNumber: textMatch.pageNumber,
-            left: item.transform[4] + start * (item.width / length),
-            top: viewport.height - (item.transform[5] + item.height),
-            width: (end - start) * (item.width / length),
-            height: item.height
-          });
+        if (end > start && item.str.slice(start, end).trim()) {
+          matchRects.push(
+            getItemRect(
+              item,
+              styles[item.fontName],
+              viewport,
+              start,
+              end,
+              textMatch.pageNumber
+            )
+          );
         }
         offset3 += length;
         if (offset3 >= matchEnd) {
@@ -7921,6 +8497,61 @@ async function calculateHighlightRects(pageProxy, textMatch) {
   }
   return mergeAdjacentRects(matchRects);
 }
+var measurementContext;
+function getTextFractions(item, style, start, end) {
+  const length = item.str.length;
+  let from = start / length;
+  let to = end / length;
+  if ((start > 0 || end < length) && style?.fontFamily && !style.vertical && typeof document !== "undefined") {
+    if (measurementContext === void 0) {
+      const canvas = document.createElement("canvas");
+      canvas.width = canvas.height = 0;
+      measurementContext = canvas.getContext("2d");
+    }
+    if (measurementContext) {
+      measurementContext.font = `100px ${style.fontFamily}`;
+      const width = measurementContext.measureText(item.str).width;
+      if (width > 0) {
+        from = start === 0 ? 0 : measurementContext.measureText(item.str.slice(0, start)).width / width;
+        to = end === length ? 1 : measurementContext.measureText(item.str.slice(0, end)).width / width;
+      }
+    }
+  }
+  return item.dir === "rtl" ? [1 - to, 1 - from] : [from, to];
+}
+function getItemRect(item, style, viewport, start, end, pageNumber) {
+  const angle = Math.atan2(item.transform[1], item.transform[0]) - (style?.vertical ? Math.PI / 2 : 0);
+  const cosine = Math.cos(angle);
+  const sine = Math.sin(angle);
+  const height = Math.hypot(item.transform[2], item.transform[3]);
+  const ascent = (style?.ascent ?? (style?.descent ? 1 + style.descent : 1)) * height;
+  const width = style?.vertical ? item.height : item.width;
+  const [startFraction, endFraction] = getTextFractions(
+    item,
+    style,
+    start,
+    end
+  );
+  const from = startFraction * width;
+  const to = endFraction * width;
+  let left = Infinity;
+  let top = Infinity;
+  let right = -Infinity;
+  let bottom = -Infinity;
+  for (const along of [from, to]) {
+    for (const above of [ascent, ascent - height]) {
+      const [x, y] = viewport.convertToViewportPoint(
+        item.transform[4] + along * cosine - above * sine,
+        item.transform[5] + along * sine + above * cosine
+      );
+      left = Math.min(left, x);
+      top = Math.min(top, y);
+      right = Math.max(right, x);
+      bottom = Math.max(bottom, y);
+    }
+  }
+  return { pageNumber, left, top, width: right - left, height: bottom - top };
+}
 function mergeAdjacentRects(rects) {
   if (rects.length <= 1) return rects;
   const merged = [];
@@ -7929,10 +8560,13 @@ function mergeAdjacentRects(rects) {
   for (let i = 1; i < rects.length; i++) {
     const next = rects[i];
     if (!next) continue;
-    if (Math.abs(current.top - next.top) < 2 && Math.abs(current.height - next.height) < 2) {
+    if (Math.abs(current.top - next.top) < 2 && Math.abs(current.height - next.height) < 2 && Math.max(current.left, next.left) <= Math.min(current.left + current.width, next.left + next.width) + 2) {
       current = {
         ...current,
-        width: next.left + next.width - current.left
+        left: Math.min(current.left, next.left),
+        top: Math.min(current.top, next.top),
+        width: Math.max(current.left + current.width, next.left + next.width) - Math.min(current.left, next.left),
+        height: Math.max(current.top + current.height, next.top + next.height) - Math.min(current.top, next.top)
       };
     } else {
       merged.push(current);