react-pdf-highlighter-plus 1.0.0

package/dist/esm/index.d.ts

@@ -0,0 +1,19 @@
+import { PdfHighlighter, PdfHighlighterProps } from "./components/PdfHighlighter";
+import { TextHighlight, TextHighlightProps, TextHighlightStyle } from "./components/TextHighlight";
+import { MonitoredHighlightContainer, MonitoredHighlightContainerProps } from "./components/MonitoredHighlightContainer";
+import { AreaHighlight, AreaHighlightProps, AreaHighlightStyle } from "./components/AreaHighlight";
+import { FreetextHighlight, FreetextHighlightProps, FreetextStyle } from "./components/FreetextHighlight";
+import { ImageHighlight, ImageHighlightProps } from "./components/ImageHighlight";
+import { SignaturePad, SignaturePadProps } from "./components/SignaturePad";
+import { DrawingCanvas, DrawingCanvasProps } from "./components/DrawingCanvas";
+import { DrawingHighlight, DrawingHighlightProps } from "./components/DrawingHighlight";
+import { ShapeCanvas, ShapeCanvasProps } from "./components/ShapeCanvas";
+import { ShapeHighlight, ShapeHighlightProps, ShapeStyle } from "./components/ShapeHighlight";
+import { PdfLoader, PdfLoaderProps } from "./components/PdfLoader";
+import { HighlightContainerUtils, useHighlightContainerContext } from "./contexts/HighlightContext";
+import { viewportPositionToScaled, scaledPositionToViewport } from "./lib/coordinates";
+import { exportPdf, ExportPdfOptions, ExportableHighlight } from "./lib/export-pdf";
+import { PdfHighlighterUtils, usePdfHighlighterContext } from "./contexts/PdfHighlighterContext";
+export { PdfHighlighter, PdfLoader, TextHighlight, MonitoredHighlightContainer, AreaHighlight, FreetextHighlight, ImageHighlight, SignaturePad, DrawingCanvas, DrawingHighlight, ShapeCanvas, ShapeHighlight, useHighlightContainerContext, viewportPositionToScaled, scaledPositionToViewport, usePdfHighlighterContext, exportPdf, };
+export type { HighlightContainerUtils, PdfHighlighterUtils, PdfHighlighterProps, TextHighlightProps, TextHighlightStyle, MonitoredHighlightContainerProps, AreaHighlightProps, AreaHighlightStyle, FreetextHighlightProps, FreetextStyle, ImageHighlightProps, SignaturePadProps, DrawingCanvasProps, DrawingHighlightProps, ShapeCanvasProps, ShapeHighlightProps, ShapeStyle, PdfLoaderProps, ExportPdfOptions, ExportableHighlight, };
+export * from "./types";

package/dist/esm/index.js

@@ -0,0 +1,19 @@
+import { PdfHighlighter, } from "./components/PdfHighlighter";
+import { TextHighlight, } from "./components/TextHighlight";
+import { MonitoredHighlightContainer, } from "./components/MonitoredHighlightContainer";
+import { AreaHighlight, } from "./components/AreaHighlight";
+import { FreetextHighlight, } from "./components/FreetextHighlight";
+import { ImageHighlight, } from "./components/ImageHighlight";
+import { SignaturePad, } from "./components/SignaturePad";
+import { DrawingCanvas, } from "./components/DrawingCanvas";
+import { DrawingHighlight, } from "./components/DrawingHighlight";
+import { ShapeCanvas, } from "./components/ShapeCanvas";
+import { ShapeHighlight, } from "./components/ShapeHighlight";
+import { PdfLoader } from "./components/PdfLoader";
+import { useHighlightContainerContext, } from "./contexts/HighlightContext";
+import { viewportPositionToScaled, scaledPositionToViewport, } from "./lib/coordinates";
+import { exportPdf, } from "./lib/export-pdf";
+import { usePdfHighlighterContext, } from "./contexts/PdfHighlighterContext";
+export { PdfHighlighter, PdfLoader, TextHighlight, MonitoredHighlightContainer, AreaHighlight, FreetextHighlight, ImageHighlight, SignaturePad, DrawingCanvas, DrawingHighlight, ShapeCanvas, ShapeHighlight, useHighlightContainerContext, viewportPositionToScaled, scaledPositionToViewport, usePdfHighlighterContext, exportPdf, };
+export * from "./types";
+//# sourceMappingURL=index.js.map

package/dist/esm/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,cAAc,GAEf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,aAAa,GAGd,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,2BAA2B,GAE5B,MAAM,0CAA0C,CAAC;AAClD,OAAO,EACL,aAAa,GAGd,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,iBAAiB,GAGlB,MAAM,gCAAgC,CAAC;AACxC,OAAO,EACL,cAAc,GAEf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,YAAY,GAEb,MAAM,2BAA2B,CAAC;AACnC,OAAO,EACL,aAAa,GAEd,MAAM,4BAA4B,CAAC;AACpC,OAAO,EACL,gBAAgB,GAEjB,MAAM,+BAA+B,CAAC;AACvC,OAAO,EACL,WAAW,GAEZ,MAAM,0BAA0B,CAAC;AAClC,OAAO,EACL,cAAc,GAGf,MAAM,6BAA6B,CAAC;AACrC,OAAO,EAAE,SAAS,EAAkB,MAAM,wBAAwB,CAAC;AACnE,OAAO,EAEL,4BAA4B,GAC7B,MAAM,6BAA6B,CAAC;AACrC,OAAO,EACL,wBAAwB,EACxB,wBAAwB,GACzB,MAAM,mBAAmB,CAAC;AAC3B,OAAO,EACL,SAAS,GAGV,MAAM,kBAAkB,CAAC;AAE1B,OAAO,EAEL,wBAAwB,GACzB,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EACL,cAAc,EACd,SAAS,EACT,aAAa,EACb,2BAA2B,EAC3B,aAAa,EACb,iBAAiB,EACjB,cAAc,EACd,YAAY,EACZ,aAAa,EACb,gBAAgB,EAChB,WAAW,EACX,cAAc,EACd,4BAA4B,EAC5B,wBAAwB,EACxB,wBAAwB,EACxB,wBAAwB,EACxB,SAAS,GACV,CAAC;AAwBF,cAAc,SAAS,CAAC"}

package/dist/esm/lib/coordinates.d.ts

@@ -0,0 +1,16 @@
+import { PDFViewer } from "pdfjs-dist/types/web/pdf_viewer";
+import type { LTWHP, ViewportPosition, Scaled, ScaledPosition } from "../types";
+import { PageViewport } from "pdfjs-dist";
+interface WIDTH_HEIGHT {
+    width: number;
+    height: number;
+}
+/** @category Utilities */
+export declare const viewportToScaled: (rect: LTWHP, { width, height }: WIDTH_HEIGHT) => Scaled;
+/** @category Utilities */
+export declare const viewportPositionToScaled: ({ boundingRect, rects }: ViewportPosition, viewer: PDFViewer) => ScaledPosition;
+/** @category Utilities */
+export declare const scaledToViewport: (scaled: Scaled, viewport: PageViewport, usePdfCoordinates?: boolean) => LTWHP;
+/** @category Utilities */
+export declare const scaledPositionToViewport: ({ boundingRect, rects, usePdfCoordinates }: ScaledPosition, viewer: PDFViewer) => ViewportPosition;
+export {};

package/dist/esm/lib/coordinates.js

@@ -0,0 +1,69 @@
+/** @category Utilities */
+export const viewportToScaled = (rect, { width, height }) => {
+    return {
+        x1: rect.left,
+        y1: rect.top,
+        x2: rect.left + rect.width,
+        y2: rect.top + rect.height,
+        width,
+        height,
+        pageNumber: rect.pageNumber,
+    };
+};
+/** @category Utilities */
+export const viewportPositionToScaled = ({ boundingRect, rects }, viewer) => {
+    const pageNumber = boundingRect.pageNumber;
+    const viewport = viewer.getPageView(pageNumber - 1).viewport; // Account for 1 indexing of PDF documents
+    const scale = (obj) => viewportToScaled(obj, viewport);
+    return {
+        boundingRect: scale(boundingRect),
+        rects: (rects || []).map(scale),
+    };
+};
+const pdfToViewport = (pdf, viewport) => {
+    const [x1, y1, x2, y2] = viewport.convertToViewportRectangle([
+        pdf.x1,
+        pdf.y1,
+        pdf.x2,
+        pdf.y2,
+    ]);
+    return {
+        left: Math.min(x1, x2),
+        top: Math.min(y1, y2),
+        width: Math.abs(x2 - x1),
+        height: Math.abs(y1 - y2),
+        pageNumber: pdf.pageNumber,
+    };
+};
+/** @category Utilities */
+export const scaledToViewport = (scaled, viewport, usePdfCoordinates = false) => {
+    const { width, height } = viewport;
+    if (usePdfCoordinates) {
+        return pdfToViewport(scaled, viewport);
+    }
+    if (scaled.x1 === undefined) {
+        throw new Error("You are using old position format, please update");
+    }
+    const x1 = (width * scaled.x1) / scaled.width;
+    const y1 = (height * scaled.y1) / scaled.height;
+    const x2 = (width * scaled.x2) / scaled.width;
+    const y2 = (height * scaled.y2) / scaled.height;
+    return {
+        left: x1,
+        top: y1,
+        width: x2 - x1,
+        height: y2 - y1,
+        pageNumber: scaled.pageNumber,
+    };
+};
+/** @category Utilities */
+export const scaledPositionToViewport = ({ boundingRect, rects, usePdfCoordinates }, viewer) => {
+    const pageNumber = boundingRect.pageNumber;
+    const viewport = viewer.getPageView(pageNumber - 1).viewport; // Account for 1 indexing of PDF documents
+    const scale = (obj) => scaledToViewport(obj, viewport, usePdfCoordinates);
+    return {
+        boundingRect: scale(boundingRect),
+        rects: (rects || []).map(scale),
+    };
+};
+//# sourceMappingURL=coordinates.js.map

package/dist/esm/lib/coordinates.js.map

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

package/dist/esm/lib/export-pdf.d.ts

@@ -0,0 +1,81 @@
+import type { ScaledPosition, ShapeData } from "../types";
+/**
+ * Options for the PDF export function.
+ *
+ * @category Type
+ */
+export interface ExportPdfOptions {
+    /** Default color for text highlights. Default: "rgba(255, 226, 143, 0.5)" */
+    textHighlightColor?: string;
+    /** Default color for area highlights. Default: "rgba(255, 226, 143, 0.5)" */
+    areaHighlightColor?: string;
+    /** Default text color for freetext. Default: "#333333" */
+    defaultFreetextColor?: string;
+    /** Default background for freetext. Default: "#ffffc8" */
+    defaultFreetextBgColor?: string;
+    /** Default font size for freetext. Default: 14 */
+    defaultFreetextFontSize?: number;
+    /** Progress callback for large PDFs */
+    onProgress?: (current: number, total: number) => void;
+}
+/**
+ * A highlight that can be exported to PDF.
+ *
+ * @category Type
+ */
+export interface ExportableHighlight {
+    id: string;
+    type?: "text" | "area" | "freetext" | "image" | "drawing" | "shape";
+    content?: {
+        text?: string;
+        image?: string;
+        shape?: ShapeData;
+    };
+    position: ScaledPosition;
+    /** Per-highlight color override (for text/area highlights) */
+    highlightColor?: string;
+    /** Style mode for text highlights: "highlight" (default), "underline", or "strikethrough" */
+    highlightStyle?: "highlight" | "underline" | "strikethrough";
+    /** Text color for freetext highlights */
+    color?: string;
+    /** Background color for freetext highlights */
+    backgroundColor?: string;
+    /** Font size for freetext highlights */
+    fontSize?: string;
+    /** Font family for freetext highlights (not used in export, Helvetica is always used) */
+    fontFamily?: string;
+    /** Shape type for shape highlights */
+    shapeType?: "rectangle" | "circle" | "arrow";
+    /** Stroke color for shape highlights */
+    strokeColor?: string;
+    /** Stroke width for shape highlights */
+    strokeWidth?: number;
+}
+/**
+ * Export a PDF with annotations embedded.
+ *
+ * @param pdfSource - The source PDF as a URL string, Uint8Array, or ArrayBuffer
+ * @param highlights - Array of highlights to embed in the PDF
+ * @param options - Export options for customizing colors and behavior
+ * @returns Promise<Uint8Array> - The modified PDF as bytes
+ *
+ * @example
+ * ```typescript
+ * const pdfBytes = await exportPdf(pdfUrl, highlights, {
+ *   textHighlightColor: "rgba(255, 255, 0, 0.4)",
+ *   onProgress: (current, total) => console.log(`${current}/${total} pages`)
+ * });
+ *
+ * // Download the file
+ * const blob = new Blob([pdfBytes], { type: "application/pdf" });
+ * const url = URL.createObjectURL(blob);
+ * const a = document.createElement("a");
+ * a.href = url;
+ * a.download = "annotated.pdf";
+ * a.click();
+ * URL.revokeObjectURL(url);
+ * ```
+ *
+ * @category Function
+ */
+export declare function exportPdf(pdfSource: string | Uint8Array | ArrayBuffer, highlights: ExportableHighlight[], options?: ExportPdfOptions): Promise<Uint8Array>;