Existing Issue: Images don't render properly

[prof-awais]

Config:

version:  ["react-to-pdf": "^1.0.1", "next": "14.1.0"]
format: PNG

import { Margin, usePDF } from "react-to-pdf";

const { toPDF, targetRef } = usePDF({
    filename: "FileName",
    page: { margin: Margin.MEDIUM },
});

Hi, react-to-pdf initially worked perfectly for me but later I faced PNG image issue. Reason I don't know exactly but my usage is following.

<MuiDialog
        open={showLicense}
        onClose={() => setShowLicense(false)}
        // PaperComponent={PaperComponent}
        aria-labelledby="draggable-dialog-title"
        fullScreen
        scroll="paper"
        PaperProps={{ sx: { overflowX: "hidden" } }}
      >

                {/* App bar goes here  */}


        <MuiDialogContent sx={{ padding: "unset", minWidth: "2100px" }}>
          <section className="av-mx-8" ref={targetRef}>
            <section className="av-space-y-12 av-mb-14">
              <LcShowTitle variant="v1">3D Object License</LcShowTitle>
            </section>

            <LcShowClient
              data={CONTENT_LC_SHOW}
              licenseBinary={data?.binaryData}
              isPDF     // just responsible for conditional with of the sections. 
            />
          </section>
        </MuiDialogContent>
      </MuiDialog>

I have read the following issues but no solution found inside.

Relevant issues:

• Svgs don't seem to be rendered correctly #41 (svg)
• @viniciushfr did you find a solution to this problem? Im facing the same issue #68 (svg)
• image is not rendering in image removed when pdf downloaded #55
• add imageFormat prop to support jpeg or png #43
• Images #21

Please if there is something wrong is usage tell me.

[Emanuel-Palestino]

Same problem with a png image.

[prof-awais]

Same problem with a png image.

On my side they worked in production correctly. No text or image is broken. And in development its on luck.

[soham2k06]

I would assume you are using <Image /> component by next.js
I used normal img tag and it works.
Next image is behaving the same you demonstrated

[prof-awais]

I would assume you are using <Image /> component by next.js I used normal img tag and it works. Next image is behaving the same you demonstrated

Maybe I have to try. Because after few months I downloaded license and images were missing. Lol. I've to fix them again.

[soham2k06]

Pretty sure something is wrong with Image component, and we can remove that since in pdf we do not need any optimisation either