@rzymek/react-pdf-highlighter 8.0.1-rc.0

package/dist/node_modules/.pnpm/ts-debounce@4.0.0/node_modules/ts-debounce/dist/src/index.esm.js

@@ -0,0 +1,38 @@
+function r(r2, e, n) {
+  var i, t, o;
+  void 0 === n && (n = {});
+  var a = null != (i = n.isImmediate) && i, u = null != (t = n.callback) && t, c = n.maxWait, v = Date.now(), l = [];
+  function f() {
+    if (void 0 !== c) {
+      var r3 = Date.now() - v;
+      if (r3 + e >= c) return c - r3;
+    }
+    return e;
+  }
+  var d = function() {
+    var e2 = [].slice.call(arguments), n2 = this;
+    return new Promise(function(i2, t2) {
+      var c2 = a && void 0 === o;
+      if (void 0 !== o && clearTimeout(o), o = setTimeout(function() {
+        if (o = void 0, v = Date.now(), !a) {
+          var i3 = r2.apply(n2, e2);
+          u && u(i3), l.forEach(function(r3) {
+            return (0, r3.resolve)(i3);
+          }), l = [];
+        }
+      }, f()), c2) {
+        var d2 = r2.apply(n2, e2);
+        return u && u(d2), i2(d2);
+      }
+      l.push({ resolve: i2, reject: t2 });
+    });
+  };
+  return d.cancel = function(r3) {
+    void 0 !== o && clearTimeout(o), l.forEach(function(e2) {
+      return (0, e2.reject)(r3);
+    }), l = [];
+  }, d;
+}
+export {
+  r as debounce
+};

package/dist/src/components/AreaHighlight.js

@@ -0,0 +1,58 @@
+import { jsx } from "react/jsx-runtime";
+import { Rnd } from "react-rnd";
+import { getPageFromElement } from "../lib/pdfjs-dom.js";
+import styles from "../style/AreaHighlight.module.css.js";
+function AreaHighlight({
+  highlight,
+  onChange,
+  isScrolledTo,
+  ...otherProps
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: `${styles.areaHighlight} ${isScrolledTo ? styles.scrolledTo : ""}`,
+      children: /* @__PURE__ */ jsx(
+        Rnd,
+        {
+          className: styles.part,
+          onDragStop: (_, data) => {
+            const boundingRect = {
+              ...highlight.position.boundingRect,
+              top: data.y,
+              left: data.x
+            };
+            onChange(boundingRect);
+          },
+          onResizeStop: (_mouseEvent, _direction, ref, _delta, position) => {
+            var _a;
+            const boundingRect = {
+              top: position.y,
+              left: position.x,
+              width: ref.offsetWidth,
+              height: ref.offsetHeight,
+              pageNumber: ((_a = getPageFromElement(ref)) == null ? void 0 : _a.number) || -1
+            };
+            onChange(boundingRect);
+          },
+          position: {
+            x: highlight.position.boundingRect.left,
+            y: highlight.position.boundingRect.top
+          },
+          size: {
+            width: highlight.position.boundingRect.width,
+            height: highlight.position.boundingRect.height
+          },
+          onClick: (event) => {
+            event.stopPropagation();
+            event.preventDefault();
+          },
+          ...otherProps
+        }
+      )
+    }
+  );
+}
+export {
+  AreaHighlight
+};

package/dist/src/components/Highlight.js

@@ -0,0 +1,45 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import styles from "../style/Highlight.module.css.js";
+function Highlight({
+  position,
+  onClick,
+  onMouseOver,
+  onMouseOut,
+  comment,
+  isScrolledTo
+}) {
+  const { rects, boundingRect } = position;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: `Highlight ${styles.highlight} ${isScrolledTo ? styles.scrolledTo : ""}`,
+      children: [
+        comment ? /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: `Highlight__emoji ${styles.emoji}`,
+            style: {
+              left: 20,
+              top: boundingRect.top
+            },
+            children: comment.emoji
+          }
+        ) : null,
+        /* @__PURE__ */ jsx("div", { className: `Highlight__parts ${styles.parts}`, children: rects.map((rect, index) => /* @__PURE__ */ jsx(
+          "div",
+          {
+            onMouseOver,
+            onMouseOut,
+            onClick,
+            style: rect,
+            className: `Highlight__part ${styles.part}`
+          },
+          index
+        )) })
+      ]
+    }
+  );
+}
+export {
+  Highlight
+};

package/dist/src/components/HighlightLayer.js

@@ -0,0 +1,47 @@
+import { jsx } from "react/jsx-runtime";
+import { viewportToScaled } from "../lib/coordinates.js";
+function HighlightLayer({
+  highlightsByPage,
+  scaledPositionToViewport,
+  pageNumber,
+  scrolledToHighlightId,
+  highlightTransform,
+  tip,
+  hideTipAndSelection,
+  viewer,
+  screenshot,
+  showTip,
+  setTip
+}) {
+  const currentHighlights = highlightsByPage[String(pageNumber)] || [];
+  return /* @__PURE__ */ jsx("div", { children: viewer && currentHighlights.map((highlight, index) => {
+    const viewportHighlight = {
+      ...highlight,
+      position: scaledPositionToViewport(highlight.position)
+    };
+    if (tip && tip.highlight.id === String(highlight.id)) {
+      showTip(tip.highlight, tip.callback(viewportHighlight));
+    }
+    const isScrolledTo = Boolean(scrolledToHighlightId === highlight.id);
+    return highlightTransform(
+      viewportHighlight,
+      index,
+      (highlight2, callback) => {
+        setTip({ highlight: highlight2, callback });
+        showTip(highlight2, callback(highlight2));
+      },
+      hideTipAndSelection,
+      (rect) => {
+        const viewport = viewer.getPageView(
+          (rect.pageNumber || Number.parseInt(pageNumber)) - 1
+        ).viewport;
+        return viewportToScaled(rect, viewport);
+      },
+      (boundingRect) => screenshot(boundingRect, Number.parseInt(pageNumber)),
+      isScrolledTo
+    );
+  }) });
+}
+export {
+  HighlightLayer
+};

package/dist/src/components/MouseMonitor.js

@@ -0,0 +1,45 @@
+var __defProp = Object.defineProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+import { jsx } from "react/jsx-runtime";
+import React, { Component } from "react";
+class MouseMonitor extends Component {
+  constructor() {
+    super(...arguments);
+    __publicField(this, "container", null);
+    __publicField(this, "unsubscribe", () => {
+    });
+    __publicField(this, "onMouseMove", (event) => {
+      if (!this.container) {
+        return;
+      }
+      const { onMoveAway, paddingX, paddingY } = this.props;
+      const { clientX, clientY } = event;
+      const { left, top, width, height } = this.container.getBoundingClientRect();
+      const inBoundsX = clientX > left - paddingX && clientX < left + width + paddingX;
+      const inBoundsY = clientY > top - paddingY && clientY < top + height + paddingY;
+      const isNear = inBoundsX && inBoundsY;
+      if (!isNear) {
+        onMoveAway();
+      }
+    });
+    __publicField(this, "attachRef", (ref) => {
+      this.container = ref;
+      this.unsubscribe();
+      if (ref) {
+        const { ownerDocument: doc } = ref;
+        doc.addEventListener("mousemove", this.onMouseMove);
+        this.unsubscribe = () => {
+          doc.removeEventListener("mousemove", this.onMouseMove);
+        };
+      }
+    });
+  }
+  render() {
+    const { onMoveAway, paddingX, paddingY, children, ...restProps } = this.props;
+    return /* @__PURE__ */ jsx("div", { ref: this.attachRef, children: React.cloneElement(children, restProps) });
+  }
+}
+export {
+  MouseMonitor
+};

package/dist/src/components/MouseSelection.js

@@ -0,0 +1,119 @@
+import { jsx } from "react/jsx-runtime";
+import { useState, useRef, useEffect, useCallback } from "react";
+import { isHTMLElement } from "../lib/pdfjs-dom.js";
+import styles from "../style/MouseSelection.module.css.js";
+const getBoundingRect = (start, end) => ({
+  left: Math.min(end.x, start.x),
+  top: Math.min(end.y, start.y),
+  width: Math.abs(end.x - start.x),
+  height: Math.abs(end.y - start.y)
+});
+const shouldRender = (boundingRect) => boundingRect.width >= 1 && boundingRect.height >= 1;
+function MouseSelection({
+  onSelection,
+  onDragStart,
+  onDragEnd,
+  shouldStart,
+  onChange
+}) {
+  const [locked, setLocked] = useState(false);
+  const [start, setStart] = useState(null);
+  const [end, setEnd] = useState(null);
+  const rootRef = useRef(null);
+  const startRef = useRef(start);
+  const lockedRef = useRef(locked);
+  useEffect(() => {
+    startRef.current = start;
+  }, [start]);
+  useEffect(() => {
+    lockedRef.current = locked;
+  }, [locked]);
+  const reset = useCallback(() => {
+    onDragEnd();
+    setStart(null);
+    setEnd(null);
+    setLocked(false);
+  }, [onDragEnd]);
+  useEffect(() => {
+    const isVisible = Boolean(start && end);
+    onChange(isVisible);
+  }, [start, end, onChange]);
+  useEffect(() => {
+    const root = rootRef.current;
+    if (!root) {
+      return;
+    }
+    const container = root.parentElement;
+    if (!container || !isHTMLElement(container)) {
+      return;
+    }
+    const containerCoords = (pageX, pageY) => {
+      const containerBoundingRect = container.getBoundingClientRect();
+      return {
+        x: pageX - containerBoundingRect.left + container.scrollLeft,
+        y: pageY - containerBoundingRect.top + container.scrollTop - window.scrollY
+      };
+    };
+    const mouseMoveHandler = (event) => {
+      if (!startRef.current || lockedRef.current) {
+        return;
+      }
+      setEnd(containerCoords(event.pageX, event.pageY));
+    };
+    const mouseDownHandler = (event) => {
+      if (!shouldStart(event)) {
+        reset();
+        return;
+      }
+      const startTarget = event.target;
+      if (!(startTarget instanceof Element) || !isHTMLElement(startTarget)) {
+        return;
+      }
+      onDragStart();
+      setStart(containerCoords(event.pageX, event.pageY));
+      setEnd(null);
+      setLocked(false);
+      const mouseUpHandler = (event2) => {
+        var _a;
+        (_a = event2.currentTarget) == null ? void 0 : _a.removeEventListener("mouseup", mouseUpHandler);
+        const currentStart = startRef.current;
+        if (!currentStart) {
+          return;
+        }
+        if (!(event2 instanceof MouseEvent)) {
+          return;
+        }
+        const endCoords = containerCoords(event2.pageX, event2.pageY);
+        const boundingRect = getBoundingRect(currentStart, endCoords);
+        if (!(event2.target instanceof Element) || !isHTMLElement(event2.target) || !container.contains(event2.target) || !shouldRender(boundingRect)) {
+          reset();
+          return;
+        }
+        setEnd(endCoords);
+        setLocked(true);
+        onSelection(startTarget, boundingRect, reset);
+        onDragEnd();
+      };
+      const doc = container.ownerDocument;
+      if (doc == null ? void 0 : doc.body) {
+        doc.body.addEventListener("mouseup", mouseUpHandler);
+      }
+    };
+    container.addEventListener("mousemove", mouseMoveHandler);
+    container.addEventListener("mousedown", mouseDownHandler);
+    return () => {
+      container.removeEventListener("mousemove", mouseMoveHandler);
+      container.removeEventListener("mousedown", mouseDownHandler);
+    };
+  }, [shouldStart, onDragStart, onDragEnd, onSelection, reset]);
+  return /* @__PURE__ */ jsx("div", { ref: rootRef, children: start && end && /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: styles.mouseSelection,
+      style: getBoundingRect(start, end)
+    }
+  ) });
+}
+export {
+  MouseSelection
+};