react-pdf-highlighter-plus 1.0.0

package/dist/esm/components/SignaturePad.js

@@ -0,0 +1,138 @@
+import React, { useRef, useEffect, useCallback } from "react";
+import "../style/SignaturePad.css";
+/**
+ * A modal component with a canvas for drawing signatures.
+ * Supports both mouse and touch input.
+ *
+ * @category Component
+ */
+export const SignaturePad = ({ isOpen, onComplete, onClose, width = 400, height = 200, }) => {
+    const canvasRef = useRef(null);
+    const isDrawingRef = useRef(false);
+    const lastPosRef = useRef({ x: 0, y: 0 });
+    // Initialize canvas context
+    useEffect(() => {
+        if (!isOpen || !canvasRef.current)
+            return;
+        const canvas = canvasRef.current;
+        const ctx = canvas.getContext("2d");
+        if (!ctx)
+            return;
+        // Set up drawing style
+        ctx.strokeStyle = "#000000";
+        ctx.lineWidth = 2;
+        ctx.lineCap = "round";
+        ctx.lineJoin = "round";
+        // Clear canvas
+        ctx.fillStyle = "white";
+        ctx.fillRect(0, 0, width, height);
+    }, [isOpen, width, height]);
+    const getPosition = useCallback((e) => {
+        const canvas = canvasRef.current;
+        if (!canvas)
+            return { x: 0, y: 0 };
+        const rect = canvas.getBoundingClientRect();
+        let clientX;
+        let clientY;
+        if ("touches" in e) {
+            clientX = e.touches[0].clientX;
+            clientY = e.touches[0].clientY;
+        }
+        else {
+            clientX = e.clientX;
+            clientY = e.clientY;
+        }
+        return {
+            x: clientX - rect.left,
+            y: clientY - rect.top,
+        };
+    }, []);
+    const startDrawing = useCallback((e) => {
+        e.preventDefault();
+        isDrawingRef.current = true;
+        lastPosRef.current = getPosition(e);
+    }, [getPosition]);
+    const draw = useCallback((e) => {
+        if (!isDrawingRef.current)
+            return;
+        e.preventDefault();
+        const canvas = canvasRef.current;
+        const ctx = canvas?.getContext("2d");
+        if (!ctx)
+            return;
+        const currentPos = getPosition(e);
+        ctx.beginPath();
+        ctx.moveTo(lastPosRef.current.x, lastPosRef.current.y);
+        ctx.lineTo(currentPos.x, currentPos.y);
+        ctx.stroke();
+        lastPosRef.current = currentPos;
+    }, [getPosition]);
+    const stopDrawing = useCallback(() => {
+        isDrawingRef.current = false;
+    }, []);
+    // Set up event listeners
+    useEffect(() => {
+        if (!isOpen)
+            return;
+        const canvas = canvasRef.current;
+        if (!canvas)
+            return;
+        // Mouse events
+        const handleMouseDown = (e) => startDrawing(e);
+        const handleMouseMove = (e) => draw(e);
+        const handleMouseUp = () => stopDrawing();
+        const handleMouseLeave = () => stopDrawing();
+        // Touch events
+        const handleTouchStart = (e) => startDrawing(e);
+        const handleTouchMove = (e) => draw(e);
+        const handleTouchEnd = () => stopDrawing();
+        canvas.addEventListener("mousedown", handleMouseDown);
+        canvas.addEventListener("mousemove", handleMouseMove);
+        canvas.addEventListener("mouseup", handleMouseUp);
+        canvas.addEventListener("mouseleave", handleMouseLeave);
+        canvas.addEventListener("touchstart", handleTouchStart, { passive: false });
+        canvas.addEventListener("touchmove", handleTouchMove, { passive: false });
+        canvas.addEventListener("touchend", handleTouchEnd);
+        return () => {
+            canvas.removeEventListener("mousedown", handleMouseDown);
+            canvas.removeEventListener("mousemove", handleMouseMove);
+            canvas.removeEventListener("mouseup", handleMouseUp);
+            canvas.removeEventListener("mouseleave", handleMouseLeave);
+            canvas.removeEventListener("touchstart", handleTouchStart);
+            canvas.removeEventListener("touchmove", handleTouchMove);
+            canvas.removeEventListener("touchend", handleTouchEnd);
+        };
+    }, [isOpen, startDrawing, draw, stopDrawing]);
+    const handleClear = () => {
+        const canvas = canvasRef.current;
+        const ctx = canvas?.getContext("2d");
+        if (!ctx || !canvas)
+            return;
+        ctx.fillStyle = "white";
+        ctx.fillRect(0, 0, width, height);
+    };
+    const handleDone = () => {
+        const canvas = canvasRef.current;
+        if (!canvas)
+            return;
+        const dataUrl = canvas.toDataURL("image/png");
+        onComplete(dataUrl);
+    };
+    const handleOverlayClick = (e) => {
+        // Close if clicking the overlay background
+        if (e.target === e.currentTarget) {
+            onClose();
+        }
+    };
+    if (!isOpen)
+        return null;
+    return (React.createElement("div", { className: "SignaturePad__overlay", onClick: handleOverlayClick },
+        React.createElement("div", { className: "SignaturePad__modal" },
+            React.createElement("h3", { className: "SignaturePad__title" }, "Draw your signature"),
+            React.createElement("canvas", { ref: canvasRef, className: "SignaturePad__canvas", width: width, height: height }),
+            React.createElement("div", { className: "SignaturePad__buttons" },
+                React.createElement("button", { type: "button", className: "SignaturePad__button SignaturePad__button--clear", onClick: handleClear }, "Clear"),
+                React.createElement("button", { type: "button", className: "SignaturePad__button SignaturePad__button--cancel", onClick: onClose }, "Cancel"),
+                React.createElement("button", { type: "button", className: "SignaturePad__button SignaturePad__button--done", onClick: handleDone }, "Done")))));
+};
+//# sourceMappingURL=SignaturePad.js.map

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

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

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

@@ -0,0 +1,93 @@
+import React, { CSSProperties, MouseEvent, ReactNode } from "react";
+import "../style/TextHighlight.css";
+import type { ViewportHighlight } from "../types";
+/**
+ * Style options for text highlight appearance.
+ */
+export interface TextHighlightStyle {
+    highlightColor?: string;
+    highlightStyle?: "highlight" | "underline" | "strikethrough";
+}
+/**
+ * The props type for {@link TextHighlight}.
+ *
+ * @category Component Properties
+ */
+export interface TextHighlightProps {
+    /**
+     * Highlight to render over text.
+     */
+    highlight: ViewportHighlight;
+    /**
+     * Callback triggered whenever the user clicks on the part of a highlight.
+     *
+     * @param event - Mouse event associated with click.
+     */
+    onClick?(event: MouseEvent<HTMLDivElement>): void;
+    /**
+     * Callback triggered whenever the user enters the area of a text highlight.
+     *
+     * @param event - Mouse event associated with movement.
+     */
+    onMouseOver?(event: MouseEvent<HTMLDivElement>): void;
+    /**
+     * Callback triggered whenever the user leaves  the area of a text highlight.
+     *
+     * @param event - Mouse event associated with movement.
+     */
+    onMouseOut?(event: MouseEvent<HTMLDivElement>): void;
+    /**
+     * Indicates whether the component is autoscrolled into view, affecting
+     * default theming.
+     */
+    isScrolledTo: boolean;
+    /**
+     * Callback triggered whenever the user tries to open context menu on highlight.
+     *
+     * @param event - Mouse event associated with click.
+     */
+    onContextMenu?(event: MouseEvent<HTMLDivElement>): void;
+    /**
+     * Optional CSS styling applied to each TextHighlight part.
+     */
+    style?: CSSProperties;
+    /**
+     * Background/line color for the highlight.
+     * Default: "rgba(255, 226, 143, 1)" (yellow)
+     */
+    highlightColor?: string;
+    /**
+     * Style mode for the highlight.
+     * - "highlight": Solid background color (default)
+     * - "underline": Line under the text
+     * - "strikethrough": Line through the text
+     */
+    highlightStyle?: "highlight" | "underline" | "strikethrough";
+    /**
+     * Callback triggered when the style changes.
+     */
+    onStyleChange?(style: TextHighlightStyle): void;
+    /**
+     * Callback triggered when the delete button is clicked.
+     */
+    onDelete?(): void;
+    /**
+     * Custom style icon. Replaces the default palette icon.
+     */
+    styleIcon?: ReactNode;
+    /**
+     * Custom delete icon. Replaces the default trash icon.
+     */
+    deleteIcon?: ReactNode;
+    /**
+     * Custom color presets for the style panel.
+     * Default: ["rgba(255, 226, 143, 1)", "#ffcdd2", "#c8e6c9", "#bbdefb", "#e1bee7"]
+     */
+    colorPresets?: string[];
+}
+/**
+ * A component for displaying a highlighted text area.
+ *
+ * @category Component
+ */
+export declare const TextHighlight: ({ highlight, onClick, onMouseOver, onMouseOut, isScrolledTo, onContextMenu, style, highlightColor, highlightStyle, onStyleChange, onDelete, styleIcon, deleteIcon, colorPresets, }: TextHighlightProps) => React.JSX.Element;

package/dist/esm/components/TextHighlight.js

@@ -0,0 +1,115 @@
+import React, { useState, useRef, useEffect, } from "react";
+import "../style/TextHighlight.css";
+// Default icons
+const DefaultStyleIcon = () => (React.createElement("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor" },
+    React.createElement("path", { d: "M12 3c-4.97 0-9 4.03-9 9s4.03 9 9 9c.83 0 1.5-.67 1.5-1.5 0-.39-.15-.74-.39-1.01-.23-.26-.38-.61-.38-.99 0-.83.67-1.5 1.5-1.5H16c2.76 0 5-2.24 5-5 0-4.42-4.03-8-9-8zm-5.5 9c-.83 0-1.5-.67-1.5-1.5S5.67 9 6.5 9 8 9.67 8 10.5 7.33 12 6.5 12zm3-4C8.67 8 8 7.33 8 6.5S8.67 5 9.5 5s1.5.67 1.5 1.5S10.33 8 9.5 8zm5 0c-.83 0-1.5-.67-1.5-1.5S13.67 5 14.5 5s1.5.67 1.5 1.5S15.33 8 14.5 8zm3 4c-.83 0-1.5-.67-1.5-1.5S16.67 9 17.5 9s1.5.67 1.5 1.5-.67 1.5-1.5 1.5z" })));
+const DefaultDeleteIcon = () => (React.createElement("svg", { width: "14", height: "14", viewBox: "0 0 24 24", fill: "currentColor" },
+    React.createElement("path", { d: "M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z" })));
+// Highlight style icons
+const HighlightIcon = () => (React.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" },
+    React.createElement("path", { d: "M6 14l3 3v5h6v-5l3-3V9H6v5zm5-12h2v3h-2V2zM3.5 5.875L4.914 4.46l2.12 2.122L5.622 8 3.5 5.875zm13.46.71l2.123-2.12 1.414 1.414L18.375 8l-1.414-1.414z" })));
+const UnderlineIcon = () => (React.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" },
+    React.createElement("path", { d: "M12 17c3.31 0 6-2.69 6-6V3h-2.5v8c0 1.93-1.57 3.5-3.5 3.5S8.5 12.93 8.5 11V3H6v8c0 3.31 2.69 6 6 6zm-7 2v2h14v-2H5z" })));
+const StrikethroughIcon = () => (React.createElement("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor" },
+    React.createElement("path", { d: "M10 19h4v-3h-4v3zM5 4v3h5v3h4V7h5V4H5zM3 14h18v-2H3v2z" })));
+// Default color presets
+const DEFAULT_COLOR_PRESETS = [
+    "rgba(255, 226, 143, 1)", // Yellow (default)
+    "#ffcdd2", // Light red
+    "#c8e6c9", // Light green
+    "#bbdefb", // Light blue
+    "#e1bee7", // Light purple
+];
+/**
+ * A component for displaying a highlighted text area.
+ *
+ * @category Component
+ */
+export const TextHighlight = ({ highlight, onClick, onMouseOver, onMouseOut, isScrolledTo, onContextMenu, style, highlightColor = "rgba(255, 226, 143, 1)", highlightStyle = "highlight", onStyleChange, onDelete, styleIcon, deleteIcon, colorPresets = DEFAULT_COLOR_PRESETS, }) => {
+    const [isStylePanelOpen, setIsStylePanelOpen] = useState(false);
+    const [isHovered, setIsHovered] = useState(false);
+    const stylePanelRef = useRef(null);
+    const containerRef = useRef(null);
+    // Close style panel when clicking outside
+    useEffect(() => {
+        if (!isStylePanelOpen)
+            return;
+        const handleClickOutside = (e) => {
+            if (stylePanelRef.current &&
+                !stylePanelRef.current.contains(e.target)) {
+                setIsStylePanelOpen(false);
+            }
+        };
+        // Delay adding listener to avoid immediate close
+        const timeoutId = setTimeout(() => {
+            document.addEventListener("mousedown", handleClickOutside);
+        }, 0);
+        return () => {
+            clearTimeout(timeoutId);
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, [isStylePanelOpen]);
+    const highlightClass = isScrolledTo ? "TextHighlight--scrolledTo" : "";
+    const { rects } = highlight.position;
+    // Get the first rect to position the toolbar
+    const firstRect = rects[0];
+    // Build style class based on highlight style
+    const getPartStyleClass = () => {
+        switch (highlightStyle) {
+            case "underline":
+                return "TextHighlight__part--underline";
+            case "strikethrough":
+                return "TextHighlight__part--strikethrough";
+            default:
+                return "";
+        }
+    };
+    // Build inline style for each part
+    const getPartStyle = (rect) => {
+        const baseStyle = { ...rect, ...style };
+        if (highlightStyle === "highlight") {
+            baseStyle.backgroundColor = highlightColor;
+        }
+        else {
+            // For underline and strikethrough, use the color for the line
+            baseStyle.backgroundColor = "transparent";
+            baseStyle.color = highlightColor;
+        }
+        return baseStyle;
+    };
+    return (React.createElement("div", { className: `TextHighlight ${highlightClass}`, onContextMenu: onContextMenu, ref: containerRef },
+        (onStyleChange || onDelete) && firstRect && (React.createElement("div", { className: "TextHighlight__toolbar-wrapper", style: {
+                position: "absolute",
+                left: firstRect.left,
+                top: firstRect.top - 28,
+                paddingBottom: 12,
+            }, onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false) },
+            React.createElement("div", { className: `TextHighlight__toolbar ${isHovered || isStylePanelOpen ? "TextHighlight__toolbar--visible" : ""}` },
+                onStyleChange && (React.createElement("button", { className: "TextHighlight__style-button", onClick: (e) => {
+                        e.stopPropagation();
+                        setIsStylePanelOpen(!isStylePanelOpen);
+                    }, title: "Change style", type: "button" }, styleIcon || React.createElement(DefaultStyleIcon, null))),
+                onDelete && (React.createElement("button", { className: "TextHighlight__delete-button", onClick: (e) => {
+                        e.stopPropagation();
+                        onDelete();
+                    }, title: "Delete", type: "button" }, deleteIcon || React.createElement(DefaultDeleteIcon, null)))),
+            isStylePanelOpen && onStyleChange && (React.createElement("div", { className: "TextHighlight__style-panel", ref: stylePanelRef, onClick: (e) => e.stopPropagation() },
+                React.createElement("div", { className: "TextHighlight__style-row" },
+                    React.createElement("label", null, "Style"),
+                    React.createElement("div", { className: "TextHighlight__style-buttons" },
+                        React.createElement("button", { type: "button", className: `TextHighlight__style-type-button ${highlightStyle === "highlight" ? "active" : ""}`, onClick: () => onStyleChange({ highlightStyle: "highlight" }), title: "Highlight" },
+                            React.createElement(HighlightIcon, null)),
+                        React.createElement("button", { type: "button", className: `TextHighlight__style-type-button ${highlightStyle === "underline" ? "active" : ""}`, onClick: () => onStyleChange({ highlightStyle: "underline" }), title: "Underline" },
+                            React.createElement(UnderlineIcon, null)),
+                        React.createElement("button", { type: "button", className: `TextHighlight__style-type-button ${highlightStyle === "strikethrough" ? "active" : ""}`, onClick: () => onStyleChange({ highlightStyle: "strikethrough" }), title: "Strikethrough" },
+                            React.createElement(StrikethroughIcon, null)))),
+                React.createElement("div", { className: "TextHighlight__style-row" },
+                    React.createElement("label", null, "Color"),
+                    React.createElement("div", { className: "TextHighlight__color-options" },
+                        React.createElement("div", { className: "TextHighlight__color-presets" }, colorPresets.map((c) => (React.createElement("button", { key: c, type: "button", className: `TextHighlight__color-preset ${highlightColor === c ? "active" : ""}`, style: { backgroundColor: c }, onClick: () => onStyleChange({ highlightColor: c }), title: c })))),
+                        React.createElement("input", { type: "color", value: highlightColor, onChange: (e) => {
+                                onStyleChange({ highlightColor: e.target.value });
+                            } }))))))),
+        React.createElement("div", { className: "TextHighlight__parts", onMouseEnter: () => setIsHovered(true), onMouseLeave: () => setIsHovered(false) }, rects.map((rect, index) => (React.createElement("div", { onMouseOver: onMouseOver, onMouseOut: onMouseOut, onClick: onClick, key: index, style: getPartStyle(rect), className: `TextHighlight__part ${getPartStyleClass()}` }))))));
+};
+//# sourceMappingURL=TextHighlight.js.map

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

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

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

@@ -0,0 +1,27 @@
+import { PDFViewer } from "pdfjs-dist/types/web/pdf_viewer";
+import React, { MutableRefObject } from "react";
+/**
+ * The props type for {@link TipContainer}.
+ *
+ * @category Component Properties
+ * @internal
+ */
+export interface TipContainerProps {
+    /**
+     * The PDFViewer instance containing the HighlightLayer
+     */
+    viewer: PDFViewer;
+    /**
+     * Reference to the callback to update the tip's position.This should be
+     * managed by the PdfHighlighter.
+     */
+    updateTipPositionRef: MutableRefObject<() => void>;
+}
+/**
+ * A component that manages rendering and placement of a tip around a highlight.
+ * It does not automatically update the tip's position if it resizes.
+ *
+ * @category Component
+ * @internal
+ */
+export declare const TipContainer: ({ viewer, updateTipPositionRef, }: TipContainerProps) => React.JSX.Element | null;

package/dist/esm/components/TipContainer.js

@@ -0,0 +1,58 @@
+import React, { useLayoutEffect, useRef, useState, } from "react";
+import { usePdfHighlighterContext } from "../contexts/PdfHighlighterContext";
+const clamp = (value, left, right) => Math.min(Math.max(value, left), right);
+const VERTICAL_PADDING = 5;
+/**
+ * A component that manages rendering and placement of a tip around a highlight.
+ * It does not automatically update the tip's position if it resizes.
+ *
+ * @category Component
+ * @internal
+ */
+export const TipContainer = ({ viewer, updateTipPositionRef, }) => {
+    const [height, setHeight] = useState(0);
+    const [width, setWidth] = useState(0);
+    const containerRef = useRef(null);
+    const updatePosition = () => {
+        if (!containerRef.current)
+            return;
+        const { offsetHeight, offsetWidth } = containerRef.current;
+        setHeight(offsetHeight);
+        setWidth(offsetWidth);
+    };
+    updateTipPositionRef.current = updatePosition;
+    // useLayoutEffect ensures state is updated before re-render, preventing flickering
+    useLayoutEffect(() => {
+        updatePosition();
+    }, [updatePosition]);
+    const { getTip } = usePdfHighlighterContext();
+    const currentTip = getTip();
+    if (!currentTip)
+        return null;
+    // Destructuring current tip's position and content
+    const { position, content } = currentTip;
+    const { boundingRect } = position;
+    const pageNumber = boundingRect.pageNumber;
+    const pageNode = viewer.getPageView(pageNumber - 1).div; // Account for 1 indexing of pdf documents
+    const pageBoundingClientRect = pageNode.getBoundingClientRect();
+    const { left: pageLeft, width: pageWidth } = pageBoundingClientRect;
+    // Calculate the position and dimensions of the tip container
+    const scrollTop = viewer.container.scrollTop; // How much the viewer has been scrolled vertically
+    const left = pageNode.offsetLeft + boundingRect.left + boundingRect.width / 2; // center tip over highlight
+    const highlightTop = boundingRect.top + pageNode.offsetTop;
+    const highlightBottom = highlightTop + boundingRect.height;
+    // Determine whether the tip should be moved below the highlight
+    const shouldMove = highlightTop - height - VERTICAL_PADDING < scrollTop; // Would the tip render beyond the top of the visible document?
+    const top = shouldMove
+        ? highlightBottom + VERTICAL_PADDING
+        : highlightTop - height - VERTICAL_PADDING;
+    // Ensure the tip stays within the left edge of the viewer and the right edge of the page
+    const clampedLeft = clamp(left - width / 2, 0, pageLeft + pageWidth - width);
+    return (React.createElement("div", { className: "PdfHighlighter__tip-container", style: {
+            top,
+            left: clampedLeft,
+            height: "max-content",
+            width: "max-content",
+        }, ref: containerRef }, content));
+};
+//# sourceMappingURL=TipContainer.js.map

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

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

package/dist/esm/contexts/HighlightContext.d.ts

@@ -0,0 +1,44 @@
+/// <reference types="react" />
+import { Highlight, HighlightBindings, LTWH, LTWHP, Scaled, ViewportHighlight } from "../types";
+/**
+ * A set of utilities for rendering highlights. Designed to be used within a
+ * highlight container.
+ *
+ * @category Context
+ */
+export type HighlightContainerUtils<T extends Highlight = Highlight> = {
+    /**
+     * The highlight being rendered at this component.
+     */
+    highlight: ViewportHighlight<T>;
+    /**
+     * Convert a Viewport rectangle to a scaled rectangle. Can be used
+     * for storing and updating area selection highlights, for example.
+     *
+     * @returns - Scaled/display agnostic rectangle.
+     */
+    viewportToScaled(rect: LTWHP): Scaled;
+    /**
+     *  Capture a PNG data url of a viewport rectangle.
+     *
+     * @returns - PNG data url. See https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URLs
+     */
+    screenshot(position: LTWH): string;
+    /**
+     * Whether the highlight has been autoscrolled to.
+     */
+    isScrolledTo: boolean;
+    /**
+     * All the DOM refs for the highlights shared on the same page
+     * as `highlight`
+     */
+    highlightBindings: HighlightBindings;
+};
+export declare const HighlightContext: import("react").Context<HighlightContainerUtils<Highlight> | undefined>;
+/**
+ * Custom hook for providing {@link HighlightContainerUtils}. Must be used
+ * within a child of {@link PdfHighlighter}.
+ *
+ * @category Context
+ */
+export declare const useHighlightContainerContext: <T extends Highlight = Highlight>() => HighlightContainerUtils<T>;

package/dist/esm/contexts/HighlightContext.js

@@ -0,0 +1,16 @@
+import { createContext, useContext } from "react";
+export const HighlightContext = createContext(undefined);
+/**
+ * Custom hook for providing {@link HighlightContainerUtils}. Must be used
+ * within a child of {@link PdfHighlighter}.
+ *
+ * @category Context
+ */
+export const useHighlightContainerContext = () => {
+    const highlightContainerUtils = useContext(HighlightContext);
+    if (highlightContainerUtils === undefined) {
+        throw new Error("useHighlightContainerContext must be used within a child of PdfHighlighter!");
+    }
+    return highlightContainerUtils;
+};
+//# sourceMappingURL=HighlightContext.js.map

package/dist/esm/contexts/HighlightContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HighlightContext.js","sourceRoot":"","sources":["../../../src/contexts/HighlightContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAiDlD,MAAM,CAAC,MAAM,gBAAgB,GAAG,aAAa,CAE3C,SAAS,CAAC,CAAC;AAEb;;;;;GAKG;AACH,MAAM,CAAC,MAAM,4BAA4B,GAAG,GAExC,EAAE;IACJ,MAAM,uBAAuB,GAAG,UAAU,CAAC,gBAAgB,CAAC,CAAC;IAE7D,IAAI,uBAAuB,KAAK,SAAS,EAAE,CAAC;QAC1C,MAAM,IAAI,KAAK,CACb,6EAA6E,CAC9E,CAAC;IACJ,CAAC;IAED,OAAO,uBAAqD,CAAC;AAC/D,CAAC,CAAC"}

package/dist/esm/contexts/PdfHighlighterContext.d.ts

@@ -0,0 +1,89 @@
+/// <reference types="react" />
+import { GhostHighlight, Highlight, PdfSelection, Tip } from "../types";
+import { PDFViewer } from "pdfjs-dist/types/web/pdf_viewer";
+/**
+ * A set of utilities for to control the behaviour of {@link PdfHighlighter}.
+ *
+ * @category Context
+ */
+export type PdfHighlighterUtils = {
+    /**
+     * Checks whether a selection is progress, a ghost highlight, or an edit.
+     *
+     * @returns - `true` if editing, ghost highlighting, or selecting.
+     */
+    isEditingOrHighlighting(): boolean;
+    /**
+     * Get currently selected area or text selection.
+     *
+     * @returns - current selection or `null` if no selection is being made.
+     */
+    getCurrentSelection(): PdfSelection | null;
+    /**
+     * Get the currently present ghost highlight.
+     *
+     * @return - currently present ghost highlight or `null` if non-existent.
+     */
+    getGhostHighlight(): GhostHighlight | null;
+    /**
+     * Cancel any ghost highlight.
+     * The selected area will stay selected until the user clicks away.
+     */
+    removeGhostHighlight(): void;
+    /**
+     * If enabled, automatic tips/popups inside of a PdfHighlighter will be disabled.
+     * Additional niceties will also be provided to prevent new highlights being made.
+     */
+    toggleEditInProgress(flag?: boolean): void;
+    /**
+     * Whether an AreaHighlight is being moved/resized, or a manual highlight edit has
+     * been toggled.
+     *
+     * @returns - `true` if AreaHighlight is being edited or edit mode was set.
+     */
+    isEditInProgress(): boolean;
+    /**
+     * Whether a mouse selection or text selection is currently being performed.
+     *
+     * @returns - `true` if mouse selection or text selection is being performed.
+     */
+    isSelectionInProgress(): boolean;
+    /**
+     * Scroll to a highlight in this viewer.
+     *
+     * @param highlight - A highlight provided to the {@link PdfHighlighter} to
+     * scroll to.
+     */
+    scrollToHighlight(highlight: Highlight): void;
+    /**
+     * Get a reference to the currently used instance of a PDF Viewer.
+     *
+     * @returns - The currently active PDF Viewer.
+     */
+    getViewer(): PDFViewer | null;
+    /**
+     * Get the currently active tip, if any.
+     *
+     * @returns - the currently active tip or `null` if inactive.
+     */
+    getTip(): Tip | null;
+    /**
+     * Set a tip to be displayed in the current PDF Viewer.
+     *
+     * @param tip - tip to be displayed, or `null` to hide any tip.
+     */
+    setTip(tip: Tip | null): void;
+    /**
+     * Callback to update any currently active tip's position. This will make sure
+     * the tip is visible above/below its highlight.
+     */
+    updateTipPosition(): void;
+};
+export declare const PdfHighlighterContext: import("react").Context<PdfHighlighterUtils | undefined>;
+/**
+ * Custom hook for providing {@link PdfHighlighterUtils}. Must be used
+ * within a child of {@link PdfHighlighter}.
+ *
+ * @category Context
+ */
+export declare const usePdfHighlighterContext: () => PdfHighlighterUtils;

package/dist/esm/contexts/PdfHighlighterContext.js

@@ -0,0 +1,16 @@
+import { createContext, useContext } from "react";
+export const PdfHighlighterContext = createContext(undefined);
+/**
+ * Custom hook for providing {@link PdfHighlighterUtils}. Must be used
+ * within a child of {@link PdfHighlighter}.
+ *
+ * @category Context
+ */
+export const usePdfHighlighterContext = () => {
+    const pdfHighlighterUtils = useContext(PdfHighlighterContext);
+    if (pdfHighlighterUtils === undefined) {
+        throw new Error("usePdfHighlighterContext must be used within PdfHighlighter!");
+    }
+    return pdfHighlighterUtils;
+};
+//# sourceMappingURL=PdfHighlighterContext.js.map

package/dist/esm/contexts/PdfHighlighterContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PdfHighlighterContext.js","sourceRoot":"","sources":["../../../src/contexts/PdfHighlighterContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AA6FlD,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAEhD,SAAS,CAAC,CAAC;AAEb;;;;;GAKG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,GAAG,EAAE;IAC3C,MAAM,mBAAmB,GAAG,UAAU,CAAC,qBAAqB,CAAC,CAAC;IAE9D,IAAI,mBAAmB,KAAK,SAAS,EAAE,CAAC;QACtC,MAAM,IAAI,KAAK,CACb,8DAA8D,CAC/D,CAAC;IACJ,CAAC;IAED,OAAO,mBAAmB,CAAC;AAC7B,CAAC,CAAC"}