Getting started

0.x, experimental

The API may change in any minor release until 1.0. The changelog says what each release changes.

Install

npm

npm install parapdf

pnpm

pnpm add parapdf

yarn

yarn add parapdf

ParaPDF needs React 19.2 or later. It depends on pdfjs-dist 6.4.299 exactly, because it ships that version’s worker and files.

Show a PDF

import { PdfDocument, PdfViewport } from "parapdf";

export function App() {
  return (
    <PdfDocument source="/manual.pdf">
      <PdfViewport style={{ height: "100vh" }} />
    </PdfDocument>
  );
}

LaTeX2e for authors, The LaTeX Project (license).

• PdfViewport is the scroll container. Give it a definite height, as above or through a flex or grid layout: it contains its own layout and does not grow with the document.
• The first PdfDocument to render loads pdf.js and starts its worker, and each one starts downloading its PDF while it renders, from the page’s head when the page is rendered on the server. pdf.js takes the preloaded response, so the PDF downloads once (Safari is not verified yet).
• This works as it is with bundlers that emit files referenced with new URL(…, import.meta.url), such as Vite, webpack, Rsbuild, and Next.js: see Bundlers for the others.

A source can also be { url, httpHeaders, withCredentials } or { data } with the PDF’s bytes: see Sources.

Next

Controls and stateBuild a toolbar with the viewer's hooks.

Scroll modes and spreadsArrange pages in rows, side by side, or one at a time.

SearchFind text in the whole document.

OptionsEverything PdfDocument takes.