react-pdf icon indicating copy to clipboard operation
react-pdf copied to clipboard

No option to add alt tag to image components

Open olliequ opened this issue 1 year ago • 2 comments

Using images with react-pdf works, but during the build process of the app (npm run build) results in the warning:

Warning: Image elements must have an alt prop, either with meaningful text, or an empty string for decorative images. jsx-a11y/alt-text

Having an option for an alt tag would solve this.

olliequ avatar Oct 10 '24 23:10 olliequ

I am interested in solving this issue. Please let me know if I can proceed.

abid-sayyed avatar Oct 11 '24 05:10 abid-sayyed

I'm facing same issue too. If anyone can provide example how it should fixed, I'm eager to do some collabration too. Thanks

abadrangui avatar Oct 19 '24 21:10 abadrangui

That's a linting error. Seems like your linting rule is thinking react-pdf image is a dom image. Not sure what alt means in a PDF. I guess an accessibility tag to the image? There are issues creatd for accessibility. Will close

diegomura avatar Nov 17 '24 01:11 diegomura

You can use use import aliasing to "solve" this: import { Image as PDFImage } from "@react-pdf/renderer";

verdynius avatar Nov 29 '24 08:11 verdynius

I am no expert in creating or rendering PDFs, but a quick search found that it is possible to use tagging to tag images with an ALT-Text for a11y-Readers. (In case you are unable to visually inspect images etc.)

As I found that this project uses pdfkit at some point, it could be possible to create ALT-texts with the a11y features of pdfkit: https://pdfkit.org/docs/accessibility.html

RSchlenker avatar May 12 '25 14:05 RSchlenker