@embedpdf/plugin-selection 1.0.5 → 1.0.6

package/dist/preact/index.cjs

@@ -34,10 +34,11 @@ var useSelectionPlugin = () => (0, import_preact.usePlugin)(import_plugin_select
 
 // src/preact/components/selection-layer.tsx
 var import_hooks = require("preact/hooks");
-var import_plugin_selection2 = require("@embedpdf/plugin-selection");
+var import_models = require("@embedpdf/models");
 var import_preact2 = require("@embedpdf/plugin-interaction-manager/preact");
+var import_plugin_selection2 = require("@embedpdf/plugin-selection");
 var import_jsx_runtime = require("preact/jsx-runtime");
-function SelectionLayer({ pageIndex, scale }) {
+function SelectionLayer({ pageIndex, scale, background = "rgba(33,150,243)" }) {
   const { provides: sel } = useSelectionCapability();
   const { register } = (0, import_preact2.usePointerHandlers)({ modeId: "default", pageIndex });
   const [rects, setRects] = (0, import_hooks.useState)([]);
@@ -45,7 +46,7 @@ function SelectionLayer({ pageIndex, scale }) {
   (0, import_hooks.useEffect)(() => {
     if (!sel) return;
     return sel.onSelectionChange(() => {
-      setRects(sel.getHighlightRects(pageIndex));
+      setRects(sel.getHighlightRectsForPage(pageIndex));
     });
   }, [sel, pageIndex]);
   let geoCache;
@@ -55,17 +56,25 @@ function SelectionLayer({ pageIndex, scale }) {
   }, []);
   (0, import_hooks.useEffect)(() => {
     if (!sel) return;
-    sel.getGeometry(pageIndex).then((g) => geoCache = g);
+    const task = sel.getGeometry(pageIndex);
+    task.wait((g) => geoCache = g, import_models.ignore);
+    return () => {
+      task.abort({
+        code: import_models.PdfErrorCode.Cancelled,
+        message: "Cancelled"
+      });
+    };
   }, [sel, pageIndex]);
   const handlers = (0, import_hooks.useMemo)(
     () => ({
       onPointerDown: (point) => {
         if (!sel) return;
         sel.clear();
-        sel.getGeometry(pageIndex).then((geo) => {
+        const task = sel.getGeometry(pageIndex);
+        task.wait((geo) => {
           const g = (0, import_plugin_selection2.glyphAt)(geo, point);
           if (g !== -1) sel.begin(pageIndex, g);
-        });
+        }, import_models.ignore);
       },
       onPointerMove: (point) => {
         if (!sel) return;
@@ -97,7 +106,7 @@ function SelectionLayer({ pageIndex, scale }) {
         top: b.origin.y * scale,
         width: b.size.width * scale,
         height: b.size.height * scale,
-        background: "rgba(33,150,243)",
+        background,
         pointerEvents: "none"
       }
     },

package/dist/preact/index.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preact/index.ts","../../src/preact/hooks/use-selection.ts","../../src/preact/components/selection-layer.tsx"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { SelectionPlugin } from '@embedpdf/plugin-selection';\n\nexport const useSelectionCapability = () => useCapability<SelectionPlugin>(SelectionPlugin.id);\nexport const useSelectionPlugin = () => usePlugin<SelectionPlugin>(SelectionPlugin.id);\n","/** @jsxImportSource preact */\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport { useSelectionCapability } from '../hooks';\nimport { glyphAt } from '@embedpdf/plugin-selection';\nimport { PdfPageGeometry, Rect } from '@embedpdf/models';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\n\ntype Props = { pageIndex: number; scale: number };\n\nexport function SelectionLayer({ pageIndex, scale }: Props) {\n  const { provides: sel } = useSelectionCapability();\n  const { register } = usePointerHandlers({ modeId: 'default', pageIndex });\n  const [rects, setRects] = useState<Array<Rect>>([]);\n  const { setCursor, removeCursor } = useCursor();\n\n  /* subscribe to rect updates */\n  useEffect(() => {\n    if (!sel) return;\n    return sel.onSelectionChange(() => {\n      setRects(sel.getHighlightRects(pageIndex));\n    });\n  }, [sel, pageIndex]);\n\n  /* cheap glyphAt cache for the active page */\n  let geoCache: PdfPageGeometry | undefined;\n  const cachedGlyphAt = useCallback((pt: { x: number; y: number }) => {\n    if (!geoCache) return -1;\n    return glyphAt(geoCache, pt);\n  }, []);\n\n  // Initialize geometry cache\n  useEffect(() => {\n    if (!sel) return;\n    sel.getGeometry(pageIndex).then((g) => (geoCache = g));\n  }, [sel, pageIndex]);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (point) => {\n        if (!sel) return;\n\n        // clear the selection\n        sel.clear();\n        sel.getGeometry(pageIndex).then((geo) => {\n          const g = glyphAt(geo, point);\n          if (g !== -1) sel.begin(pageIndex, g);\n        });\n      },\n      onPointerMove: (point) => {\n        if (!sel) return;\n        const g = cachedGlyphAt(point);\n        if (g !== -1) {\n          setCursor('selection-text', 'text', 10);\n        } else {\n          removeCursor('selection-text');\n        }\n        if (g !== -1) sel.update(pageIndex, g);\n      },\n      onPointerUp: () => {\n        if (!sel) return;\n        sel.end();\n      },\n    }),\n    [sel, pageIndex, cachedGlyphAt],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return (\n    <>\n      {rects.map((b, i) => (\n        <div\n          key={i}\n          style={{\n            position: 'absolute',\n            left: b.origin.x * scale,\n            top: b.origin.y * scale,\n            width: b.size.width * scale,\n            height: b.size.height * scale,\n            background: 'rgba(33,150,243)',\n            pointerEvents: 'none',\n          }}\n        />\n      ))}\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAAyC;AACzC,8BAAgC;AAEzB,IAAM,yBAAyB,UAAM,6BAA+B,wCAAgB,EAAE;AACtF,IAAM,qBAAqB,UAAM,yBAA2B,wCAAgB,EAAE;;;ACHrF,mBAAkE;AAElE,IAAAA,2BAAwB;AAExB,IAAAC,iBAA8C;AAoE1C;AA/DG,SAAS,eAAe,EAAE,WAAW,MAAM,GAAU;AAC1D,QAAM,EAAE,UAAU,IAAI,IAAI,uBAAuB;AACjD,QAAM,EAAE,SAAS,QAAI,mCAAmB,EAAE,QAAQ,WAAW,UAAU,CAAC;AACxE,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAsB,CAAC,CAAC;AAClD,QAAM,EAAE,WAAW,aAAa,QAAI,0BAAU;AAG9C,8BAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,WAAO,IAAI,kBAAkB,MAAM;AACjC,eAAS,IAAI,kBAAkB,SAAS,CAAC;AAAA,IAC3C,CAAC;AAAA,EACH,GAAG,CAAC,KAAK,SAAS,CAAC;AAGnB,MAAI;AACJ,QAAM,oBAAgB,0BAAY,CAAC,OAAiC;AAClE,QAAI,CAAC,SAAU,QAAO;AACtB,eAAO,kCAAQ,UAAU,EAAE;AAAA,EAC7B,GAAG,CAAC,CAAC;AAGL,8BAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,QAAI,YAAY,SAAS,EAAE,KAAK,CAAC,MAAO,WAAW,CAAE;AAAA,EACvD,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,QAAM,eAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AAGV,YAAI,MAAM;AACV,YAAI,YAAY,SAAS,EAAE,KAAK,CAAC,QAAQ;AACvC,gBAAM,QAAI,kCAAQ,KAAK,KAAK;AAC5B,cAAI,MAAM,GAAI,KAAI,MAAM,WAAW,CAAC;AAAA,QACtC,CAAC;AAAA,MACH;AAAA,MACA,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AACV,cAAM,IAAI,cAAc,KAAK;AAC7B,YAAI,MAAM,IAAI;AACZ,oBAAU,kBAAkB,QAAQ,EAAE;AAAA,QACxC,OAAO;AACL,uBAAa,gBAAgB;AAAA,QAC/B;AACA,YAAI,MAAM,GAAI,KAAI,OAAO,WAAW,CAAC;AAAA,MACvC;AAAA,MACA,aAAa,MAAM;AACjB,YAAI,CAAC,IAAK;AACV,YAAI,IAAI;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,KAAK,WAAW,aAAa;AAAA,EAChC;AAEA,8BAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SACE,2EACG,gBAAM,IAAI,CAAC,GAAG,MACb;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,MAAM,EAAE,OAAO,IAAI;AAAA,QACnB,KAAK,EAAE,OAAO,IAAI;AAAA,QAClB,OAAO,EAAE,KAAK,QAAQ;AAAA,QACtB,QAAQ,EAAE,KAAK,SAAS;AAAA,QACxB,YAAY;AAAA,QACZ,eAAe;AAAA,MACjB;AAAA;AAAA,IATK;AAAA,EAUP,CACD,GACH;AAEJ;","names":["import_plugin_selection","import_preact"]}
+{"version":3,"sources":["../../src/preact/index.ts","../../src/preact/hooks/use-selection.ts","../../src/preact/components/selection-layer.tsx"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { SelectionPlugin } from '@embedpdf/plugin-selection';\n\nexport const useSelectionCapability = () => useCapability<SelectionPlugin>(SelectionPlugin.id);\nexport const useSelectionPlugin = () => usePlugin<SelectionPlugin>(SelectionPlugin.id);\n","/** @jsxImportSource preact */\nimport { useCallback, useEffect, useMemo, useState } from 'preact/hooks';\nimport { ignore, PdfErrorCode, PdfPageGeometry, Rect } from '@embedpdf/models';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { glyphAt } from '@embedpdf/plugin-selection';\n\nimport { useSelectionCapability } from '../hooks';\n\ntype Props = {\n  pageIndex: number;\n  scale: number;\n  background?: string;\n};\n\nexport function SelectionLayer({ pageIndex, scale, background = 'rgba(33,150,243)' }: Props) {\n  const { provides: sel } = useSelectionCapability();\n  const { register } = usePointerHandlers({ modeId: 'default', pageIndex });\n  const [rects, setRects] = useState<Array<Rect>>([]);\n  const { setCursor, removeCursor } = useCursor();\n\n  /* subscribe to rect updates */\n  useEffect(() => {\n    if (!sel) return;\n    return sel.onSelectionChange(() => {\n      setRects(sel.getHighlightRectsForPage(pageIndex));\n    });\n  }, [sel, pageIndex]);\n\n  /* cheap glyphAt cache for the active page */\n  let geoCache: PdfPageGeometry | undefined;\n  const cachedGlyphAt = useCallback((pt: { x: number; y: number }) => {\n    if (!geoCache) return -1;\n    return glyphAt(geoCache, pt);\n  }, []);\n\n  // Initialize geometry cache\n  useEffect(() => {\n    if (!sel) return;\n    const task = sel.getGeometry(pageIndex);\n    task.wait((g) => (geoCache = g), ignore);\n\n    return () => {\n      task.abort({\n        code: PdfErrorCode.Cancelled,\n        message: 'Cancelled',\n      });\n    };\n  }, [sel, pageIndex]);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (point) => {\n        if (!sel) return;\n\n        // clear the selection\n        sel.clear();\n        const task = sel.getGeometry(pageIndex);\n        task.wait((geo) => {\n          const g = glyphAt(geo, point);\n          if (g !== -1) sel.begin(pageIndex, g);\n        }, ignore);\n      },\n      onPointerMove: (point) => {\n        if (!sel) return;\n        const g = cachedGlyphAt(point);\n        if (g !== -1) {\n          setCursor('selection-text', 'text', 10);\n        } else {\n          removeCursor('selection-text');\n        }\n        if (g !== -1) sel.update(pageIndex, g);\n      },\n      onPointerUp: () => {\n        if (!sel) return;\n        sel.end();\n      },\n    }),\n    [sel, pageIndex, cachedGlyphAt],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return (\n    <>\n      {rects.map((b, i) => (\n        <div\n          key={i}\n          style={{\n            position: 'absolute',\n            left: b.origin.x * scale,\n            top: b.origin.y * scale,\n            width: b.size.width * scale,\n            height: b.size.height * scale,\n            background,\n            pointerEvents: 'none',\n          }}\n        />\n      ))}\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,oBAAyC;AACzC,8BAAgC;AAEzB,IAAM,yBAAyB,UAAM,6BAA+B,wCAAgB,EAAE;AACtF,IAAM,qBAAqB,UAAM,yBAA2B,wCAAgB,EAAE;;;ACHrF,mBAA0D;AAC1D,oBAA4D;AAC5D,IAAAA,iBAA8C;AAE9C,IAAAC,2BAAwB;AAkFpB;AAxEG,SAAS,eAAe,EAAE,WAAW,OAAO,aAAa,mBAAmB,GAAU;AAC3F,QAAM,EAAE,UAAU,IAAI,IAAI,uBAAuB;AACjD,QAAM,EAAE,SAAS,QAAI,mCAAmB,EAAE,QAAQ,WAAW,UAAU,CAAC;AACxE,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAsB,CAAC,CAAC;AAClD,QAAM,EAAE,WAAW,aAAa,QAAI,0BAAU;AAG9C,8BAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,WAAO,IAAI,kBAAkB,MAAM;AACjC,eAAS,IAAI,yBAAyB,SAAS,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,GAAG,CAAC,KAAK,SAAS,CAAC;AAGnB,MAAI;AACJ,QAAM,oBAAgB,0BAAY,CAAC,OAAiC;AAClE,QAAI,CAAC,SAAU,QAAO;AACtB,eAAO,kCAAQ,UAAU,EAAE;AAAA,EAC7B,GAAG,CAAC,CAAC;AAGL,8BAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,UAAM,OAAO,IAAI,YAAY,SAAS;AACtC,SAAK,KAAK,CAAC,MAAO,WAAW,GAAI,oBAAM;AAEvC,WAAO,MAAM;AACX,WAAK,MAAM;AAAA,QACT,MAAM,2BAAa;AAAA,QACnB,SAAS;AAAA,MACX,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,QAAM,eAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AAGV,YAAI,MAAM;AACV,cAAM,OAAO,IAAI,YAAY,SAAS;AACtC,aAAK,KAAK,CAAC,QAAQ;AACjB,gBAAM,QAAI,kCAAQ,KAAK,KAAK;AAC5B,cAAI,MAAM,GAAI,KAAI,MAAM,WAAW,CAAC;AAAA,QACtC,GAAG,oBAAM;AAAA,MACX;AAAA,MACA,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AACV,cAAM,IAAI,cAAc,KAAK;AAC7B,YAAI,MAAM,IAAI;AACZ,oBAAU,kBAAkB,QAAQ,EAAE;AAAA,QACxC,OAAO;AACL,uBAAa,gBAAgB;AAAA,QAC/B;AACA,YAAI,MAAM,GAAI,KAAI,OAAO,WAAW,CAAC;AAAA,MACvC;AAAA,MACA,aAAa,MAAM;AACjB,YAAI,CAAC,IAAK;AACV,YAAI,IAAI;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,KAAK,WAAW,aAAa;AAAA,EAChC;AAEA,8BAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SACE,2EACG,gBAAM,IAAI,CAAC,GAAG,MACb;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,MAAM,EAAE,OAAO,IAAI;AAAA,QACnB,KAAK,EAAE,OAAO,IAAI;AAAA,QAClB,OAAO,EAAE,KAAK,QAAQ;AAAA,QACtB,QAAQ,EAAE,KAAK,SAAS;AAAA,QACxB;AAAA,QACA,eAAe;AAAA,MACjB;AAAA;AAAA,IATK;AAAA,EAUP,CACD,GACH;AAEJ;","names":["import_preact","import_plugin_selection"]}

package/dist/preact/index.d.cts

@@ -16,7 +16,8 @@ declare const useSelectionPlugin: () => {
 type Props = {
     pageIndex: number;
     scale: number;
+    background?: string;
 };
-declare function SelectionLayer({ pageIndex, scale }: Props): preact.JSX.Element;
+declare function SelectionLayer({ pageIndex, scale, background }: Props): preact.JSX.Element;
 
 export { SelectionLayer, useSelectionCapability, useSelectionPlugin };

package/dist/preact/index.d.ts

@@ -16,7 +16,8 @@ declare const useSelectionPlugin: () => {
 type Props = {
     pageIndex: number;
     scale: number;
+    background?: string;
 };
-declare function SelectionLayer({ pageIndex, scale }: Props): preact.JSX.Element;
+declare function SelectionLayer({ pageIndex, scale, background }: Props): preact.JSX.Element;
 
 export { SelectionLayer, useSelectionCapability, useSelectionPlugin };

package/dist/preact/index.js

@@ -6,10 +6,11 @@ var useSelectionPlugin = () => usePlugin(SelectionPlugin.id);
 
 // src/preact/components/selection-layer.tsx
 import { useCallback, useEffect, useMemo, useState } from "preact/hooks";
-import { glyphAt } from "@embedpdf/plugin-selection";
+import { ignore, PdfErrorCode } from "@embedpdf/models";
 import { useCursor, usePointerHandlers } from "@embedpdf/plugin-interaction-manager/preact";
+import { glyphAt } from "@embedpdf/plugin-selection";
 import { Fragment, jsx } from "preact/jsx-runtime";
-function SelectionLayer({ pageIndex, scale }) {
+function SelectionLayer({ pageIndex, scale, background = "rgba(33,150,243)" }) {
   const { provides: sel } = useSelectionCapability();
   const { register } = usePointerHandlers({ modeId: "default", pageIndex });
   const [rects, setRects] = useState([]);
@@ -17,7 +18,7 @@ function SelectionLayer({ pageIndex, scale }) {
   useEffect(() => {
     if (!sel) return;
     return sel.onSelectionChange(() => {
-      setRects(sel.getHighlightRects(pageIndex));
+      setRects(sel.getHighlightRectsForPage(pageIndex));
     });
   }, [sel, pageIndex]);
   let geoCache;
@@ -27,17 +28,25 @@ function SelectionLayer({ pageIndex, scale }) {
   }, []);
   useEffect(() => {
     if (!sel) return;
-    sel.getGeometry(pageIndex).then((g) => geoCache = g);
+    const task = sel.getGeometry(pageIndex);
+    task.wait((g) => geoCache = g, ignore);
+    return () => {
+      task.abort({
+        code: PdfErrorCode.Cancelled,
+        message: "Cancelled"
+      });
+    };
   }, [sel, pageIndex]);
   const handlers = useMemo(
     () => ({
       onPointerDown: (point) => {
         if (!sel) return;
         sel.clear();
-        sel.getGeometry(pageIndex).then((geo) => {
+        const task = sel.getGeometry(pageIndex);
+        task.wait((geo) => {
           const g = glyphAt(geo, point);
           if (g !== -1) sel.begin(pageIndex, g);
-        });
+        }, ignore);
       },
       onPointerMove: (point) => {
         if (!sel) return;
@@ -69,7 +78,7 @@ function SelectionLayer({ pageIndex, scale }) {
         top: b.origin.y * scale,
         width: b.size.width * scale,
         height: b.size.height * scale,
-        background: "rgba(33,150,243)",
+        background,
         pointerEvents: "none"
       }
     },

package/dist/preact/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/preact/hooks/use-selection.ts","../../src/preact/components/selection-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { SelectionPlugin } from '@embedpdf/plugin-selection';\n\nexport const useSelectionCapability = () => useCapability<SelectionPlugin>(SelectionPlugin.id);\nexport const useSelectionPlugin = () => usePlugin<SelectionPlugin>(SelectionPlugin.id);\n","/** @jsxImportSource preact */\nimport { useCallback, useEffect, useMemo, useRef, useState } from 'preact/hooks';\nimport { useSelectionCapability } from '../hooks';\nimport { glyphAt } from '@embedpdf/plugin-selection';\nimport { PdfPageGeometry, Rect } from '@embedpdf/models';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\n\ntype Props = { pageIndex: number; scale: number };\n\nexport function SelectionLayer({ pageIndex, scale }: Props) {\n  const { provides: sel } = useSelectionCapability();\n  const { register } = usePointerHandlers({ modeId: 'default', pageIndex });\n  const [rects, setRects] = useState<Array<Rect>>([]);\n  const { setCursor, removeCursor } = useCursor();\n\n  /* subscribe to rect updates */\n  useEffect(() => {\n    if (!sel) return;\n    return sel.onSelectionChange(() => {\n      setRects(sel.getHighlightRects(pageIndex));\n    });\n  }, [sel, pageIndex]);\n\n  /* cheap glyphAt cache for the active page */\n  let geoCache: PdfPageGeometry | undefined;\n  const cachedGlyphAt = useCallback((pt: { x: number; y: number }) => {\n    if (!geoCache) return -1;\n    return glyphAt(geoCache, pt);\n  }, []);\n\n  // Initialize geometry cache\n  useEffect(() => {\n    if (!sel) return;\n    sel.getGeometry(pageIndex).then((g) => (geoCache = g));\n  }, [sel, pageIndex]);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (point) => {\n        if (!sel) return;\n\n        // clear the selection\n        sel.clear();\n        sel.getGeometry(pageIndex).then((geo) => {\n          const g = glyphAt(geo, point);\n          if (g !== -1) sel.begin(pageIndex, g);\n        });\n      },\n      onPointerMove: (point) => {\n        if (!sel) return;\n        const g = cachedGlyphAt(point);\n        if (g !== -1) {\n          setCursor('selection-text', 'text', 10);\n        } else {\n          removeCursor('selection-text');\n        }\n        if (g !== -1) sel.update(pageIndex, g);\n      },\n      onPointerUp: () => {\n        if (!sel) return;\n        sel.end();\n      },\n    }),\n    [sel, pageIndex, cachedGlyphAt],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return (\n    <>\n      {rects.map((b, i) => (\n        <div\n          key={i}\n          style={{\n            position: 'absolute',\n            left: b.origin.x * scale,\n            top: b.origin.y * scale,\n            width: b.size.width * scale,\n            height: b.size.height * scale,\n            background: 'rgba(33,150,243)',\n            pointerEvents: 'none',\n          }}\n        />\n      ))}\n    </>\n  );\n}\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,uBAAuB;AAEzB,IAAM,yBAAyB,MAAM,cAA+B,gBAAgB,EAAE;AACtF,IAAM,qBAAqB,MAAM,UAA2B,gBAAgB,EAAE;;;ACHrF,SAAS,aAAa,WAAW,SAAiB,gBAAgB;AAElE,SAAS,eAAe;AAExB,SAAS,WAAW,0BAA0B;AAoE1C,mBAEI,WAFJ;AA/DG,SAAS,eAAe,EAAE,WAAW,MAAM,GAAU;AAC1D,QAAM,EAAE,UAAU,IAAI,IAAI,uBAAuB;AACjD,QAAM,EAAE,SAAS,IAAI,mBAAmB,EAAE,QAAQ,WAAW,UAAU,CAAC;AACxE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAsB,CAAC,CAAC;AAClD,QAAM,EAAE,WAAW,aAAa,IAAI,UAAU;AAG9C,YAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,WAAO,IAAI,kBAAkB,MAAM;AACjC,eAAS,IAAI,kBAAkB,SAAS,CAAC;AAAA,IAC3C,CAAC;AAAA,EACH,GAAG,CAAC,KAAK,SAAS,CAAC;AAGnB,MAAI;AACJ,QAAM,gBAAgB,YAAY,CAAC,OAAiC;AAClE,QAAI,CAAC,SAAU,QAAO;AACtB,WAAO,QAAQ,UAAU,EAAE;AAAA,EAC7B,GAAG,CAAC,CAAC;AAGL,YAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,QAAI,YAAY,SAAS,EAAE,KAAK,CAAC,MAAO,WAAW,CAAE;AAAA,EACvD,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,QAAM,WAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AAGV,YAAI,MAAM;AACV,YAAI,YAAY,SAAS,EAAE,KAAK,CAAC,QAAQ;AACvC,gBAAM,IAAI,QAAQ,KAAK,KAAK;AAC5B,cAAI,MAAM,GAAI,KAAI,MAAM,WAAW,CAAC;AAAA,QACtC,CAAC;AAAA,MACH;AAAA,MACA,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AACV,cAAM,IAAI,cAAc,KAAK;AAC7B,YAAI,MAAM,IAAI;AACZ,oBAAU,kBAAkB,QAAQ,EAAE;AAAA,QACxC,OAAO;AACL,uBAAa,gBAAgB;AAAA,QAC/B;AACA,YAAI,MAAM,GAAI,KAAI,OAAO,WAAW,CAAC;AAAA,MACvC;AAAA,MACA,aAAa,MAAM;AACjB,YAAI,CAAC,IAAK;AACV,YAAI,IAAI;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,KAAK,WAAW,aAAa;AAAA,EAChC;AAEA,YAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SACE,gCACG,gBAAM,IAAI,CAAC,GAAG,MACb;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,MAAM,EAAE,OAAO,IAAI;AAAA,QACnB,KAAK,EAAE,OAAO,IAAI;AAAA,QAClB,OAAO,EAAE,KAAK,QAAQ;AAAA,QACtB,QAAQ,EAAE,KAAK,SAAS;AAAA,QACxB,YAAY;AAAA,QACZ,eAAe;AAAA,MACjB;AAAA;AAAA,IATK;AAAA,EAUP,CACD,GACH;AAEJ;","names":[]}
+{"version":3,"sources":["../../src/preact/hooks/use-selection.ts","../../src/preact/components/selection-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/preact';\nimport { SelectionPlugin } from '@embedpdf/plugin-selection';\n\nexport const useSelectionCapability = () => useCapability<SelectionPlugin>(SelectionPlugin.id);\nexport const useSelectionPlugin = () => usePlugin<SelectionPlugin>(SelectionPlugin.id);\n","/** @jsxImportSource preact */\nimport { useCallback, useEffect, useMemo, useState } from 'preact/hooks';\nimport { ignore, PdfErrorCode, PdfPageGeometry, Rect } from '@embedpdf/models';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/preact';\nimport { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { glyphAt } from '@embedpdf/plugin-selection';\n\nimport { useSelectionCapability } from '../hooks';\n\ntype Props = {\n  pageIndex: number;\n  scale: number;\n  background?: string;\n};\n\nexport function SelectionLayer({ pageIndex, scale, background = 'rgba(33,150,243)' }: Props) {\n  const { provides: sel } = useSelectionCapability();\n  const { register } = usePointerHandlers({ modeId: 'default', pageIndex });\n  const [rects, setRects] = useState<Array<Rect>>([]);\n  const { setCursor, removeCursor } = useCursor();\n\n  /* subscribe to rect updates */\n  useEffect(() => {\n    if (!sel) return;\n    return sel.onSelectionChange(() => {\n      setRects(sel.getHighlightRectsForPage(pageIndex));\n    });\n  }, [sel, pageIndex]);\n\n  /* cheap glyphAt cache for the active page */\n  let geoCache: PdfPageGeometry | undefined;\n  const cachedGlyphAt = useCallback((pt: { x: number; y: number }) => {\n    if (!geoCache) return -1;\n    return glyphAt(geoCache, pt);\n  }, []);\n\n  // Initialize geometry cache\n  useEffect(() => {\n    if (!sel) return;\n    const task = sel.getGeometry(pageIndex);\n    task.wait((g) => (geoCache = g), ignore);\n\n    return () => {\n      task.abort({\n        code: PdfErrorCode.Cancelled,\n        message: 'Cancelled',\n      });\n    };\n  }, [sel, pageIndex]);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (point) => {\n        if (!sel) return;\n\n        // clear the selection\n        sel.clear();\n        const task = sel.getGeometry(pageIndex);\n        task.wait((geo) => {\n          const g = glyphAt(geo, point);\n          if (g !== -1) sel.begin(pageIndex, g);\n        }, ignore);\n      },\n      onPointerMove: (point) => {\n        if (!sel) return;\n        const g = cachedGlyphAt(point);\n        if (g !== -1) {\n          setCursor('selection-text', 'text', 10);\n        } else {\n          removeCursor('selection-text');\n        }\n        if (g !== -1) sel.update(pageIndex, g);\n      },\n      onPointerUp: () => {\n        if (!sel) return;\n        sel.end();\n      },\n    }),\n    [sel, pageIndex, cachedGlyphAt],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return (\n    <>\n      {rects.map((b, i) => (\n        <div\n          key={i}\n          style={{\n            position: 'absolute',\n            left: b.origin.x * scale,\n            top: b.origin.y * scale,\n            width: b.size.width * scale,\n            height: b.size.height * scale,\n            background,\n            pointerEvents: 'none',\n          }}\n        />\n      ))}\n    </>\n  );\n}\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,uBAAuB;AAEzB,IAAM,yBAAyB,MAAM,cAA+B,gBAAgB,EAAE;AACtF,IAAM,qBAAqB,MAAM,UAA2B,gBAAgB,EAAE;;;ACHrF,SAAS,aAAa,WAAW,SAAS,gBAAgB;AAC1D,SAAS,QAAQ,oBAA2C;AAC5D,SAAS,WAAW,0BAA0B;AAE9C,SAAS,eAAe;AAkFpB,mBAEI,WAFJ;AAxEG,SAAS,eAAe,EAAE,WAAW,OAAO,aAAa,mBAAmB,GAAU;AAC3F,QAAM,EAAE,UAAU,IAAI,IAAI,uBAAuB;AACjD,QAAM,EAAE,SAAS,IAAI,mBAAmB,EAAE,QAAQ,WAAW,UAAU,CAAC;AACxE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAsB,CAAC,CAAC;AAClD,QAAM,EAAE,WAAW,aAAa,IAAI,UAAU;AAG9C,YAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,WAAO,IAAI,kBAAkB,MAAM;AACjC,eAAS,IAAI,yBAAyB,SAAS,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,GAAG,CAAC,KAAK,SAAS,CAAC;AAGnB,MAAI;AACJ,QAAM,gBAAgB,YAAY,CAAC,OAAiC;AAClE,QAAI,CAAC,SAAU,QAAO;AACtB,WAAO,QAAQ,UAAU,EAAE;AAAA,EAC7B,GAAG,CAAC,CAAC;AAGL,YAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,UAAM,OAAO,IAAI,YAAY,SAAS;AACtC,SAAK,KAAK,CAAC,MAAO,WAAW,GAAI,MAAM;AAEvC,WAAO,MAAM;AACX,WAAK,MAAM;AAAA,QACT,MAAM,aAAa;AAAA,QACnB,SAAS;AAAA,MACX,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,QAAM,WAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AAGV,YAAI,MAAM;AACV,cAAM,OAAO,IAAI,YAAY,SAAS;AACtC,aAAK,KAAK,CAAC,QAAQ;AACjB,gBAAM,IAAI,QAAQ,KAAK,KAAK;AAC5B,cAAI,MAAM,GAAI,KAAI,MAAM,WAAW,CAAC;AAAA,QACtC,GAAG,MAAM;AAAA,MACX;AAAA,MACA,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AACV,cAAM,IAAI,cAAc,KAAK;AAC7B,YAAI,MAAM,IAAI;AACZ,oBAAU,kBAAkB,QAAQ,EAAE;AAAA,QACxC,OAAO;AACL,uBAAa,gBAAgB;AAAA,QAC/B;AACA,YAAI,MAAM,GAAI,KAAI,OAAO,WAAW,CAAC;AAAA,MACvC;AAAA,MACA,aAAa,MAAM;AACjB,YAAI,CAAC,IAAK;AACV,YAAI,IAAI;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,KAAK,WAAW,aAAa;AAAA,EAChC;AAEA,YAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SACE,gCACG,gBAAM,IAAI,CAAC,GAAG,MACb;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,MAAM,EAAE,OAAO,IAAI;AAAA,QACnB,KAAK,EAAE,OAAO,IAAI;AAAA,QAClB,OAAO,EAAE,KAAK,QAAQ;AAAA,QACtB,QAAQ,EAAE,KAAK,SAAS;AAAA,QACxB;AAAA,QACA,eAAe;AAAA,MACjB;AAAA;AAAA,IATK;AAAA,EAUP,CACD,GACH;AAEJ;","names":[]}

package/dist/react/index.cjs

@@ -0,0 +1,122 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/react/index.ts
+var react_exports = {};
+__export(react_exports, {
+  SelectionLayer: () => SelectionLayer,
+  useSelectionCapability: () => useSelectionCapability,
+  useSelectionPlugin: () => useSelectionPlugin
+});
+module.exports = __toCommonJS(react_exports);
+
+// src/react/hooks/use-selection.ts
+var import_react = require("@embedpdf/core/react");
+var import_plugin_selection = require("@embedpdf/plugin-selection");
+var useSelectionCapability = () => (0, import_react.useCapability)(import_plugin_selection.SelectionPlugin.id);
+var useSelectionPlugin = () => (0, import_react.usePlugin)(import_plugin_selection.SelectionPlugin.id);
+
+// src/react/components/selection-layer.tsx
+var import_react2 = require("react");
+var import_models = require("@embedpdf/models");
+var import_react3 = require("@embedpdf/plugin-interaction-manager/react");
+var import_plugin_selection2 = require("@embedpdf/plugin-selection");
+var import_jsx_runtime = require("react/jsx-runtime");
+function SelectionLayer({ pageIndex, scale, background = "rgba(33,150,243)" }) {
+  const { provides: sel } = useSelectionCapability();
+  const { register } = (0, import_react3.usePointerHandlers)({ modeId: "default", pageIndex });
+  const [rects, setRects] = (0, import_react2.useState)([]);
+  const { setCursor, removeCursor } = (0, import_react3.useCursor)();
+  (0, import_react2.useEffect)(() => {
+    if (!sel) return;
+    return sel.onSelectionChange(() => {
+      setRects(sel.getHighlightRectsForPage(pageIndex));
+    });
+  }, [sel, pageIndex]);
+  let geoCache;
+  const cachedGlyphAt = (0, import_react2.useCallback)((pt) => {
+    if (!geoCache) return -1;
+    return (0, import_plugin_selection2.glyphAt)(geoCache, pt);
+  }, []);
+  (0, import_react2.useEffect)(() => {
+    if (!sel) return;
+    const task = sel.getGeometry(pageIndex);
+    task.wait((g) => geoCache = g, import_models.ignore);
+    return () => {
+      task.abort({
+        code: import_models.PdfErrorCode.Cancelled,
+        message: "Cancelled"
+      });
+    };
+  }, [sel, pageIndex]);
+  const handlers = (0, import_react2.useMemo)(
+    () => ({
+      onPointerDown: (point) => {
+        if (!sel) return;
+        sel.clear();
+        const task = sel.getGeometry(pageIndex);
+        task.wait((geo) => {
+          const g = (0, import_plugin_selection2.glyphAt)(geo, point);
+          if (g !== -1) sel.begin(pageIndex, g);
+        }, import_models.ignore);
+      },
+      onPointerMove: (point) => {
+        if (!sel) return;
+        const g = cachedGlyphAt(point);
+        if (g !== -1) {
+          setCursor("selection-text", "text", 10);
+        } else {
+          removeCursor("selection-text");
+        }
+        if (g !== -1) sel.update(pageIndex, g);
+      },
+      onPointerUp: () => {
+        if (!sel) return;
+        sel.end();
+      }
+    }),
+    [sel, pageIndex, cachedGlyphAt]
+  );
+  (0, import_react2.useEffect)(() => {
+    if (!register) return;
+    return register(handlers);
+  }, [register, handlers]);
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: rects.map((b, i) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        left: b.origin.x * scale,
+        top: b.origin.y * scale,
+        width: b.size.width * scale,
+        height: b.size.height * scale,
+        background,
+        pointerEvents: "none"
+      }
+    },
+    i
+  )) });
+}
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SelectionLayer,
+  useSelectionCapability,
+  useSelectionPlugin
+});
+//# sourceMappingURL=index.cjs.map

package/dist/react/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/react/index.ts","../../src/react/hooks/use-selection.ts","../../src/react/components/selection-layer.tsx"],"sourcesContent":["export * from './hooks';\nexport * from './components';\n","import { useCapability, usePlugin } from '@embedpdf/core/react';\nimport { SelectionPlugin } from '@embedpdf/plugin-selection';\n\nexport const useSelectionCapability = () => useCapability<SelectionPlugin>(SelectionPlugin.id);\nexport const useSelectionPlugin = () => usePlugin<SelectionPlugin>(SelectionPlugin.id);\n","import { useCallback, useEffect, useMemo, useState } from 'react';\nimport { ignore, PdfErrorCode, PdfPageGeometry, Rect } from '@embedpdf/models';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/react';\nimport { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { glyphAt } from '@embedpdf/plugin-selection';\n\nimport { useSelectionCapability } from '../hooks';\n\ntype Props = {\n  pageIndex: number;\n  scale: number;\n  background?: string;\n};\n\nexport function SelectionLayer({ pageIndex, scale, background = 'rgba(33,150,243)' }: Props) {\n  const { provides: sel } = useSelectionCapability();\n  const { register } = usePointerHandlers({ modeId: 'default', pageIndex });\n  const [rects, setRects] = useState<Array<Rect>>([]);\n  const { setCursor, removeCursor } = useCursor();\n\n  /* subscribe to rect updates */\n  useEffect(() => {\n    if (!sel) return;\n    return sel.onSelectionChange(() => {\n      setRects(sel.getHighlightRectsForPage(pageIndex));\n    });\n  }, [sel, pageIndex]);\n\n  /* cheap glyphAt cache for the active page */\n  let geoCache: PdfPageGeometry | undefined;\n  const cachedGlyphAt = useCallback((pt: { x: number; y: number }) => {\n    if (!geoCache) return -1;\n    return glyphAt(geoCache, pt);\n  }, []);\n\n  // Initialize geometry cache\n  useEffect(() => {\n    if (!sel) return;\n    const task = sel.getGeometry(pageIndex);\n    task.wait((g) => (geoCache = g), ignore);\n\n    return () => {\n      task.abort({\n        code: PdfErrorCode.Cancelled,\n        message: 'Cancelled',\n      });\n    };\n  }, [sel, pageIndex]);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (point) => {\n        if (!sel) return;\n\n        // clear the selection\n        sel.clear();\n        const task = sel.getGeometry(pageIndex);\n        task.wait((geo) => {\n          const g = glyphAt(geo, point);\n          if (g !== -1) sel.begin(pageIndex, g);\n        }, ignore);\n      },\n      onPointerMove: (point) => {\n        if (!sel) return;\n        const g = cachedGlyphAt(point);\n        if (g !== -1) {\n          setCursor('selection-text', 'text', 10);\n        } else {\n          removeCursor('selection-text');\n        }\n        if (g !== -1) sel.update(pageIndex, g);\n      },\n      onPointerUp: () => {\n        if (!sel) return;\n        sel.end();\n      },\n    }),\n    [sel, pageIndex, cachedGlyphAt],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return (\n    <>\n      {rects.map((b, i) => (\n        <div\n          key={i}\n          style={{\n            position: 'absolute',\n            left: b.origin.x * scale,\n            top: b.origin.y * scale,\n            width: b.size.width * scale,\n            height: b.size.height * scale,\n            background,\n            pointerEvents: 'none',\n          }}\n        />\n      ))}\n    </>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAyC;AACzC,8BAAgC;AAEzB,IAAM,yBAAyB,UAAM,4BAA+B,wCAAgB,EAAE;AACtF,IAAM,qBAAqB,UAAM,wBAA2B,wCAAgB,EAAE;;;ACJrF,IAAAA,gBAA0D;AAC1D,oBAA4D;AAC5D,IAAAA,gBAA8C;AAE9C,IAAAC,2BAAwB;AAkFpB;AAxEG,SAAS,eAAe,EAAE,WAAW,OAAO,aAAa,mBAAmB,GAAU;AAC3F,QAAM,EAAE,UAAU,IAAI,IAAI,uBAAuB;AACjD,QAAM,EAAE,SAAS,QAAI,kCAAmB,EAAE,QAAQ,WAAW,UAAU,CAAC;AACxE,QAAM,CAAC,OAAO,QAAQ,QAAI,wBAAsB,CAAC,CAAC;AAClD,QAAM,EAAE,WAAW,aAAa,QAAI,yBAAU;AAG9C,+BAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,WAAO,IAAI,kBAAkB,MAAM;AACjC,eAAS,IAAI,yBAAyB,SAAS,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,GAAG,CAAC,KAAK,SAAS,CAAC;AAGnB,MAAI;AACJ,QAAM,oBAAgB,2BAAY,CAAC,OAAiC;AAClE,QAAI,CAAC,SAAU,QAAO;AACtB,eAAO,kCAAQ,UAAU,EAAE;AAAA,EAC7B,GAAG,CAAC,CAAC;AAGL,+BAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,UAAM,OAAO,IAAI,YAAY,SAAS;AACtC,SAAK,KAAK,CAAC,MAAO,WAAW,GAAI,oBAAM;AAEvC,WAAO,MAAM;AACX,WAAK,MAAM;AAAA,QACT,MAAM,2BAAa;AAAA,QACnB,SAAS;AAAA,MACX,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,QAAM,eAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AAGV,YAAI,MAAM;AACV,cAAM,OAAO,IAAI,YAAY,SAAS;AACtC,aAAK,KAAK,CAAC,QAAQ;AACjB,gBAAM,QAAI,kCAAQ,KAAK,KAAK;AAC5B,cAAI,MAAM,GAAI,KAAI,MAAM,WAAW,CAAC;AAAA,QACtC,GAAG,oBAAM;AAAA,MACX;AAAA,MACA,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AACV,cAAM,IAAI,cAAc,KAAK;AAC7B,YAAI,MAAM,IAAI;AACZ,oBAAU,kBAAkB,QAAQ,EAAE;AAAA,QACxC,OAAO;AACL,uBAAa,gBAAgB;AAAA,QAC/B;AACA,YAAI,MAAM,GAAI,KAAI,OAAO,WAAW,CAAC;AAAA,MACvC;AAAA,MACA,aAAa,MAAM;AACjB,YAAI,CAAC,IAAK;AACV,YAAI,IAAI;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,KAAK,WAAW,aAAa;AAAA,EAChC;AAEA,+BAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SACE,2EACG,gBAAM,IAAI,CAAC,GAAG,MACb;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,MAAM,EAAE,OAAO,IAAI;AAAA,QACnB,KAAK,EAAE,OAAO,IAAI;AAAA,QAClB,OAAO,EAAE,KAAK,QAAQ;AAAA,QACtB,QAAQ,EAAE,KAAK,SAAS;AAAA,QACxB;AAAA,QACA,eAAe;AAAA,MACjB;AAAA;AAAA,IATK;AAAA,EAUP,CACD,GACH;AAEJ;","names":["import_react","import_plugin_selection"]}

package/dist/react/index.d.cts

@@ -0,0 +1,23 @@
+import * as _embedpdf_plugin_selection from '@embedpdf/plugin-selection';
+import { SelectionPlugin } from '@embedpdf/plugin-selection';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+declare const useSelectionCapability: () => {
+    provides: Readonly<_embedpdf_plugin_selection.SelectionCapability> | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+declare const useSelectionPlugin: () => {
+    plugin: SelectionPlugin | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+
+type Props = {
+    pageIndex: number;
+    scale: number;
+    background?: string;
+};
+declare function SelectionLayer({ pageIndex, scale, background }: Props): react_jsx_runtime.JSX.Element;
+
+export { SelectionLayer, useSelectionCapability, useSelectionPlugin };

package/dist/react/index.d.ts

@@ -0,0 +1,23 @@
+import * as _embedpdf_plugin_selection from '@embedpdf/plugin-selection';
+import { SelectionPlugin } from '@embedpdf/plugin-selection';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+declare const useSelectionCapability: () => {
+    provides: Readonly<_embedpdf_plugin_selection.SelectionCapability> | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+declare const useSelectionPlugin: () => {
+    plugin: SelectionPlugin | null;
+    isLoading: boolean;
+    ready: Promise<void>;
+};
+
+type Props = {
+    pageIndex: number;
+    scale: number;
+    background?: string;
+};
+declare function SelectionLayer({ pageIndex, scale, background }: Props): react_jsx_runtime.JSX.Element;
+
+export { SelectionLayer, useSelectionCapability, useSelectionPlugin };

package/dist/react/index.js

@@ -0,0 +1,93 @@
+// src/react/hooks/use-selection.ts
+import { useCapability, usePlugin } from "@embedpdf/core/react";
+import { SelectionPlugin } from "@embedpdf/plugin-selection";
+var useSelectionCapability = () => useCapability(SelectionPlugin.id);
+var useSelectionPlugin = () => usePlugin(SelectionPlugin.id);
+
+// src/react/components/selection-layer.tsx
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { ignore, PdfErrorCode } from "@embedpdf/models";
+import { useCursor, usePointerHandlers } from "@embedpdf/plugin-interaction-manager/react";
+import { glyphAt } from "@embedpdf/plugin-selection";
+import { Fragment, jsx } from "react/jsx-runtime";
+function SelectionLayer({ pageIndex, scale, background = "rgba(33,150,243)" }) {
+  const { provides: sel } = useSelectionCapability();
+  const { register } = usePointerHandlers({ modeId: "default", pageIndex });
+  const [rects, setRects] = useState([]);
+  const { setCursor, removeCursor } = useCursor();
+  useEffect(() => {
+    if (!sel) return;
+    return sel.onSelectionChange(() => {
+      setRects(sel.getHighlightRectsForPage(pageIndex));
+    });
+  }, [sel, pageIndex]);
+  let geoCache;
+  const cachedGlyphAt = useCallback((pt) => {
+    if (!geoCache) return -1;
+    return glyphAt(geoCache, pt);
+  }, []);
+  useEffect(() => {
+    if (!sel) return;
+    const task = sel.getGeometry(pageIndex);
+    task.wait((g) => geoCache = g, ignore);
+    return () => {
+      task.abort({
+        code: PdfErrorCode.Cancelled,
+        message: "Cancelled"
+      });
+    };
+  }, [sel, pageIndex]);
+  const handlers = useMemo(
+    () => ({
+      onPointerDown: (point) => {
+        if (!sel) return;
+        sel.clear();
+        const task = sel.getGeometry(pageIndex);
+        task.wait((geo) => {
+          const g = glyphAt(geo, point);
+          if (g !== -1) sel.begin(pageIndex, g);
+        }, ignore);
+      },
+      onPointerMove: (point) => {
+        if (!sel) return;
+        const g = cachedGlyphAt(point);
+        if (g !== -1) {
+          setCursor("selection-text", "text", 10);
+        } else {
+          removeCursor("selection-text");
+        }
+        if (g !== -1) sel.update(pageIndex, g);
+      },
+      onPointerUp: () => {
+        if (!sel) return;
+        sel.end();
+      }
+    }),
+    [sel, pageIndex, cachedGlyphAt]
+  );
+  useEffect(() => {
+    if (!register) return;
+    return register(handlers);
+  }, [register, handlers]);
+  return /* @__PURE__ */ jsx(Fragment, { children: rects.map((b, i) => /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        position: "absolute",
+        left: b.origin.x * scale,
+        top: b.origin.y * scale,
+        width: b.size.width * scale,
+        height: b.size.height * scale,
+        background,
+        pointerEvents: "none"
+      }
+    },
+    i
+  )) });
+}
+export {
+  SelectionLayer,
+  useSelectionCapability,
+  useSelectionPlugin
+};
+//# sourceMappingURL=index.js.map

package/dist/react/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/react/hooks/use-selection.ts","../../src/react/components/selection-layer.tsx"],"sourcesContent":["import { useCapability, usePlugin } from '@embedpdf/core/react';\nimport { SelectionPlugin } from '@embedpdf/plugin-selection';\n\nexport const useSelectionCapability = () => useCapability<SelectionPlugin>(SelectionPlugin.id);\nexport const useSelectionPlugin = () => usePlugin<SelectionPlugin>(SelectionPlugin.id);\n","import { useCallback, useEffect, useMemo, useState } from 'react';\nimport { ignore, PdfErrorCode, PdfPageGeometry, Rect } from '@embedpdf/models';\nimport { useCursor, usePointerHandlers } from '@embedpdf/plugin-interaction-manager/react';\nimport { PointerEventHandlers } from '@embedpdf/plugin-interaction-manager';\nimport { glyphAt } from '@embedpdf/plugin-selection';\n\nimport { useSelectionCapability } from '../hooks';\n\ntype Props = {\n  pageIndex: number;\n  scale: number;\n  background?: string;\n};\n\nexport function SelectionLayer({ pageIndex, scale, background = 'rgba(33,150,243)' }: Props) {\n  const { provides: sel } = useSelectionCapability();\n  const { register } = usePointerHandlers({ modeId: 'default', pageIndex });\n  const [rects, setRects] = useState<Array<Rect>>([]);\n  const { setCursor, removeCursor } = useCursor();\n\n  /* subscribe to rect updates */\n  useEffect(() => {\n    if (!sel) return;\n    return sel.onSelectionChange(() => {\n      setRects(sel.getHighlightRectsForPage(pageIndex));\n    });\n  }, [sel, pageIndex]);\n\n  /* cheap glyphAt cache for the active page */\n  let geoCache: PdfPageGeometry | undefined;\n  const cachedGlyphAt = useCallback((pt: { x: number; y: number }) => {\n    if (!geoCache) return -1;\n    return glyphAt(geoCache, pt);\n  }, []);\n\n  // Initialize geometry cache\n  useEffect(() => {\n    if (!sel) return;\n    const task = sel.getGeometry(pageIndex);\n    task.wait((g) => (geoCache = g), ignore);\n\n    return () => {\n      task.abort({\n        code: PdfErrorCode.Cancelled,\n        message: 'Cancelled',\n      });\n    };\n  }, [sel, pageIndex]);\n\n  const handlers = useMemo(\n    (): PointerEventHandlers => ({\n      onPointerDown: (point) => {\n        if (!sel) return;\n\n        // clear the selection\n        sel.clear();\n        const task = sel.getGeometry(pageIndex);\n        task.wait((geo) => {\n          const g = glyphAt(geo, point);\n          if (g !== -1) sel.begin(pageIndex, g);\n        }, ignore);\n      },\n      onPointerMove: (point) => {\n        if (!sel) return;\n        const g = cachedGlyphAt(point);\n        if (g !== -1) {\n          setCursor('selection-text', 'text', 10);\n        } else {\n          removeCursor('selection-text');\n        }\n        if (g !== -1) sel.update(pageIndex, g);\n      },\n      onPointerUp: () => {\n        if (!sel) return;\n        sel.end();\n      },\n    }),\n    [sel, pageIndex, cachedGlyphAt],\n  );\n\n  useEffect(() => {\n    if (!register) return;\n    return register(handlers);\n  }, [register, handlers]);\n\n  return (\n    <>\n      {rects.map((b, i) => (\n        <div\n          key={i}\n          style={{\n            position: 'absolute',\n            left: b.origin.x * scale,\n            top: b.origin.y * scale,\n            width: b.size.width * scale,\n            height: b.size.height * scale,\n            background,\n            pointerEvents: 'none',\n          }}\n        />\n      ))}\n    </>\n  );\n}\n"],"mappings":";AAAA,SAAS,eAAe,iBAAiB;AACzC,SAAS,uBAAuB;AAEzB,IAAM,yBAAyB,MAAM,cAA+B,gBAAgB,EAAE;AACtF,IAAM,qBAAqB,MAAM,UAA2B,gBAAgB,EAAE;;;ACJrF,SAAS,aAAa,WAAW,SAAS,gBAAgB;AAC1D,SAAS,QAAQ,oBAA2C;AAC5D,SAAS,WAAW,0BAA0B;AAE9C,SAAS,eAAe;AAkFpB,mBAEI,WAFJ;AAxEG,SAAS,eAAe,EAAE,WAAW,OAAO,aAAa,mBAAmB,GAAU;AAC3F,QAAM,EAAE,UAAU,IAAI,IAAI,uBAAuB;AACjD,QAAM,EAAE,SAAS,IAAI,mBAAmB,EAAE,QAAQ,WAAW,UAAU,CAAC;AACxE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAsB,CAAC,CAAC;AAClD,QAAM,EAAE,WAAW,aAAa,IAAI,UAAU;AAG9C,YAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,WAAO,IAAI,kBAAkB,MAAM;AACjC,eAAS,IAAI,yBAAyB,SAAS,CAAC;AAAA,IAClD,CAAC;AAAA,EACH,GAAG,CAAC,KAAK,SAAS,CAAC;AAGnB,MAAI;AACJ,QAAM,gBAAgB,YAAY,CAAC,OAAiC;AAClE,QAAI,CAAC,SAAU,QAAO;AACtB,WAAO,QAAQ,UAAU,EAAE;AAAA,EAC7B,GAAG,CAAC,CAAC;AAGL,YAAU,MAAM;AACd,QAAI,CAAC,IAAK;AACV,UAAM,OAAO,IAAI,YAAY,SAAS;AACtC,SAAK,KAAK,CAAC,MAAO,WAAW,GAAI,MAAM;AAEvC,WAAO,MAAM;AACX,WAAK,MAAM;AAAA,QACT,MAAM,aAAa;AAAA,QACnB,SAAS;AAAA,MACX,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,KAAK,SAAS,CAAC;AAEnB,QAAM,WAAW;AAAA,IACf,OAA6B;AAAA,MAC3B,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AAGV,YAAI,MAAM;AACV,cAAM,OAAO,IAAI,YAAY,SAAS;AACtC,aAAK,KAAK,CAAC,QAAQ;AACjB,gBAAM,IAAI,QAAQ,KAAK,KAAK;AAC5B,cAAI,MAAM,GAAI,KAAI,MAAM,WAAW,CAAC;AAAA,QACtC,GAAG,MAAM;AAAA,MACX;AAAA,MACA,eAAe,CAAC,UAAU;AACxB,YAAI,CAAC,IAAK;AACV,cAAM,IAAI,cAAc,KAAK;AAC7B,YAAI,MAAM,IAAI;AACZ,oBAAU,kBAAkB,QAAQ,EAAE;AAAA,QACxC,OAAO;AACL,uBAAa,gBAAgB;AAAA,QAC/B;AACA,YAAI,MAAM,GAAI,KAAI,OAAO,WAAW,CAAC;AAAA,MACvC;AAAA,MACA,aAAa,MAAM;AACjB,YAAI,CAAC,IAAK;AACV,YAAI,IAAI;AAAA,MACV;AAAA,IACF;AAAA,IACA,CAAC,KAAK,WAAW,aAAa;AAAA,EAChC;AAEA,YAAU,MAAM;AACd,QAAI,CAAC,SAAU;AACf,WAAO,SAAS,QAAQ;AAAA,EAC1B,GAAG,CAAC,UAAU,QAAQ,CAAC;AAEvB,SACE,gCACG,gBAAM,IAAI,CAAC,GAAG,MACb;AAAA,IAAC;AAAA;AAAA,MAEC,OAAO;AAAA,QACL,UAAU;AAAA,QACV,MAAM,EAAE,OAAO,IAAI;AAAA,QACnB,KAAK,EAAE,OAAO,IAAI;AAAA,QAClB,OAAO,EAAE,KAAK,QAAQ;AAAA,QACtB,QAAQ,EAAE,KAAK,SAAS;AAAA,QACxB;AAAA,QACA,eAAe;AAAA,MACjB;AAAA;AAAA,IATK;AAAA,EAUP,CACD,GACH;AAEJ;","names":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@embedpdf/plugin-selection",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",
@@ -15,25 +15,30 @@
       "types": "./dist/preact/index.d.ts",
       "import": "./dist/preact/index.js",
       "require": "./dist/preact/index.cjs"
+    },
+    "./react": {
+      "types": "./dist/react/index.d.ts",
+      "import": "./dist/react/index.js",
+      "require": "./dist/react/index.cjs"
     }
   },
   "dependencies": {
-    "@embedpdf/models": "1.0.5"
+    "@embedpdf/models": "1.0.6"
   },
   "devDependencies": {
     "@types/react": "^18.2.0",
     "tsup": "^8.0.0",
     "typescript": "^5.0.0",
-    "@embedpdf/plugin-viewport": "1.0.5",
-    "@embedpdf/plugin-interaction-manager": "1.0.5"
+    "@embedpdf/plugin-viewport": "1.0.6",
+    "@embedpdf/plugin-interaction-manager": "1.0.6"
   },
   "peerDependencies": {
     "react": ">=16.8.0",
     "react-dom": ">=16.8.0",
     "preact": "^10.26.4",
-    "@embedpdf/plugin-viewport": "1.0.5",
-    "@embedpdf/core": "1.0.5",
-    "@embedpdf/plugin-interaction-manager": "1.0.5"
+    "@embedpdf/plugin-viewport": "1.0.6",
+    "@embedpdf/plugin-interaction-manager": "1.0.6",
+    "@embedpdf/core": "1.0.6"
   },
   "files": [
     "dist",