@embedpdf/plugin-selection 2.2.0 → 2.3.0

package/dist/index.js

@@ -1,4 +1,4 @@
-import { BasePlugin, createScopedEmitter, REFRESH_PAGES } from "@embedpdf/core";
+import { clamp, BasePlugin, createScopedEmitter, REFRESH_PAGES } from "@embedpdf/core";
 import { boundingRect, Task, ignore, PdfErrorCode, PdfTaskHelper, PdfPermissionFlag } from "@embedpdf/models";
 const SELECTION_PLUGIN_ID = "selection";
 const manifest = {
@@ -326,6 +326,90 @@ function mergeAdjacentRects(textRuns) {
   }
   return results;
 }
+function createTextSelectionHandler(opts) {
+  return {
+    onPointerDown: (point, evt, modeId) => {
+      if (!opts.isEnabled(modeId)) return;
+      opts.onClear();
+      const geo = opts.getGeometry();
+      if (geo) {
+        const g = glyphAt(geo, point);
+        if (g !== -1) {
+          opts.onBegin(g);
+          evt.stopImmediatePropagation();
+        }
+      }
+    },
+    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);
+          evt.stopImmediatePropagation();
+        }
+      }
+    },
+    onPointerUp: (_point, _evt, modeId) => {
+      if (!opts.isEnabled(modeId)) return;
+      opts.onEnd();
+    },
+    onHandlerActiveEnd: (modeId) => {
+      if (!opts.isEnabled(modeId)) return;
+      opts.onClear();
+    }
+  };
+}
+function createMarqueeSelectionHandler(opts) {
+  const { pageSize, scale, minDragPx = 5 } = opts;
+  let start = null;
+  let last = null;
+  return {
+    onPointerDown: (pos, evt, modeId) => {
+      var _a;
+      if (!opts.isEnabled(modeId)) return;
+      start = pos;
+      last = { origin: { x: pos.x, y: pos.y }, size: { width: 0, height: 0 } };
+      opts.onBegin(pos);
+      (_a = evt.setPointerCapture) == null ? void 0 : _a.call(evt);
+    },
+    onPointerMove: (pos, _evt, modeId) => {
+      if (!start || !opts.isEnabled(modeId)) return;
+      const x = clamp(pos.x, 0, pageSize.width);
+      const y = clamp(pos.y, 0, pageSize.height);
+      last = {
+        origin: { x: Math.min(start.x, x), y: Math.min(start.y, y) },
+        size: { width: Math.abs(x - start.x), height: Math.abs(y - start.y) }
+      };
+      opts.onChange(last);
+    },
+    onPointerUp: (_pos, evt, modeId) => {
+      var _a;
+      if (!opts.isEnabled(modeId)) return;
+      if (last && start) {
+        const dragPx = Math.max(last.size.width, last.size.height) * scale;
+        if (dragPx > minDragPx) {
+          opts.onEnd(last);
+        } else {
+          opts.onCancel();
+        }
+      }
+      start = null;
+      last = null;
+      (_a = evt.releasePointerCapture) == null ? void 0 : _a.call(evt);
+    },
+    onPointerCancel: (_pos, evt, modeId) => {
+      var _a;
+      if (!opts.isEnabled(modeId)) return;
+      start = null;
+      last = null;
+      opts.onCancel();
+      (_a = evt.releasePointerCapture) == null ? void 0 : _a.call(evt);
+    }
+  };
+}
 const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
   constructor(id, registry, config) {
     var _a, _b, _c;
@@ -333,6 +417,8 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
     this.enabledModesPerDoc = /* @__PURE__ */ new Map();
     this.selecting = /* @__PURE__ */ new Map();
     this.anchor = /* @__PURE__ */ new Map();
+    this.marqueeEnabled = /* @__PURE__ */ new Map();
+    this.marqueePage = /* @__PURE__ */ new Map();
     this.pageCallbacks = /* @__PURE__ */ new Map();
     this.menuPlacement$ = createScopedEmitter((documentId, placement) => ({ documentId, placement }));
     this.selChange$ = createScopedEmitter((documentId, selection) => ({ documentId, selection }));
@@ -348,8 +434,18 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       (documentId) => ({ documentId }),
       { cache: false }
     );
+    this.marqueeChange$ = createScopedEmitter((documentId, data) => ({ documentId, pageIndex: data.pageIndex, rect: data.rect }), {
+      cache: false
+    });
+    this.marqueeEnd$ = createScopedEmitter(
+      (documentId, data) => ({ documentId, pageIndex: data.pageIndex, rect: data.rect }),
+      {
+        cache: false
+      }
+    );
     this.viewportCapability = null;
     this.scrollCapability = null;
+    this.config = config;
     this.menuHeight = config.menuHeight ?? 40;
     const imPlugin = registry.getPlugin("interaction-manager");
     if (!imPlugin) {
@@ -379,10 +475,15 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
   /* ── life-cycle ────────────────────────────────────────── */
   onDocumentLoadingStarted(documentId) {
     this.dispatch(initSelectionState(documentId, initialSelectionDocumentState));
-    this.enabledModesPerDoc.set(documentId, /* @__PURE__ */ new Set(["pointerMode"]));
+    this.enabledModesPerDoc.set(
+      documentId,
+      /* @__PURE__ */ new Map([["pointerMode", { showRects: true }]])
+    );
     this.pageCallbacks.set(documentId, /* @__PURE__ */ new Map());
     this.selecting.set(documentId, false);
     this.anchor.set(documentId, void 0);
+    const marqueeConfig = this.config.marquee;
+    this.marqueeEnabled.set(documentId, (marqueeConfig == null ? void 0 : marqueeConfig.enabled) !== false);
   }
   onDocumentClosed(documentId) {
     this.dispatch(cleanupSelectionState(documentId));
@@ -390,12 +491,16 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
     this.pageCallbacks.delete(documentId);
     this.selecting.delete(documentId);
     this.anchor.delete(documentId);
+    this.marqueeEnabled.delete(documentId);
+    this.marqueePage.delete(documentId);
     this.selChange$.clearScope(documentId);
     this.textRetrieved$.clearScope(documentId);
     this.copyToClipboard$.clearScope(documentId);
     this.beginSelection$.clearScope(documentId);
     this.endSelection$.clearScope(documentId);
     this.menuPlacement$.clearScope(documentId);
+    this.marqueeChange$.clearScope(documentId);
+    this.marqueeEnd$.clearScope(documentId);
   }
   async initialize() {
   }
@@ -406,6 +511,8 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
     this.beginSelection$.clear();
     this.endSelection$.clear();
     this.menuPlacement$.clear();
+    this.marqueeChange$.clear();
+    this.marqueeEnd$.clear();
     super.destroy();
   }
   /* ── capability exposed to UI / other plugins ─────────── */
@@ -423,14 +530,17 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       clear: (docId) => this.clearSelection(getDocId(docId)),
       copyToClipboard: (docId) => this.copyToClipboard(getDocId(docId)),
       getState: (docId) => this.getDocumentState(getDocId(docId)),
-      enableForMode: (modeId, docId) => {
+      enableForMode: (modeId, options, docId) => {
         var _a;
-        return (_a = this.enabledModesPerDoc.get(getDocId(docId))) == null ? void 0 : _a.add(modeId);
+        return (_a = this.enabledModesPerDoc.get(getDocId(docId))) == null ? void 0 : _a.set(modeId, { showRects: true, ...options });
       },
       isEnabledForMode: (modeId, docId) => {
         var _a;
         return ((_a = this.enabledModesPerDoc.get(getDocId(docId))) == null ? void 0 : _a.has(modeId)) ?? false;
       },
+      // Marquee selection
+      setMarqueeEnabled: (enabled, docId) => this.setMarqueeEnabled(getDocId(docId), enabled),
+      isMarqueeEnabled: (docId) => this.isMarqueeEnabled(getDocId(docId)),
       // Document-scoped operations
       forDocument: this.createSelectionScope.bind(this),
       // Global events
@@ -438,7 +548,10 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       onSelectionChange: this.selChange$.onGlobal,
       onTextRetrieved: this.textRetrieved$.onGlobal,
       onBeginSelection: this.beginSelection$.onGlobal,
-      onEndSelection: this.endSelection$.onGlobal
+      onEndSelection: this.endSelection$.onGlobal,
+      // Marquee selection events
+      onMarqueeChange: this.marqueeChange$.onGlobal,
+      onMarqueeEnd: this.marqueeEnd$.onGlobal
     };
   }
   createSelectionScope(documentId) {
@@ -453,11 +566,15 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       clear: () => this.clearSelection(documentId),
       copyToClipboard: () => this.copyToClipboard(documentId),
       getState: () => this.getDocumentState(documentId),
+      setMarqueeEnabled: (enabled) => this.setMarqueeEnabled(documentId, enabled),
+      isMarqueeEnabled: () => this.isMarqueeEnabled(documentId),
       onSelectionChange: this.selChange$.forScope(documentId),
       onTextRetrieved: this.textRetrieved$.forScope(documentId),
       onCopyToClipboard: this.copyToClipboard$.forScope(documentId),
       onBeginSelection: this.beginSelection$.forScope(documentId),
-      onEndSelection: this.endSelection$.forScope(documentId)
+      onEndSelection: this.endSelection$.forScope(documentId),
+      onMarqueeChange: this.marqueeChange$.forScope(documentId),
+      onMarqueeEnd: this.marqueeEnd$.forScope(documentId)
     };
   }
   getDocumentState(documentId) {
@@ -476,6 +593,10 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
   onMenuPlacement(documentId, listener) {
     return this.menuPlacement$.forScope(documentId)(listener);
   }
+  /**
+   * Register text selection on a page. Uses `registerAlways` so any plugin
+   * can enable text selection for their mode via `enableForMode()`.
+   */
   registerSelectionOnPage(opts) {
     var _a;
     const { documentId, pageIndex, onRectsChange } = opts;
@@ -497,45 +618,19 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       rects: selectRectsForPage(docState, pageIndex),
       boundingRect: selectBoundingRectForPage(docState, pageIndex)
     });
-    const handlers = {
-      onPointerDown: (point, _evt, modeId) => {
-        if (!(enabledModes == null ? void 0 : enabledModes.has(modeId))) return;
-        this.clearSelection(documentId);
-        const cached = this.getDocumentState(documentId).geometry[pageIndex];
-        if (cached) {
-          const g = glyphAt(cached, point);
-          if (g !== -1) {
-            this.beginSelection(documentId, pageIndex, g);
-          }
-        }
-      },
-      onPointerMove: (point, _evt, modeId) => {
-        if (!(enabledModes == null ? void 0 : enabledModes.has(modeId))) return;
-        const cached = this.getDocumentState(documentId).geometry[pageIndex];
-        if (cached) {
-          const g = glyphAt(cached, point);
-          if (g !== -1) {
-            interactionScope.setCursor("selection-text", "text", 10);
-          } else {
-            interactionScope.removeCursor("selection-text");
-          }
-          if (this.selecting.get(documentId) && g !== -1) {
-            this.updateSelection(documentId, pageIndex, g);
-          }
-        }
-      },
-      onPointerUp: (_point, _evt, modeId) => {
-        if (!(enabledModes == null ? void 0 : enabledModes.has(modeId))) return;
-        this.endSelection(documentId);
-      },
-      onHandlerActiveEnd: (modeId) => {
-        if (!(enabledModes == null ? void 0 : enabledModes.has(modeId))) return;
-        this.clearSelection(documentId);
-      }
-    };
+    const textHandler = createTextSelectionHandler({
+      getGeometry: () => this.getDocumentState(documentId).geometry[pageIndex],
+      isEnabled: (modeId) => (enabledModes == null ? void 0 : enabledModes.has(modeId)) ?? false,
+      onBegin: (g) => this.beginSelection(documentId, pageIndex, g),
+      onUpdate: (g) => this.updateSelection(documentId, pageIndex, g),
+      onEnd: () => this.endSelection(documentId),
+      onClear: () => this.clearSelection(documentId),
+      isSelecting: () => this.selecting.get(documentId) ?? false,
+      setCursor: (cursor) => cursor ? interactionScope.setCursor("selection-text", cursor, 10) : interactionScope.removeCursor("selection-text")
+    });
     const unregisterHandlers = this.interactionManagerCapability.registerAlways({
       scope: { type: "page", documentId, pageIndex },
-      handlers
+      handlers: textHandler
     });
     return () => {
       var _a2;
@@ -544,6 +639,72 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       geoTask.abort({ code: PdfErrorCode.Cancelled, message: "Cleanup" });
     };
   }
+  /**
+   * Register marquee selection on a page. Uses `registerHandlers` with `pointerMode`
+   * only - marquee selection is only active in the default pointer mode.
+   */
+  registerMarqueeOnPage(opts) {
+    var _a;
+    const { documentId, pageIndex, scale, onRectChange } = opts;
+    const docState = this.state.documents[documentId];
+    if (!docState) {
+      this.logger.warn(
+        "SelectionPlugin",
+        "RegisterMarqueeFailed",
+        `Cannot register marquee on page ${pageIndex} for document ${documentId}: document state not initialized.`
+      );
+      return () => {
+      };
+    }
+    const coreDoc = this.coreState.core.documents[documentId];
+    if (!coreDoc || !coreDoc.document) {
+      this.logger.warn(
+        "SelectionPlugin",
+        "DocumentNotFound",
+        `Cannot register marquee on page ${pageIndex}: document not found`
+      );
+      return () => {
+      };
+    }
+    const page = coreDoc.document.pages[pageIndex];
+    if (!page) {
+      this.logger.warn(
+        "SelectionPlugin",
+        "PageNotFound",
+        `Cannot register marquee on page ${pageIndex}: page not found`
+      );
+      return () => {
+      };
+    }
+    const pageSize = page.size;
+    const minDragPx = ((_a = this.config.marquee) == null ? void 0 : _a.minDragPx) ?? 5;
+    const marqueeHandler = createMarqueeSelectionHandler({
+      pageSize,
+      scale,
+      minDragPx,
+      isEnabled: () => this.marqueeEnabled.get(documentId) !== false,
+      onBegin: (pos) => this.beginMarquee(documentId, pageIndex, pos),
+      onChange: (rect) => {
+        this.updateMarquee(documentId, pageIndex, rect);
+        onRectChange(rect);
+      },
+      onEnd: (rect) => {
+        this.endMarquee(documentId, pageIndex, rect);
+        onRectChange(null);
+      },
+      onCancel: () => {
+        this.cancelMarquee(documentId);
+        onRectChange(null);
+      }
+    });
+    const unregisterHandlers = this.interactionManagerCapability.registerHandlers({
+      documentId,
+      pageIndex,
+      modeId: "pointerMode",
+      handlers: marqueeHandler
+    });
+    return unregisterHandlers;
+  }
   /**
    * Helper to calculate viewport relative metrics for a page rect.
    * Returns null if the rect cannot be converted to viewport space.
@@ -627,12 +788,14 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
     this.menuPlacement$.emit(documentId, null);
   }
   notifyPage(documentId, pageIndex) {
-    var _a;
+    var _a, _b;
     const callback = (_a = this.pageCallbacks.get(documentId)) == null ? void 0 : _a.get(pageIndex);
     if (callback) {
       const docState = this.getDocumentState(documentId);
       const mode = this.interactionManagerCapability.forDocument(documentId).getActiveMode();
-      if (mode === "pointerMode") {
+      const modeConfig = (_b = this.enabledModesPerDoc.get(documentId)) == null ? void 0 : _b.get(mode);
+      const shouldShowRects = modeConfig && modeConfig.showRects !== false;
+      if (shouldShowRects) {
         callback({
           rects: selectRectsForPage(docState, pageIndex),
           boundingRect: selectBoundingRectForPage(docState, pageIndex)
@@ -763,6 +926,31 @@ const _SelectionPlugin = class _SelectionPlugin extends BasePlugin {
       this.copyToClipboard$.emit(documentId, text2.join("\n"));
     }, ignore);
   }
+  /* ── marquee selection state updates ─────────────────────── */
+  beginMarquee(documentId, pageIndex, _startPos) {
+    this.marqueePage.set(documentId, pageIndex);
+  }
+  updateMarquee(documentId, pageIndex, rect) {
+    this.marqueeChange$.emit(documentId, { pageIndex, rect });
+  }
+  endMarquee(documentId, pageIndex, rect) {
+    this.marqueeEnd$.emit(documentId, { pageIndex, rect });
+    this.marqueeChange$.emit(documentId, { pageIndex, rect: null });
+    this.marqueePage.delete(documentId);
+  }
+  cancelMarquee(documentId) {
+    const pageIndex = this.marqueePage.get(documentId);
+    if (pageIndex !== void 0) {
+      this.marqueeChange$.emit(documentId, { pageIndex, rect: null });
+      this.marqueePage.delete(documentId);
+    }
+  }
+  setMarqueeEnabled(documentId, enabled) {
+    this.marqueeEnabled.set(documentId, enabled);
+  }
+  isMarqueeEnabled(documentId) {
+    return this.marqueeEnabled.get(documentId) !== false;
+  }
 };
 _SelectionPlugin.id = "selection";
 let SelectionPlugin = _SelectionPlugin;