Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: allow units for page size #2773

Merged
merged 8 commits into from
Dec 3, 2024

Conversation

nikischin
Copy link
Contributor

@nikischin nikischin commented Jun 3, 2024

In addition to #2771 I also implemented the support for units "in", "cm", "mm" to the <Page/> size attribute.

Includes the fixes for the dpi from #2771 already but had to be a bit rewritten.

implements #2008
fixes #2885

Some background about this and also #2771:
The PDF spec doesn't really have DPI and always expects the unit to be user points which always expects points in an PDF to be 1/72 of an inch. So any unitless value in a PDF always should be considered a user point. The dpi setting then should represent a user unit which defaults to 72 dots per inch and can change this conversion to anything else.

Please check out more details to this here or here

The thing with PDF is, you always want to have a font set to 12pt to be the same size no matter what dpi setting you have. You can check on Adobe Indesign and create two pdfs, one with 72dpi and one with 300dpi, and in both the font will have the same size (relative to the page size) if set to 12pt (which equals 12 user points). This was not working before the fix and was therefore super confusing. Why should the complete layout of the page change when I change the dpi setting?

Please note that debug mode also represents the user points and not pixels.

Expected behavior

  • A page with "A4" will result in 595 x 841 points no matter what dpi is set

  • A page with {{width: "210mm", height: "297mm"}} will result in 595 x 841 points no matter what dpi is set

  • A page with {{width: 595, height: 841 }} will result in 595 x 841 points no matter what dpi is set

  • A page with {{width: "595px", height: "841px" }} will result in 595 x 841 points on 72 dpi, but only 142 x 202 points on 300dpi

  • A element with a width of 590 points will almost fill the page for a A4 page no matter what dpi

  • A element with a width of "99vw" will almost fill the page for a A4 page no matter what dpi

  • A element with a width of "590px" will almost fill the page for a A4 page on 72dpi but will only fill about 1/4 or 1/5 on 300dpi

Copy link

changeset-bot bot commented Jun 3, 2024

🦋 Changeset detected

Latest commit: baec01d

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 6 packages
Name Type
@react-pdf/stylesheet Minor
@react-pdf/layout Minor
@react-pdf/renderer Patch
@react-pdf/examples Patch
@react-pdf/e2e-node-cjs Patch
@react-pdf/e2e-node-esm Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@nikischin nikischin marked this pull request as ready for review June 24, 2024 06:32
@nikischin
Copy link
Contributor Author

Thank you for merging #2771 @diegomura, in addition I also merged the branch and prepared this PR.

@nikischin nikischin mentioned this pull request Aug 10, 2024
@nikischin
Copy link
Contributor Author

Could you have a look on this please @diegomura? Thank you so much!

@nikischin
Copy link
Contributor Author

Bump @diegomura :)

packages/layout/src/page/getSize.js Outdated Show resolved Hide resolved
nikischin and others added 2 commits December 1, 2024 19:41
Update version update to minor (see separate comment)
@diegomura diegomura changed the title Allow units for page size feat: allow units for page size Dec 3, 2024
Copy link
Owner

@diegomura diegomura left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @nikischin !

@diegomura diegomura merged commit 18834ef into diegomura:master Dec 3, 2024
natterstefan added a commit to traveltechdeluxe/react-pdf that referenced this pull request Dec 6, 2024
# By Diego Muracciole (31) and others
# Via GitHub
* upstream/master: (60 commits)
  feat: allow units for page size (diegomura#2773)
  chore: bump jay-peg
  chore: release packages (diegomura#2981)
  fix(textkit): make indentation only affect first line. (diegomura#2975)
  fix: conditional rendering (diegomura#2983)
  fix(reconciler): missing dependencies (diegomura#2980)
  chore: release packages (diegomura#2959)
  feat: rem border widths (diegomura#2960)
  fix: add scheduler dependency (diegomura#2958)
  chore: update README
  chore: release packages (diegomura#2953)
  feat: support rem units (diegomura#2955)
  feat: add image stress test example (diegomura#2954)
  feat: support multiple line-height units (diegomura#2952)
  chore: release packages (diegomura#2946)
  fix: note rendering (diegomura#2951)
  feat: accept commas between transformations (diegomura#2950)
  fix: document metadata setters (diegomura#2949)
  fix: stroke dash array computation (diegomura#2948)
  feat: remove cross-fetch (diegomura#2947)
  ...

# Conflicts:
#	packages/renderer/index.d.ts
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Page dpi prop is not affecting page height and width anymore
3 participants