@react-pdf-viewer/core 3.6.0 on Node.js Yarn

New features

Allow to choose pages when printing a document via the setPages option. Is is a function that takes the current document and returns the list of zero-based index of pages you want to print.

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

const printPluginInstance = printPlugin({
    setPages: (doc: PdfJs.PdfDocument) => number[],
});

Here are some examples:

// Only print the even pages
const printPluginInstance = printPlugin({
    setPages: (doc) =>
        Array(doc.numPages)
            .fill(0)
            .map((_, i) => i)
            .filter((i) => (i + 1) % 2 === 0),
});

// Only print the odd pages
const printPluginInstance = printPlugin({
    setPages: (doc) =>
        Array(doc.numPages)
            .fill(0)
            .map((_, i) => i)
            .filter((i) => (i + 1) % 2 === 1),
});

The option is also available when using the default layout plugin:

const defaultLayoutPluginInstance = defaultLayoutPlugin({
    toolbarPlugin: {
        printPlugin: {
            setPages: ...,
        },
    },
});

You don't have to implement functions that return popular pages numbers. The print plugin provides useful functions for most popular cases:

import {
    getAllPagesNumbers,
    getCustomPagesNumbers,
    getEvenPagesNumbers,
    getOddPagesNumbers,
} from '@react-pdf-viewer/print';

const printPluginInstance = printPlugin({
    setPages: getEvenPagesNumbers,
});

Function	Description
`getAllPagesNumbers`	Returns all pages numbers of the document
`getCustomPagesNumbers`	Returns the custom pages numbers. The input is a string consists of given pages or ranges of pages. For example:
	1, 2, 3
	1-3
	1-3, 5, 8-11
`getEvenPagesNumbers`	Returns even pages numbers
`getOddPagesNumbers`	Returns odd pages numbers

The target print pages can be determined from users' input:

import { getEvenPagesNumbers } from '@react-pdf-viewer/print';
const printPluginInstance = printPlugin();

const { setPages } = printPluginInstance;

// Show UI for users to choose pages
const handleChooseEvenPages = () => setPages(getEvenPagesNumbers);

<label>
    <input type="radio" onChange={handleChooseEvenPages} />
    Print even pages
</label>;

The print plugin exposes the print function:

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

const printPluginInstance = printPlugin();
const { print } = printPluginInstance;

The print function is also available if you use the default layout plugin:

import { defaultLayoutPlugin } from '@react-pdf-viewer/default-layout';

const defaultLayoutPluginInstance = defaultLayoutPlugin();
const { print } = defaultLayoutPluginInstance.toolbarPluginInstance.printPluginInstance;

You can customize the progress bar when preparing pages to print:

const printPluginInstance = printPlugin({
    renderProgressBar: (numLoadedPages: number, numPages: number, onCancel: () => void) => (
        // Render the progress bar
    ),
});

Improvement

Replace the icons used in buttons to download and open a document with less confusing one

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

Bug fix

Can't search or set the initial keyword for scanned documents

@react-pdf-viewer/core 3.6.0 Improve print plugin on Node.js Yarn

New features

Improvement

Bug fix

@react-pdf-viewer/core 3.6.0
Improve print plugin

on Node.js Yarn