feat: add support to options

lib/Page.tsx

@@ -9,14 +9,15 @@ import { useViewerContext } from "@/hooks/useViewerContext"
 import type { PageProps } from "@/types"
 
 import UltimateReactPdfError from "./components/UltimateReactPdfError"
+import { isWindowDefined } from "./utils"
 
 export function Page({
 	className,
 	controls = false,
 	initialPage = 1,
 	annotations = true,
 	pageRef,
-	viewPortScale = typeof window !== "undefined" ? window.devicePixelRatio : 1,
+	viewPortScale = isWindowDefined ? window.devicePixelRatio : 1,
 	onPageChange,
 	onPageError,
 	onPageLoad,
@@ -81,7 +82,8 @@ export function Page({
 		viewPortScale,
 	])
 
-	if (!pdf) return null
+	if (!pdf && status === STATUS.LOADING) return <LoadingStatus />
+	if (!pdf && status === STATUS.ERROR) return <ErrorStatus />
 
 	return (
 		<div className="pdf-viewer__container">
@@ -93,9 +95,6 @@ export function Page({
 				/>
 			)}
 
-			{status === STATUS.LOADING && <LoadingStatus />}
-			{status === STATUS.ERROR && <ErrorStatus />}
-
 			<div
 				ref={pageRef}
 				className={

lib/contexts/ViewerContext.tsx

@@ -1,13 +1,15 @@
 import {
 	getDocument,
 	GlobalWorkerOptions,
+	type PDFDocumentLoadingTask,
 	type PDFDocumentProxy,
 } from "pdfjs-dist"
 import { createContext, useEffect, useRef, useState } from "react"
 
 import UltimateReactPdfError from "@/components/UltimateReactPdfError"
 import { STATUS } from "@/constants"
 import type { Status, ViewerContextProps, ViewerProviderProps } from "@/types"
+import { isValidUrl, isWindowDefined } from "@/utils"
 
 import workerContent from "./build/pdf.worker.min.mjs.json"
 
@@ -27,20 +29,48 @@ export const PdfViewerProvider = ({
 	onDocumentError,
 	onDocumentLoad,
 	messages,
+	options = {},
 }: ViewerProviderProps) => {
 	const [status, setStatus] = useState<Status>(STATUS.LOADING)
 	const [pdf, setPdf] = useState<PDFDocumentProxy>()
 
-	const isTaskInProgress = useRef(false)
+	const isTaskInProgress = useRef<PDFDocumentLoadingTask>()
 
 	useEffect(() => {
 		if (pdf || isTaskInProgress.current) return
 
 		const loadDocument = async () => {
 			try {
-				isTaskInProgress.current = true
+				if (typeof src === "string") {
+					if (isValidUrl(src)) {
+						isTaskInProgress.current = getDocument({
+							url: src,
+							verbosity: 0,
+							...options,
+						})
+					}
 
-				const pdfLoaded = await getDocument(src).promise
+					if (!isValidUrl(src)) {
+						isTaskInProgress.current = getDocument({
+							data: isWindowDefined ? window.atob(src) : src,
+							verbosity: 0,
+							...options,
+						})
+					}
+				}
+
+				if (src instanceof URL) {
+					isTaskInProgress.current = getDocument({
+						url: src,
+						verbosity: 0,
+						...options,
+					})
+				}
+
+				if (!isTaskInProgress.current)
+					throw new UltimateReactPdfError("Unsupported source")
+
+				const pdfLoaded = await isTaskInProgress.current.promise
 
 				onDocumentLoad && onDocumentLoad(pdfLoaded)
 
@@ -52,13 +82,11 @@ export const PdfViewerProvider = ({
 				setStatus(STATUS.ERROR)
 
 				throw error
-			} finally {
-				isTaskInProgress.current = false
 			}
 		}
 
 		loadDocument()
-	}, [src, pdf, onDocumentError, onDocumentLoad])
+	}, [src, pdf, onDocumentError, onDocumentLoad, options])
 
 	return (
 		<ViewerContext.Provider

lib/types.ts

@@ -1,5 +1,8 @@
 import type { getDocument, PDFDocumentProxy, PDFPageProxy } from "pdfjs-dist"
-import type { RefProxy } from "pdfjs-dist/types/src/display/api"
+import type {
+	DocumentInitParameters,
+	RefProxy,
+} from "pdfjs-dist/types/src/display/api"
 import type { ComponentProps, RefObject } from "react"
 
 import type { STATUS } from "@/constants"
@@ -23,6 +26,7 @@ export interface ViewerProviderProps
 		| "externalLinkTarget"
 		| "externalLinkRel"
 		| "messages"
+		| "options"
 	> {
 	children: React.ReactNode
 }
@@ -46,6 +50,7 @@ export interface DocumentProps {
 	onDocumentError?: (error: unknown) => void
 	onDocumentLoad?: (document: PDFDocumentProxy | undefined) => void
 	messages?: Messages
+	options?: Omit<DocumentInitParameters, "url" | "data" | "verbosity">
 }
 
 export interface PageCommonProps {

lib/utils.ts

@@ -0,0 +1,15 @@
+export const isWindowDefined = typeof window !== "undefined"
+
+export const isValidUrl = (url: string) => {
+	if (URL.canParse !== undefined) {
+		return URL.canParse(url)
+	}
+
+	// Fallback for older browsers versions
+	try {
+		new URL(url)
+		return true
+	} catch {
+		return false
+	}
+}

src/main.tsx

@@ -10,7 +10,7 @@ import { examplePdf } from "./example"
 
 ReactDOM.createRoot(document.getElementById("root")!).render(
 	<StrictMode>
-		<Document src={{ data: atob(examplePdf) }}>
+		<Document src={examplePdf}>
 			<Page controls />
 		</Document>
 	</StrictMode>