postcss-convert-values - npm Package Compare versions

Comparing version 5.1.0 to 5.1.1

package.json

 {
   "name": "postcss-convert-values",
-  "version": "5.1.0",
+  "version": "5.1.1",
   "description": "Convert values with PostCSS (e.g. ms -> s)",
@@ -27,2 +27,3 @@ "main": "src/index.js",
   "dependencies": {
+    "browserslist": "^4.20.3",
     "postcss-value-parser": "^4.2.0"
@@ -41,4 +42,3 @@ },
     "postcss": "^8.2.15"
-  },
-  "readme": "# [postcss][postcss]-convert-values\n\n> Convert values with PostCSS (e.g. ms -> s)\n\n## Install\n\nWith [npm](https://npmjs.org/package/postcss-convert-values) do:\n\n```\nnpm install postcss-convert-values --save\n```\n\n## Example\n\nThis plugin reduces CSS size by converting values to use different units\nwhere possible; for example, `500ms` can be represented as `.5s`. You can\nread more about these units in [this article][csstricks].\n\n### Input\n\n```css\nh1 {\n    font-size: 16px;\n    width: 0em\n}\n```\n\n### Output\n\n```css\nh1 {\n    font-size: 1pc;\n    width: 0\n}\n```\n\nNote that this plugin only covers conversions for duration and absolute length\nvalues. For color conversions, use [postcss-colormin][colormin].\n\n## API\n\n### convertValues([options])\n\n#### options\n\n##### length\n\nType: `boolean`\nDefault: `true`\n\nPass `false` to disable conversion from `px` to other absolute length units,\nsuch as `pc` & `pt` & vice versa.\n\n##### time\n\nType: `boolean`\nDefault: `true`\n\nPass `false` to disable conversion from `ms` to `s` & vice versa.\n\n##### angle\n\nType: `boolean`\nDefault: `true`\n\nPass `false` to disable conversion from `deg` to `turn` & vice versa.\n\n##### precision\n\nType: `boolean|number`\nDefault: `false`\n\nSpecify any numeric value here to round `px` values to that many decimal places;\nfor example, using `{precision: 2}` will round `6.66667px` to `6.67px`, and\n`{precision: 0}` will round it to `7px`. Passing `false` (the default) will\nleave these values as is.\n\nIt is recommended for most use cases to set this option to `2`.\n\n\n## Usage\n\nSee the [PostCSS documentation](https://github.com/postcss/postcss#usage) for\nexamples for your environment.\n\n\n## Contributors\n\nSee [CONTRIBUTORS.md](https://github.com/cssnano/cssnano/blob/master/CONTRIBUTORS.md).\n\n\n## License\n\nMIT © [Ben Briggs](http://beneb.info)\n\n\n[postcss]: https://github.com/postcss/postcss\n[csstricks]: https://css-tricks.com/the-lengths-of-css/\n"
+  }
 }

src/index.js

 'use strict';
 const valueParser = require('postcss-value-parser');
+const browserslist = require('browserslist');
 const convert = require('./lib/convert.js');
@@ -39,2 +40,5 @@
 
+// Can't remove the % on these properties when they're 0 on IE 11
+const keepZeroPercent = new Set(['max-height', 'height', 'min-width']);
+
 /**
@@ -108,5 +112,6 @@ * Numbers without digits after the dot are technically invalid,
  * @param {import('postcss').Declaration} decl
+ * @param {string[]} browsers
  * @return {boolean}
  */
-function shouldKeepZeroUnit(decl) {
+function shouldKeepZeroUnit(decl, browsers) {
   const { parent } = decl;
@@ -116,3 +121,4 @@ const lowerCasedProp = decl.prop.toLowerCase();
     (decl.value.includes('%') &&
-      (lowerCasedProp === 'max-height' || lowerCasedProp === 'height')) ||
+      keepZeroPercent.has(lowerCasedProp) &&
+      browsers.includes('ie 11')) ||
     (parent &&
@@ -130,6 +136,7 @@ parent.parent &&
  * @param {Options} opts
+ * @param {string[]} browsers
  * @param {import('postcss').Declaration} decl
  * @return {void}
  */
-function transform(opts, decl) {
+function transform(opts, browsers, decl) {
   const lowerCasedProp = decl.prop.toLowerCase();
@@ -149,3 +156,3 @@ if (
       if (node.type === 'word') {
-        parseWord(node, opts, shouldKeepZeroUnit(decl));
+        parseWord(node, opts, shouldKeepZeroUnit(decl, browsers));
         if (
@@ -183,3 +190,3 @@ lowerCasedProp === 'opacity' ||
 /**
- * @typedef {{precision: boolean | number, angle?: boolean, time?: boolean, length?: boolean}} Options */
+ * @typedef {{precision: boolean | number, angle?: boolean, time?: boolean, length?: boolean} & browserslist.Options} Options */
 /**
@@ -191,6 +198,12 @@ * @type {import('postcss').PluginCreator<Options>}
 function pluginCreator(opts = { precision: false }) {
+  const browsers = browserslist(null, {
+    stats: opts.stats,
+    path: __dirname,
+    env: opts.env,
+  });
+
   return {
     postcssPlugin: plugin,
     OnceExit(css) {
-      css.walkDecls(transform.bind(null, opts));
+      css.walkDecls((decl) => transform(opts, browsers, decl));
     },
@@ -197,0 +210,0 @@ };

types/index.d.ts

 export = pluginCreator;
 /**
- * @typedef {{precision: boolean | number, angle?: boolean, time?: boolean, length?: boolean}} Options */
+ * @typedef {{precision: boolean | number, angle?: boolean, time?: boolean, length?: boolean} & browserslist.Options} Options */
 /**
@@ -18,3 +18,4 @@ * @type {import('postcss').PluginCreator<Options>}
     length?: boolean;
-};
+} & browserslist.Options;
 declare var postcss: true;
+import browserslist = require("browserslist");

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Lines of code

292

increased by4.29%

Worsened metrics

Total package byte prevSize

11636

decreased by-11.22%

Dependency count

3

increased by50%

Dependency changes

• + Addedbrowserslist@^4.20.3

• + Addedbrowserslist@4.24.2(transitive)

• + Addedcaniuse-lite@1.0.30001680(transitive)

• + Addedelectron-to-chromium@1.5.63(transitive)

• + Addedescalade@3.2.0(transitive)

• + Addednode-releases@2.0.18(transitive)

• + Addedupdate-browserslist-db@1.1.1(transitive)