Open plugin

The `open` plugin provides a button that can be used to open a PDF document in your computer. It is possible to customize the button as well.

Install

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

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

1. Import the plugin and styles

import { openPlugin } from '@react-pdf-viewer/open';

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

2. Create the plugin instance

const openPluginInstance = openPlugin(props?: OpenPluginProps);

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

(? denotes an optional property)

Property	Type	Description	From
`enableShortcuts`?	`boolean`	Enable shortcuts	2.9.0

By default, the shortcuts are enabled. Users can press `ctrl` + `O` to open a document.

The plugin instance `openPluginInstance` provides the following properties:

Property	Type	Description	From
`Open`	`ReactElement`	Customizable open button	2.0.0
`OpenButton`	`ReactElement`	The default open button	2.0.0
`OpenMenuItem`	`ReactElement`	The default open menu item	2.5.0

3. Register the plugin

<Viewer plugins={[openPluginInstance]} />

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

import { OpenFileIcon } from '@react-pdf-viewer/open';

Property	Type	Description	From
`OpenFileIcon`	`ReactElement`	The open file icon	2.0.0

v3.8.0

v3.6.0

v2.9.0

v2.4.1

The `Open file button` covers other elements, so we can't click on the Download or Print buttons. This issue only happens on Safari 14

v2.0.0