@embedpdf/plugin-selection 2.6.0 → 2.6.2

package/dist/index.js

@@ -21,6 +21,7 @@ const END_SELECTION = "SELECTION/END_SELECTION";
 const CLEAR_SELECTION = "SELECTION/CLEAR_SELECTION";
 const SET_RECTS = "SELECTION/SET_RECTS";
 const SET_SLICES = "SELECTION/SET_SLICES";
+const EVICT_PAGE_GEOMETRY = "SELECTION/EVICT_PAGE_GEOMETRY";
 const RESET = "SELECTION/RESET";
 const initSelectionState = (documentId, state) => ({
   type: INIT_SELECTION_STATE,
@@ -55,6 +56,10 @@ const setRects = (documentId, allRects) => ({
   payload: { documentId, rects: allRects }
 });
 const setSlices = (documentId, slices) => ({ type: SET_SLICES, payload: { documentId, slices } });
+const evictPageGeometry = (documentId, pages) => ({
+  type: EVICT_PAGE_GEOMETRY,
+  payload: { documentId, pages }
+});
 const initialSelectionDocumentState = {
   geometry: {},
   rects: {},
@@ -147,6 +152,20 @@ const selectionReducer = (state = initialState, action) => {
       if (!docState) return state;
       return updateDocState(state, documentId, { ...docState, slices });
     }
+    case EVICT_PAGE_GEOMETRY: {
+      const { documentId, pages } = action.payload;
+      const docState = state.documents[documentId];
+      if (!docState) return state;
+      const geometry = { ...docState.geometry };
+      const rects = { ...docState.rects };
+      const slices = { ...docState.slices };
+      for (const p of pages) {
+        delete geometry[p];
+        delete rects[p];
+        delete slices[p];
+      }
+      return updateDocState(state, documentId, { ...docState, geometry, rects, slices });
+    }
     case RESET: {
       const { documentId } = action.payload;
       const docState = state.documents[documentId];
@@ -197,18 +216,67 @@ function getFormattedSelection(state) {
   }
   return result;
 }
-function glyphAt(geo, pt) {
+function glyphAt(geo, pt, toleranceFactor = 1.5) {
   for (const run of geo.runs) {
     const inRun = pt.y >= run.rect.y && pt.y <= run.rect.y + run.rect.height && pt.x >= run.rect.x && pt.x <= run.rect.x + run.rect.width;
     if (!inRun) continue;
-    const rel = run.glyphs.findIndex(
-      (g) => pt.x >= g.x && pt.x <= g.x + g.width && pt.y >= g.y && pt.y <= g.y + g.height
-    );
+    const rel = run.glyphs.findIndex((g) => {
+      const gx = g.tightX ?? g.x;
+      const gy = g.tightY ?? g.y;
+      const gw = g.tightWidth ?? g.width;
+      const gh = g.tightHeight ?? g.height;
+      return pt.x >= gx && pt.x <= gx + gw && pt.y >= gy && pt.y <= gy + gh;
+    });
     if (rel !== -1) {
       return run.charStart + rel;
     }
   }
-  return -1;
+  if (toleranceFactor <= 0) return -1;
+  const tolerance = computeTolerance(geo, toleranceFactor);
+  const halfTol = tolerance / 2;
+  let bestIndex = -1;
+  let bestDist = Infinity;
+  for (const run of geo.runs) {
+    if (pt.y < run.rect.y - halfTol || pt.y > run.rect.y + run.rect.height + halfTol || pt.x < run.rect.x - halfTol || pt.x > run.rect.x + run.rect.width + halfTol) {
+      continue;
+    }
+    for (let i = 0; i < run.glyphs.length; i++) {
+      const g = run.glyphs[i];
+      if (g.flags === 2) continue;
+      const gx = g.tightX ?? g.x;
+      const gy = g.tightY ?? g.y;
+      const gw = g.tightWidth ?? g.width;
+      const gh = g.tightHeight ?? g.height;
+      const expandedLeft = gx - halfTol;
+      const expandedRight = gx + gw + halfTol;
+      const expandedTop = gy - halfTol;
+      const expandedBottom = gy + gh + halfTol;
+      if (pt.x < expandedLeft || pt.x > expandedRight || pt.y < expandedTop || pt.y > expandedBottom) {
+        continue;
+      }
+      const curXdif = Math.min(Math.abs(pt.x - gx), Math.abs(pt.x - (gx + gw)));
+      const curYdif = Math.min(Math.abs(pt.y - gy), Math.abs(pt.y - (gy + gh)));
+      const dist = curXdif + curYdif;
+      if (dist < bestDist) {
+        bestDist = dist;
+        bestIndex = run.charStart + i;
+      }
+    }
+  }
+  return bestIndex;
+}
+function computeTolerance(geo, factor) {
+  let totalHeight = 0;
+  let count = 0;
+  for (const run of geo.runs) {
+    for (const g of run.glyphs) {
+      if (g.flags === 2) continue;
+      totalHeight += g.height;
+      count++;
+    }
+  }
+  if (count === 0) return 0;
+  return totalHeight / count * factor;
 }
 function sliceBounds(sel, geo, page) {
   if (!sel || !geo) return null;
@@ -221,6 +289,7 @@ function sliceBounds(sel, geo, page) {
 }
 function rectsWithinSlice(geo, from, to, merge = true) {
   const textRuns = [];
+  const CHAR_DISTANCE_FACTOR = 2.5;
   for (const run of geo.runs) {
     const runStart = run.charStart;
     const runEnd = runStart + run.glyphs.length - 1;
@@ -230,24 +299,46 @@ function rectsWithinSlice(geo, from, to, merge = true) {
     let minX = Infinity, maxX = -Infinity;
     let minY = Infinity, maxY = -Infinity;
     let charCount = 0;
+    let widthSum = 0;
+    let prevRight = -Infinity;
+    const flushSubRun = () => {
+      if (minX !== Infinity && charCount > 0) {
+        textRuns.push({
+          rect: {
+            origin: { x: minX, y: minY },
+            size: { width: maxX - minX, height: maxY - minY }
+          },
+          charCount,
+          fontSize: run.fontSize
+        });
+      }
+      minX = Infinity;
+      maxX = -Infinity;
+      minY = Infinity;
+      maxY = -Infinity;
+      charCount = 0;
+      widthSum = 0;
+      prevRight = -Infinity;
+    };
     for (let i = sIdx; i <= eIdx; i++) {
       const g = run.glyphs[i];
       if (g.flags === 2) continue;
+      if (charCount > 0 && prevRight > -Infinity) {
+        const gap = Math.abs(g.x - prevRight);
+        const avgWidth = widthSum / charCount;
+        if (avgWidth > 0 && gap > CHAR_DISTANCE_FACTOR * avgWidth) {
+          flushSubRun();
+        }
+      }
       minX = Math.min(minX, g.x);
       maxX = Math.max(maxX, g.x + g.width);
       minY = Math.min(minY, g.y);
       maxY = Math.max(maxY, g.y + g.height);
       charCount++;
+      widthSum += g.width;
+      prevRight = g.x + g.width;
     }
-    if (minX !== Infinity && charCount > 0) {
-      textRuns.push({
-        rect: {
-          origin: { x: minX, y: minY },
-          size: { width: maxX - minX, height: maxY - minY }
-        },
-        charCount
-      });
-    }
+    flushSubRun();
   }
   if (!merge) {
     return textRuns.map((run) => run.rect);
@@ -289,6 +380,13 @@ function getVerticalOverlap(rect1, rect2) {
   return intersectRect.size.height / unionRect.size.height;
 }
 function shouldMergeHorizontalRects(textRun1, textRun2) {
+  const FONT_SIZE_RATIO_THRESHOLD = 1.5;
+  if (textRun1.fontSize != null && textRun2.fontSize != null && textRun1.fontSize > 0 && textRun2.fontSize > 0) {
+    const ratio = Math.max(textRun1.fontSize, textRun2.fontSize) / Math.min(textRun1.fontSize, textRun2.fontSize);
+    if (ratio > FONT_SIZE_RATIO_THRESHOLD) {
+      return false;
+    }
+  }
   const VERTICAL_OVERLAP_THRESHOLD = 0.8;
   const rect1 = textRun1.rect;
   const rect2 = textRun2.rect;
@@ -326,39 +424,178 @@ function mergeAdjacentRects(textRuns) {
   }
   return results;
 }
+const VERTICAL_OVERLAP_THRESHOLD_LINE = 0.5;
+function resolveCharIndex(geo, charIndex) {
+  for (let r = 0; r < geo.runs.length; r++) {
+    const run = geo.runs[r];
+    const localIdx = charIndex - run.charStart;
+    if (localIdx >= 0 && localIdx < run.glyphs.length) {
+      return { runIdx: r, localIdx };
+    }
+  }
+  return null;
+}
+function isGlyphWordBoundary(flags) {
+  return flags === 1 || flags === 2;
+}
+function expandToWordBoundary(geo, charIndex) {
+  const resolved = resolveCharIndex(geo, charIndex);
+  if (!resolved) return null;
+  const totalChars = getTotalCharCount(geo);
+  if (totalChars === 0) return null;
+  let from = charIndex;
+  while (from > 0) {
+    const prev = resolveCharIndex(geo, from - 1);
+    if (!prev) break;
+    if (isGlyphWordBoundary(geo.runs[prev.runIdx].glyphs[prev.localIdx].flags)) break;
+    from--;
+  }
+  let to = charIndex;
+  while (to < totalChars - 1) {
+    const next = resolveCharIndex(geo, to + 1);
+    if (!next) break;
+    if (isGlyphWordBoundary(geo.runs[next.runIdx].glyphs[next.localIdx].flags)) break;
+    to++;
+  }
+  return { from, to };
+}
+function expandToLineBoundary(geo, charIndex) {
+  const resolved = resolveCharIndex(geo, charIndex);
+  if (!resolved) return null;
+  const anchorRun = geo.runs[resolved.runIdx];
+  const anchorTop = anchorRun.rect.y;
+  const anchorBottom = anchorRun.rect.y + anchorRun.rect.height;
+  let from = anchorRun.charStart;
+  let to = anchorRun.charStart + anchorRun.glyphs.length - 1;
+  for (let r = resolved.runIdx - 1; r >= 0; r--) {
+    const run = geo.runs[r];
+    if (isZeroSizeRun(run)) continue;
+    if (!runsOverlapVertically(run.rect.y, run.rect.y + run.rect.height, anchorTop, anchorBottom)) {
+      break;
+    }
+    from = run.charStart;
+  }
+  for (let r = resolved.runIdx + 1; r < geo.runs.length; r++) {
+    const run = geo.runs[r];
+    if (isZeroSizeRun(run)) continue;
+    if (!runsOverlapVertically(run.rect.y, run.rect.y + run.rect.height, anchorTop, anchorBottom)) {
+      break;
+    }
+    to = run.charStart + run.glyphs.length - 1;
+  }
+  return { from, to };
+}
+function isZeroSizeRun(run) {
+  return run.rect.width === 0 && run.rect.height === 0;
+}
+function runsOverlapVertically(top1, bottom1, top2, bottom2) {
+  const unionHeight = Math.max(bottom1, bottom2) - Math.min(top1, top2);
+  const intersectHeight = Math.max(0, Math.min(bottom1, bottom2) - Math.max(top1, top2));
+  if (unionHeight === 0) return false;
+  return intersectHeight / unionHeight >= VERTICAL_OVERLAP_THRESHOLD_LINE;
+}
+function getTotalCharCount(geo) {
+  if (geo.runs.length === 0) return 0;
+  const lastRun = geo.runs[geo.runs.length - 1];
+  return lastRun.charStart + lastRun.glyphs.length;
+}
+const TRIPLE_CLICK_INTERVAL_MS = 500;
 function createTextSelectionHandler(opts) {
+  const minDrag = opts.minDragDistance ?? 3;
+  const tolFactor = opts.toleranceFactor ?? 1.5;
+  let anchorGlyph = null;
+  let anchorPos = null;
+  let dragStarted = false;
+  let lastDblClickTime = 0;
+  function reset() {
+    var _a;
+    anchorGlyph = null;
+    anchorPos = null;
+    dragStarted = false;
+    (_a = opts.setHasTextAnchor) == null ? void 0 : _a.call(opts, false);
+  }
   return {
     onPointerDown: (point, evt, modeId) => {
-      var _a;
+      var _a, _b;
       if (evt.target === evt.currentTarget) {
         (_a = opts.onEmptySpaceClick) == null ? void 0 : _a.call(opts, modeId);
       }
       if (!opts.isEnabled(modeId)) return;
-      opts.onClear(modeId);
+      const now = Date.now();
+      if (lastDblClickTime === 0 || now - lastDblClickTime >= TRIPLE_CLICK_INTERVAL_MS) {
+        opts.onClear(modeId);
+      }
       const geo = opts.getGeometry();
-      if (geo) {
-        const g = glyphAt(geo, point);
-        if (g !== -1) {
-          opts.onBegin(g, modeId);
-        }
+      if (!geo) return;
+      const g = glyphAt(geo, point, tolFactor);
+      if (g !== -1) {
+        anchorGlyph = g;
+        anchorPos = point;
+        dragStarted = false;
+        (_b = opts.setHasTextAnchor) == null ? void 0 : _b.call(opts, true);
       }
     },
     onPointerMove: (point, _evt, modeId) => {
       if (!opts.isEnabled(modeId)) return;
       const geo = opts.getGeometry();
-      if (geo) {
-        const g = glyphAt(geo, point);
-        opts.setCursor(g !== -1 ? "text" : null);
-        if (opts.isSelecting() && g !== -1) {
-          opts.onUpdate(g, modeId);
+      if (!geo) return;
+      const g = glyphAt(geo, point, tolFactor);
+      opts.setCursor(g !== -1 ? "text" : null);
+      if (anchorGlyph !== null && anchorPos && !dragStarted) {
+        const dx = point.x - anchorPos.x;
+        const dy = point.y - anchorPos.y;
+        const dist = Math.sqrt(dx * dx + dy * dy);
+        if (dist >= minDrag) {
+          dragStarted = true;
+          opts.onBegin(anchorGlyph, modeId);
+          if (g !== -1) {
+            opts.onUpdate(g, modeId);
+          }
         }
+        return;
+      }
+      if (opts.isSelecting() && g !== -1) {
+        opts.onUpdate(g, modeId);
       }
     },
     onPointerUp: (_point, _evt, modeId) => {
+      if (!opts.isEnabled(modeId)) {
+        reset();
+        return;
+      }
+      if (dragStarted) {
+        opts.onEnd(modeId);
+      }
+      reset();
+    },
+    onDoubleClick: (point, _evt, modeId) => {
+      var _a;
+      if (!opts.isEnabled(modeId)) return;
+      const geo = opts.getGeometry();
+      if (!geo) return;
+      const g = glyphAt(geo, point, tolFactor);
+      if (g === -1) return;
+      lastDblClickTime = Date.now();
+      (_a = opts.onWordSelect) == null ? void 0 : _a.call(opts, g, modeId);
+    },
+    onClick: (point, _evt, modeId) => {
+      var _a;
       if (!opts.isEnabled(modeId)) return;
-      opts.onEnd(modeId);
+      if (lastDblClickTime === 0) return;
+      const now = Date.now();
+      if (now - lastDblClickTime > TRIPLE_CLICK_INTERVAL_MS) {
+        lastDblClickTime = 0;
+        return;
+      }
+      lastDblClickTime = 0;
+      const geo = opts.getGeometry();
+      if (!geo) return;
+      const g = glyphAt(geo, point, tolFactor);
+      if (g === -1) return;
+      (_a = opts.onLineSelect) == null ? void 0 : _a.call(opts, g, modeId);
     },
     onHandlerActiveEnd: (modeId) => {
+      reset();
       if (!opts.isEnabled(modeId)) return;
       opts.onClear(modeId);
     }
@@ -420,8 +657,10 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
     this.enabledModesPerDoc = /* @__PURE__ */ new Map();
     this.selecting = /* @__PURE__ */ new Map();
     this.anchor = /* @__PURE__ */ new Map();
+    this.hasTextAnchor = /* @__PURE__ */ new Map();
     this.marqueePage = /* @__PURE__ */ new Map();
     this.pageCallbacks = /* @__PURE__ */ new Map();
+    this.geoAccessOrder = /* @__PURE__ */ new Map();
     this.menuPlacement$ = createScopedEmitter((documentId, placement) => ({ documentId, placement }));
     this.selChange$ = createScopedEmitter((documentId, selection) => ({
       documentId,
@@ -520,14 +759,18 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       ])
     );
     this.pageCallbacks.set(documentId, /* @__PURE__ */ new Map());
+    this.geoAccessOrder.set(documentId, []);
     this.selecting.set(documentId, false);
     this.anchor.set(documentId, void 0);
+    this.hasTextAnchor.set(documentId, false);
   }
   onDocumentClosed(documentId) {
     this.dispatch(cleanupSelectionState(documentId));
     this.enabledModesPerDoc.delete(documentId);
     this.pageCallbacks.delete(documentId);
+    this.geoAccessOrder.delete(documentId);
     this.selecting.delete(documentId);
+    this.hasTextAnchor.delete(documentId);
     this.anchor.delete(documentId);
     this.marqueePage.delete(documentId);
     this.selChange$.clearScope(documentId);
@@ -659,6 +902,22 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       rects: selectRectsForPage(docState, pageIndex),
       boundingRect: selectBoundingRectForPage(docState, pageIndex)
     });
+    geoTask.wait((geo) => {
+      const currentState = this.getDocumentState(documentId);
+      const sel = currentState.selection;
+      if (!sel || pageIndex < sel.start.page || pageIndex > sel.end.page) return;
+      const sb = sliceBounds(sel, geo, pageIndex);
+      if (!sb) return;
+      const pageRects = rectsWithinSlice(geo, sb.from, sb.to);
+      this.dispatch(setRects(documentId, { ...currentState.rects, [pageIndex]: pageRects }));
+      this.dispatch(
+        setSlices(documentId, {
+          ...currentState.slices,
+          [pageIndex]: { start: sb.from, count: sb.to - sb.from + 1 }
+        })
+      );
+      this.notifyPage(documentId, pageIndex);
+    }, ignore);
     const textHandler = createTextSelectionHandler({
       getGeometry: () => this.getDocumentState(documentId).geometry[pageIndex],
       isEnabled: (modeId) => {
@@ -672,7 +931,12 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       onClear: (modeId) => this.clearSelection(documentId, modeId),
       isSelecting: () => this.selecting.get(documentId) ?? false,
       setCursor: (cursor) => cursor ? interactionScope.setCursor("selection-text", cursor, 10) : interactionScope.removeCursor("selection-text"),
-      onEmptySpaceClick: (modeId) => this.emptySpaceClick$.emit(documentId, { pageIndex, modeId })
+      onEmptySpaceClick: (modeId) => this.emptySpaceClick$.emit(documentId, { pageIndex, modeId }),
+      onWordSelect: (g, modeId) => this.selectWord(documentId, pageIndex, g, modeId),
+      onLineSelect: (g, modeId) => this.selectLine(documentId, pageIndex, g, modeId),
+      setHasTextAnchor: (active) => this.hasTextAnchor.set(documentId, active),
+      minDragDistance: this.config.minSelectionDragDistance,
+      toleranceFactor: this.config.toleranceFactor
     });
     const unregisterHandlers = this.interactionManagerCapability.registerAlways({
       scope: { type: "page", documentId, pageIndex },
@@ -739,7 +1003,7 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
         const config = (_a2 = this.enabledModesPerDoc.get(documentId)) == null ? void 0 : _a2.get(modeId);
         return (config == null ? void 0 : config.enableMarquee) === true;
       },
-      isTextSelecting: () => this.selecting.get(documentId) ?? false,
+      isTextSelecting: () => (this.selecting.get(documentId) ?? false) || (this.hasTextAnchor.get(documentId) ?? false),
       onBegin: (pos, modeId) => this.beginMarquee(documentId, pageIndex, pos, modeId),
       onChange: (rect, modeId) => {
         this.updateMarquee(documentId, pageIndex, rect, modeId);
@@ -886,15 +1150,46 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
     const task = this.engine.getPageGeometry(coreDoc.document, page);
     task.wait((geo) => {
       this.dispatch(cachePageGeometry(documentId, pageIdx, geo));
+      this.touchGeometry(documentId, pageIdx);
     }, ignore);
     return task;
   }
   /* ── geometry cache ───────────────────────────────────── */
   getOrLoadGeometry(documentId, pageIdx) {
     const cached = this.getDocumentState(documentId).geometry[pageIdx];
-    if (cached) return PdfTaskHelper.resolve(cached);
+    if (cached) {
+      this.touchGeometry(documentId, pageIdx);
+      return PdfTaskHelper.resolve(cached);
+    }
     return this.getNewPageGeometryAndCache(documentId, pageIdx);
   }
+  /* ── geometry LRU eviction ──────────────────────────────── */
+  touchGeometry(documentId, pageIdx) {
+    const order = this.geoAccessOrder.get(documentId);
+    if (!order) return;
+    const idx = order.indexOf(pageIdx);
+    if (idx > -1) order.splice(idx, 1);
+    order.push(pageIdx);
+    this.evictGeometryIfNeeded(documentId);
+  }
+  evictGeometryIfNeeded(documentId) {
+    const max = this.config.maxCachedGeometries ?? 50;
+    const order = this.geoAccessOrder.get(documentId);
+    if (!order || order.length <= max) return;
+    const pinned = this.pageCallbacks.get(documentId);
+    const toEvict = [];
+    while (order.length - toEvict.length > max) {
+      const candidate = order.find((p) => !toEvict.includes(p) && !(pinned == null ? void 0 : pinned.has(p)));
+      if (candidate === void 0) break;
+      toEvict.push(candidate);
+    }
+    if (toEvict.length === 0) return;
+    for (const p of toEvict) {
+      const idx = order.indexOf(p);
+      if (idx > -1) order.splice(idx, 1);
+    }
+    this.dispatch(evictPageGeometry(documentId, toEvict));
+  }
   /* ── selection state updates ───────────────────────────── */
   beginSelection(documentId, page, index, modeId) {
     this.selecting.set(documentId, true);
@@ -918,6 +1213,43 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
     this.emitMenuPlacement(documentId, null);
     this.notifyAllPages(documentId);
   }
+  selectWord(documentId, page, charIndex, modeId) {
+    const geo = this.getDocumentState(documentId).geometry[page];
+    if (!geo) return;
+    const bounds = expandToWordBoundary(geo, charIndex);
+    if (!bounds) return;
+    this.applyInstantSelection(documentId, page, bounds.from, bounds.to, modeId);
+  }
+  selectLine(documentId, page, charIndex, modeId) {
+    const geo = this.getDocumentState(documentId).geometry[page];
+    if (!geo) return;
+    const bounds = expandToLineBoundary(geo, charIndex);
+    if (!bounds) return;
+    this.applyInstantSelection(documentId, page, bounds.from, bounds.to, modeId);
+  }
+  /**
+   * Set a selection range without going through the drag begin/update/end flow.
+   * Used by double-click (word) and triple-click (line) selection.
+   */
+  applyInstantSelection(documentId, page, from, to, modeId) {
+    const range = {
+      start: { page, index: from },
+      end: { page, index: to }
+    };
+    this.selecting.set(documentId, false);
+    this.anchor.set(documentId, void 0);
+    this.dispatch(startSelection(documentId));
+    this.dispatch(setSelection(documentId, range));
+    this.updateRectsAndSlices(documentId, range);
+    this.dispatch(endSelection(documentId));
+    this.selChange$.emit(documentId, range);
+    this.beginSelection$.emit(documentId, { page, index: from, modeId });
+    this.endSelection$.emit(documentId, { modeId });
+    for (let p = range.start.page; p <= range.end.page; p++) {
+      this.notifyPage(documentId, p);
+    }
+    this.recalculateMenuPlacement(documentId);
+  }
   updateSelection(documentId, page, index, modeId) {
     if (!this.selecting.get(documentId) || !this.anchor.get(documentId)) return;
     const a = this.anchor.get(documentId);
@@ -1042,6 +1374,8 @@ export {
   SELECTION_PLUGIN_ID,
   SelectionPlugin,
   SelectionPluginPackage,
+  expandToLineBoundary,
+  expandToWordBoundary,
   getVerticalOverlap,
   glyphAt,
   manifest,