pdf-tsx 0.16.4 → 0.17.1

package/dist/es/components/PDFViewer.js

@@ -3,384 +3,388 @@ import { useScrollTracking as t } from "../hooks/useScrollTracking.js";
 import { useKeyboardShortcuts as n } from "../hooks/useKeyboardShortcuts.js";
 import { useTextLayer as r } from "../hooks/useTextLayer.js";
 import { isSafeUrl as i } from "../utils/url.js";
-import { useAnnotationLayer as ee } from "../hooks/useAnnotationLayer.js";
-import { usePDFLoader as te } from "../hooks/usePDFLoader.js";
-import { usePDFRenderer as ne } from "../hooks/usePDFRenderer.js";
-import { useOverlayRects as re } from "../hooks/useOverlayRects.js";
-import { computeFit as a } from "../utils/pdfFit.js";
+import { useAnnotationLayer as a } from "../hooks/useAnnotationLayer.js";
+import { usePDFLoader as ee } from "../hooks/usePDFLoader.js";
+import { usePDFRenderer as te } from "../hooks/usePDFRenderer.js";
+import { useOverlayRects as ne } from "../hooks/useOverlayRects.js";
+import { usePinchZoom as re } from "../hooks/usePinchZoom.js";
+import { computeFit as o } from "../utils/pdfFit.js";
 import { ThemeProvider as ie } from "../context/ThemeContext.js";
 import { LabelsProvider as ae } from "../context/LabelsContext.js";
-import { useLabels as o } from "../hooks/useLabels.js";
-import s from "./PDFViewer.module.js";
-import { useCallback as c, useEffect as l, useMemo as u, useRef as d, useState as f } from "react";
+import { useLabels as s } from "../hooks/useLabels.js";
+import c from "./PDFViewer.module.js";
+import { useCallback as l, useEffect as u, useMemo as d, useRef as f, useState as p } from "react";
 import * as oe from "pdfjs-dist";
-import { Fragment as se, jsx as p, jsxs as m } from "react/jsx-runtime";
+import { Fragment as se, jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region src/components/PDFViewer.tsx
-var h = 2;
+var g = 2;
 function ce({ hasRead: e }) {
-	let t = o();
-	return /* @__PURE__ */ m("div", {
-		className: `${s.requireReadBanner} ${e ? s.requireReadDone : ""}`,
-		children: [e ? /* @__PURE__ */ p("svg", {
+	let t = s();
+	return /* @__PURE__ */ h("div", {
+		className: `${c.requireReadBanner} ${e ? c.requireReadDone : ""}`,
+		children: [e ? /* @__PURE__ */ m("svg", {
 			width: "16",
 			height: "16",
 			viewBox: "0 0 16 16",
 			fill: "none",
 			"aria-hidden": "true",
-			children: /* @__PURE__ */ p("path", {
+			children: /* @__PURE__ */ m("path", {
 				d: "M3 8l3.5 3.5L13 4.5",
 				stroke: "currentColor",
 				strokeWidth: "2",
 				strokeLinecap: "round",
 				strokeLinejoin: "round"
 			})
-		}) : /* @__PURE__ */ p("svg", {
+		}) : /* @__PURE__ */ m("svg", {
 			width: "16",
 			height: "16",
 			viewBox: "0 0 16 16",
 			fill: "none",
 			"aria-hidden": "true",
-			children: /* @__PURE__ */ p("path", {
+			children: /* @__PURE__ */ m("path", {
 				d: "M8 3v10M4 9l4 4 4-4",
 				stroke: "currentColor",
 				strokeWidth: "2",
 				strokeLinecap: "round",
 				strokeLinejoin: "round"
 			})
-		}), /* @__PURE__ */ p("span", { children: e ? t.requireReadDone : t.requireReadPending })]
+		}), /* @__PURE__ */ m("span", { children: e ? t.requireReadDone : t.requireReadPending })]
 	});
 }
-var g = ({ file: o, workerSrc: g, sidebar: le, toolbar: _, onChangeFile: v, themeOverrides: ue, defaultTheme: de, defaultFit: y, language: fe, className: b, style: pe, requireRead: x, onDocumentRead: S }) => {
-	l(() => {
-		oe.GlobalWorkerOptions.workerSrc = g;
-	}, [g]);
-	let [C, w] = f(1), [T, E] = f(0), [D, O] = f(null), [k, me] = f([]), [A, he] = f(!1), [j, ge] = f(y ?? null), [M, N] = f(null), [P, F] = f(!1), I = d(!1), L = d(null), R = d([]), z = d([]), B = d(T);
-	l(() => {
-		B.current = T;
-	}, [T]);
-	let [_e, ve] = f(null);
-	_e !== o && (ve(o), O(null), F(!1)), l(() => {
-		I.current = !1;
-	}, [o]);
-	let { pdf: V, numPages: H, loading: ye } = te(o);
-	l(() => {
-		V && (R.current = Array(V.numPages).fill(null), z.current = Array(V.numPages).fill(null));
-	}, [V]), l(() => {
-		!V || !y || !L.current || a(y, V, L.current, B.current).then(w);
-	}, [V, y]);
-	let U = d(j);
-	l(() => {
-		U.current = j;
-	}, [j]), l(() => {
-		if (!V || !L.current) return;
-		let e = L.current, t = new ResizeObserver(() => {
-			U.current && a(U.current, V, e, B.current).then(w);
+var _ = ({ file: s, workerSrc: _, sidebar: le, toolbar: v, onChangeFile: y, themeOverrides: ue, defaultTheme: de, defaultFit: b, language: fe, className: x, style: pe, requireRead: S, onDocumentRead: C }) => {
+	u(() => {
+		oe.GlobalWorkerOptions.workerSrc = _;
+	}, [_]);
+	let [w, T] = p(1), [E, D] = p(0), [O, k] = p(null), [A, me] = p([]), [j, he] = p(!1), [M, N] = p(b ?? null), [P, F] = p(null), [I, L] = p(!1), R = f(!1), z = f(null), B = f([]), V = f([]), H = f(E);
+	u(() => {
+		H.current = E;
+	}, [E]);
+	let [ge, _e] = p(null);
+	ge !== s && (_e(s), k(null), L(!1)), u(() => {
+		R.current = !1;
+	}, [s]);
+	let { pdf: U, numPages: W, loading: ve } = ee(s);
+	u(() => {
+		U && (B.current = Array(U.numPages).fill(null), V.current = Array(U.numPages).fill(null));
+	}, [U]), u(() => {
+		!U || !b || !z.current || o(b, U, z.current, H.current).then(T);
+	}, [U, b]);
+	let G = f(M);
+	u(() => {
+		G.current = M;
+	}, [M]), u(() => {
+		if (!U || !z.current) return;
+		let e = z.current, t = new ResizeObserver(() => {
+			G.current && o(G.current, U, e, H.current).then(T);
 		});
 		return t.observe(e), () => t.disconnect();
-	}, [V]);
-	let { currentPage: W, goToPage: G } = t({
-		numPages: H,
-		containerRef: L,
-		pageRefs: R
+	}, [U]);
+	let { currentPage: K, goToPage: q } = t({
+		numPages: W,
+		containerRef: z,
+		pageRefs: B
 	});
-	l(() => {
-		H === 0 || W < H || (x && !P && F(!0), I.current || (I.current = !0, S?.()));
+	u(() => {
+		W === 0 || K < W || (S && !I && L(!0), R.current || (R.current = !0, C?.()));
 	}, [
+		K,
 		W,
-		H,
-		x,
-		P,
-		S
+		S,
+		I,
+		C
 	]);
-	let K = u(() => {
-		if (H === 0) return [];
-		let e = /* @__PURE__ */ new Set(), t = Math.max(W - h, 1), n = Math.min(W + h, H);
+	let J = d(() => {
+		if (W === 0) return [];
+		let e = /* @__PURE__ */ new Set(), t = Math.max(K - g, 1), n = Math.min(K + g, W);
 		for (let r = t; r <= n; r++) e.add(r);
-		D && e.add(D.page);
-		for (let t of k) e.add(t.page);
+		O && e.add(O.page);
+		for (let t of A) e.add(t.page);
 		return Array.from(e).sort((e, t) => e - t);
 	}, [
+		K,
 		W,
-		H,
-		D,
-		k
-	]), { pageSizes: be, renderedPages: q } = ne({
-		pdf: V,
-		zoom: C,
-		rotation: T,
-		visiblePages: K,
-		canvasRefs: z
-	}), J = u(() => {
-		let e = new Set(K);
-		for (let t of q) e.add(t);
+		O,
+		A
+	]), { pageSizes: ye, renderedPages: Y } = te({
+		pdf: U,
+		zoom: w,
+		rotation: E,
+		visiblePages: J,
+		canvasRefs: V
+	}), X = d(() => {
+		let e = new Set(J);
+		for (let t of Y) e.add(t);
 		return Array.from(e).sort((e, t) => e - t);
-	}, [K, q]);
+	}, [J, Y]);
 	n({
-		pdf: V,
-		currentPage: W,
-		goToPage: G,
-		setRotation: E
+		pdf: U,
+		currentPage: K,
+		goToPage: q,
+		setRotation: D
+	}), re(z, w, T, N);
+	let be = r({
+		pdf: U,
+		zoom: w,
+		rotation: E,
+		mountedPages: X,
+		canvasRefs: V
+	}), { linkOverlays: xe, noteOverlays: Se } = a({
+		pdf: U,
+		zoom: w,
+		rotation: E,
+		mountedPages: X,
+		goToPage: q
 	});
-	let xe = r({
-		pdf: V,
-		zoom: C,
-		rotation: T,
-		mountedPages: J,
-		canvasRefs: z
-	}), { linkOverlays: Se, noteOverlays: Ce } = ee({
-		pdf: V,
-		zoom: C,
-		rotation: T,
-		mountedPages: J,
-		goToPage: G
-	});
-	l(() => {
-		if (!M) return;
-		let e = () => N(null), t = (e) => {
-			e.key === "Escape" && N(null);
+	u(() => {
+		if (!P) return;
+		let e = () => F(null), t = (e) => {
+			e.key === "Escape" && F(null);
 		};
 		return document.addEventListener("click", e), document.addEventListener("keydown", t), () => {
 			document.removeEventListener("click", e), document.removeEventListener("keydown", t);
 		};
-	}, [M]);
-	let { overlayRect: Y, searchOverlays: we } = re({
-		pdf: V,
-		highlight: D,
-		searchMatches: k,
-		zoom: C,
-		rotation: T
-	}), Te = c((e, t) => {
+	}, [P]);
+	let { overlayRect: Z, searchOverlays: Ce } = ne({
+		pdf: U,
+		highlight: O,
+		searchMatches: A,
+		zoom: w,
+		rotation: E
+	}), we = l((e, t) => {
 		(!e.url || !i(e.url)) && (t.preventDefault(), e.url || e._handleClick());
-	}, []), X = d(null), Z = c((e, t) => {
-		X.current && clearTimeout(X.current);
+	}, []), Q = f(null), Te = l((e, t) => {
+		Q.current && clearTimeout(Q.current);
 		let n = t.clientY > window.innerHeight * .6;
-		N({
+		F({
 			x: Math.min(t.clientX, window.innerWidth - 304),
 			y: n ? window.innerHeight - t.clientY + 8 : t.clientY + 12,
 			above: n,
 			contents: e.contents,
 			title: e.title
 		});
-	}, []), Q = c(() => {
-		X.current = setTimeout(() => N(null), 200);
-	}, []), $ = c((e) => {
-		O({
+	}, []), $ = l(() => {
+		Q.current = setTimeout(() => F(null), 200);
+	}, []), Ee = l((e) => {
+		k({
 			page: e.page,
 			pdfRect: e.pdfRect
-		}), G(e.page);
-	}, [O, G]), Ee = u(() => ({
-		pdf: V,
-		numPages: H,
-		zoom: C,
-		setZoom: w,
-		rotation: T,
-		setRotation: E,
-		currentPage: W,
-		goToPage: G,
-		containerRef: L,
-		canvasRefs: z,
-		file: o,
-		highlight: D,
-		setHighlight: O,
-		searchMatches: k,
+		}), q(e.page);
+	}, [k, q]), De = d(() => ({
+		pdf: U,
+		numPages: W,
+		zoom: w,
+		setZoom: T,
+		rotation: E,
+		setRotation: D,
+		currentPage: K,
+		goToPage: q,
+		containerRef: z,
+		canvasRefs: V,
+		file: s,
+		highlight: O,
+		setHighlight: k,
+		searchMatches: A,
 		setSearchMatches: me,
-		onChangeFile: v,
-		sidebarCollapsed: A,
+		onChangeFile: y,
+		sidebarCollapsed: j,
 		setSidebarCollapsed: he,
-		fitMode: j,
-		setFitMode: ge,
-		navigationLocked: !!x && !P
+		fitMode: M,
+		setFitMode: N,
+		navigationLocked: !!S && !I
 	}), [
-		V,
-		H,
-		C,
-		T,
+		U,
 		W,
-		G,
-		o,
-		D,
-		k,
-		v,
+		w,
+		E,
+		K,
+		q,
+		s,
+		O,
 		A,
+		y,
 		j,
-		x,
-		P
+		M,
+		S,
+		I
 	]);
-	return /* @__PURE__ */ p(ie, {
+	return /* @__PURE__ */ m(ie, {
 		themeOverrides: ue,
 		defaultTheme: de,
-		children: /* @__PURE__ */ p(ae, {
+		children: /* @__PURE__ */ m(ae, {
 			language: fe,
-			children: /* @__PURE__ */ m(e.Provider, {
-				value: Ee,
-				children: [/* @__PURE__ */ m("div", {
-					className: `${s.appLayout}${b ? ` ${b}` : ""}`,
+			children: /* @__PURE__ */ h(e.Provider, {
+				value: De,
+				children: [/* @__PURE__ */ h("div", {
+					className: `${c.appLayout}${x ? ` ${x}` : ""}`,
 					style: pe,
-					children: [_ && /* @__PURE__ */ p("div", {
-						className: s.toolbar,
-						children: _
-					}), /* @__PURE__ */ m("div", {
-						className: s.body,
+					children: [v && /* @__PURE__ */ m("div", {
+						className: c.toolbar,
+						children: v
+					}), /* @__PURE__ */ h("div", {
+						className: c.body,
 						children: [le, /* @__PURE__ */ m("div", {
-							className: s.scrollContainer,
-							ref: L,
-							children: [
-								ye && /* @__PURE__ */ p("div", { className: s.documentLoading }),
-								Array.from({ length: H }, (e, t) => {
-									let n = q.has(t + 1), r = be[t], ee = J.includes(t + 1);
-									return /* @__PURE__ */ m("div", {
-										className: s.pageWrapper,
-										ref: (e) => {
-											R.current[t] = e;
-										},
-										style: r ? {
-											width: r.width,
-											height: r.height
-										} : void 0,
-										children: [
-											r && !n && /* @__PURE__ */ p("div", {
-												className: s.pageSkeleton,
-												style: {
-													width: r.width,
-													height: r.height
-												}
-											}),
-											ee && /* @__PURE__ */ m(se, { children: [/* @__PURE__ */ p("canvas", {
-												className: s.pageCanvas,
-												ref: (e) => {
-													z.current[t] = e;
-												},
-												style: { display: n ? "block" : "none" }
-											}), /* @__PURE__ */ p("div", {
-												className: `textLayer ${s.textLayer}`,
-												ref: (e) => {
-													xe.current[t] = e;
-												}
-											})] }),
-											Se.filter((e) => e.page === t + 1).map((e, t) => /* @__PURE__ */ p("a", {
-												className: s.linkOverlay,
-												href: e.url && i(e.url) ? e.url : "#",
-												target: "_blank",
-												rel: "noopener noreferrer",
-												style: {
-													left: e.x,
-													top: e.y,
-													width: e.width,
-													height: e.height
-												},
-												onClick: (t) => Te(e, t)
-											}, t)),
-											Ce.filter((e) => e.page === t + 1).map((e, t) => e.subtype === "Text" ? /* @__PURE__ */ p("div", {
-												className: s.noteIconOverlay,
-												style: {
-													left: e.x,
-													top: e.y,
-													width: Math.max(e.width, 26),
-													height: Math.max(e.height, 26)
-												},
-												onMouseEnter: (t) => Z(e, t),
-												onMouseLeave: Q,
-												onClick: () => $(e),
-												children: /* @__PURE__ */ m("svg", {
-													width: "22",
-													height: "22",
-													viewBox: "0 0 12 12",
-													fill: "none",
-													"aria-hidden": "true",
-													children: [
-														/* @__PURE__ */ p("rect", {
-															x: "0.5",
-															y: "0.5",
-															width: "9",
-															height: "8",
-															rx: "1",
-															fill: "rgba(255,210,0,0.9)",
-															stroke: "rgba(160,120,0,0.7)",
-															strokeWidth: "1"
-														}),
-														/* @__PURE__ */ p("path", {
-															d: "M9.5 5.5v3l2.5-3z",
-															fill: "rgba(255,210,0,0.9)",
-															stroke: "rgba(160,120,0,0.7)",
-															strokeWidth: "1"
-														}),
-														/* @__PURE__ */ p("line", {
-															x1: "2",
-															y1: "3",
-															x2: "8",
-															y2: "3",
-															stroke: "rgba(90,60,0,0.8)",
-															strokeWidth: "1",
-															strokeLinecap: "round"
-														}),
-														/* @__PURE__ */ p("line", {
-															x1: "2",
-															y1: "5.5",
-															x2: "7",
-															y2: "5.5",
-															stroke: "rgba(90,60,0,0.8)",
-															strokeWidth: "1",
-															strokeLinecap: "round"
-														})
-													]
+							className: c.scrollContainer,
+							ref: z,
+							children: /* @__PURE__ */ h("div", {
+								className: c.scrollInner,
+								children: [
+									ve && /* @__PURE__ */ m("div", { className: c.documentLoading }),
+									Array.from({ length: W }, (e, t) => {
+										let n = Y.has(t + 1), r = ye[t], a = X.includes(t + 1);
+										return /* @__PURE__ */ h("div", {
+											className: c.pageWrapper,
+											ref: (e) => {
+												B.current[t] = e;
+											},
+											style: r ? {
+												width: r.width,
+												height: r.height
+											} : void 0,
+											children: [
+												r && !n && /* @__PURE__ */ m("div", {
+													className: c.pageSkeleton,
+													style: {
+														width: r.width,
+														height: r.height
+													}
+												}),
+												a && /* @__PURE__ */ h(se, { children: [/* @__PURE__ */ m("canvas", {
+													className: c.pageCanvas,
+													ref: (e) => {
+														V.current[t] = e;
+													},
+													style: { display: n ? "block" : "none" }
+												}), /* @__PURE__ */ m("div", {
+													className: `textLayer ${c.textLayer}`,
+													ref: (e) => {
+														be.current[t] = e;
+													}
+												})] }),
+												xe.filter((e) => e.page === t + 1).map((e, t) => /* @__PURE__ */ m("a", {
+													className: c.linkOverlay,
+													href: e.url && i(e.url) ? e.url : "#",
+													target: "_blank",
+													rel: "noopener noreferrer",
+													style: {
+														left: e.x,
+														top: e.y,
+														width: e.width,
+														height: e.height
+													},
+													onClick: (t) => we(e, t)
+												}, t)),
+												Se.filter((e) => e.page === t + 1).map((e, t) => e.subtype === "Text" ? /* @__PURE__ */ m("div", {
+													className: c.noteIconOverlay,
+													style: {
+														left: e.x,
+														top: e.y,
+														width: Math.max(e.width, 26),
+														height: Math.max(e.height, 26)
+													},
+													onMouseEnter: (t) => Te(e, t),
+													onMouseLeave: $,
+													onClick: () => Ee(e),
+													children: /* @__PURE__ */ h("svg", {
+														width: "22",
+														height: "22",
+														viewBox: "0 0 12 12",
+														fill: "none",
+														"aria-hidden": "true",
+														children: [
+															/* @__PURE__ */ m("rect", {
+																x: "0.5",
+																y: "0.5",
+																width: "9",
+																height: "8",
+																rx: "1",
+																fill: "rgba(255,210,0,0.9)",
+																stroke: "rgba(160,120,0,0.7)",
+																strokeWidth: "1"
+															}),
+															/* @__PURE__ */ m("path", {
+																d: "M9.5 5.5v3l2.5-3z",
+																fill: "rgba(255,210,0,0.9)",
+																stroke: "rgba(160,120,0,0.7)",
+																strokeWidth: "1"
+															}),
+															/* @__PURE__ */ m("line", {
+																x1: "2",
+																y1: "3",
+																x2: "8",
+																y2: "3",
+																stroke: "rgba(90,60,0,0.8)",
+																strokeWidth: "1",
+																strokeLinecap: "round"
+															}),
+															/* @__PURE__ */ m("line", {
+																x1: "2",
+																y1: "5.5",
+																x2: "7",
+																y2: "5.5",
+																stroke: "rgba(90,60,0,0.8)",
+																strokeWidth: "1",
+																strokeLinecap: "round"
+															})
+														]
+													})
+												}, t) : /* @__PURE__ */ m("div", {
+													className: c.noteOverlay,
+													style: {
+														left: e.x,
+														top: e.y,
+														width: e.width,
+														height: e.height
+													},
+													onMouseEnter: (t) => Te(e, t),
+													onMouseLeave: $,
+													onClick: () => Ee(e)
+												}, t)),
+												Ce.filter((e) => e.page === t + 1).map((e, t) => /* @__PURE__ */ m("div", {
+													className: c.searchMatchOverlay,
+													style: {
+														left: e.x,
+														top: e.y,
+														width: e.width,
+														height: e.height
+													}
+												}, t)),
+												O && Z?.page === t + 1 && /* @__PURE__ */ m("div", {
+													className: c.highlightOverlay,
+													style: {
+														left: Z.x,
+														top: Z.y,
+														width: Z.width,
+														height: Z.height
+													}
 												})
-											}, t) : /* @__PURE__ */ p("div", {
-												className: s.noteOverlay,
-												style: {
-													left: e.x,
-													top: e.y,
-													width: e.width,
-													height: e.height
-												},
-												onMouseEnter: (t) => Z(e, t),
-												onMouseLeave: Q,
-												onClick: () => $(e)
-											}, t)),
-											we.filter((e) => e.page === t + 1).map((e, t) => /* @__PURE__ */ p("div", {
-												className: s.searchMatchOverlay,
-												style: {
-													left: e.x,
-													top: e.y,
-													width: e.width,
-													height: e.height
-												}
-											}, t)),
-											D && Y?.page === t + 1 && /* @__PURE__ */ p("div", {
-												className: s.highlightOverlay,
-												style: {
-													left: Y.x,
-													top: Y.y,
-													width: Y.width,
-													height: Y.height
-												}
-											})
-										]
-									}, `${t}-${T}`);
-								}),
-								x && /* @__PURE__ */ p(ce, { hasRead: P })
-							]
+											]
+										}, `${t}-${E}`);
+									}),
+									S && /* @__PURE__ */ m(ce, { hasRead: I })
+								]
+							})
 						})]
 					})]
-				}), M && /* @__PURE__ */ m("div", {
-					className: s.notePopover,
-					style: M.above ? {
-						left: M.x,
-						bottom: M.y
+				}), P && /* @__PURE__ */ h("div", {
+					className: c.notePopover,
+					style: P.above ? {
+						left: P.x,
+						bottom: P.y
 					} : {
-						left: M.x,
-						top: M.y
+						left: P.x,
+						top: P.y
 					},
 					onMouseEnter: () => {
-						X.current && clearTimeout(X.current);
+						Q.current && clearTimeout(Q.current);
 					},
-					onMouseLeave: Q,
+					onMouseLeave: $,
 					onClick: (e) => e.stopPropagation(),
-					children: [M.title && /* @__PURE__ */ p("div", {
-						className: s.notePopoverTitle,
-						children: M.title
-					}), /* @__PURE__ */ p("p", {
-						className: s.notePopoverContent,
-						children: M.contents
+					children: [P.title && /* @__PURE__ */ m("div", {
+						className: c.notePopoverTitle,
+						children: P.title
+					}), /* @__PURE__ */ m("p", {
+						className: c.notePopoverContent,
+						children: P.contents
 					})]
 				})]
 			})
@@ -388,4 +392,4 @@ var g = ({ file: o, workerSrc: g, sidebar: le, toolbar: _, onChangeFile: v, them
 	});
 };
 //#endregion
-export { g as default };
+export { _ as default };