0

I would like to allow users to copy and paste text from PDF documents. However when I inspect the page (with Chrome dev tools) where we are rendering the PDF document, I notice there are styles that set user-select to none. I can't find anything in the react-pdf documentation that indicates how to allow users to select text. Hoping someone knows how!

Here are the CSS rules that are defined on .react-pdf__Document > div > div > div. We could certainly override it with !important but I'm hoping there's another way.

{
    position: absolute;
    inset: 10px 20px;
    height: 1229.41px;
    width: 950px;
    user-select: none;
}
Vanessa Bell
  • 3
  • 3

2 Answers2

0

you can manually add user-select: none to the following class:

.react-pdf__Page__textContent

This works for me

Zesi
  • 26
  • 1
0

The browser is responsible for handling user choices thus the user interface allows the user to copy print / read aloud or otherwise interact with the text transferred download either when using a real PDF download/renderer or in react-pdf cases a web reproduction of a PDF.js.

If you serve "Image Only" as PDF then the browser needs to use any OCR screen reader.

enter image description here

K J
  • 8,045
  • 3
  • 14
  • 36