postcss-convert-values 5.0.0 → 5.0.4

package/package.json

@@ -1,17 +1,12 @@
 {
   "name": "postcss-convert-values",
-  "version": "5.0.0",
+  "version": "5.0.4",
   "description": "Convert values with PostCSS (e.g. ms -> s)",
-  "main": "dist/index.js",
+  "main": "src/index.js",
   "files": [
     "LICENSE-MIT",
-    "dist"
+    "src"
   ],
-  "scripts": {
-    "prebuild": "del-cli dist",
-    "build": "cross-env BABEL_ENV=publish babel src --config-file ../../babel.config.js --out-dir dist --ignore \"**/__tests__/\"",
-    "prepublish": "yarn build"
-  },
   "keywords": [
     "css",
     "optimisation",
@@ -27,7 +22,7 @@
   },
   "repository": "cssnano/cssnano",
   "dependencies": {
-    "postcss-value-parser": "^4.1.0"
+    "postcss-value-parser": "^4.2.0"
   },
   "bugs": {
     "url": "https://github.com/cssnano/cssnano/issues"
@@ -36,10 +31,10 @@
     "node": "^10 || ^12 || >=14.0"
   },
   "devDependencies": {
-    "postcss": "^8.2.1"
+    "postcss": "^8.2.15"
   },
   "peerDependencies": {
-    "postcss": "^8.2.1"
+    "postcss": "^8.2.15"
   },
-  "gitHead": "0e2c3bf5835bafcdc8783bef66f730a24194c8f3"
-}
+  "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"
+}

package/src/index.js

@@ -0,0 +1,164 @@
+'use strict';
+const valueParser = require('postcss-value-parser');
+const convert = require('./lib/convert');
+
+const LENGTH_UNITS = new Set([
+  'em',
+  'ex',
+  'ch',
+  'rem',
+  'vw',
+  'vh',
+  'vmin',
+  'vmax',
+  'cm',
+  'mm',
+  'q',
+  'in',
+  'pt',
+  'pc',
+  'px',
+]);
+
+// These properties only accept percentages, so no point in trying to transform
+const notALength = new Set([
+  'descent-override',
+  'ascent-override',
+  'font-stretch',
+  'size-adjust',
+  'line-gap-override',
+]);
+
+// Can't change the unit on these properties when they're 0
+const keepWhenZero = new Set([
+  'stroke-dashoffset',
+  'stroke-width',
+  'line-height',
+]);
+
+/*
+ * Numbers without digits after the dot are technically invalid,
+ * but in that case css-value-parser returns the dot as part of the unit,
+ * so we use this to remove the dot.
+ */
+function stripLeadingDot(item) {
+  if (item.charCodeAt(0) === '.'.charCodeAt(0)) {
+    return item.slice(1);
+  } else {
+    return item;
+  }
+}
+
+function parseWord(node, opts, keepZeroUnit) {
+  const pair = valueParser.unit(node.value);
+  if (pair) {
+    const num = Number(pair.number);
+    const u = stripLeadingDot(pair.unit);
+    if (num === 0) {
+      node.value =
+        0 +
+        (keepZeroUnit || (!LENGTH_UNITS.has(u.toLowerCase()) && u !== '%')
+          ? u
+          : '');
+    } else {
+      node.value = convert(num, u, opts);
+
+      if (
+        typeof opts.precision === 'number' &&
+        u.toLowerCase() === 'px' &&
+        pair.number.includes('.')
+      ) {
+        const precision = Math.pow(10, opts.precision);
+        node.value =
+          Math.round(parseFloat(node.value) * precision) / precision + u;
+      }
+    }
+  }
+}
+
+function clampOpacity(node) {
+  const pair = valueParser.unit(node.value);
+  if (!pair) {
+    return;
+  }
+  let num = Number(pair.number);
+  if (num > 1) {
+    node.value = pair.unit === '%' ? num + pair.unit : 1 + pair.unit;
+  } else if (num < 0) {
+    node.value = 0 + pair.unit;
+  }
+}
+
+function shouldKeepZeroUnit(decl) {
+  const { parent } = decl;
+  const lowerCasedProp = decl.prop.toLowerCase();
+  return (
+    (decl.value.includes('%') &&
+      (lowerCasedProp === 'max-height' || lowerCasedProp === 'height')) ||
+    (parent.parent &&
+      parent.parent.name &&
+      parent.parent.name.toLowerCase() === 'keyframes' &&
+      lowerCasedProp === 'stroke-dasharray') ||
+    keepWhenZero.has(lowerCasedProp)
+  );
+}
+
+function transform(opts, decl) {
+  const lowerCasedProp = decl.prop.toLowerCase();
+  if (
+    lowerCasedProp.includes('flex') ||
+    lowerCasedProp.indexOf('--') === 0 ||
+    notALength.has(lowerCasedProp)
+  ) {
+    return;
+  }
+
+  decl.value = valueParser(decl.value)
+    .walk((node) => {
+      const lowerCasedValue = node.value.toLowerCase();
+
+      if (node.type === 'word') {
+        parseWord(node, opts, shouldKeepZeroUnit(decl));
+        if (
+          lowerCasedProp === 'opacity' ||
+          lowerCasedProp === 'shape-image-threshold'
+        ) {
+          clampOpacity(node);
+        }
+      } else if (node.type === 'function') {
+        if (
+          lowerCasedValue === 'calc' ||
+          lowerCasedValue === 'min' ||
+          lowerCasedValue === 'max' ||
+          lowerCasedValue === 'clamp' ||
+          lowerCasedValue === 'hsl' ||
+          lowerCasedValue === 'hsla'
+        ) {
+          valueParser.walk(node.nodes, (n) => {
+            if (n.type === 'word') {
+              parseWord(n, opts, true);
+            }
+          });
+          return false;
+        }
+        if (lowerCasedValue === 'url') {
+          return false;
+        }
+      }
+    })
+    .toString();
+}
+
+const plugin = 'postcss-convert-values';
+
+function pluginCreator(opts = { precision: false }) {
+  return {
+    postcssPlugin: plugin,
+    OnceExit(css) {
+      css.walkDecls(transform.bind(null, opts));
+    },
+  };
+}
+
+pluginCreator.postcss = true;
+module.exports = pluginCreator;

package/src/lib/convert.js

@@ -0,0 +1,68 @@
+'use strict';
+const lengthConv = new Map([
+  ['in', 96],
+  ['px', 1],
+  ['pt', 4 / 3],
+  ['pc', 16],
+]);
+
+const timeConv = new Map([
+  ['s', 1000],
+  ['ms', 1],
+]);
+
+const angleConv = new Map([
+  ['turn', 360],
+  ['deg', 1],
+]);
+
+function dropLeadingZero(number) {
+  const value = String(number);
+
+  if (number % 1) {
+    if (value[0] === '0') {
+      return value.slice(1);
+    }
+
+    if (value[0] === '-' && value[1] === '0') {
+      return '-' + value.slice(2);
+    }
+  }
+
+  return value;
+}
+
+function transform(number, originalUnit, conversions) {
+  let conversionUnits = [...conversions.keys()].filter((u) => {
+    return originalUnit !== u;
+  });
+
+  const base = number * conversions.get(originalUnit);
+
+  return conversionUnits
+    .map((u) => dropLeadingZero(base / conversions.get(u)) + u)
+    .reduce((a, b) => (a.length < b.length ? a : b));
+}
+
+module.exports = function (number, unit, { time, length, angle }) {
+  let value = dropLeadingZero(number) + (unit ? unit : '');
+  let converted;
+  const lowerCaseUnit = unit.toLowerCase();
+  if (length !== false && lengthConv.has(lowerCaseUnit)) {
+    converted = transform(number, lowerCaseUnit, lengthConv);
+  }
+
+  if (time !== false && timeConv.has(lowerCaseUnit)) {
+    converted = transform(number, lowerCaseUnit, timeConv);
+  }
+
+  if (angle !== false && angleConv.has(lowerCaseUnit)) {
+    converted = transform(number, lowerCaseUnit, angleConv);
+  }
+
+  if (converted && converted.length < value.length) {
+    value = converted;
+  }
+
+  return value;
+};

package/CHANGELOG.md

@@ -1,63 +0,0 @@
-# Change Log
-
-All notable changes to this project will be documented in this file.
-See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
-
-# [5.0.0](https://github.com/cssnano/cssnano/compare/postcss-convert-values@5.0.0-rc.2...postcss-convert-values@5.0.0) (2021-04-06)
-
-**Note:** Version bump only for package postcss-convert-values
-
-
-
-
-
-# [5.0.0-rc.2](https://github.com/cssnano/cssnano/compare/postcss-convert-values@5.0.0-rc.1...postcss-convert-values@5.0.0-rc.2) (2021-03-15)
-
-**Note:** Version bump only for package postcss-convert-values
-
-
-
-
-
-# [5.0.0-rc.1](https://github.com/cssnano/cssnano/compare/postcss-convert-values@5.0.0-rc.0...postcss-convert-values@5.0.0-rc.1) (2021-03-04)
-
-**Note:** Version bump only for package postcss-convert-values
-
-
-
-
-
-# 5.0.0-rc.0 (2021-02-19)
-
-
-### Bug Fixes
-
-* Keep math functions together ([#895](https://github.com/cssnano/cssnano/issues/895)) ([4ddf843](https://github.com/cssnano/cssnano/commit/4ddf843ca5dc64059f488113224e76165211a669))
-* preservation of opacities defined as percentages ([#881](https://github.com/cssnano/cssnano/issues/881)) ([fd7b878](https://github.com/cssnano/cssnano/commit/fd7b878e72ed9bd20c145c9e2daa7b5d48cb1117))
-* units being removed in math functions ([#894](https://github.com/cssnano/cssnano/issues/894)) ([1ccbd5b](https://github.com/cssnano/cssnano/commit/1ccbd5b29e1b2121efaf7b24a69aa782848966dc))
-* **postcss-convert-values:** prevent zero units from being dropped in line-height. ([#801](https://github.com/cssnano/cssnano/issues/801)) ([d781855](https://github.com/cssnano/cssnano/commit/d78185567ae5ebcde0469cf0e55145a7a3130d3e))
-
-
-### chore
-
-* minimum require version of node is 10.13 ([#871](https://github.com/cssnano/cssnano/issues/871)) ([28bda24](https://github.com/cssnano/cssnano/commit/28bda243e32ce3ba89b3c358a5f78727b3732f11))
-
-
-### Features
-
-* migarete to PostCSS 8 ([#975](https://github.com/cssnano/cssnano/issues/975)) ([40b82dc](https://github.com/cssnano/cssnano/commit/40b82dca7f53ac02cd4fe62846dec79b898ccb49))
-
-
-### BREAKING CHANGES
-
-* minimum supported `postcss` version is `8.2.1`
-* minimum require version of node is 10.13
-
-
-
-## 4.1.1 (2018-09-24)
-
-
-### Bug Fixes
-
-* **postcss-merge-longhand:** not mangle border output ([#555](https://github.com/cssnano/cssnano/issues/555)) ([9a70605](https://github.com/cssnano/cssnano/commit/9a706050b621e7795a9bf74eb7110b5c81804ffe)), closes [#553](https://github.com/cssnano/cssnano/issues/553) [#554](https://github.com/cssnano/cssnano/issues/554)

package/dist/index.js

@@ -1,128 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-
-var _postcssValueParser = _interopRequireWildcard(require("postcss-value-parser"));
-
-var _convert = _interopRequireDefault(require("./lib/convert"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-const LENGTH_UNITS = ['em', 'ex', 'ch', 'rem', 'vw', 'vh', 'vmin', 'vmax', 'cm', 'mm', 'q', 'in', 'pt', 'pc', 'px'];
-/*
- * Numbers without digits after the dot are technically invalid,
- * but in that case css-value-parser returns the dot as part of the unit,
- * so we use this to remove the dot.
- */
-
-function stripLeadingDot(item) {
-  if (item.charCodeAt(0) === '.'.charCodeAt(0)) {
-    return item.slice(1);
-  } else {
-    return item;
-  }
-}
-
-function parseWord(node, opts, keepZeroUnit) {
-  const pair = (0, _postcssValueParser.unit)(node.value);
-
-  if (pair) {
-    const num = Number(pair.number);
-    const u = stripLeadingDot(pair.unit);
-
-    if (num === 0) {
-      node.value = 0 + (keepZeroUnit || !~LENGTH_UNITS.indexOf(u.toLowerCase()) && u !== '%' ? u : '');
-    } else {
-      node.value = (0, _convert.default)(num, u, opts);
-
-      if (typeof opts.precision === 'number' && u.toLowerCase() === 'px' && ~pair.number.indexOf('.')) {
-        const precision = Math.pow(10, opts.precision);
-        node.value = Math.round(parseFloat(node.value) * precision) / precision + u;
-      }
-    }
-  }
-}
-
-function clampOpacity(node) {
-  const pair = (0, _postcssValueParser.unit)(node.value);
-
-  if (!pair) {
-    return;
-  }
-
-  let num = Number(pair.number);
-
-  if (num > 1) {
-    node.value = pair.unit === '%' ? num + pair.unit : 1 + pair.unit;
-  } else if (num < 0) {
-    node.value = 0 + pair.unit;
-  }
-}
-
-function shouldKeepUnit(decl) {
-  const {
-    parent
-  } = decl;
-  const lowerCasedProp = decl.prop.toLowerCase();
-  return ~decl.value.indexOf('%') && (lowerCasedProp === 'max-height' || lowerCasedProp === 'height') || parent.parent && parent.parent.name && parent.parent.name.toLowerCase() === 'keyframes' && lowerCasedProp === 'stroke-dasharray' || lowerCasedProp === 'stroke-dashoffset' || lowerCasedProp === 'stroke-width' || lowerCasedProp === 'line-height';
-}
-
-function transform(opts, decl) {
-  const lowerCasedProp = decl.prop.toLowerCase();
-
-  if (~lowerCasedProp.indexOf('flex') || lowerCasedProp.indexOf('--') === 0) {
-    return;
-  }
-
-  decl.value = (0, _postcssValueParser.default)(decl.value).walk(node => {
-    const lowerCasedValue = node.value.toLowerCase();
-
-    if (node.type === 'word') {
-      parseWord(node, opts, shouldKeepUnit(decl));
-
-      if (lowerCasedProp === 'opacity' || lowerCasedProp === 'shape-image-threshold') {
-        clampOpacity(node);
-      }
-    } else if (node.type === 'function') {
-      if (lowerCasedValue === 'calc' || lowerCasedValue === 'min' || lowerCasedValue === 'max' || lowerCasedValue === 'clamp' || lowerCasedValue === 'hsl' || lowerCasedValue === 'hsla') {
-        (0, _postcssValueParser.walk)(node.nodes, n => {
-          if (n.type === 'word') {
-            parseWord(n, opts, true);
-          }
-        });
-        return false;
-      }
-
-      if (lowerCasedValue === 'url') {
-        return false;
-      }
-    }
-  }).toString();
-}
-
-const plugin = 'postcss-convert-values';
-
-function pluginCreator(opts = {
-  precision: false
-}) {
-  return {
-    postcssPlugin: plugin,
-
-    OnceExit(css) {
-      css.walkDecls(transform.bind(null, opts));
-    }
-
-  };
-}
-
-pluginCreator.postcss = true;
-var _default = pluginCreator;
-exports.default = _default;
-module.exports = exports.default;

package/dist/lib/convert.js

@@ -1,85 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = _default;
-const lengthConv = {
-  in: 96,
-  px: 1,
-  pt: 4 / 3,
-  pc: 16
-};
-const timeConv = {
-  s: 1000,
-  ms: 1
-};
-const angleConv = {
-  turn: 360,
-  deg: 1
-};
-
-function dropLeadingZero(number) {
-  const value = String(number);
-
-  if (number % 1) {
-    if (value[0] === '0') {
-      return value.slice(1);
-    }
-
-    if (value[0] === '-' && value[1] === '0') {
-      return '-' + value.slice(2);
-    }
-  }
-
-  return value;
-}
-
-function transform(number, unit, conversion) {
-  const lowerCasedUnit = unit.toLowerCase();
-  let one, base;
-  let convertionUnits = Object.keys(conversion).filter(u => {
-    if (conversion[u] === 1) {
-      one = u;
-    }
-
-    return lowerCasedUnit !== u;
-  });
-
-  if (lowerCasedUnit === one) {
-    base = number / conversion[lowerCasedUnit];
-  } else {
-    base = number * conversion[lowerCasedUnit];
-  }
-
-  return convertionUnits.map(u => dropLeadingZero(base / conversion[u]) + u).reduce((a, b) => a.length < b.length ? a : b);
-}
-
-function _default(number, unit, {
-  time,
-  length,
-  angle
-}) {
-  let value = dropLeadingZero(number) + (unit ? unit : '');
-  let converted;
-
-  if (length !== false && unit.toLowerCase() in lengthConv) {
-    converted = transform(number, unit, lengthConv);
-  }
-
-  if (time !== false && unit.toLowerCase() in timeConv) {
-    converted = transform(number, unit, timeConv);
-  }
-
-  if (angle !== false && unit.toLowerCase() in angleConv) {
-    converted = transform(number, unit, angleConv);
-  }
-
-  if (converted && converted.length < value.length) {
-    value = converted;
-  }
-
-  return value;
-}
-
-module.exports = exports.default;