Example: Highlight multiple keywords initially

You can pass an array of keywords that will be highlighted initially via the keyword option provided by the Search plugin.

It can be a single or an array of keywords. Each keyword can be a string, RegExp or FlagKeyword. The FlagKeyword type determines if we want to match the case or find the whole word:

interface FlagKeyword {
    keyword: string;
    matchCase?: boolean;    // `false` by default
    wholeWords?: boolean;   // `false` by default
}

The following example highlights all document and PDF found in all pages:

import { searchPlugin } from '@react-pdf-viewer/search';

const searchPluginInstance = searchPlugin({
    keyword: ['document', 'PDF'],
});

If you want the results to match the case or the whole words, then use the matchCase and wholeWords option. The sample code below only highlights PDF and ignore pdf:

const searchPluginInstance = searchPlugin({
    keyword: [
        'document',
        {
            keyword: 'PDF',
            matchCase: true,
        },
    ],
});

(The sample code)

Related examples