react-pdf-highlighter-plus 1.0.0

package/dist/esm/components/MouseSelection.d.ts

@@ -0,0 +1,66 @@
+import React, { CSSProperties } from "react";
+import "../style/MouseSelection.css";
+import { PDFViewer } from "pdfjs-dist/types/web/pdf_viewer";
+import type { ScaledPosition, ViewportPosition } from "../types";
+/**
+ * The props type for {@link MouseSelection}.
+ *
+ * @category Component Properties
+ * @internal
+ */
+export interface MouseSelectionProps {
+    /**
+     * The PDFViewer instance containing this MouseSelection.
+     */
+    viewer: PDFViewer;
+    /**
+     * Callback triggered whenever the user stops dragging their mouse and a valid
+     * mouse selection is made. In general, this will only be called if a mouse
+     * selection is rendered.
+     *
+     * @param viewportPosition - viewport position of the mouse selection.
+     * @param scaledPosition - scaled position of the mouse selection.
+     * @param image - PNG screenshot of the mouse selection.
+     * @param resetSelection - Callback to reset the current selection.
+     * @param event - Mouse event associated with ending the selection.
+     */
+    onSelection?(viewportPosition: ViewportPosition, scaledPosition: ScaledPosition, image: string, resetSelection: () => void, event: MouseEvent): void;
+    /**
+     * Callback triggered whenever the current mouse selection is reset.
+     * This includes when dragging ends but the selection is invalid.
+     */
+    onReset?(): void;
+    /**
+     * Callback triggered whenever a new valid mouse selection begins.
+     *
+     * @param event - mouse event associated with the new selection.
+     */
+    onDragStart?(event: MouseEvent): void;
+    /**
+     * Condition to check before any mouse selection starts.
+     *
+     * @param event - mouse event associated with the new selection.
+     * @returns - `True` if mouse selection should start.
+     */
+    enableAreaSelection(event: MouseEvent): boolean;
+    /**
+     * Callback whenever the mouse selection area changes.
+     *
+     * @param isVisible - Whether the mouse selection is rendered (i.e., non-zero area)
+     */
+    onChange?(isVisible: boolean): void;
+    /**
+     * Optional style props for the mouse selection rectangle.
+     */
+    style?: CSSProperties;
+}
+/**
+ * A component that enables the creation of rectangular and interactive mouse
+ * selections within a given container. NOTE: This does not disable selection in
+ * whatever container the component is placed in. That must be handled through
+ * the component's events.
+ *
+ * @category Component
+ * @internal
+ */
+export declare const MouseSelection: ({ viewer, onSelection, onReset, onDragStart, enableAreaSelection, onChange, style, }: MouseSelectionProps) => React.JSX.Element;

package/dist/esm/components/MouseSelection.js

@@ -0,0 +1,122 @@
+import React, { useEffect, useRef, useState } from "react";
+import { asElement, getPageFromElement, isHTMLElement } from "../lib/pdfjs-dom";
+import "../style/MouseSelection.css";
+import { viewportPositionToScaled } from "../lib/coordinates";
+import screenshot from "../lib/screenshot";
+const getBoundingRect = (start, end) => {
+    return {
+        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 getContainerCoords = (container, pageX, pageY) => {
+    const containerBoundingRect = container.getBoundingClientRect();
+    return {
+        x: pageX - containerBoundingRect.left + container.scrollLeft,
+        y: pageY - containerBoundingRect.top + container.scrollTop - window.scrollY,
+    };
+};
+/**
+ * A component that enables the creation of rectangular and interactive mouse
+ * selections within a given container. NOTE: This does not disable selection in
+ * whatever container the component is placed in. That must be handled through
+ * the component's events.
+ *
+ * @category Component
+ * @internal
+ */
+export const MouseSelection = ({ viewer, onSelection, onReset, onDragStart, enableAreaSelection, onChange, style, }) => {
+    const [start, setStart] = useState(null);
+    const [end, setEnd] = useState(null);
+    const [locked, setLocked] = useState(false);
+    const rootRef = useRef(null);
+    // Needed in order to grab the page info of a mouse selection
+    const startTargetRef = useRef(null);
+    const reset = () => {
+        onReset && onReset();
+        setStart(null);
+        setEnd(null);
+        setLocked(false);
+    };
+    // Register event listeners onChange
+    useEffect(() => {
+        onChange && onChange(Boolean(start && end));
+        if (!rootRef.current)
+            return;
+        // Should be the PdfHighlighter
+        const container = asElement(rootRef.current.parentElement);
+        const handleMouseUp = (event) => {
+            if (!start || !end || !startTargetRef.current)
+                return;
+            const boundingRect = getBoundingRect(start, end);
+            // Check if the bounding rectangle has a minimum width and height
+            // to prevent recording selections with 0 area
+            const shouldEnd = boundingRect.width >= 1 && boundingRect.height >= 1;
+            if (!container.contains(asElement(event.target)) || !shouldEnd) {
+                reset();
+                return;
+            }
+            setLocked(true);
+            const page = getPageFromElement(startTargetRef.current);
+            if (!page)
+                return;
+            const pageBoundingRect = {
+                ...boundingRect,
+                top: boundingRect.top - page.node.offsetTop,
+                left: boundingRect.left - page.node.offsetLeft,
+                pageNumber: page.number,
+            };
+            const viewportPosition = {
+                boundingRect: pageBoundingRect,
+                rects: [],
+            };
+            const scaledPosition = viewportPositionToScaled(viewportPosition, viewer);
+            const image = screenshot(pageBoundingRect, pageBoundingRect.pageNumber, viewer);
+            onSelection &&
+                onSelection(viewportPosition, scaledPosition, image, reset, event);
+        };
+        const handleMouseMove = (event) => {
+            if (!rootRef.current || !start || locked)
+                return;
+            setEnd(getContainerCoords(container, event.pageX, event.pageY));
+        };
+        const handleMouseDown = (event) => {
+            const shouldStart = (event) => enableAreaSelection(event) &&
+                isHTMLElement(event.target) &&
+                Boolean(asElement(event.target).closest(".page"));
+            // If the user clicks anywhere outside a tip, reset the selection
+            const shouldReset = (event) => start &&
+                !asElement(event.target).closest(".PdfHighlighter__tip-container");
+            if (!shouldStart(event)) {
+                if (shouldReset(event))
+                    reset();
+                return;
+            }
+            startTargetRef.current = asElement(event.target);
+            onDragStart && onDragStart(event);
+            setStart(getContainerCoords(container, event.pageX, event.pageY));
+            setEnd(null);
+            setLocked(false);
+        };
+        /**
+         * Although we register the event listeners on the PdfHighlighter component, we encapsulate
+         * them in this separate component to enhance maintainability and prevent unnecessary
+         * rerenders of the PdfHighlighter itself. While synthetic events on PdfHighlighter would
+         * be preferable, we need to register "mouseup" on the entire document anyway. Therefore,
+         * we can't avoid using useEffect. We must re-register all events on state changes, as
+         * custom event listeners may otherwise receive stale state.
+         */
+        container.addEventListener("mousemove", handleMouseMove);
+        container.addEventListener("mousedown", handleMouseDown);
+        document.addEventListener("mouseup", handleMouseUp);
+        return () => {
+            container.removeEventListener("mousemove", handleMouseMove);
+            container.removeEventListener("mousedown", handleMouseDown);
+            document.removeEventListener("mouseup", handleMouseUp);
+        };
+    }, [start, end, enableAreaSelection]);
+    return (React.createElement("div", { className: "MouseSelection-container", ref: rootRef }, start && end && (React.createElement("div", { className: "MouseSelection", style: { ...getBoundingRect(start, end), ...style } }))));
+};
+//# sourceMappingURL=MouseSelection.js.map

package/dist/esm/components/MouseSelection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MouseSelection.js","sourceRoot":"","sources":["../../../src/components/MouseSelection.tsx"],"names":[],"mappings":"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"}

package/dist/esm/components/PdfHighlighter.d.ts

@@ -0,0 +1,184 @@
+import "pdfjs-dist/web/pdf_viewer.css";
+import "../style/PdfHighlighter.css";
+import "../style/pdf_viewer.css";
+import { PDFDocumentProxy } from "pdfjs-dist";
+import React, { CSSProperties, ReactNode } from "react";
+import { PdfHighlighterUtils } from "../contexts/PdfHighlighterContext";
+import { DrawingStroke, GhostHighlight, Highlight, PdfScaleValue, PdfSelection, ScaledPosition, ShapeData, ShapeType } from "../types";
+/**
+ * The props type for {@link PdfHighlighter}.
+ *
+ * @category Component Properties
+ */
+export interface PdfHighlighterProps {
+    /**
+     * Array of all highlights to be organised and fed through to the child
+     * highlight container.
+     */
+    highlights: Array<Highlight>;
+    /**
+     * Event is called only once whenever the user changes scroll after
+     * the autoscroll function, scrollToHighlight, has been called.
+     */
+    onScrollAway?(): void;
+    /**
+     * What scale to render the PDF at inside the viewer.
+     */
+    pdfScaleValue?: PdfScaleValue;
+    /**
+     * Callback triggered whenever a user finishes making a mouse selection or has
+     * selected text.
+     *
+     * @param PdfSelection - Content and positioning of the selection. NOTE:
+     * `makeGhostHighlight` will not work if the selection disappears.
+     */
+    onSelection?(PdfSelection: PdfSelection): void;
+    /**
+     * Callback triggered whenever a ghost (non-permanent) highlight is created.
+     *
+     * @param ghostHighlight - Ghost Highlight that has been created.
+     */
+    onCreateGhostHighlight?(ghostHighlight: GhostHighlight): void;
+    /**
+     * Callback triggered whenever a ghost (non-permanent) highlight is removed.
+     *
+     * @param ghostHighlight - Ghost Highlight that has been removed.
+     */
+    onRemoveGhostHighlight?(ghostHighlight: GhostHighlight): void;
+    /**
+     * Optional element that can be displayed as a tip whenever a user makes a
+     * selection.
+     */
+    selectionTip?: ReactNode;
+    /**
+     * Condition to check before any mouse selection starts.
+     *
+     * @param event - mouse event associated with the new selection.
+     * @returns - `True` if mouse selection should start.
+     */
+    enableAreaSelection?(event: MouseEvent): boolean;
+    /**
+     * When true, shows crosshair cursor indicating area selection mode is active.
+     * Use this when area selection should be persistently enabled (not just on modifier key).
+     */
+    areaSelectionMode?: boolean;
+    /**
+     * Optional CSS styling for the rectangular mouse selection.
+     */
+    mouseSelectionStyle?: CSSProperties;
+    /**
+     * PDF document to view and overlay highlights.
+     */
+    pdfDocument: PDFDocumentProxy;
+    /**
+     * This should be a highlight container/renderer of some sorts. It will be
+     * given appropriate context for a single highlight which it can then use to
+     * render a TextHighlight, AreaHighlight, etc. in the correct place.
+     */
+    children: ReactNode;
+    /**
+     * Coloring for unhighlighted, selected text.
+     */
+    textSelectionColor?: string;
+    /**
+     * Creates a reference to the PdfHighlighterContext above the component.
+     *
+     * @param pdfHighlighterUtils - various useful tools with a PdfHighlighter.
+     * See {@link PdfHighlighterContext} for more description.
+     */
+    utilsRef(pdfHighlighterUtils: PdfHighlighterUtils): void;
+    /**
+     * Style properties for the PdfHighlighter (scrollbar, background, etc.), NOT
+     * the PDF.js viewer it encloses. If you want to edit the latter, use the
+     * other style props like `textSelectionColor` or overwrite pdf_viewer.css
+     */
+    style?: CSSProperties;
+    /**
+     * Condition to check before freetext creation starts.
+     *
+     * @param event - mouse event associated with the click.
+     * @returns - `True` if freetext creation should occur.
+     */
+    enableFreetextCreation?(event: MouseEvent): boolean;
+    /**
+     * Callback triggered when user clicks to create a freetext annotation.
+     *
+     * @param position - Scaled position where the click occurred.
+     */
+    onFreetextClick?(position: ScaledPosition): void;
+    /**
+     * Condition to check before image creation starts.
+     *
+     * @param event - mouse event associated with the click.
+     * @returns - `True` if image creation should occur.
+     */
+    enableImageCreation?(event: MouseEvent): boolean;
+    /**
+     * Callback triggered when user clicks to create an image annotation.
+     *
+     * @param position - Scaled position where the click occurred.
+     */
+    onImageClick?(position: ScaledPosition): void;
+    /**
+     * Whether drawing mode is enabled.
+     */
+    enableDrawingMode?: boolean;
+    /**
+     * Callback triggered when a drawing is completed.
+     *
+     * @param dataUrl - The drawing as a PNG data URL.
+     * @param position - Scaled position of the drawing on the page.
+     * @param strokes - The stroke data for later editing.
+     */
+    onDrawingComplete?(dataUrl: string, position: ScaledPosition, strokes: DrawingStroke[]): void;
+    /**
+     * Callback triggered when drawing is cancelled.
+     */
+    onDrawingCancel?(): void;
+    /**
+     * Stroke color for drawing mode.
+     * @default "#000000"
+     */
+    drawingStrokeColor?: string;
+    /**
+     * Stroke width for drawing mode.
+     * @default 3
+     */
+    drawingStrokeWidth?: number;
+    /**
+     * The type of shape to create, or null if shape mode is not active.
+     */
+    enableShapeMode?: ShapeType | null;
+    /**
+     * Callback triggered when a shape is completed.
+     *
+     * @param position - Scaled position of the shape on the page.
+     * @param shape - The shape data (type, color, width).
+     */
+    onShapeComplete?(position: ScaledPosition, shape: ShapeData): void;
+    /**
+     * Callback triggered when shape creation is cancelled.
+     */
+    onShapeCancel?(): void;
+    /**
+     * Stroke color for shape mode.
+     * @default "#000000"
+     */
+    shapeStrokeColor?: string;
+    /**
+     * Stroke width for shape mode.
+     * @default 2
+     */
+    shapeStrokeWidth?: number;
+}
+/**
+ * This is a large-scale PDF viewer component designed to facilitate
+ * highlighting. It should be used as a child to a {@link PdfLoader} to ensure
+ * proper document loading. This does not itself render any highlights, but
+ * instead its child should be the container component for each individual
+ * highlight. This component will be provided appropriate HighlightContext for
+ * rendering.
+ *
+ * @category Component
+ */
+export declare const PdfHighlighter: ({ highlights, onScrollAway, pdfScaleValue, onSelection: onSelectionFinished, onCreateGhostHighlight, onRemoveGhostHighlight, selectionTip, enableAreaSelection, areaSelectionMode, mouseSelectionStyle, pdfDocument, children, textSelectionColor, utilsRef, style, enableFreetextCreation, onFreetextClick, enableImageCreation, onImageClick, enableDrawingMode, onDrawingComplete, onDrawingCancel, drawingStrokeColor, drawingStrokeWidth, enableShapeMode, onShapeComplete, onShapeCancel, shapeStrokeColor, shapeStrokeWidth, }: PdfHighlighterProps) => React.JSX.Element;