Create a custom search control

You can customize the search control in the Search plugin with the `Search` component:
import { RenderSearchProps, Search } from '@react-pdf-viewer/search';
<Search>
{
(renderSearchProps: RenderSearchProps) => (
// Your custom search control
)
}
</Search>
The parameter `renderSearchProps` provides the properties and methods to build up a custom search control:
PropertyTypeDescription
`clearKeyword``Function`Clear the keyword
`changeMatchCase``Function`The result has to match case with the keyword
`changeWholeWords``Function`The result has to match the whole keyword
`currentMatch``number`The index of current match
`jumpToNextMatch``Function`Jump to the next match
`jumpToPreviousMatch``Function`Jump to the previous match
`keyword``string`The current keyword
`matchCase``boolean``true` if the result matches case with the keyword
`wholeWords``boolean``true` if the result matches the whole keyword
`search``Function`Perform the search with current `keyword` and `matchCase`, `wholeWords` conditions
`setKeyword``Function`Set the current keyword

See also