A React component to view a PDF document. Written in TypeScript and powered by React hooks completely.
Key Features:
- Support password protected document
- Zooming: Support custom levels such as actual size, page fit, and page width
- Navigation between pages
- Can go to the first and last pages quickly
- Search for text
- Preview page thumbnails
- View and navigate the table of contents
- List and download attachments
- Rotating
- Text selection and hand tool modes
- Different scrolling modes
- Full screen mode
- Can open a file from local. Users can drag and drop a local file to view it
- Download file
- View the document properties
- Support SSR
- Custom toolbar
- Multi languages
Install & Import:
# NPM $ npm i pdfjs-dist @phuocng/react-pdf-viewer --save
import Viewer, { Worker } from '@phuocng/react-pdf-viewer'; import '@phuocng/react-pdf-viewer/cjs/react-pdf-viewer.css';
Basic Usage:
<Worker workerUrl="https://unpkg.com/[email protected]/build/pdf.worker.min.js"> <div style={{ height: '750px' }}> <Viewer fileUrl="/path/to/document.pdf" /> </div> </Worker>
Preview:
Download Details:
Author: react-pdf-viewer
Live Demo: View The Demo
Download Link: Download The Source Code
Official Website: https://github.com/react-pdf-viewer/react-pdf-viewer
License: MIT