React renderer for creating PDF files on the browser and server
Questions tagged [react-pdf]
409 questions
0
votes
0 answers
PDF text is rendering upside down in react-pdf
I am using react-pdf [version 4.1.0] in react based application to display the PDF documents as SVG by setting render mode to SVG.
Currently, the issue I am facing is…

Asif Iqbal
- 502
- 6
- 24
0
votes
0 answers
Using React-pdf in Node JS to render pdf content to string
I am using the npm @react-pdf/renderer to convert a pdf content to a string in node js (using the renderToString method from the npm) so i can attach the pdf to an email. The issue is everything i try leads to an error when attempting this.
Try 1:…

Atomics Digital
- 1
- 2
0
votes
0 answers
pdf.getDocument does not throw a PasswordException
Using react web app
package.json
"react": "^16.10.2",
"react-pdf": "^5.7.2",
imports:
import {pdfjs} from "react-pdf";
pdfjs.GlobalWorkerOptions.workerSrc = `//unpkg.com/pdfjs-dist@${pdfjs.version}/build/pdf.worker.min.js`;
When loading…

patrikw
- 25
- 1
- 6
0
votes
1 answer
Why react-pdf freeze app while rendering?
I'm trying to render basic example from react-pdf official website (https://react-pdf.org/)
but app is freezing while i'm trying to use one of rendering options (i tried PDFViever, usePDF hook, PDFDownloadLink).
When im trying the same example on…

Max Green
- 241
- 3
- 9
0
votes
0 answers
Outline onItemClick works only once
In the React-pdf library, the onitemclick props of the Outline component only works once, while the same props but of the Document component always work.
I send the piece of code, where you can see that the Outline component is wrapped in a MUI…

Ricardo Capozza
- 31
- 4
0
votes
0 answers
react-pdf : avoid fetching twice the pdf file
I'm using react-pdf to display a pdf file in the following way :
import React, { FC, useState } from 'react'
import { Document, Page, pdfjs } from 'react-pdf'
pdfjs.GlobalWorkerOptions.workerSrc =…

bssyy78
- 319
- 5
- 16
0
votes
0 answers
JSX, React-pdf table create a table, which filter those undefined
I have an array that contains the element with the number from 1-20.
[{ region1:"America", "country1": "US", service1: "mobile" },
{ region2: "Asia", country2: "JP", service2: "security" },
...
{ region20:undefined, country20: undefined,…

Cora Kwok
- 13
- 6
0
votes
1 answer
Styling Outline in react-pdf
Is there a way to style the outline of the react-pdf module, according to the documentation, the Outline component has the props className, but I don't know how to use it, thanks in advance

Ricardo Capozza
- 31
- 4
0
votes
0 answers
React-PDF Auto Page Change
I have to make a web pdf viewer for TV, I'm using react-pdf, but i can't find a solution for auto page change. Is there a option to make it like a carousel ?
const HeroSlider = () => {
const [numPages, setNumPages] = useState(null);
const…

todevv
- 400
- 2
- 11
0
votes
0 answers
Multi-Column Page Layout using react-pdf
The above picture is an example of a two-column page layout system in MS Word. On the web, a similar layout can be achieved using the following code:
Lorem ipsum dolor sit amet,…

Sharukh Rahman
- 327
- 3
- 12
0
votes
0 answers
Highlight text does not show highlighted text in pdf document
I am implementing the text highlight function when searching for a specific string, everything seems to work fine until, that is, the search is correct, the markup in the text layer is also correct, but when it comes to highlighting the text in the…

Ricardo Capozza
- 31
- 4
0
votes
0 answers
react-pdf: how to view pdf and return to sender
I have successfully implemented react-pdf. The pdf has 3 navigation
buttons - Return, Previous, and Next. The button that does not work
is "Return". The functioning components are Send.js and RenderPDF.js.
Send.js displays a list of documents…

Lannie
- 15
- 4
0
votes
1 answer
Smooth scrolling down after component with pdf is displayed in reactjs
I would need smooth scrolling down to component with generated pdf. But it looks like that first is scrolled to view and then
component is mounted. How can I set waiting to component is displayed and then scroll to view this component?
When I click…

Elo
- 226
- 5
- 19
0
votes
1 answer
Fonts not loading in @react-pdf/renderer
I'm getting this error code when trying to load a local font to my PDF project.
I've followed the documentation and tried several ways to import the font.
import DinPro from…

Johannes Andersson
- 15
- 6
0
votes
1 answer
Uncaught TypeError: Cannot read properties of undefined (reading 'call'). VITE + @react-pdf/renderer v3
To recreate
Create React TS app with Vite
npm init vite@latest vite-project --template react
Create sample pdf document
import React from 'react';
import pdf from '@react-pdf/renderer';
const { Page, Text, View, Document, StyleSheet } = pdf;
//…

QuaCode
- 21
- 3