pdf-tsx 0.17.2 → 0.17.3

package/dist/cjs/components/ui/PDFToolbar.cjs

@@ -1 +1 @@
-const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../hooks/useLabels.cjs"),n=require("./ToolbarButton.cjs"),r=require("./PDFToolbar.module.cjs"),i=require("./PDFToolbarDropdownContext.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=40;function c({children:e,overflowIcon:c=`···`}){let l=t.useLabels(),u=(0,a.useRef)(null),d=(0,a.useRef)([]),f=(0,a.useRef)([]),[p,m]=(0,a.useState)(null),[h,g]=(0,a.useState)(!1),_=(0,a.useRef)(null),v=a.default.Children.toArray(e),y=(0,a.useCallback)(()=>{let e=u.current;if(!e)return;d.current.forEach((e,t)=>{if(e){let n=e.offsetWidth;n>0&&(f.current[t]=n)}});let t=f.current;if(t.length===0)return;let n=e.offsetWidth;if(t.reduce((e,t)=>e+t,0)<=n){m(null);return}let r=0,i=0;for(let e=0;e<t.length&&r+t[e]+s<=n;e++)r+=t[e],i++;m(i)},[]);(0,a.useLayoutEffect)(()=>{y()},[y]),(0,a.useEffect)(()=>{let e=u.current;if(!e)return;let t=new ResizeObserver(()=>y());return t.observe(e),()=>t.disconnect()},[y]),(0,a.useEffect)(()=>{if(!h)return;let e=e=>{_.current?.contains(e.target)||g(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[h]);let b=p!==null&&p<v.length,x=b?v.slice(p):[];return(0,o.jsxs)(`div`,{ref:u,className:r.default.toolbar,children:[v.map((e,t)=>(0,o.jsx)(`div`,{ref:e=>{d.current[t]=e},className:r.default.item,style:p!==null&&t>=p?{display:`none`}:void 0,children:e},t)),b&&(0,o.jsxs)(`div`,{ref:_,className:r.default.overflowWrapper,children:[(0,o.jsx)(n.ToolbarButton,{onClick:()=>g(e=>!e),"aria-label":l.toolbarMoreOptions,"aria-expanded":h,"aria-haspopup":`true`,title:l.toolbarMoreOptions,className:h?r.default.overflowBtnActive:void 0,children:c}),h&&(0,o.jsx)(`div`,{className:r.default.dropdown,role:`menu`,children:x.map((e,t)=>{if(a.default.isValidElement(e)&&e.type.isSeparator)return(0,o.jsx)(i.PDFToolbarDropdownContext.Provider,{value:!0,children:e},t);let n=a.default.isValidElement(e)?e.type.toolbarLabelKey:void 0,s=n?l[n]:void 0;return(0,o.jsx)(`div`,{className:r.default.dropdownItem,role:`menuitem`,children:s?(0,o.jsxs)(`div`,{className:r.default.labeledItem,children:[(0,o.jsx)(`span`,{className:r.default.itemLabel,children:s}),(0,o.jsx)(`div`,{className:r.default.itemContent,children:e})]}):(0,o.jsx)(i.PDFToolbarDropdownContext.Provider,{value:!0,children:e})},t)})})]})]})}exports.PDFToolbar=c;
+const e=require("../../_virtual/_rolldown/runtime.cjs"),t=require("../../hooks/useLabels.cjs"),n=require("./ToolbarButton.cjs"),r=require("./PDFToolbar.module.cjs"),i=require("./PDFToolbarDropdownContext.cjs");let a=require("react");a=e.__toESM(a,1);let o=require("react/jsx-runtime");var s=40;function c({children:e,overflowIcon:c=`···`}){let l=t.useLabels(),u=(0,a.useRef)(null),d=(0,a.useRef)([]),f=(0,a.useRef)([]),[p,m]=(0,a.useState)(null),[h,g]=(0,a.useState)(!1),_=(0,a.useRef)(null),v=a.default.Children.toArray(e),y=(0,a.useCallback)(()=>{let e=u.current;if(!e)return;d.current.forEach((e,t)=>{if(e){let n=e.offsetWidth;n>0&&(f.current[t]=n)}});let t=f.current;if(t.length===0)return;let n=e.offsetWidth;if(t.reduce((e,t)=>e+t,0)<=n){m(null);return}let r=0,i=0;for(let e=0;e<t.length&&r+t[e]+s<=n;e++)r+=t[e],i++;m(i)},[]);(0,a.useLayoutEffect)(()=>{y()},[y]),(0,a.useEffect)(()=>{let e=u.current;if(!e)return;let t=new ResizeObserver(()=>y());return t.observe(e),d.current.forEach(e=>{e&&t.observe(e)}),()=>t.disconnect()},[y,v.length]),(0,a.useEffect)(()=>{if(!h)return;let e=e=>{_.current?.contains(e.target)||g(!1)};return document.addEventListener(`mousedown`,e),()=>document.removeEventListener(`mousedown`,e)},[h]);let b=p!==null&&p<v.length,x=b?v.slice(p):[];return(0,o.jsxs)(`div`,{ref:u,className:r.default.toolbar,children:[v.map((e,t)=>(0,o.jsx)(`div`,{ref:e=>{d.current[t]=e},className:r.default.item,style:p!==null&&t>=p?{display:`none`}:void 0,children:e},t)),b&&(0,o.jsxs)(`div`,{ref:_,className:r.default.overflowWrapper,children:[(0,o.jsx)(n.ToolbarButton,{onClick:()=>g(e=>!e),"aria-label":l.toolbarMoreOptions,"aria-expanded":h,"aria-haspopup":`true`,title:l.toolbarMoreOptions,className:h?r.default.overflowBtnActive:void 0,children:c}),h&&(0,o.jsx)(`div`,{className:r.default.dropdown,role:`menu`,children:x.map((e,t)=>{if(a.default.isValidElement(e)&&e.type.isSeparator)return(0,o.jsx)(i.PDFToolbarDropdownContext.Provider,{value:!0,children:e},t);let n=a.default.isValidElement(e)?e.type.toolbarLabelKey:void 0,s=n?l[n]:void 0;return(0,o.jsx)(`div`,{className:r.default.dropdownItem,role:`menuitem`,children:s?(0,o.jsxs)(`div`,{className:r.default.labeledItem,children:[(0,o.jsx)(`span`,{className:r.default.itemLabel,children:s}),(0,o.jsx)(`div`,{className:r.default.itemContent,children:e})]}):(0,o.jsx)(i.PDFToolbarDropdownContext.Provider,{value:!0,children:e})},t)})})]})]})}exports.PDFToolbar=c;

package/dist/cjs/hooks/usePDFRenderer.cjs

@@ -1 +1 @@
-const e=require("../_virtual/_rolldown/runtime.cjs");let t=require("react"),n=require("pdfjs-dist");n=e.__toESM(n,1);function r({pdf:e,zoom:n,rotation:r,visiblePages:i,canvasRefs:a}){let[o,s]=(0,t.useState)([]),[c,l]=(0,t.useState)(new Set),u=(0,t.useRef)([]),d=(0,t.useRef)(new Set),f=(0,t.useRef)(!1);return(0,t.useEffect)(()=>{if(!e)return;f.current=!1,d.current=new Set,l(new Set);let t=!1;return(async()=>{let i=u.current.map(e=>e?(e.cancel(),e.promise.catch(()=>{})):Promise.resolve());if(await Promise.all(i),u.current=Array(e.numPages).fill(null),t)return;let a=await e.getPage(1);if(t)return;let o=a.getViewport({scale:n,rotation:r}),c={width:o.width,height:o.height};s(Array(e.numPages).fill(c));let l=await Promise.all(Array.from({length:e.numPages},async(t,i)=>{let o=(i===0?a:await e.getPage(i+1)).getViewport({scale:n,rotation:r});return{width:o.width,height:o.height}}));t||(f.current=!0,s(l))})(),()=>{t=!0,u.current.forEach(e=>e?.cancel())}},[e,n,r]),(0,t.useEffect)(()=>{if(!e||o.length!==e.numPages||!f.current)return;let t=!1;return(async()=>{for(let o of i){if(t||d.current.has(o))continue;let i=await e.getPage(o);if(t)return;let s=window.devicePixelRatio||1,c=i.getViewport({scale:n,rotation:r}),f=i.getViewport({scale:n*s,rotation:r}),p=a.current[o-1];if(!p)continue;let m=p.getContext(`2d`);if(!m)continue;let h=u.current[o-1];if(h&&(h.cancel(),await h.promise.catch(()=>{}),t))return;p.width=f.width,p.height=f.height,p.style.width=`${c.width}px`,p.style.height=`${c.height}px`;let g=i.render({canvasContext:m,viewport:f,canvas:p});u.current[o-1]=g;try{await g.promise,t||(d.current=new Set(d.current).add(o),l(e=>{if(e.has(o))return e;let t=new Set(e);return t.add(o),t}))}catch(e){e&&typeof e==`object`&&`name`in e&&e.name!==`RenderingCancelledException`&&console.error(`Render error:`,e)}finally{u.current[o-1]===g&&(u.current[o-1]=null)}}})(),()=>{t=!0}},[e,o,r,i,n,a]),{pageSizes:o,renderedPages:c}}exports.usePDFRenderer=r;
+const e=require("../_virtual/_rolldown/runtime.cjs");let t=require("react"),n=require("pdfjs-dist");n=e.__toESM(n,1);function r(e,t,n,r){let i=e.getContext(`2d`);if(!i)return null;let a=t.getViewport({scale:n,rotation:r}),o=window.devicePixelRatio||1,s=Math.min(1,4096/Math.max(a.width,a.height)),c=Math.sqrt(Math.min(1,16777216/(a.width*a.height))),l=Math.max(.1,Math.min(o,s,c));l<o&&console.warn(`[pdf-tsx] canvas clamped to avoid blank render: page=${t.pageNumber} zoom=${n} dpr=${o} requested=${Math.round(a.width*o)}x${Math.round(a.height*o)}px clamped=${Math.round(a.width*l)}x${Math.round(a.height*l)}px`);let u=t.getViewport({scale:n*l,rotation:r});return e.width=u.width,e.height=u.height,e.style.width=`${a.width}px`,e.style.height=`${a.height}px`,t.render({canvasContext:i,viewport:u,canvas:e})}function i({pdf:e,zoom:n,rotation:i,visiblePages:a,canvasRefs:o}){let[s,c]=(0,t.useState)([]),[l,u]=(0,t.useState)(new Set),d=(0,t.useRef)([]),f=(0,t.useRef)(new Set),p=(0,t.useRef)(!1);return(0,t.useEffect)(()=>{if(!e)return;p.current=!1,f.current=new Set,u(new Set);let t=!1;return(async()=>{let r=d.current.map(e=>e?(e.cancel(),e.promise.catch(()=>{})):Promise.resolve());if(await Promise.all(r),d.current=Array(e.numPages).fill(null),t)return;let a=await e.getPage(1);if(t)return;let o=a.getViewport({scale:n,rotation:i}),s={width:o.width,height:o.height};c(Array(e.numPages).fill(s));let l=await Promise.all(Array.from({length:e.numPages},async(t,r)=>{let o=(r===0?a:await e.getPage(r+1)).getViewport({scale:n,rotation:i});return{width:o.width,height:o.height}}));t||(p.current=!0,c(l))})(),()=>{t=!0,d.current.forEach(e=>e?.cancel())}},[e,n,i]),(0,t.useEffect)(()=>{if(!e||s.length!==e.numPages||!p.current)return;let t=!1;return(async()=>{for(let s of a){if(t||f.current.has(s))continue;let a=await e.getPage(s);if(t)return;let c=o.current[s-1];if(!c)continue;let l=d.current[s-1];if(l&&(l.cancel(),await l.promise.catch(()=>{}),t))return;let p=r(c,a,n,i);if(p){d.current[s-1]=p;try{await p.promise,t||(f.current=new Set(f.current).add(s),u(e=>{if(e.has(s))return e;let t=new Set(e);return t.add(s),t}))}catch(e){e&&typeof e==`object`&&`name`in e&&e.name!==`RenderingCancelledException`&&console.error(`Render error:`,e)}finally{d.current[s-1]===p&&(d.current[s-1]=null)}}}})(),()=>{t=!0}},[e,s,i,a,n,o]),{pageSizes:s,renderedPages:l}}exports.usePDFRenderer=i;

package/dist/cjs/utils/pdfFit.cjs

@@ -1 +1 @@
-var e=60,t=10;async function n(n,r,i,a){let o=(await r.getPage(1)).getViewport({scale:1,rotation:a}),s=i.clientWidth-e;if(n===`width`)return s/o.width;let c=i.clientHeight-t*2;return Math.min(s/o.width,c/o.height)}exports.computeFit=n;
+const e=require("./zoom.cjs");var t=60,n=10;async function r(r,i,a,o){if(a.clientWidth<=t)return 1;let s=(await i.getPage(1)).getViewport({scale:1,rotation:o}),c=a.clientWidth-t,l;if(r===`width`)l=c/s.width;else{let e=a.clientHeight-n*2;l=Math.min(c/s.width,e/s.height)}return Math.max(e.MIN_ZOOM,Math.min(5,l))}exports.computeFit=r;

package/dist/es/components/ui/PDFToolbar.js

@@ -33,8 +33,10 @@ function p({ children: p, overflowIcon: m = "···" }) {
 		let e = g.current;
 		if (!e) return;
 		let t = new ResizeObserver(() => T());
-		return t.observe(e), () => t.disconnect();
-	}, [T]), o(() => {
+		return t.observe(e), _.current.forEach((e) => {
+			e && t.observe(e);
+		}), () => t.disconnect();
+	}, [T, w.length]), o(() => {
 		if (!x) return;
 		let e = (e) => {
 			C.current?.contains(e.target) || S(!1);

package/dist/es/hooks/usePDFRenderer.js

@@ -1,96 +1,103 @@
 import { useEffect as e, useRef as t, useState as n } from "react";
 import "pdfjs-dist";
 //#region src/hooks/usePDFRenderer.ts
-function r({ pdf: r, zoom: i, rotation: a, visiblePages: o, canvasRefs: s }) {
-	let [c, l] = n([]), [u, d] = n(/* @__PURE__ */ new Set()), f = t([]), p = t(/* @__PURE__ */ new Set()), m = t(!1);
+function r(e, t, n, r) {
+	let i = e.getContext("2d");
+	if (!i) return null;
+	let a = t.getViewport({
+		scale: n,
+		rotation: r
+	}), o = window.devicePixelRatio || 1, s = Math.min(1, 4096 / Math.max(a.width, a.height)), c = Math.sqrt(Math.min(1, 16777216 / (a.width * a.height))), l = Math.max(.1, Math.min(o, s, c));
+	l < o && console.warn(`[pdf-tsx] canvas clamped to avoid blank render: page=${t.pageNumber} zoom=${n} dpr=${o} requested=${Math.round(a.width * o)}x${Math.round(a.height * o)}px clamped=${Math.round(a.width * l)}x${Math.round(a.height * l)}px`);
+	let u = t.getViewport({
+		scale: n * l,
+		rotation: r
+	});
+	return e.width = u.width, e.height = u.height, e.style.width = `${a.width}px`, e.style.height = `${a.height}px`, t.render({
+		canvasContext: i,
+		viewport: u,
+		canvas: e
+	});
+}
+function i({ pdf: i, zoom: a, rotation: o, visiblePages: s, canvasRefs: c }) {
+	let [l, u] = n([]), [d, f] = n(/* @__PURE__ */ new Set()), p = t([]), m = t(/* @__PURE__ */ new Set()), h = t(!1);
 	return e(() => {
-		if (!r) return;
-		m.current = !1, p.current = /* @__PURE__ */ new Set(), d(/* @__PURE__ */ new Set());
+		if (!i) return;
+		h.current = !1, m.current = /* @__PURE__ */ new Set(), f(/* @__PURE__ */ new Set());
 		let e = !1;
 		return (async () => {
-			let t = f.current.map((e) => e ? (e.cancel(), e.promise.catch(() => {})) : Promise.resolve());
-			if (await Promise.all(t), f.current = Array(r.numPages).fill(null), e) return;
-			let n = await r.getPage(1);
+			let t = p.current.map((e) => e ? (e.cancel(), e.promise.catch(() => {})) : Promise.resolve());
+			if (await Promise.all(t), p.current = Array(i.numPages).fill(null), e) return;
+			let n = await i.getPage(1);
 			if (e) return;
-			let o = n.getViewport({
-				scale: i,
-				rotation: a
+			let r = n.getViewport({
+				scale: a,
+				rotation: o
 			}), s = {
-				width: o.width,
-				height: o.height
+				width: r.width,
+				height: r.height
 			};
-			l(Array(r.numPages).fill(s));
-			let c = await Promise.all(Array.from({ length: r.numPages }, async (e, t) => {
-				let o = (t === 0 ? n : await r.getPage(t + 1)).getViewport({
-					scale: i,
-					rotation: a
+			u(Array(i.numPages).fill(s));
+			let c = await Promise.all(Array.from({ length: i.numPages }, async (e, t) => {
+				let r = (t === 0 ? n : await i.getPage(t + 1)).getViewport({
+					scale: a,
+					rotation: o
 				});
 				return {
-					width: o.width,
-					height: o.height
+					width: r.width,
+					height: r.height
 				};
 			}));
-			e || (m.current = !0, l(c));
+			e || (h.current = !0, u(c));
 		})(), () => {
-			e = !0, f.current.forEach((e) => e?.cancel());
+			e = !0, p.current.forEach((e) => e?.cancel());
 		};
 	}, [
-		r,
 		i,
-		a
+		a,
+		o
 	]), e(() => {
-		if (!r || c.length !== r.numPages || !m.current) return;
+		if (!i || l.length !== i.numPages || !h.current) return;
 		let e = !1;
 		return (async () => {
-			for (let t of o) {
-				if (e || p.current.has(t)) continue;
-				let n = await r.getPage(t);
+			for (let t of s) {
+				if (e || m.current.has(t)) continue;
+				let n = await i.getPage(t);
 				if (e) return;
-				let o = window.devicePixelRatio || 1, c = n.getViewport({
-					scale: i,
-					rotation: a
-				}), l = n.getViewport({
-					scale: i * o,
-					rotation: a
-				}), u = s.current[t - 1];
-				if (!u) continue;
-				let m = u.getContext("2d");
-				if (!m) continue;
-				let h = f.current[t - 1];
-				if (h && (h.cancel(), await h.promise.catch(() => {}), e)) return;
-				u.width = l.width, u.height = l.height, u.style.width = `${c.width}px`, u.style.height = `${c.height}px`;
-				let g = n.render({
-					canvasContext: m,
-					viewport: l,
-					canvas: u
-				});
-				f.current[t - 1] = g;
-				try {
-					await g.promise, e || (p.current = new Set(p.current).add(t), d((e) => {
-						if (e.has(t)) return e;
-						let n = new Set(e);
-						return n.add(t), n;
-					}));
-				} catch (e) {
-					e && typeof e == "object" && "name" in e && e.name !== "RenderingCancelledException" && console.error("Render error:", e);
-				} finally {
-					f.current[t - 1] === g && (f.current[t - 1] = null);
+				let s = c.current[t - 1];
+				if (!s) continue;
+				let l = p.current[t - 1];
+				if (l && (l.cancel(), await l.promise.catch(() => {}), e)) return;
+				let u = r(s, n, a, o);
+				if (u) {
+					p.current[t - 1] = u;
+					try {
+						await u.promise, e || (m.current = new Set(m.current).add(t), f((e) => {
+							if (e.has(t)) return e;
+							let n = new Set(e);
+							return n.add(t), n;
+						}));
+					} catch (e) {
+						e && typeof e == "object" && "name" in e && e.name !== "RenderingCancelledException" && console.error("Render error:", e);
+					} finally {
+						p.current[t - 1] === u && (p.current[t - 1] = null);
+					}
 				}
 			}
 		})(), () => {
 			e = !0;
 		};
 	}, [
-		r,
-		c,
-		a,
-		o,
 		i,
-		s
+		l,
+		o,
+		s,
+		a,
+		c
 	]), {
-		pageSizes: c,
-		renderedPages: u
+		pageSizes: l,
+		renderedPages: d
 	};
 }
 //#endregion
-export { r as usePDFRenderer };
+export { i as usePDFRenderer };

package/dist/es/utils/pdfFit.js

@@ -1,13 +1,18 @@
+import { MIN_ZOOM as e } from "./zoom.js";
 //#region src/utils/pdfFit.ts
-var e = 60, t = 10;
-async function n(n, r, i, a) {
-	let o = (await r.getPage(1)).getViewport({
+var t = 60, n = 10;
+async function r(r, i, a, o) {
+	if (a.clientWidth <= t) return 1;
+	let s = (await i.getPage(1)).getViewport({
 		scale: 1,
-		rotation: a
-	}), s = i.clientWidth - e;
-	if (n === "width") return s / o.width;
-	let c = i.clientHeight - t * 2;
-	return Math.min(s / o.width, c / o.height);
+		rotation: o
+	}), c = a.clientWidth - t, l;
+	if (r === "width") l = c / s.width;
+	else {
+		let e = a.clientHeight - n * 2;
+		l = Math.min(c / s.width, e / s.height);
+	}
+	return Math.max(e, Math.min(5, l));
 }
 //#endregion
-export { n as computeFit };
+export { r as computeFit };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pdf-tsx",
-  "version": "0.17.2",
+  "version": "0.17.3",
   "description": "A fully-featured, composable PDF viewer component for React",
   "type": "module",
   "main": "./dist/cjs/index.cjs",