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

Usage

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)
PropertyTypeDescriptionFrom
enableShortcuts?booleanEnable shortcuts2.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:
PropertyTypeDescriptionFrom
PrintReactElementCustomizable print button2.0.0
PrintButtonReactElementThe default print button2.0.0
PrintMenuItemReactElementThe default print menu item2.5.0
3. Register the plugin
Register the print plugin instance:
<Viewer plugins={[printPluginInstance]} />

Properties

The print plugin provides other useful property as following:
import { PrintIcon } from '@react-pdf-viewer/print';
PropertyTypeDescriptionFrom
PrintIconReactElementThe print icon2.0.0

See also

Changelog

v2.7.0
  • The print progress container loses the border
v2.6.0
  • Enable or disable shortcuts via the enableShortcuts option
  • Can't open any popover after printing
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
  • Support shortcuts
v2.2.0
  • In some cases, there is an extra blank page when printing
  • The plugin doesn't work with the Default Layout plugin
v2.0.0
  • First release