Skip to components

DEVELOPER REFERENCE · v4.0.0

PdfViewer API

Props, callbacks and methods. Select an underlined type to explore its fields, allowed values and callback arguments.

View pdf viewer examples →

PdfViewer14 props5 callbacks15 methods

Props14

PdfViewer props
Name	Type	Description
`className`Optional	`string \| undefined`	Additional CSS classes applied to the component root.
`height`Optional	`string \| number \| undefined`	Viewer height as a CSS length or a number in pixels.
`text`Optional	`Partial<PdfViewerText>`Inspect type	Overrides any of the default PDF viewer labels; unspecified labels keep their defaults.
`toolbar`Optional	`PdfViewerToolbarConfig \| undefined`Inspect type	Omit for all tools, false for no toolbar, or choose individual groups.
`showHeader`Optional	`boolean \| undefined`	Hide the filename/page summary header.
`renderToolbar`Optional	`((controller: PdfViewerController, state: Readonly<PdfViewerState>, toolbarProps: PdfViewerToolbarProps) => ComponentChildren) \| undefined`Inspect type	Replaces the toolbar using the controller, current state and default toolbar props supplied to the callback.
`renderStatus`Optional	`((state: Readonly<PdfViewerState>) => ComponentChildren) \| undefined`Inspect type	Replaces loading, empty and error status content using the current viewer state.
`workerSrc`Required	`string`	URL of the matching pdfjs-dist/build/pdf.worker.min.mjs, served by your app.
`l10n`Optional	`L10n \| undefined`Inspect type	PDF.js localization service for page accessibility and annotation content.
`source`Optional	`PdfSource \| null \| undefined`Inspect type	PDF URL, Uint8Array, ArrayBuffer or Blob. null or an omitted source shows the empty viewer.
`fileName`Optional	`string \| undefined`	Display/download filename override for the document.
`initialPage`Optional	`number \| undefined`	Initial one-based page number, default 1; clamped to the available pages.
`initialZoom`Optional	`PdfZoom \| undefined`Inspect type	Initial zoom, default page-width. Use a numeric scale from 0.25 to 5 (1 = 100%), page-width or page-fit.
`documentOptions`Optional	`Omit<DocumentInitParameters, "data" \| "url" \| "worker"> \| undefined`Inspect type	Asset URLs, authentication, password and other PDF.js loading options.

Events and callbacks5

PdfViewer events and callbacks
Name	Type	Description
`onReady`Optional	`((controller: PdfViewerController) => void) \| undefined`Inspect type	Receives the viewer controller so your application can navigate, zoom, search, print or download.
`onLoad`Optional	`((details: { pageCount: number; fileName: string; }) => void) \| undefined`Inspect type	Receives pageCount and fileName when a document has loaded.
`onPageChange`Optional	`((page: number) => void) \| undefined`Inspect type	Receives the current one-based page number when it changes.
`onZoomChange`Optional	`((zoom: PdfZoom, scale: number) => void) \| undefined`Inspect type	Receives the selected zoom mode/value and the resolved numeric scale.
`onError`Optional	`((error: Error) => void) \| undefined`Inspect type	Receives document loading, worker or viewer operation errors.

Methods15

PdfViewer methods
Name	Signature	Description
`PdfViewerController.setPrintTitle`	`(title: string) => void`Inspect type	Update translated print-frame accessibility text without reloading the PDF. Available through `renderToolbar callback`.
`PdfViewerController.retry`	`() => Promise<void>`Inspect type	Retries loading the last source after an error. Available through `renderToolbar callback`.
`PdfViewerController.setCallbacks`	`(callbacks: Pick<PdfViewerOptions, "onLoad" \| "onError" \| "onPageChange" \| "onZoomChange">) => void`Inspect type	Update event handlers without recreating the document or its worker. Available through `renderToolbar callback`.
`PdfViewerController.subscribe`	`(listener: (state: Readonly<PdfViewerState>) => void) => () => void`Inspect type	Subscribes to viewer state changes; returns an unsubscribe function. Available through `renderToolbar callback`.
`PdfViewerController.attach`	`(container: HTMLDivElement) => Promise<void>`Inspect type	Initializes the viewer in its container before loading a document. Available through `renderToolbar callback`.
`PdfViewerController.load`	`(source: PdfSource \| null, fileName?: string) => Promise<void>`Inspect type	The latest source wins. Empty/null clears the document. Failures are exposed in snapshot/onError. Available through `renderToolbar callback`.
`PdfViewerController.goToPage`	`(page: number) => void`Inspect type	Navigates to a one-based page number, clamped to the document page count. Available through `renderToolbar callback`.
`PdfViewerController.setZoom`	`(zoom: PdfZoom) => void`Inspect type	Applies a numeric scale or page-width/page-fit mode when a document is ready. Available through `renderToolbar callback`.
`PdfViewerController.rotate`	`() => void`Inspect type	Rotates all pages clockwise by 90 degrees. Available through `renderToolbar callback`.
`PdfViewerController.search`	`(query: string, previous?: boolean, again?: boolean) => void`Inspect type	Searches the document; previous selects search direction and again continues to the next match. Available through `renderToolbar callback`.
`PdfViewerController.clearSearch`	`() => void`Inspect type	Closes the search state and removes match highlighting. Available through `renderToolbar callback`.
`PdfViewerController.download`	`() => Promise<void>`Inspect type	Downloads the currently loaded PDF. Available through `renderToolbar callback`.
`PdfViewerController.print`	`() => Promise<void>`Inspect type	Prepares and opens the print view for the loaded PDF. Available through `renderToolbar callback`.
`PdfViewerController.cancelPrint`	`() => void`Inspect type	Cancels an in-progress print preparation. Available through `renderToolbar callback`.
`PdfViewerController.destroy`	`() => void`Inspect type	Releases the document, worker, listeners and viewer resources. Available through `renderToolbar callback`.