@react-pdf/stylesheet 5.1.0 → 5.2.1

package/README.md

@@ -15,7 +15,7 @@ yarn add @react-pdf/stylesheet
 ## How it works
 
 ```js
-const stylesheet = require('@react-pdf/stylesheet');
+import stylesheet from '@react-pdf/stylesheet';
 
 const container = {
   width: 400,

package/lib/index.js

@@ -162,7 +162,7 @@ const processMarginSingle = expandBoxModel({
   autoSupported: true
 });
 
-const BORDER_SHORTHAND_REGEX = /(-?\d+(\.\d+)?(px|in|mm|cm|pt|vw|vh|px)?)\s(\S+)\s(.+)/;
+const BORDER_SHORTHAND_REGEX = /(-?\d+(\.\d+)?(in|mm|cm|pt|vw|vh|px|rem)?)\s(\S+)\s(.+)/;
 const matchBorderShorthand = value => value.match(BORDER_SHORTHAND_REGEX) || [];
 const expandBorders = (key, value) => {
   const match = matchBorderShorthand(`${value}`);
@@ -439,14 +439,15 @@ const parseValue = value => {
  */
 const transformUnit = (container, value) => {
   const scalar = parseValue(value);
-  const dpi = 72; // Removed: container.dpi || 72
-  const mmFactor = 1 / 25.4 * dpi;
-  const cmFactor = 1 / 2.54 * dpi;
+  const outputDpi = 72;
+  const inputDpi = container.dpi || 72;
+  const mmFactor = 1 / 25.4 * outputDpi;
+  const cmFactor = 1 / 2.54 * outputDpi;
   switch (scalar.unit) {
     case 'rem':
       return scalar.value * (container.remBase || 18);
     case 'in':
-      return scalar.value * dpi;
+      return scalar.value * outputDpi;
     case 'mm':
       return scalar.value * mmFactor;
     case 'cm':
@@ -455,6 +456,8 @@ const transformUnit = (container, value) => {
       return scalar.value * (container.height / 100);
     case 'vw':
       return scalar.value * (container.width / 100);
+    case 'px':
+      return Math.round(scalar.value * (outputDpi / inputDpi));
     default:
       return scalar.value;
   }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-pdf/stylesheet",
-  "version": "5.1.0",
+  "version": "5.2.1",
   "license": "MIT",
   "description": "A styles engine for Node and the browser",
   "author": "Diego Muracciole <diegomuracciole@gmail.com>",
@@ -20,7 +20,7 @@
   "dependencies": {
     "@babel/runtime": "^7.20.13",
     "@react-pdf/fns": "3.0.0",
-    "@react-pdf/types": "^2.7.0",
+    "@react-pdf/types": "^2.7.1",
     "color-string": "^1.9.1",
     "hsl-to-hex": "^1.0.0",
     "media-engine": "^1.0.3",