Print plugin

The `print` plugin provides a button to print the current PDF document. It is possible to customize the button as well.

Install

npm install '@react-pdf-viewer/print';

The `print` plugin is included in the toolbar and default-layout plugins

1. Import the plugin and styles

import { printPlugin } from '@react-pdf-viewer/print';

// Import styles
import '@react-pdf-viewer/print/lib/styles/index.css';

2. Create the plugin instance

const printPluginInstance = printPlugin(props?: PrintPluginProps);

The `printPlugin()` function takes an optional `PrintPluginProps` parameter that consists of the following property:

(? denotes an optional property)

Property	Type	Description	From
`enableShortcuts`?	`boolean`	Enable shortcuts	2.6.0
`renderProgressBar`	`Function`	Customize the progress bar when preparing pages to print. See this example	3.6.0
`setPages`?	`Function`	Set target pages that will be printed. See this example	3.6.0

By default, the shortcut is enabled. Users can press `ctrl` + `P` to print the current document.

The plugin instance `printPluginInstance` provides the following properties:

Property	Type	Description	From
`print`	`Function`	Print the current document. See this example	3.6.0
`Print`	`ReactElement`	Customizable print button	2.0.0
`PrintButton`	`ReactElement`	The default print button	2.0.0
`PrintMenuItem`	`ReactElement`	The default print menu item	2.5.0

3. Register the plugin

<Viewer plugins={[printPluginInstance]} />

The `print` plugin provides other useful property as following:

import { PrintIcon } from '@react-pdf-viewer/print';

Property	Type	Description	From
`PrintIcon`	`ReactElement`	The print icon	2.0.0

v3.6.0

v2.10.0

v2.7.0

v2.6.0

v2.4.3

Display the progress properly when printing a big document
Improve the performance of preparing pages for print such as using a shared `canvas` element for all pages
Support documents whose pages have different dimensions

v2.4.2

v2.2.0

v2.0.0