@react-pdf/stylesheet 2.0.12 → 3.0.0

package/CHANGELOG.md

@@ -0,0 +1,30 @@
+# @react-pdf/stylesheet
+
+## 3.0.0
+
+### Major Changes
+
+- [#1829](https://github.com/diegomura/react-pdf/pull/1829) [`5458a00`](https://github.com/diegomura/react-pdf/commit/5458a00979d883341c6df094243cae859344d2b9) Thanks [@diegomura](https://github.com/diegomura)! - refactor: remove ramda from stylesheet package
+
+### Patch Changes
+
+- [#1838](https://github.com/diegomura/react-pdf/pull/1838) [`9bdb5c9`](https://github.com/diegomura/react-pdf/commit/9bdb5c934a822340754cd4c892d399f91f6218de) Thanks [@diegomura](https://github.com/diegomura)! - feat: create fns package
+
+- Updated dependencies [[`9bdb5c9`](https://github.com/diegomura/react-pdf/commit/9bdb5c934a822340754cd4c892d399f91f6218de), [`fe0f214`](https://github.com/diegomura/react-pdf/commit/fe0f214dbbf2f632b852ebfe65f886ecc4dd6953)]:
+  - @react-pdf/fns@1.0.0
+  - @react-pdf/types@2.0.9
+
+## 2.1.0
+
+### Minor Changes
+
+- [#1535](https://github.com/diegomura/react-pdf/pull/1535) [`1f0eb6e`](https://github.com/diegomura/react-pdf/commit/1f0eb6e0d4e75480de6745a204924d5075859db7) Thanks [@jeetiss](https://github.com/jeetiss)! - fixed `margin: auto` parsing
+
+* [#1654](https://github.com/diegomura/react-pdf/pull/1654) [`ccf3bf2`](https://github.com/diegomura/react-pdf/commit/ccf3bf22867a9bd49668cdd3543ec32492a40e4b) Thanks [@jeetiss](https://github.com/jeetiss)! - added `@babel/runtime` to dependencies
+
+### Patch Changes
+
+- [#1581](https://github.com/diegomura/react-pdf/pull/1581) [`04449ab`](https://github.com/diegomura/react-pdf/commit/04449ab352db0cca2155024dd3e8c690e42193ca) Thanks [@jeetiss](https://github.com/jeetiss)! - added changelog with changesets
+
+- Updated dependencies [[`04449ab`](https://github.com/diegomura/react-pdf/commit/04449ab352db0cca2155024dd3e8c690e42193ca)]:
+  - @react-pdf/types@2.0.8

package/lib/expand/borders.js

@@ -1,14 +1,12 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 exports.__esModule = true;
 exports.default = void 0;
-
-var R = _interopRequireWildcard(require("ramda"));
-
 var BORDER_SHORTHAND_REGEX = /(-?\d+(\.\d+)?(px|in|mm|cm|pt|vw|vh|px)?)\s(\S+)\s(.+)/;
-var matchBorderShorthand = R.match(BORDER_SHORTHAND_REGEX);
+
+var matchBorderShorthand = function matchBorderShorthand(value) {
+  return value.match(BORDER_SHORTHAND_REGEX) || [];
+};
 
 var expandBorders = function expandBorders(key, value) {
   var match = matchBorderShorthand("" + value);

package/lib/expand/boxModel.js

@@ -1,46 +1,81 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
 exports.default = void 0;
 
-var R = _interopRequireWildcard(require("ramda"));
+var _parse = _interopRequireDefault(require("postcss-value-parser/lib/parse"));
 
-var BOX_MODEL_REGEX = /-?\d+(\.\d+)?(px|in|mm|cm|pt|%|vw|vh|px)?/g;
-var matchBoxModelValue = R.match(BOX_MODEL_REGEX);
+var _unit = _interopRequireDefault(require("postcss-value-parser/lib/unit"));
 
-var expandBoxModel = function expandBoxModel(model) {
-  return function (key, value) {
-    var _ref;
+/* eslint-disable no-plusplus */
+var BOX_MODEL_UNITS = 'px,in,mm,cm,pt,%,vw,vh';
 
-    if (value === 'auto') return _ref = {}, _ref[model + "Top"] = 'auto', _ref[model + "Right"] = 'auto', _ref[model + "Bottom"] = 'auto', _ref[model + "Left"] = 'auto', _ref;
-    var match = matchBoxModelValue("" + value);
+var logError = function logError(style, value) {
+  console.error("\n    @react-pdf/stylesheet parsing error:\n\n    " + style + ": " + value + ",\n    " + ' '.repeat(style.length + 2) + "^\n    Unsupported " + style + " value format\n  ");
+};
+
+var expandBoxModel = function expandBoxModel(_temp) {
+  var _ref = _temp === void 0 ? {} : _temp,
+      expandsTo = _ref.expandsTo,
+      _ref$maxValues = _ref.maxValues,
+      maxValues = _ref$maxValues === void 0 ? 1 : _ref$maxValues,
+      _ref$autoSupported = _ref.autoSupported,
+      autoSupported = _ref$autoSupported === void 0 ? false : _ref$autoSupported;
 
-    if (match) {
-      var _ref4;
+  return function (model, value) {
+    var _ref2;
 
-      var top = match[0];
-      var right = match[1] || match[0];
-      var bottom = match[2] || match[0];
-      var left = match[3] || match[1] || match[0];
+    var nodes = (0, _parse.default)("" + value);
+    var parts = [];
 
-      if (key.match(/Horizontal$/)) {
-        var _ref2;
+    for (var i = 0; i < nodes.length; i++) {
+      var node = nodes[i]; // value contains `calc`, `url` or other css function
+      // `,`, `/` or strings that unsupported by margin and padding
 
-        return _ref2 = {}, _ref2[model + "Right"] = right, _ref2[model + "Left"] = left, _ref2;
+      if (node.type === 'function' || node.type === 'string' || node.type === 'div') {
+        logError(model, value);
+        return {};
       }
 
-      if (key.match(/Vertical$/)) {
-        var _ref3;
+      if (node.type === 'word') {
+        if (node.value === 'auto' && autoSupported) {
+          parts.push(node.value);
+        } else {
+          var result = (0, _unit.default)(node.value); // when unit isn't specified this condition is true
 
-        return _ref3 = {}, _ref3[model + "Top"] = top, _ref3[model + "Bottom"] = bottom, _ref3;
+          if (result && BOX_MODEL_UNITS.includes(result.unit)) {
+            parts.push(node.value);
+          } else {
+            logError(model, value);
+            return {};
+          }
+        }
       }
+    } // checks that we have enough parsed values
+
+
+    if (parts.length > maxValues) {
+      logError(model, value);
+      return {};
+    }
+
+    var first = parts[0];
 
-      return _ref4 = {}, _ref4[model + "Top"] = top, _ref4[model + "Right"] = right, _ref4[model + "Bottom"] = bottom, _ref4[model + "Left"] = left, _ref4;
+    if (expandsTo) {
+      var second = parts[1] || parts[0];
+      var third = parts[2] || parts[0];
+      var fourth = parts[3] || parts[1] || parts[0];
+      return expandsTo({
+        first: first,
+        second: second,
+        third: third,
+        fourth: fourth
+      });
     }
 
-    return value;
+    return _ref2 = {}, _ref2[model] = first, _ref2;
   };
 };
 

package/lib/expand/index.js

@@ -1,17 +1,17 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
 exports.default = void 0;
 
 var _flex = _interopRequireDefault(require("./flex"));
 
-var _margins = _interopRequireDefault(require("./margins"));
+var _margins = require("./margins");
 
 var _borders = _interopRequireDefault(require("./borders"));
 
-var _paddings = _interopRequireDefault(require("./paddings"));
+var _paddings = require("./paddings");
 
 var _objectPosition = _interopRequireDefault(require("./objectPosition"));
 
@@ -19,12 +19,20 @@ var _transformOrigin = _interopRequireDefault(require("./transformOrigin"));
 
 var shorthands = {
   flex: _flex.default,
-  margin: _margins.default,
-  marginHorizontal: _margins.default,
-  marginVertical: _margins.default,
-  padding: _paddings.default,
-  paddingHorizontal: _paddings.default,
-  paddingVertical: _paddings.default,
+  margin: _margins.processMargin,
+  marginHorizontal: _margins.processMarginHorizontal,
+  marginVertical: _margins.processMarginVertical,
+  marginTop: _margins.processMarginSingle,
+  marginRight: _margins.processMarginSingle,
+  marginBottom: _margins.processMarginSingle,
+  marginLeft: _margins.processMarginSingle,
+  padding: _paddings.processPadding,
+  paddingHorizontal: _paddings.processPaddingHorizontal,
+  paddingVertical: _paddings.processPaddingVertical,
+  paddingTop: _paddings.processPaddingSingle,
+  paddingRight: _paddings.processPaddingSingle,
+  paddingBottom: _paddings.processPaddingSingle,
+  paddingLeft: _paddings.processPaddingSingle,
   border: _borders.default,
   borderTop: _borders.default,
   borderRight: _borders.default,

package/lib/expand/margins.js

@@ -1,12 +1,56 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
-exports.default = void 0;
+exports.processMarginVertical = exports.processMarginSingle = exports.processMarginHorizontal = exports.processMargin = void 0;
 
 var _boxModel = _interopRequireDefault(require("./boxModel"));
 
-var expandMargin = (0, _boxModel.default)('margin');
-var _default = expandMargin;
-exports.default = _default;
+var processMargin = (0, _boxModel.default)({
+  expandsTo: function expandsTo(_ref) {
+    var first = _ref.first,
+        second = _ref.second,
+        third = _ref.third,
+        fourth = _ref.fourth;
+    return {
+      marginTop: first,
+      marginRight: second,
+      marginBottom: third,
+      marginLeft: fourth
+    };
+  },
+  maxValues: 4,
+  autoSupported: true
+});
+exports.processMargin = processMargin;
+var processMarginVertical = (0, _boxModel.default)({
+  expandsTo: function expandsTo(_ref2) {
+    var first = _ref2.first,
+        second = _ref2.second;
+    return {
+      marginTop: first,
+      marginBottom: second
+    };
+  },
+  maxValues: 2,
+  autoSupported: true
+});
+exports.processMarginVertical = processMarginVertical;
+var processMarginHorizontal = (0, _boxModel.default)({
+  expandsTo: function expandsTo(_ref3) {
+    var first = _ref3.first,
+        second = _ref3.second;
+    return {
+      marginRight: first,
+      marginLeft: second
+    };
+  },
+  maxValues: 2,
+  autoSupported: true
+});
+exports.processMarginHorizontal = processMarginHorizontal;
+var processMarginSingle = (0, _boxModel.default)({
+  autoSupported: true
+});
+exports.processMarginSingle = processMarginSingle;

package/lib/expand/paddings.js

@@ -1,12 +1,51 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
-exports.default = void 0;
+exports.processPaddingVertical = exports.processPaddingSingle = exports.processPaddingHorizontal = exports.processPadding = void 0;
 
 var _boxModel = _interopRequireDefault(require("./boxModel"));
 
-var expandPadding = (0, _boxModel.default)('padding');
-var _default = expandPadding;
-exports.default = _default;
+var processPadding = (0, _boxModel.default)({
+  expandsTo: function expandsTo(_ref) {
+    var first = _ref.first,
+        second = _ref.second,
+        third = _ref.third,
+        fourth = _ref.fourth;
+    return {
+      paddingTop: first,
+      paddingRight: second,
+      paddingBottom: third,
+      paddingLeft: fourth
+    };
+  },
+  maxValues: 4
+});
+exports.processPadding = processPadding;
+var processPaddingVertical = (0, _boxModel.default)({
+  expandsTo: function expandsTo(_ref2) {
+    var first = _ref2.first,
+        second = _ref2.second;
+    return {
+      paddingTop: first,
+      paddingBottom: second
+    };
+  },
+  maxValues: 2
+});
+exports.processPaddingVertical = processPaddingVertical;
+var processPaddingHorizontal = (0, _boxModel.default)({
+  expandsTo: function expandsTo(_ref3) {
+    var first = _ref3.first,
+        second = _ref3.second;
+    return {
+      paddingRight: first,
+      paddingLeft: second
+    };
+  },
+  maxValues: 2
+});
+exports.processPaddingHorizontal = processPaddingHorizontal;
+var processPaddingSingle = (0, _boxModel.default)();
+exports.processPaddingSingle = processPaddingSingle;

package/lib/flatten/index.js

@@ -1,32 +1,19 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 exports.__esModule = true;
 exports.default = void 0;
 
-var R = _interopRequireWildcard(require("ramda"));
+var _fns = require("@react-pdf/fns");
 
-var isNotArray = R.complement(R.is(Array));
-var castArray = R.when(isNotArray, function (v) {
-  return [v];
-});
 /**
  * Remove nil values from array
  *
  * @param {Array} array
  * @returns {Array} array without nils
  */
-
-var compact = R.filter(Boolean);
-/**
- * Checks if value is array
- *
- * @param {any} value
- * @returns {Boolean} is value an array
- */
-
-var isArray = R.is(Array);
+var compact = function compact(array) {
+  return array.filter(Boolean);
+};
 /**
  * Merges style objects array
  *
@@ -34,9 +21,10 @@ var isArray = R.is(Array);
  * @returns {Object} merged style object
  */
 
+
 var mergeStyles = function mergeStyles(styles) {
   return styles.reduce(function (acc, style) {
-    var s = isArray(style) ? flatten(style) : style;
+    var s = Array.isArray(style) ? flatten(style) : style;
     Object.keys(s).forEach(function (key) {
       if (s[key] !== null && s[key] !== undefined) {
         acc[key] = s[key];
@@ -53,6 +41,6 @@ var mergeStyles = function mergeStyles(styles) {
  */
 
 
-var flatten = R.compose(mergeStyles, compact, castArray);
+var flatten = (0, _fns.compose)(mergeStyles, compact, _fns.castArray);
 var _default = flatten;
 exports.default = _default;

package/lib/index.js

@@ -1,13 +1,11 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
-exports.default = exports.processTransform = exports.transformColor = void 0;
+exports.transformColor = exports.processTransform = exports.default = void 0;
 
-var R = _interopRequireWildcard(require("ramda"));
+var _fns = require("@react-pdf/fns");
 
 var _expand = _interopRequireDefault(require("./expand"));
 
@@ -33,10 +31,13 @@ exports.processTransform = _transform2.default;
  * @returns {Object} resolved style object
  */
 var resolveStyles = function resolveStyles(container, style) {
-  return R.compose((0, _transform.default)(container), _expand.default, (0, _mediaQueries.default)(container), _flatten.default)(style);
-}; // Utils exported for SVG processing
+  var computeMediaQueries = function computeMediaQueries(value) {
+    return (0, _mediaQueries.default)(container, value);
+  };
 
+  return (0, _fns.compose)((0, _transform.default)(container), _expand.default, computeMediaQueries, _flatten.default)(style);
+}; // Utils exported for SVG processing
 
-var _default = R.curryN(2, resolveStyles);
 
+var _default = resolveStyles;
 exports.default = _default;

package/lib/mediaQueries/index.js

@@ -1,16 +1,12 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
 exports.default = void 0;
 
 var _extends3 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 
-var R = _interopRequireWildcard(require("ramda"));
-
 var _mediaEngine = _interopRequireDefault(require("media-engine"));
 
 /**
@@ -33,6 +29,5 @@ var resolveMediaQueries = function resolveMediaQueries(container, styles) {
   }, {});
 };
 
-var _default = R.curryN(2, resolveMediaQueries);
-
+var _default = resolveMediaQueries;
 exports.default = _default;

package/lib/transform/colors.js

@@ -1,22 +1,21 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
 exports.default = void 0;
 
-var R = _interopRequireWildcard(require("ramda"));
-
 var _hslToHex = _interopRequireDefault(require("hsl-to-hex"));
 
 var _colorString = _interopRequireDefault(require("color-string"));
 
-var isRgb = R.test(/rgb/g);
-var isRgba = R.test(/rgba/g);
-var isHsl = R.test(/hsl/g);
-var isHsla = R.test(/hsla/g);
+var isRgb = function isRgb(value) {
+  return /rgba?/g.test(value);
+};
+
+var isHsl = function isHsl(value) {
+  return /hsla?/g.test(value);
+};
 /**
  * Transform rgb color to hexa
  *
@@ -24,7 +23,12 @@ var isHsla = R.test(/hsla/g);
  * @returns {Object} transformed value
  */
 
-var parseRgb = R.compose(_colorString.default.to.hex, _colorString.default.get.rgb);
+
+var parseRgb = function parseRgb(value) {
+  var rgb = _colorString.default.get.rgb(value);
+
+  return _colorString.default.to.hex(rgb);
+};
 /**
  * Transform Hsl color to hexa
  *
@@ -32,7 +36,14 @@ var parseRgb = R.compose(_colorString.default.to.hex, _colorString.default.get.r
  * @returns {Object} transformed value
  */
 
-var parseHsl = R.compose(R.toUpper, R.apply(_hslToHex.default), R.map(Math.round), _colorString.default.get.hsl);
+
+var parseHsl = function parseHsl(value) {
+  var hsl = _colorString.default.get.hsl(value).map(Math.round);
+
+  var hex = _hslToHex.default.apply(void 0, hsl);
+
+  return hex.toUpperCase();
+};
 /**
  * Transform given color to hexa
  *
@@ -40,8 +51,11 @@ var parseHsl = R.compose(R.toUpper, R.apply(_hslToHex.default), R.map(Math.round
  * @returns {Object} transformed value
  */
 
+
 var transformColor = function transformColor(value) {
-  return R.cond([[isRgba, parseRgb], [isRgb, parseRgb], [isHsla, parseHsl], [isHsl, parseHsl], [R.T, R.always(value)]])(value);
+  if (isRgb(value)) return parseRgb(value);
+  if (isHsl(value)) return parseHsl(value);
+  return value;
 };
 
 var _default = transformColor;

package/lib/transform/index.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
 exports.default = void 0;

package/lib/transform/objectPosition.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
 exports.default = void 0;

package/lib/transform/transform.js

@@ -130,6 +130,7 @@ var normalize = function normalize(operations) {
 };
 
 var processTransform = function processTransform(value) {
+  if (typeof value !== 'string') return value;
   return normalize(parse(value));
 };
 

package/lib/transform/transformOrigin.js

@@ -1,6 +1,6 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 
 exports.__esModule = true;
 exports.default = void 0;

package/lib/utils/castFloat.js

@@ -1,14 +1,11 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 exports.__esModule = true;
 exports.default = void 0;
 
-var R = _interopRequireWildcard(require("ramda"));
-
-/* eslint-disable import/prefer-default-export */
-var matchNumber = R.when(R.is(String), R.test(/^-?\d*\.?\d*$/));
+var matchNumber = function matchNumber(value) {
+  return typeof value === 'string' && /^-?\d*\.?\d*$/.test(value);
+};
 
 var castFloat = function castFloat(value) {
   if (typeof value !== 'string') return value;

package/package.json

@@ -1,22 +1,29 @@
 {
   "name": "@react-pdf/stylesheet",
-  "version": "2.0.12",
+  "version": "3.0.0",
   "license": "MIT",
+  "description": "A styles engine for Node and the browser",
   "author": "Diego Muracciole <diegomuracciole@gmail.com>",
   "homepage": "https://github.com/diegomura/react-pdf#readme",
-  "repository": "git@github.com:diegomura/react-pdf.git",
   "main": "lib/index.js",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/diegomura/react-pdf.git",
+    "directory": "packages/stylesheet"
+  },
   "scripts": {
     "test": "jest",
     "build": "rimraf ./lib && babel src --out-dir lib",
     "watch": "rimraf ./lib && babel src --out-dir lib --watch"
   },
   "dependencies": {
-    "@react-pdf/types": "^2.0.6",
+    "@babel/runtime": "^7.16.4",
+    "@react-pdf/fns": "1.0.0",
+    "@react-pdf/types": "^2.0.9",
     "color-string": "^1.5.3",
     "hsl-to-hex": "^1.0.0",
     "media-engine": "^1.0.3",
-    "ramda": "^0.26.1"
+    "postcss-value-parser": "^4.1.0"
   },
   "files": [
     "lib"