@react-pdf-kit/viewer 2.9.1 → 2.9.2

package/dist/components/RPPages.js

@@ -1,3 +1,3 @@
 "use client";
-import { t as e } from "../RPPages-cyO0Tn21.js";
+import { t as e } from "../RPPages-BZwgKgfJ.js";
 export { e as RPPages };

package/dist/components/page/CanvasLayer.js

@@ -1,2 +1,2 @@
-import { t as e } from "../../CanvasLayer-CJqCJ30J.js";
+import { t as e } from "../../CanvasLayer-C3gb8EXu.js";
 export { e as CanvasLayer };

package/dist/components/page/RPPage.js

@@ -4,91 +4,83 @@ import { usePagesRotateContext as n } from "../../contexts/PagesRotateContext.js
 import { useLayerContext as r } from "../../contexts/LayerContext.js";
 import { useLoaderContext as i } from "../../contexts/LoaderContext.js";
 import { withRef as a } from "../../utils/withRef.js";
-import { n as o, t as s } from "../../CanvasLayer-CJqCJ30J.js";
+import { n as o, t as s } from "../../CanvasLayer-C3gb8EXu.js";
 import { t as c } from "../../TextLayer-Bp1CDIIa.js";
 import { t as l } from "../../AnnotationLayer-oDu2B4X1.js";
 import { t as u } from "../../TextHighlightLayer-3vIZbRyL.js";
 import { CustomElement as d } from "./CustomElement.js";
-import { useCallback as f, useEffect as p, useImperativeHandle as m, useMemo as h, useRef as g, useState as _ } from "react";
-import { jsx as v, jsxs as y } from "react/jsx-runtime";
+import { useCallback as f, useImperativeHandle as p, useMemo as m, useRef as h, useState as g } from "react";
+import { jsx as _, jsxs as v } from "react/jsx-runtime";
 //#region lib/components/page/RPPage.tsx
-var b = a((a, b) => {
-	let { pageNumber: x, style: S, ...C } = a, { pages: w } = e(), { pageRotate: T } = n(), { textLayer: E } = r(), { currentZoom: D, targetZoom: O } = t(), { LoaderImageComponent: k } = i(), A = g(w.get(x)), [j, M] = _(!1), N = g(null), [P, F] = _({
+var y = a((a, y) => {
+	let { pageNumber: b, style: x, ...S } = a, { pages: C } = e(), { pageRotate: w } = n(), { textLayer: T } = r(), { currentZoom: E, targetZoom: D } = t(), { LoaderImageComponent: O } = i(), k = C.get(b), [A, j] = g(!1), M = h(null);
+	p(y, () => M.current);
+	let N = k ? w[b] ?? k.defaultRotation ?? 0 : 0, P = m(() => k ? k.page.getViewport({
+		scale: 1,
+		rotation: N
+	}) : {
 		width: 0,
 		height: 0
-	});
-	m(b, () => N.current);
-	let I = h(() => A.current ? T[x] ?? A.current.defaultRotation ?? 0 : 0, [x, T]);
-	p(() => {
-		w && (A.current = w.get(x), A.current && F(A.current.page.getViewport({
-			scale: 1,
-			rotation: I
-		})));
-	}, [
-		w,
-		x,
-		I
-	]);
-	let L = h(() => ({
-		width: P.width * (O || D || 1),
-		height: P.height * (O || D || 1)
+	}, [k, N]), F = m(() => ({
+		width: P.width * (D || E || 1),
+		height: P.height * (D || E || 1)
 	}), [
 		P,
-		O,
-		D
-	]), R = h(() => {
-		switch (I) {
-			case 90: return `${L.width / 2}px ${L.width / 2}px`;
+		D,
+		E
+	]), I = m(() => {
+		switch (N) {
+			case 90: return `${F.width / 2}px ${F.width / 2}px`;
 			case -90:
-			case 270: return `${L.height / 2}px ${L.height / 2}px`;
+			case 270: return `${F.height / 2}px ${F.height / 2}px`;
 			default: return "center";
 		}
-	}, [I, L]), z = h(() => !D || !O ? 1 : O / D, [D, O]), B = f((e) => {
-		M(!e.hasRenderedBefore);
-	}, []), V = f(() => {
-		M(!1);
+	}, [N, F]), L = m(() => !E || !D ? 1 : D / E, [E, D]), R = f((e) => {
+		j(!e.hasRenderedBefore);
+	}, []), z = f(() => {
+		j(!1);
 	}, []);
-	return /* @__PURE__ */ v("div", {
-		ref: N,
-		id: `page-${x}`,
-		"data-rp": `page-${x}`,
-		...C,
+	return /* @__PURE__ */ _("div", {
+		ref: M,
+		id: `page-${b}`,
+		"data-rp": `page-${b}`,
+		...S,
 		style: {
-			...S,
-			"--rp-rotate": `${I}deg`,
-			"--rp-page-rotate-translate": `${R}`,
+			...x,
+			"--rp-rotate": `${N}deg`,
+			"--rp-page-rotate-translate": `${I}`,
 			"--user-unit": P.userUnit || 1,
-			"--scale-factor": O || D,
-			"--rp-canvas-scale-ratio": z,
+			"--scale-factor": D || E,
+			"--rp-canvas-scale-ratio": L,
 			"--total-scale-factor": "calc(var(--scale-factor) * var(--user-unit))"
 		},
 		className: o["rp-page-wrapper"],
-		children: /* @__PURE__ */ y("div", {
+		children: /* @__PURE__ */ v("div", {
 			style: {
-				width: `${L.width}px`,
-				height: `${L.height}px`
+				width: `${F.width}px`,
+				height: `${F.height}px`
 			},
 			className: o["rp-page"],
 			children: [
-				/* @__PURE__ */ v(s, {
-					onLoading: B,
-					onLoaded: V,
-					pageNumber: x
+				/* @__PURE__ */ _(s, {
+					onLoading: R,
+					onLoaded: z,
+					pageNumber: b
 				}),
-				j && k && /* @__PURE__ */ v("div", {
+				A && O && /* @__PURE__ */ _("div", {
 					className: o["rp-loader-wrapper"],
-					children: /* @__PURE__ */ v(k, {})
+					children: /* @__PURE__ */ _(O, {})
 				}),
-				/* @__PURE__ */ v(d, { pageNumber: x }),
-				E && /* @__PURE__ */ v(c, { pageNumber: x }),
-				/* @__PURE__ */ v(u, {
-					pageNumber: x,
+				/* @__PURE__ */ _(d, { pageNumber: b }),
+				T && /* @__PURE__ */ _(c, { pageNumber: b }),
+				/* @__PURE__ */ _(u, {
+					pageNumber: b,
 					viewport: P
 				}),
-				/* @__PURE__ */ v(l, { pageNumber: x })
+				/* @__PURE__ */ _(l, { pageNumber: b })
 			]
 		})
 	});
 });
 //#endregion
-export { b as RPPage };
+export { y as RPPage };

package/dist/contexts/RenderQueueProvider.js

@@ -6,60 +6,60 @@ import { renderPage as i } from "../utils/renderPage.js";
 import { createContext as a, useCallback as o, useContext as s, useEffect as c, useMemo as l, useRef as u, useState as d } from "react";
 import { jsx as f } from "react/jsx-runtime";
 //#region lib/contexts/RenderQueueProvider.tsx
-var p = a(null), m = ({ children: a }) => {
-	let s = u(!1), m = u(/* @__PURE__ */ new Map()), [h, g] = d([]), _ = o((e) => {
-		g((t) => [...t, {
+var p = a(null), m = (e, t) => t.destroyed ? !0 : e instanceof Error ? e.message === "Worker was destroyed" || e.message === "Worker was destroyed." || e.message === "Transport destroyed" : !1, h = ({ children: a }) => {
+	let s = u(!1), h = u(/* @__PURE__ */ new Map()), [g, _] = d([]), v = o((e) => {
+		_((t) => [...t, {
 			id: e.page.pageNumber.toString(),
 			data: e,
 			priority: 0
 		}]);
-	}, []), v = l(() => new r(_), [_]), { focusedPage: y } = n(), { pdf: b } = t(), x = u(b);
+	}, []), y = l(() => new r(v), [v]), { focusedPage: b } = n(), { pdf: x } = t(), S = u(x);
 	c(() => {
-		x.current = b;
-	}, [b]);
-	let S = o((t) => {
+		S.current = x;
+	}, [x]);
+	let C = o((t) => {
 		s.current = !0;
-		let n = m.current.get(t.id);
-		n && (n.cancel(), m.current.delete(t.id));
+		let n = h.current.get(t.id);
+		n && (n.cancel(), h.current.delete(t.id));
 		let r;
 		try {
 			r = i(t.data.page, t.data.canvasElem, t.data.options);
-		} catch {
-			return t.data.onRenderTask?.(null), Promise.resolve();
+		} catch (e) {
+			return m(e, t.data.page) || console.error(`Error rendering page ${t.data.page.pageNumber}:`, e), t.data.onRenderTask?.(null), Promise.resolve();
 		}
-		return m.current.set(t.id, r), t.data.onRenderTask?.(r), e(x.current, r.promise).then(() => {
+		return h.current.set(t.id, r), t.data.onRenderTask?.(r), e(S.current, r.promise).then(() => {
 			t.data.canvasElem.hidden = !1, t.data.onLoaded && t.data.onLoaded();
 		}).catch((e) => {
 			e.name !== "RenderingCancelledException" && console.error(`Error rendering page ${t.data.page.pageNumber}:`, e);
 		}).finally(() => {
-			m.current.delete(t.id), t.data.onRenderTask?.(null);
+			h.current.delete(t.id), t.data.onRenderTask?.(null);
 		});
 	}, []);
 	return c(() => {
-		m.current.forEach((e) => e.cancel()), m.current.clear(), v.clear(), g(v.peekAll());
-	}, [b, v]), c(() => {
-		y && (v.changePagePriority(`^page-${y}`, 0), v.changePagePriority(`^thumbnail-${y}`, 1));
-	}, [y]), c(() => {
-		if (v.isEmpty() || s.current) return;
+		h.current.forEach((e) => e.cancel()), h.current.clear(), y.clear(), _(y.peekAll());
+	}, [x, y]), c(() => {
+		b && (y.changePagePriority(`^page-${b}`, 0), y.changePagePriority(`^thumbnail-${b}`, 1));
+	}, [b]), c(() => {
+		if (y.isEmpty() || s.current) return;
 		let e = () => {
-			let t = v.dequeue();
-			t ? S(t).catch(() => {}).finally(() => {
+			let t = y.dequeue();
+			t ? C(t).catch(() => {}).finally(() => {
 				e();
-			}) : (s.current = !1, g(v.peekAll()));
+			}) : (s.current = !1, _(y.peekAll()));
 		};
 		e();
 	}, [
-		v,
-		S,
-		h
+		y,
+		C,
+		g
 	]), /* @__PURE__ */ f(p.Provider, {
-		value: v,
+		value: y,
 		children: a
 	});
-}, h = () => {
+}, g = () => {
 	let e = s(p);
 	if (!e) throw Error("RenderQueue not found");
 	return e;
 };
 //#endregion
-export { p as RenderQueueContext, m as RenderQueueProvider, h as useRenderQueue };
+export { p as RenderQueueContext, h as RenderQueueProvider, g as useRenderQueue };

package/dist/contexts/ZoomContext.js

@@ -8,11 +8,11 @@ import { getZoomLevel as s } from "../utils/getZoomLevel.js";
 import { useLayoutContainer as c } from "./LayoutContainerContext.js";
 import { useRotationContext as ee } from "./RotationContext.js";
 import { useGlobalCurrentPage as te } from "./GlobalCurrentPage.js";
-import { useDebounce as ne } from "../utils/hooks/useDebounce.js";
-import { createContext as l, useCallback as u, useContext as d, useEffect as f, useMemo as p, useRef as m, useState as h } from "react";
-import { jsx as re } from "react/jsx-runtime";
+import { useDebounce as l } from "../utils/hooks/useDebounce.js";
+import { createContext as u, useCallback as d, useContext as f, useEffect as p, useLayoutEffect as m, useMemo as h, useRef as g, useState as _ } from "react";
+import { jsx as ne } from "react/jsx-runtime";
 //#region lib/contexts/ZoomContext.tsx
-var g = l({
+var v = u({
 	zoomLevel: 100,
 	currentZoom: 1,
 	targetZoom: 1,
@@ -22,133 +22,139 @@ var g = l({
 	previousTargetZoom: null,
 	zoomTo: () => {},
 	setZoomLevel: () => {}
-}), _ = () => {
-	let e = d(g);
+}), y = () => {
+	let e = f(v);
 	return typeof e.currentZoom != "number" && t.warn("Please use this hooks inside children component of RPProvider"), e;
-}, v = ({ children: t }) => {
-	let { initialScale: l = e.PAGE_FIT } = r(), [d, _] = h(l), [v, ie] = h(0), [y, b] = h(0), [x, S] = h(!1), [C, w] = h(null), [T, E] = h(null), [D, O] = h(null), k = m(0), A = m(0), { pages: j } = n(), { pagesRef: M } = c(), { viewMode: N } = i(), [ae, P] = h({
-		width: M?.clientWidth || 0,
-		height: M?.clientHeight || 0
-	}), F = ne(ae, 100), { rotate: I } = ee(), [L, R] = h(null), z = m(null), { currentPage: B } = te(), [V, oe] = h(B), H = m(), U = m(), W = m(), G = m({});
-	f(() => {
-		let e = j.get(V);
-		e ||= j.get(1);
-		let t = e?.page.getViewport({
+}, b = ({ children: t }) => {
+	let { initialScale: u = e.PAGE_FIT } = r(), [f, y] = _(u), [b, x] = _(0), [S, re] = _(0), [C, w] = _(!1), [T, E] = _(null), [D, O] = _(null), [k, A] = _(null), j = g(0), M = g(0), { pages: N } = n(), { pagesRef: P } = c(), { viewMode: F } = i(), [ie, ae] = _({
+		width: P?.clientWidth || 0,
+		height: P?.clientHeight || 0
+	}), I = l(ie, 100), { rotate: L } = ee(), { currentPage: R } = te(), [z, oe] = _(R), B = g(), V = g(), H = g(), U = g({}), W = g(L), G = h(() => {
+		let e = N.get(z);
+		return e ||= N.get(1), e?.page.getViewport({
 			scale: 1,
-			rotation: e.defaultRotation + I
-		});
-		t && JSON.stringify(t) !== JSON.stringify(z.current) && (z.current = t, R(t));
+			rotation: e.defaultRotation + L
+		}) ?? null;
 	}, [
-		j,
-		I,
-		V
-	]);
-	let K = u(() => L ? {
-		pageWidth: (L?.width || 0) + 8,
-		pageHeight: L?.height || 0,
-		clientWidth: M?.clientWidth || 0,
-		clientHeight: M?.clientHeight || 0
-	} : null, [L, M]), q = p(() => {
+		N,
+		L,
+		z
+	]), K = d(() => G ? {
+		pageWidth: (G?.width || 0) + 8,
+		pageHeight: G?.height || 0,
+		clientWidth: P?.clientWidth || 0,
+		clientHeight: P?.clientHeight || 0
+	} : null, [G, P]), q = h(() => {
 		let e = K();
-		if (!F.width || !F.height || !e) return 0;
-		if (typeof d == "number") return Math.max(25, Math.min(d, a)) / 100;
-		let { clientWidth: t, clientHeight: n, pageWidth: r, pageHeight: i } = e, o = s(d, t, n, r, i, N) / 100;
+		if (!I.width || !I.height || !e) return 0;
+		if (typeof f == "number") return Math.max(25, Math.min(f, a)) / 100;
+		let { clientWidth: t, clientHeight: n, pageWidth: r, pageHeight: i } = e, o = s(f, t, n, r, i, F) / 100;
 		return Math.max(25 / 100, Math.min(o, a / 100));
 	}, [
-		d,
-		F,
+		f,
+		I,
 		K,
-		N
-	]), J = u(() => {
-		H.current &&= (clearTimeout(H.current), void 0), U.current &&= (clearTimeout(U.current), void 0), W.current &&= (cancelAnimationFrame(W.current), void 0);
-	}, []), Y = u((e) => {
-		ie(e), S(!1), w(null), E(null), O(null);
-	}, []), X = u((e, t = {}) => {
+		F
+	]), J = d(() => {
+		B.current &&= (clearTimeout(B.current), void 0), V.current &&= (clearTimeout(V.current), void 0), H.current &&= (cancelAnimationFrame(H.current), void 0);
+	}, []), Y = d((e) => {
+		x(e), w(!1), E(null), O(null), A(null);
+	}, []), X = d((e, t = {}) => {
 		if (!e) return;
-		let n = k.current === 0;
-		if (!(!(Math.abs(e - A.current) > 1e-10) && !n)) {
-			if (J(), w(t.origin ?? null), E(t.gesture ?? null), O(t.previousTargetZoom ?? A.current ?? k.current ?? null), A.current = e, b(e), n || t.immediate) {
+		let n = j.current === 0;
+		if (!(!(Math.abs(e - M.current) > 1e-10) && !n)) {
+			if (J(), E(t.origin ?? null), O(t.gesture ?? null), A(t.previousTargetZoom ?? M.current ?? j.current ?? null), M.current = e, re(e), n || t.immediate) {
 				Y(e);
 				return;
 			}
-			S(!0), U.current = setTimeout(() => {
-				H.current &&= (clearTimeout(H.current), void 0), W.current &&= (cancelAnimationFrame(W.current), void 0), U.current = void 0, Y(e);
-			}, o), W.current = requestAnimationFrame(() => {
-				W.current = void 0, H.current = setTimeout(() => {
-					H.current = void 0, U.current &&= (clearTimeout(U.current), void 0), Y(e);
+			w(!0), V.current = setTimeout(() => {
+				B.current &&= (clearTimeout(B.current), void 0), H.current &&= (cancelAnimationFrame(H.current), void 0), V.current = void 0, Y(e);
+			}, o), H.current = requestAnimationFrame(() => {
+				H.current = void 0, B.current = setTimeout(() => {
+					B.current = void 0, V.current &&= (clearTimeout(V.current), void 0), Y(e);
 				}, 400);
 			});
 		}
 	}, [J, Y]);
-	f(() => {
+	m(() => {
 		if (!q) return;
-		let e = G.current;
-		G.current = {}, X(q, e);
-	}, [q, X]);
-	let Z = u((e) => {
+		let e = U.current;
+		U.current = {};
+		let t = W.current !== L && typeof f != "number";
+		W.current = L, X(q, t ? {
+			...e,
+			immediate: !0
+		} : e);
+	}, [
+		q,
+		L,
+		X,
+		f
+	]);
+	let Z = d((e) => {
 		if (typeof e == "number") return Math.max(25, Math.min(e, a)) / 100;
 		let t = K();
 		if (!t) return 0;
-		let { clientWidth: n, clientHeight: r, pageWidth: i, pageHeight: o } = t, c = s(e, n, r, i, o, N);
+		let { clientWidth: n, clientHeight: r, pageWidth: i, pageHeight: o } = t, c = s(e, n, r, i, o, F);
 		return Math.max(25, Math.min(c, a)) / 100;
-	}, [K, N]), Q = u((e, t = {}) => {
-		G.current = t, _(e), X(Z(e), t);
+	}, [K, F]), Q = d((e, t = {}) => {
+		U.current = t, y(e), X(Z(e), t);
 	}, [Z, X]);
-	f(() => {
-		y && (A.current = y);
-	}, [y]), f(() => {
-		v && (k.current = v);
-	}, [v]), f(() => () => {
+	p(() => {
+		S && (M.current = S);
+	}, [S]), p(() => {
+		b && (j.current = b);
+	}, [b]), p(() => () => {
 		J();
-	}, [J]), f(() => {
-		oe(B);
-	}, [d]), f(() => {
+	}, [J]), p(() => {
+		oe(R);
+	}, [f]), p(() => {
 		let e = new ResizeObserver((e) => {
 			e.forEach((e) => {
-				P({
+				ae({
 					width: e.contentRect.width,
 					height: e.contentRect.height
 				});
 			});
 		});
-		return M && e.observe(M), () => {
+		return P && e.observe(P), () => {
 			e.disconnect();
 		};
-	}, [M]);
-	let $ = u((e) => {
+	}, [P]);
+	let $ = d((e) => {
 		let t = 0;
 		if (typeof e == "function") {
 			let n = K();
 			if (!n) return;
 			let { clientWidth: r, clientHeight: i, pageWidth: a, pageHeight: o } = n;
-			t = (t) => e(s(t, r, i, a, o, N));
+			t = (t) => e(s(t, r, i, a, o, F));
 		} else t = e;
-		t && (G.current = {}, _(typeof t == "number" ? Math.max(25, Math.min(t, a)) : t));
-	}, [K, N]), se = p(() => ({
-		zoomLevel: d,
-		currentZoom: v,
-		targetZoom: y || v,
-		isZooming: x,
-		zoomOrigin: C,
-		zoomGesture: T,
-		previousTargetZoom: D,
+		t && (U.current = {}, y(typeof t == "number" ? Math.max(25, Math.min(t, a)) : t));
+	}, [K, F]), se = h(() => ({
+		zoomLevel: f,
+		currentZoom: b,
+		targetZoom: S || b,
+		isZooming: C,
+		zoomOrigin: T,
+		zoomGesture: D,
+		previousTargetZoom: k,
 		zoomTo: Q,
 		setZoomLevel: $
 	}), [
-		v,
-		y,
-		x,
-		d,
+		b,
+		S,
 		C,
+		f,
 		T,
 		D,
+		k,
 		Q,
 		$
 	]);
-	return /* @__PURE__ */ re(g.Provider, {
+	return /* @__PURE__ */ ne(v.Provider, {
 		value: se,
 		children: t
 	});
 };
 //#endregion
-export { g as ZoomContext, v as ZoomProvider, _ as useZoomContext };
+export { v as ZoomContext, b as ZoomProvider, y as useZoomContext };

package/dist/main.js

@@ -16,7 +16,7 @@ import { useHighlightContext as y } from "./contexts/HighlightContext.js";
 import { useElementPageContext as b } from "./contexts/ElementPageContext.js";
 import { useElementThumbnailContext as x } from "./contexts/ElementThumbnailContext.js";
 import { RPProvider as S } from "./components/RPProvider.js";
-import { t as C } from "./RPPages-cyO0Tn21.js";
+import { t as C } from "./RPPages-BZwgKgfJ.js";
 import { useFileDownload as w } from "./utils/hooks/useFileDownload.js";
 import { RPTheme as T } from "./components/RPTheme.js";
 import { RPConfig as E } from "./components/RPConfig.js";

package/dist/types/utils/documentLayout.d.ts

@@ -46,7 +46,7 @@ type BuildDocumentLayoutOptions = {
 export declare const getPageGroupForPage: (pageNumber: number, viewMode: ViewMode, totalPages: number) => number[];
 export declare const buildDocumentLayout: (options: BuildDocumentLayoutOptions) => DocumentLayout;
 export declare const getPagePlacement: (layout: DocumentLayout, pageNumber: number) => DocumentPagePlacement | null;
-export declare const getPageContentOffset: (pageBoxWidth: number, pageBoxHeight: number, pageWidth: number, pageHeight: number) => {
+export declare const getPageContentOffset: (pageBoxWidth: number, _pageBoxHeight: number, pageWidth: number, _pageHeight: number) => {
     x: number;
     y: number;
 };