vue-pdfjs-headless 4.3.1 → 4.4.0

package/README.md

@@ -5,12 +5,14 @@
 [![NPM downloads][badge-npm-downloads]][url-npm]
 [![NPM Unpacked Size (with version)][badge-npm-unpacked-size]][url-npm]
 
-Headless Vue composables over pdfjs-dist: a document's loading, a page's drawing and the viewer's state, with no styling and no renderer of its own.
+Headless Vue composables over pdfjs-dist that load a document, draw its pages and track the viewer's state, with no styling and no renderer of its own.
+
+Design notes live in [the specs](https://github.com/Esposter/Esposter/tree/main/openspec/specs/vue-pdfjs-headless).
 
 ## Table of Contents
 
 - 🚀 [Getting Started](#getting-started)
-- 📖 [Documentation](#documentation)
+- 🧩 [Key Exports](#key-exports)
 - ⚖️ [License](#license)
 
 ---
@@ -21,9 +23,42 @@ Headless Vue composables over pdfjs-dist: a document's loading, a page's drawing
 pnpm i vue-pdfjs-headless
 ```
 
-## <a name="documentation">📖 Documentation</a>
+```ts
+import * as pdfjs from "pdfjs-dist";
+import { shallowRef } from "vue";
+import { usePdfDocument, usePdfPage } from "vue-pdfjs-headless";
+
+const canvas = shallowRef<HTMLCanvasElement>();
+const { pdfDocument } = usePdfDocument({
+  renderer: {
+    api: pdfjs,
+    cMapUrl: "/cmaps/",
+    standardFontDataUrl: "/fonts/",
+    wasmUrl: "/wasm/",
+    workerSrc: "/pdf.worker.mjs",
+  },
+  source: "/document.pdf",
+});
+usePdfPage({ canvas, pageNumber: 1, pdfDocument });
+```
+
+Bind `canvas` to a `<canvas ref="canvas" />` in the component's template, and the page is drawn into it.
+
+## <a name="key-exports">🧩 Key Exports</a>
 
-We highly recommend you take a look at the [documentation](https://github.com/Esposter/Esposter/tree/main/openspec/specs) to level up.
+| Export              | Kind       | Purpose                                                                                                       |
+| ------------------- | ---------- | ------------------------------------------------------------------------------------------------------------- |
+| `PdfRenderer`       | interface  | The renderer's API module, its data folder URLs and its worker, which the consumer supplies                   |
+| `PdfSource`         | type       | A document by its URL, its bytes, or a file the reader picked                                                 |
+| `PdfViewerState`    | interface  | The viewer's pages, zoom, rotation, search, download and print, as state and actions                          |
+| `readXfdf`          | function   | Reads the free-text annotations of an XFDF file, or an error naming what is wrong with it                     |
+| `usePdfAnnotations` | composable | The reader's comments and free-text annotations, exported to and imported from XFDF                           |
+| `usePdfDocument`    | composable | Loads a document from a source through the consumer's renderer, with its password prompt and failure as state |
+| `usePdfPage`        | composable | Draws one page of a loaded document into a canvas, at the canvas's width and the device's pixel ratio         |
+| `usePdfThumbnails`  | composable | One thumbnail per page, drawn only while its row is in view of the sidebar                                    |
+| `usePdfViewer`      | composable | Builds the renderer's viewer for a loaded document, with its pages, zoom and search as state                  |
+| `usePdfZoomGesture` | composable | Pinch and Ctrl-wheel zoom the viewer about the pointer, keeping the content under it in place                 |
+| `writeXfdf`         | function   | Writes free-text annotations as XFDF                                                                          |
 
 ## <a name="license">⚖️ License</a>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-pdfjs-headless",
-  "version": "4.3.1",
+  "version": "4.4.0",
   "description": "Headless Vue composables over pdfjs-dist: a document's loading, a page's drawing and the viewer's state, with no styling and no renderer of its own.",
   "keywords": [
     "headless",
@@ -43,20 +43,21 @@
     "lint": "eslint .",
     "lint:fix": "eslint --fix .",
     "test": "vitest",
-    "typecheck": "tsc"
+    "typecheck": "tsrs --fast"
   },
   "dependencies": {
-    "@esposter/shared": "4.3.1"
+    "@esposter/shared": "4.4.0",
+    "neverthrow": "^8.2.0"
   },
   "devDependencies": {
-    "@esposter/configuration": "4.3.1",
+    "@esposter/configuration": "4.4.0",
     "@vue/test-utils": "^2.5.1",
     "happy-dom": "^21.0.4",
-    "tsdown": "^0.23.1"
+    "tsdown": "0.23.2"
   },
   "peerDependencies": {
     "pdfjs-dist": "^6.4.299",
     "vue": "^3.5.44"
   },
-  "gitHead": "777a39636b789c13af33ed13370246ccf6dbaf31"
+  "gitHead": "e1a416c4b91da69cc2aa259b50a4d656f204d272"
 }

package/dist/index.d.ts

@@ -1,189 +0,0 @@
-import { ComputedRef, MaybeRefOrGetter, Ref, ShallowRef } from "vue";
-import * as PdfJs from "pdfjs-dist";
-import { PDFDocumentLoadingTask, PDFDocumentProxy, PageViewport } from "pdfjs-dist";
-import * as PdfJsViewer from "pdfjs-dist/web/pdf_viewer.mjs";
-import { PDFViewer } from "pdfjs-dist/web/pdf_viewer.mjs";
-//#region src/models/PdfApi.d.ts
-export type PdfApi = Pick<typeof PdfJs, "getDocument" | "GlobalWorkerOptions" | "PasswordResponses">;
-//#endregion
-//#region src/models/PdfDocumentParameters.d.ts
-export type PdfDocumentParameters = Partial<Parameters<PdfApi["getDocument"]>[0]>;
-//#endregion
-//#region src/models/PdfLoadingProgress.d.ts
-export interface PdfLoadingProgress {
-  loaded: number;
-  total: number;
-}
-//#endregion
-//#region src/models/PdfDocumentState.d.ts
-export interface PdfDocumentState {
-  isFailed: Ref<boolean>;
-  isPasswordRequested: Ref<boolean>;
-  isPasswordWrong: Ref<boolean>;
-  pdfDocument: ShallowRef<PDFDocumentProxy | undefined>;
-  progress: Ref<PdfLoadingProgress>;
-  submitPassword: (password: string) => void;
-}
-//#endregion
-//#region src/models/PdfRenderer.d.ts
-export interface PdfRenderer {
-  api: PdfApi;
-  cMapUrl: string;
-  standardFontDataUrl: string;
-  wasmUrl: string;
-  workerSrc: string;
-}
-//#endregion
-//#region src/models/PdfSource.d.ts
-export type PdfSource = File | string | Uint8Array;
-//#endregion
-//#region src/composables/usePdfDocument.d.ts
-interface UsePdfDocumentOptions {
-  parameters?: PdfDocumentParameters;
-  renderer: MaybeRefOrGetter<PdfRenderer | undefined>;
-  source: MaybeRefOrGetter<PdfSource | undefined>;
-}
-export declare const usePdfDocument: ({ parameters, renderer, source }: UsePdfDocumentOptions) => PdfDocumentState;
-//#endregion
-//#region src/composables/usePdfPage.d.ts
-interface UsePdfPageOptions {
-  canvas: MaybeRefOrGetter<HTMLCanvasElement | undefined>;
-  isVisible?: MaybeRefOrGetter<boolean>;
-  pageNumber: MaybeRefOrGetter<number>;
-  pdfDocument: MaybeRefOrGetter<PDFDocumentProxy | undefined>;
-}
-export declare const usePdfPage: ({ canvas, isVisible, pageNumber, pdfDocument }: UsePdfPageOptions) => void;
-//#endregion
-//#region src/models/PdfThumbnail.d.ts
-export interface PdfThumbnail {
-  canvas: ShallowRef<HTMLCanvasElement | undefined>;
-  isCurrent: ComputedRef<boolean>;
-  isVisible: Ref<boolean>;
-  pageNumber: number;
-}
-//#endregion
-//#region src/composables/usePdfThumbnails.d.ts
-interface UsePdfThumbnailsOptions {
-  currentPageNumber: MaybeRefOrGetter<number>;
-  pdfDocument: MaybeRefOrGetter<PDFDocumentProxy | undefined>;
-  root: MaybeRefOrGetter<HTMLElement | undefined>;
-}
-export declare const usePdfThumbnails: ({ currentPageNumber, pdfDocument, root }: UsePdfThumbnailsOptions) => ShallowRef<PdfThumbnail[]>;
-//#endregion
-//#region src/models/PdfViewerApi.d.ts
-export type PdfViewerApi = Pick<typeof PdfJsViewer, "EventBus" | "FindState" | "LinkTarget" | "PDFFindController" | "PDFLinkService" | "PDFViewer">;
-//#endregion
-//#region src/models/PdfMatchesCount.d.ts
-export interface PdfMatchesCount {
-  current: number;
-  total: number;
-}
-//#endregion
-//#region src/models/PdfOutline.d.ts
-export type PdfOutline = NonNullable<Awaited<ReturnType<PDFDocumentProxy["getOutline"]>>>;
-//#endregion
-//#region src/models/PdfPageOverlay.d.ts
-export interface PdfPageOverlay {
-  element: HTMLElement;
-  pageNumber: number;
-  viewport: PageViewport;
-}
-//#endregion
-//#region src/models/PdfViewerState.d.ts
-export interface PdfViewerState {
-  actualSize: () => void;
-  currentPageNumber: Ref<number>;
-  download: (filename: string) => void;
-  findNext: () => void;
-  findPrevious: () => void;
-  fitPage: () => void;
-  fitWidth: () => void;
-  followBookmark: (item: PdfOutline[number]) => void;
-  goToPage: (pageNumber: number) => void;
-  isFullscreen: Ref<boolean>;
-  isMatchCase: Ref<boolean>;
-  isNotFound: Ref<boolean>;
-  isWholeWord: Ref<boolean>;
-  isZoomInDisabled: ComputedRef<boolean>;
-  matchesCount: Ref<PdfMatchesCount>;
-  nextPage: () => void;
-  outline: ShallowRef<PdfOutline>;
-  overlays: ShallowRef<PdfPageOverlay[]>;
-  pagesCount: Ref<number>;
-  pagesRotation: Ref<number>;
-  previousPage: () => void;
-  print: () => void;
-  rotate: () => void;
-  scale: Ref<number>;
-  searchQuery: Ref<string>;
-  toggleFullscreen: () => void;
-  zoomIn: () => void;
-  zoomOut: () => void;
-}
-//#endregion
-//#region src/composables/usePdfViewer.d.ts
-interface UsePdfViewerOptions {
-  container: MaybeRefOrGetter<HTMLDivElement | undefined>;
-  highlightTerms?: MaybeRefOrGetter<string[]>;
-  pdfDocument: MaybeRefOrGetter<PDFDocumentProxy | undefined>;
-  viewer: MaybeRefOrGetter<HTMLDivElement | undefined>;
-  viewerApi: MaybeRefOrGetter<PdfViewerApi | undefined>;
-}
-export declare const usePdfViewer: ({ container, highlightTerms, pdfDocument, viewer, viewerApi }: UsePdfViewerOptions) => PdfViewerState;
-//#endregion
-//#region src/composables/usePdfZoomGesture.d.ts
-interface UsePdfZoomGestureOptions {
-  container: MaybeRefOrGetter<HTMLDivElement | undefined>;
-  getViewer: () => PDFViewer | undefined;
-}
-export declare const usePdfZoomGesture: ({ container, getViewer }: UsePdfZoomGestureOptions) => void;
-//#endregion
-//#region src/services/constants.d.ts
-export declare const PDF_MAX_CANVAS_AREA = 16777216;
-export declare const PDF_MIN_SCALE = .1;
-export declare const PDF_MAX_SCALE = 10;
-export declare const PDF_ROTATION_STEP = 90;
-export declare const PDF_FULL_TURN = 360;
-export declare const PDF_PRINT_SCALE = 2;
-export declare const PDF_PRINT_BATCH_SIZE = 10;
-export declare const PDF_PRINT_CLASS = "pdf-print";
-export declare const PDF_MIME_TYPE = "application/pdf";
-export declare const PDF_PRINT_STYLE: string;
-export declare const PDF_WHEEL_ZOOM_DIVISOR = 500;
-//#endregion
-//#region src/services/destroyLoadingTask.d.ts
-export declare const destroyLoadingTask: (task: PDFDocumentLoadingTask) => void;
-//#endregion
-//#region src/services/getCanvasScale.d.ts
-interface Props {
-  cssWidth: number;
-  pageHeight: number;
-  pageWidth: number;
-  pixelRatio: number;
-}
-export declare const getCanvasScale: ({ cssWidth, pageHeight, pageWidth, pixelRatio }: Props) => number;
-//#endregion
-//#region src/services/getSourceParameters.d.ts
-export declare const getSourceParameters: (source: PdfSource) => Promise<{
-  data: Uint8Array;
-} | {
-  url: string;
-}>;
-//#endregion
-//#region src/services/getZoomedScroll.d.ts
-export declare const getZoomedScroll: ({ point, ratio, scroll }: {
-  point: number;
-  ratio: number;
-  scroll: number;
-}) => number;
-//#endregion
-//#region src/services/loadPdfDocument.d.ts
-export declare const loadPdfDocument: (renderer: PdfRenderer, source: PdfSource, parameters: PdfDocumentParameters) => Promise<PDFDocumentLoadingTask>;
-//#endregion
-//#region src/services/renderPrintImage.d.ts
-export declare const renderPrintImage: (pdfDocument: PDFDocumentProxy, pageNumber: number) => Promise<HTMLImageElement>;
-//#endregion
-//#region src/services/renderPrintSheets.d.ts
-export declare const renderPrintSheets: (pdfDocument: PDFDocumentProxy, checkIsCancelled: () => boolean) => Promise<HTMLDivElement | undefined>;
-//#endregion
-export {};

package/dist/index.js

@@ -1,667 +0,0 @@
-import { downloadFile, getResultAsync, getSynchronizedFunction, noop } from "@esposter/shared";
-import { computed, effectScope, onScopeDispose, ref, shallowRef, toValue, watch } from "vue";
-//#region src/services/destroyLoadingTask.ts
-const destroyLoadingTask = getSynchronizedFunction(async (task) => {
-	await task.destroy();
-});
-//#endregion
-//#region src/services/getSourceParameters.ts
-const getSourceParameters = async (source) => {
-	if (typeof source === "string") return { url: source };
-	if (source instanceof File) return { data: new Uint8Array(await source.arrayBuffer()) };
-	return { data: new Uint8Array(source) };
-};
-//#endregion
-//#region src/services/loadPdfDocument.ts
-const loadPdfDocument = async (renderer, source, parameters) => {
-	renderer.api.GlobalWorkerOptions.workerSrc = renderer.workerSrc;
-	const sourceParameters = await getSourceParameters(source);
-	return renderer.api.getDocument({
-		cMapPacked: true,
-		cMapUrl: renderer.cMapUrl,
-		standardFontDataUrl: renderer.standardFontDataUrl,
-		wasmUrl: renderer.wasmUrl,
-		...parameters,
-		...sourceParameters
-	});
-};
-//#endregion
-//#region src/composables/usePdfDocument.ts
-const EMPTY_PROGRESS = {
-	loaded: 0,
-	total: 0
-};
-const usePdfDocument = ({ parameters = {}, renderer, source }) => {
-	const pdfDocument = shallowRef();
-	const progress = ref(EMPTY_PROGRESS);
-	const isFailed = ref(false);
-	const isPasswordRequested = ref(false);
-	const isPasswordWrong = ref(false);
-	let loadingTask;
-	let updatePassword;
-	let loadGeneration = 0;
-	const destroyCurrentTask = () => {
-		if (loadingTask) destroyLoadingTask(loadingTask);
-		loadingTask = void 0;
-	};
-	const release = () => {
-		loadGeneration++;
-		destroyCurrentTask();
-		pdfDocument.value = void 0;
-		progress.value = EMPTY_PROGRESS;
-		isFailed.value = false;
-		isPasswordRequested.value = false;
-		isPasswordWrong.value = false;
-	};
-	const load = async (currentRenderer, currentSource) => {
-		const generation = loadGeneration;
-		await getResultAsync(async () => {
-			const task = await loadPdfDocument(currentRenderer, currentSource, parameters);
-			if (generation !== loadGeneration) {
-				destroyLoadingTask(task);
-				return;
-			}
-			loadingTask = task;
-			task.onProgress = ({ loaded, total }) => {
-				if (generation === loadGeneration) progress.value = {
-					loaded,
-					total
-				};
-			};
-			task.onPassword = (passwordCallback, reason) => {
-				if (generation !== loadGeneration) return;
-				updatePassword = passwordCallback;
-				isPasswordWrong.value = reason === currentRenderer.api.PasswordResponses.INCORRECT_PASSWORD;
-				isPasswordRequested.value = true;
-			};
-			const loadedDocument = await task.promise;
-			if (generation === loadGeneration) pdfDocument.value = loadedDocument;
-		}).match(noop, (error) => {
-			if (generation !== loadGeneration) return;
-			isFailed.value = true;
-			destroyCurrentTask();
-			console.error(error);
-		});
-	};
-	const submitPassword = (password) => {
-		isPasswordRequested.value = false;
-		updatePassword?.(password);
-	};
-	watch([() => toValue(renderer), () => toValue(source)], getSynchronizedFunction(async ([currentRenderer, currentSource]) => {
-		release();
-		if (currentRenderer && currentSource) await load(currentRenderer, currentSource);
-	}), { immediate: true });
-	onScopeDispose(release);
-	return {
-		isFailed,
-		isPasswordRequested,
-		isPasswordWrong,
-		pdfDocument,
-		progress,
-		submitPassword
-	};
-};
-//#endregion
-//#region src/services/constants.ts
-const PDF_MAX_CANVAS_AREA = 16777216;
-const PDF_MIN_SCALE = .1;
-const PDF_MAX_SCALE = 10;
-const PDF_ROTATION_STEP = 90;
-const PDF_FULL_TURN = 360;
-const PDF_PRINT_SCALE = 2;
-const PDF_PRINT_BATCH_SIZE = 10;
-const PDF_PRINT_CLASS = "pdf-print";
-const PDF_MIME_TYPE = "application/pdf";
-const PDF_PRINT_STYLE = `@page { margin: 3mm } .${PDF_PRINT_CLASS} { display: none } .${PDF_PRINT_CLASS} img { display: block; page-break-after: always; width: 100% } @media print { .${PDF_PRINT_CLASS} { display: block } body > :not(.${PDF_PRINT_CLASS}) { display: none !important } }`;
-const PDF_WHEEL_ZOOM_DIVISOR = 500;
-//#endregion
-//#region src/services/getCanvasScale.ts
-const getCanvasScale = ({ cssWidth, pageHeight, pageWidth, pixelRatio }) => {
-	const scale = cssWidth / pageWidth * pixelRatio;
-	if (pageWidth * pageHeight * scale ** 2 <= 16777216) return scale;
-	return Math.sqrt(PDF_MAX_CANVAS_AREA / (pageWidth * pageHeight));
-};
-//#endregion
-//#region src/composables/usePdfPage.ts
-const usePdfPage = ({ canvas, isVisible = true, pageNumber, pdfDocument }) => {
-	let cssWidth = 0;
-	let loadGeneration = 0;
-	let page;
-	let renderTask;
-	const awaitRender = getSynchronizedFunction(async (task) => {
-		await getResultAsync(() => task.promise).match(noop, (error) => {
-			if (task === renderTask) console.error(error);
-		});
-	});
-	const cancelRender = () => {
-		renderTask?.cancel();
-		renderTask = void 0;
-	};
-	const drawPage = () => {
-		const currentCanvas = toValue(canvas);
-		if (!page || !currentCanvas || cssWidth === 0 || !toValue(isVisible)) return;
-		cancelRender();
-		const { height, width } = page.getViewport({ scale: 1 });
-		const viewport = page.getViewport({ scale: getCanvasScale({
-			cssWidth,
-			pageHeight: height,
-			pageWidth: width,
-			pixelRatio: window.devicePixelRatio
-		}) });
-		currentCanvas.width = viewport.width;
-		currentCanvas.height = viewport.height;
-		const task = page.render({
-			canvas: currentCanvas,
-			viewport
-		});
-		renderTask = task;
-		awaitRender(task);
-	};
-	watch([() => toValue(pdfDocument), () => toValue(pageNumber)], getSynchronizedFunction(async ([currentDocument, currentPageNumber]) => {
-		const generation = ++loadGeneration;
-		cancelRender();
-		page = void 0;
-		if (!currentDocument) return;
-		await getResultAsync(async () => {
-			const loadedPage = await currentDocument.getPage(currentPageNumber);
-			if (generation !== loadGeneration) return;
-			page = loadedPage;
-			drawPage();
-		}).match(noop, (error) => {
-			if (generation === loadGeneration) console.error(error);
-		});
-	}), { immediate: true });
-	watch(() => toValue(canvas), (currentCanvas, _previousCanvas, onCleanup) => {
-		if (!currentCanvas) {
-			cancelRender();
-			return;
-		}
-		cssWidth = 0;
-		const observer = new ResizeObserver((entries) => {
-			const width = entries[0]?.contentRect.width ?? 0;
-			if (width === cssWidth) return;
-			cssWidth = width;
-			drawPage();
-		});
-		observer.observe(currentCanvas);
-		onCleanup(() => {
-			observer.disconnect();
-		});
-	}, { immediate: true });
-	watch(() => toValue(isVisible), (visible) => {
-		if (visible) drawPage();
-	});
-	onScopeDispose(() => {
-		loadGeneration++;
-		cancelRender();
-	});
-};
-//#endregion
-//#region src/composables/usePdfThumbnails.ts
-const usePdfThumbnails = ({ currentPageNumber, pdfDocument, root }) => {
-	const thumbnails = shallowRef([]);
-	const rows = /* @__PURE__ */ new Map();
-	let observer;
-	let scope;
-	const createThumbnail = (pageNumber, currentDocument, currentObserver) => {
-		const canvas = shallowRef();
-		const isVisible = ref(false);
-		const thumbnail = {
-			canvas,
-			isCurrent: computed(() => toValue(currentPageNumber) === pageNumber),
-			isVisible,
-			pageNumber
-		};
-		usePdfPage({
-			canvas: () => canvas.value,
-			isVisible: () => isVisible.value,
-			pageNumber,
-			pdfDocument: currentDocument
-		});
-		watch(canvas, (element, _previousElement, onCleanup) => {
-			if (!element) return;
-			rows.set(element, thumbnail);
-			currentObserver.observe(element);
-			onCleanup(() => {
-				currentObserver.unobserve(element);
-				rows.delete(element);
-			});
-		});
-		return thumbnail;
-	};
-	const disposeThumbnails = () => {
-		scope?.stop();
-		observer?.disconnect();
-	};
-	watch(() => toValue(pdfDocument), (loaded) => {
-		disposeThumbnails();
-		rows.clear();
-		thumbnails.value = [];
-		if (!loaded) return;
-		const currentObserver = new IntersectionObserver((entries) => {
-			for (const entry of entries) {
-				const row = rows.get(entry.target);
-				if (row) row.isVisible.value = entry.isIntersecting;
-			}
-		}, { root: toValue(root) ?? null });
-		observer = currentObserver;
-		scope = effectScope();
-		thumbnails.value = scope.run(() => Array.from({ length: loaded.numPages }, (_value, index) => createThumbnail(index + 1, loaded, currentObserver))) ?? [];
-	}, { immediate: true });
-	onScopeDispose(disposeThumbnails);
-	return thumbnails;
-};
-//#endregion
-//#region src/services/getZoomedScroll.ts
-const getZoomedScroll = ({ point, ratio, scroll }) => (scroll + point) * ratio - point;
-//#endregion
-//#region src/composables/usePdfZoomGesture.ts
-const usePdfZoomGesture = ({ container, getViewer }) => {
-	const abortController = new AbortController();
-	const pointers = /* @__PURE__ */ new Map();
-	let pinchDistance = 0;
-	const measurePinch = () => {
-		const [first, second] = [...pointers.values()];
-		if (pointers.size !== 2 || !first || !second) return void 0;
-		return {
-			distance: Math.hypot(second.x - first.x, second.y - first.y),
-			point: {
-				x: (first.x + second.x) / 2,
-				y: (first.y + second.y) / 2
-			}
-		};
-	};
-	const measurePinchDistance = () => measurePinch()?.distance ?? 0;
-	const zoomAbout = (ratio, point) => {
-		const viewer = getViewer();
-		const element = toValue(container);
-		if (!viewer || !element) return;
-		const { currentScale } = viewer;
-		const nextScale = Math.min(Math.max(currentScale * ratio, PDF_MIN_SCALE), 10);
-		const scaleRatio = nextScale / currentScale;
-		const { left, top } = element.getBoundingClientRect();
-		const { scrollLeft, scrollTop } = element;
-		viewer.currentScale = nextScale;
-		element.scrollLeft = getZoomedScroll({
-			point: point.x - left,
-			ratio: scaleRatio,
-			scroll: scrollLeft
-		});
-		element.scrollTop = getZoomedScroll({
-			point: point.y - top,
-			ratio: scaleRatio,
-			scroll: scrollTop
-		});
-	};
-	const onPointerDown = (event) => {
-		pointers.set(event.pointerId, {
-			x: event.clientX,
-			y: event.clientY
-		});
-		pinchDistance = measurePinchDistance();
-	};
-	const onPointerMove = (event) => {
-		if (!pointers.has(event.pointerId)) return;
-		pointers.set(event.pointerId, {
-			x: event.clientX,
-			y: event.clientY
-		});
-		const pinch = measurePinch();
-		if (pinch && pinchDistance > 0) zoomAbout(pinch.distance / pinchDistance, pinch.point);
-		pinchDistance = pinch?.distance ?? 0;
-	};
-	const onPointerEnd = (event) => {
-		pointers.delete(event.pointerId);
-		pinchDistance = measurePinchDistance();
-	};
-	const onWheel = (event) => {
-		if (!event.ctrlKey) return;
-		event.preventDefault();
-		zoomAbout(Math.exp(-event.deltaY / 500), {
-			x: event.clientX,
-			y: event.clientY
-		});
-	};
-	watch(() => toValue(container), (element) => {
-		if (!element) return;
-		const { signal } = abortController;
-		element.addEventListener("pointerdown", (event) => {
-			onPointerDown(event);
-		}, { signal });
-		element.addEventListener("pointermove", (event) => {
-			onPointerMove(event);
-		}, { signal });
-		element.addEventListener("pointerup", (event) => {
-			onPointerEnd(event);
-		}, { signal });
-		element.addEventListener("pointercancel", (event) => {
-			onPointerEnd(event);
-		}, { signal });
-		element.addEventListener("pointerleave", (event) => {
-			onPointerEnd(event);
-		}, { signal });
-		element.addEventListener("wheel", (event) => {
-			onWheel(event);
-		}, {
-			passive: false,
-			signal
-		});
-	}, { immediate: true });
-	onScopeDispose(() => {
-		abortController.abort();
-	});
-};
-//#endregion
-//#region src/services/renderPrintImage.ts
-const renderPrintImage = async (pdfDocument, pageNumber) => {
-	const page = await pdfDocument.getPage(pageNumber);
-	const { height, width } = page.getViewport({ scale: 1 });
-	const printScale = getCanvasScale({
-		cssWidth: width,
-		pageHeight: height,
-		pageWidth: width,
-		pixelRatio: 2
-	});
-	const viewport = page.getViewport({ scale: printScale });
-	const canvas = window.document.createElement("canvas");
-	canvas.width = viewport.width;
-	canvas.height = viewport.height;
-	await page.render({
-		canvas,
-		viewport
-	}).promise;
-	const image = window.document.createElement("img");
-	image.src = canvas.toDataURL("image/png");
-	return image;
-};
-//#endregion
-//#region src/services/renderPrintSheets.ts
-const renderPrintSheets = async (pdfDocument, checkIsCancelled) => {
-	const style = window.document.createElement("style");
-	style.textContent = PDF_PRINT_STYLE;
-	const printRoot = window.document.createElement("div");
-	printRoot.className = PDF_PRINT_CLASS;
-	printRoot.append(style);
-	const renderBatch = async (firstPageNumber) => {
-		if (checkIsCancelled() || firstPageNumber > pdfDocument.numPages) return;
-		const lastPageNumber = Math.min(firstPageNumber + 10 - 1, pdfDocument.numPages);
-		const pageNumbers = Array.from({ length: lastPageNumber - firstPageNumber + 1 }, (_value, index) => firstPageNumber + index);
-		printRoot.append(...await Promise.all(pageNumbers.map((pageNumber) => renderPrintImage(pdfDocument, pageNumber))));
-		await renderBatch(lastPageNumber + 1);
-	};
-	await renderBatch(1);
-	return checkIsCancelled() ? void 0 : printRoot;
-};
-//#endregion
-//#region src/composables/usePdfViewer.ts
-const usePdfViewer = ({ container, highlightTerms = [], pdfDocument, viewer, viewerApi }) => {
-	const currentPageNumber = ref(0);
-	const isFullscreen = ref(false);
-	const isMatchCase = ref(false);
-	const isNotFound = ref(false);
-	const isWholeWord = ref(false);
-	const matchesCount = ref({
-		current: 0,
-		total: 0
-	});
-	const outline = shallowRef([]);
-	const overlays = shallowRef([]);
-	const pagesCount = ref(0);
-	const pagesRotation = ref(0);
-	const scale = ref(0);
-	const searchQuery = ref("");
-	const isZoomInDisabled = computed(() => scale.value >= 10);
-	let abortController;
-	let containerElement;
-	let eventBus;
-	let linkService;
-	let pdfViewer;
-	let resizeObserver;
-	let printRoot;
-	let printGeneration = 0;
-	const onFullscreenChange = () => {
-		isFullscreen.value = window.document.fullscreenElement === containerElement;
-	};
-	const createViewer = (currentViewerApi, containerValue, viewerElement) => {
-		const { EventBus, FindState, LinkTarget, PDFFindController, PDFLinkService, PDFViewer } = currentViewerApi;
-		const bus = new EventBus();
-		const links = new PDFLinkService({
-			eventBus: bus,
-			externalLinkTarget: LinkTarget.BLANK
-		});
-		const controller = new PDFFindController({
-			eventBus: bus,
-			linkService: links
-		});
-		const viewerAbortController = new AbortController();
-		const { signal } = viewerAbortController;
-		const instance = new PDFViewer({
-			abortSignal: signal,
-			container: containerValue,
-			eventBus: bus,
-			findController: controller,
-			linkService: links,
-			maxCanvasPixels: PDF_MAX_CANVAS_AREA,
-			viewer: viewerElement
-		});
-		links.setViewer(instance);
-		abortController = viewerAbortController;
-		containerElement = containerValue;
-		eventBus = bus;
-		linkService = links;
-		pdfViewer = instance;
-		bus.on("pagesinit", () => {
-			instance.currentScaleValue = "auto";
-		});
-		bus.on("pagechanging", (event) => {
-			currentPageNumber.value = event.pageNumber;
-		});
-		bus.on("pagerendered", (event) => {
-			const overlay = {
-				element: event.source.div,
-				pageNumber: event.pageNumber,
-				viewport: event.source.viewport
-			};
-			overlays.value = [...overlays.value.filter(({ pageNumber }) => pageNumber !== event.pageNumber), overlay];
-		});
-		bus.on("scalechanging", (event) => {
-			scale.value = event.scale;
-		});
-		bus.on("rotationchanging", (event) => {
-			pagesRotation.value = event.pagesRotation;
-		});
-		bus.on("updatefindcontrolstate", (event) => {
-			isNotFound.value = event.state === FindState.NOT_FOUND;
-			matchesCount.value = event.matchesCount;
-		});
-		bus.on("updatefindmatchescount", (event) => {
-			matchesCount.value = event.matchesCount;
-		});
-		resizeObserver = new ResizeObserver(() => {
-			if (!pdfViewer) return;
-			const { currentScaleValue } = pdfViewer;
-			if (currentScaleValue) pdfViewer.currentScaleValue = currentScaleValue;
-		});
-		resizeObserver.observe(containerValue);
-		window.document.addEventListener("fullscreenchange", () => {
-			onFullscreenChange();
-		}, { signal });
-		window.addEventListener("afterprint", () => {
-			removePrint();
-		}, { signal });
-		applyDocument(toValue(pdfDocument));
-	};
-	const loadOutline = getSynchronizedFunction(async (loaded) => {
-		await getResultAsync(async () => {
-			const items = await loaded.getOutline();
-			if (loaded === toValue(pdfDocument)) outline.value = items ?? [];
-		}).match(noop, console.error);
-	});
-	const applyDocument = (loaded) => {
-		if (!pdfViewer || !linkService) return;
-		pagesCount.value = loaded?.numPages ?? 0;
-		overlays.value = [];
-		outline.value = [];
-		pdfViewer.setDocument(loaded ?? null);
-		linkService.setDocument(loaded ?? null);
-		currentPageNumber.value = 1;
-		pagesRotation.value = 0;
-		matchesCount.value = {
-			current: 0,
-			total: 0
-		};
-		isNotFound.value = false;
-		if (!loaded) return;
-		loadOutline(loaded);
-		const terms = toValue(highlightTerms);
-		if (terms.length > 0) findText({ query: terms });
-	};
-	const findText = ({ isPrevious = false, query, type = "" }) => {
-		eventBus?.dispatch("find", {
-			caseSensitive: isMatchCase.value,
-			entireWord: isWholeWord.value,
-			findPrevious: isPrevious,
-			highlightAll: true,
-			matchDiacritics: false,
-			query,
-			type
-		});
-	};
-	const removePrint = () => {
-		printGeneration++;
-		printRoot?.remove();
-		printRoot = void 0;
-	};
-	const followBookmark = (item) => {
-		if (item.dest) linkService?.goToDestination(item.dest);
-	};
-	const goToPage = (pageNumber) => {
-		if (pdfViewer && Number.isInteger(pageNumber) && pageNumber >= 1 && pageNumber <= pagesCount.value) pdfViewer.currentPageNumber = pageNumber;
-	};
-	const previousPage = () => {
-		pdfViewer?.previousPage();
-	};
-	const nextPage = () => {
-		pdfViewer?.nextPage();
-	};
-	const zoomIn = () => {
-		pdfViewer?.increaseScale();
-	};
-	const zoomOut = () => {
-		pdfViewer?.decreaseScale();
-	};
-	const fitWidth = () => {
-		if (pdfViewer) pdfViewer.currentScaleValue = "page-width";
-	};
-	const fitPage = () => {
-		if (pdfViewer) pdfViewer.currentScaleValue = "page-fit";
-	};
-	const actualSize = () => {
-		if (pdfViewer) pdfViewer.currentScaleValue = "page-actual";
-	};
-	const rotate = () => {
-		if (pdfViewer) pdfViewer.pagesRotation = (pdfViewer.pagesRotation + 90) % 360;
-	};
-	const findNext = () => {
-		findText({
-			query: searchQuery.value,
-			type: "again"
-		});
-	};
-	const findPrevious = () => {
-		findText({
-			isPrevious: true,
-			query: searchQuery.value,
-			type: "again"
-		});
-	};
-	const toggleFullscreen = getSynchronizedFunction(async () => {
-		const element = containerElement;
-		if (!element) return;
-		await getResultAsync(async () => {
-			if (window.document.fullscreenElement) await window.document.exitFullscreen();
-			else await element.requestFullscreen();
-		}).match(noop, console.error);
-	});
-	const download = getSynchronizedFunction(async (filename) => {
-		const downloaded = toValue(pdfDocument);
-		if (!downloaded) return;
-		await getResultAsync(async () => {
-			downloadFile(filename, new Uint8Array(await downloaded.getData()), PDF_MIME_TYPE);
-		}).match(noop, console.error);
-	});
-	const print = getSynchronizedFunction(async () => {
-		const printed = toValue(pdfDocument);
-		if (!printed) return;
-		removePrint();
-		const generation = printGeneration;
-		await getResultAsync(async () => {
-			const sheets = await renderPrintSheets(printed, () => generation !== printGeneration);
-			if (!sheets) return;
-			window.document.body.append(sheets);
-			printRoot = sheets;
-			window.print();
-		}).match(noop, console.error);
-	});
-	usePdfZoomGesture({
-		container,
-		getViewer: () => pdfViewer
-	});
-	watch([
-		() => toValue(viewerApi),
-		() => toValue(container),
-		() => toValue(viewer)
-	], ([currentViewerApi, containerElementValue, viewerElement]) => {
-		if (pdfViewer || !currentViewerApi || !containerElementValue || !viewerElement) return;
-		createViewer(currentViewerApi, containerElementValue, viewerElement);
-	}, { immediate: true });
-	watch(() => toValue(pdfDocument), (loaded) => {
-		applyDocument(loaded);
-	});
-	watch([
-		searchQuery,
-		isMatchCase,
-		isWholeWord
-	], () => {
-		findText({ query: searchQuery.value });
-	});
-	onScopeDispose(() => {
-		removePrint();
-		if (!pdfViewer) return;
-		pdfViewer.setDocument(null);
-		abortController?.abort();
-		resizeObserver?.disconnect();
-	});
-	return {
-		actualSize,
-		currentPageNumber,
-		download,
-		findNext,
-		findPrevious,
-		fitPage,
-		fitWidth,
-		followBookmark,
-		goToPage,
-		isFullscreen,
-		isMatchCase,
-		isNotFound,
-		isWholeWord,
-		isZoomInDisabled,
-		matchesCount,
-		nextPage,
-		outline,
-		overlays,
-		pagesCount,
-		pagesRotation,
-		previousPage,
-		print,
-		rotate,
-		scale,
-		searchQuery,
-		toggleFullscreen,
-		zoomIn,
-		zoomOut
-	};
-};
-//#endregion
-export { PDF_FULL_TURN, PDF_MAX_CANVAS_AREA, PDF_MAX_SCALE, PDF_MIME_TYPE, PDF_MIN_SCALE, PDF_PRINT_BATCH_SIZE, PDF_PRINT_CLASS, PDF_PRINT_SCALE, PDF_PRINT_STYLE, PDF_ROTATION_STEP, PDF_WHEEL_ZOOM_DIVISOR, destroyLoadingTask, getCanvasScale, getSourceParameters, getZoomedScroll, loadPdfDocument, renderPrintImage, renderPrintSheets, usePdfDocument, usePdfPage, usePdfThumbnails, usePdfViewer, usePdfZoomGesture };