postcss-color-functional-notation 1.0.0 → 2.0.1

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changes to PostCSS Color Functional Notation
 
+### 2.0.1 (September 18, 2018)
+
+- Updated: PostCSS Values Parser 2 (patch for this project)
+
+### 2.0.0 (September 17, 2018)
+
+- Updated: Support for PostCSS v7+
+- Updated: Support for Node 6+
+
+### 1.0.2 (July 13, 2018)
+
+- Fixed: Poorly detected hsl() and rgb() now resolve correctly
+
+### 1.0.1 (May 11, 2018)
+
+- Fixed: A non-percentage 0 works alongside other percentages
+
 ### 1.0.0 (May 7, 2018)
 
 - Initial version

package/README.md

@@ -3,7 +3,6 @@
 [![NPM Version][npm-img]][npm-url]
 [![CSS Standard Status][css-img]][css-url]
 [![Build Status][cli-img]][cli-url]
-[![Windows Build Status][win-img]][win-url]
 [![Support Chat][git-img]][git-url]
 
 [PostCSS Color Functional Notation] lets you use space and slash separated
@@ -12,143 +11,52 @@ color notation in CSS, following the [CSS Color] specification.
 ```pcss
 :root {
   --firebrick: rgb(178 34 34);
-  --firebrick-a50: color: rgb(70% 13.5% 13.5% / 50%);
-  --firebrick-hsl: color: hsla(0 68% 42%);
-  --firebrick-hsl-a50: color: hsl(0 68% 42% / 50%);
+  --firebrick-a50: rgb(70% 13.5% 13.5% / 50%);
+  --firebrick-hsl: hsla(0 68% 42%);
+  --firebrick-hsl-a50: hsl(0 68% 42% / 50%);
 }
 
 /* becomes */
 
 :root {
   --firebrick: rgb(178, 34, 34);
-  --firebrick-a50: color: rgba(178, 34, 34, .5);
-  --firebrick-hsl: color: hsl(0, 68%, 42%);
-  --firebrick-hsl-a50: color: hsla(0, 68%, 42%, .5);
+  --firebrick-a50: rgba(178, 34, 34, .5);
+  --firebrick-hsl: hsl(0, 68%, 42%);
+  --firebrick-hsl-a50: hsla(0, 68%, 42%, .5);
 }
 ```
 
 ## Usage
 
-Add [PostCSS Color Functional Notation] to your build tool:
+Add [PostCSS Color Functional Notation] to your project:
 
 ```bash
 npm install postcss-color-functional-notation --save-dev
 ```
 
-#### Node
-
 Use [PostCSS Color Functional Notation] to process your CSS:
 
 ```js
-import postcssColorFunctionalNotation from 'postcss-color-functional-notation';
-
-postcssColorFunctionalNotation.process(YOUR_CSS, /* processOptions */, /* pluginOptions */);
-```
-
-#### PostCSS
+const postcssColorFunctionalNotation = require('postcss-color-functional-notation');
 
-Add [PostCSS] to your build tool:
-
-```bash
-npm install postcss --save-dev
+postcssColorFunctionalNotation.process(YOUR_CSS /*, processOptions, pluginOptions */);
 ```
 
-Use [PostCSS Color Functional Notation] as a plugin:
+Or use it as a [PostCSS] plugin:
 
 ```js
-import postcss from 'gulp-postcss';
-import postcssColorFunctionalNotation from 'postcss-color-functional-notation';
+const postcss = require('postcss');
+const postcssColorFunctionalNotation = require('postcss-color-functional-notation');
 
 postcss([
   postcssColorFunctionalNotation(/* pluginOptions */)
-]).process(YOUR_CSS);
-```
-
-#### Webpack
-
-Add [PostCSS Loader] to your build tool:
-
-```bash
-npm install postcss-loader --save-dev
-```
-
-Use [PostCSS Color Functional Notation] in your Webpack configuration:
-
-```js
-import postcssColorFunctionalNotation from 'postcss-color-functional-notation';
-
-module.exports = {
-  module: {
-    rules: [
-      {
-        test: /\.css$/,
-        use: [
-          'style-loader',
-          { loader: 'css-loader', options: { importLoaders: 1 } },
-          { loader: 'postcss-loader', options: {
-            ident: 'postcss',
-            plugins: () => [
-              postcssColorFunctionalNotation(/* pluginOptions */)
-            ]
-          } }
-        ]
-      }
-    ]
-  }
-}
+]).process(YOUR_CSS /*, processOptions */);
 ```
 
-#### Gulp
+[PostCSS Color Functional Notation] runs in all Node environments, with special instructions for:
 
-Add [Gulp PostCSS] to your build tool:
-
-```bash
-npm install gulp-postcss --save-dev
-```
-
-Use [PostCSS Color Functional Notation] in your Gulpfile:
-
-```js
-import postcss from 'gulp-postcss';
-import postcssColorFunctionalNotation from 'postcss-color-functional-notation';
-
-gulp.task('css', () => gulp.src('./src/*.css').pipe(
-  postcss([
-    postcssColorFunctionalNotation(/* pluginOptions */)
-  ])
-).pipe(
-  gulp.dest('.')
-));
-```
-
-#### Grunt
-
-Add [Grunt PostCSS] to your build tool:
-
-```bash
-npm install grunt-postcss --save-dev
-```
-
-Use [PostCSS Color Functional Notation] in your Gruntfile:
-
-```js
-import postcssColorFunctionalNotation from 'postcss-color-functional-notation';
-
-grunt.loadNpmTasks('grunt-postcss');
-
-grunt.initConfig({
-  postcss: {
-    options: {
-      use: [
-       postcssColorFunctionalNotation(/* pluginOptions */)
-      ]
-    },
-    dist: {
-      src: '*.css'
-    }
-  }
-});
-```
+| [Node](INSTALL.md#node) | [PostCSS CLI](INSTALL.md#postcss-cli) | [Webpack](INSTALL.md#webpack) | [Create React App](INSTALL.md#create-react-app) | [Gulp](INSTALL.md#gulp) | [Grunt](INSTALL.md#grunt) |
+| --- | --- | --- | --- | --- | --- |
 
 ## Options
 
@@ -164,9 +72,9 @@ postcssImageSetFunction({ preserve: true })
 ```pcss
 :root {
   --firebrick: rgb(178 34 34);
-  --firebrick-a50: color: rgb(70% 13.5% 13.5% / 50%);
-  --firebrick-hsl: color: hsla(0 68% 42%);
-  --firebrick-hsl-a50: color: hsl(0 68% 42% / 50%);
+  --firebrick-a50: rgb(70% 13.5% 13.5% / 50%);
+  --firebrick-hsl: hsla(0 68% 42%);
+  --firebrick-hsl-a50: hsl(0 68% 42% / 50%);
 }
 
 /* becomes */
@@ -174,12 +82,12 @@ postcssImageSetFunction({ preserve: true })
 :root {
   --firebrick: rgb(178, 34, 34);
   --firebrick: rgb(178 34 34);
-  --firebrick-a50: color: rgba(178, 34, 34, .5);
-  --firebrick-a50: color: rgb(70% 13.5% 13.5% / 50%);
-  --firebrick-hsl: color: hsl(0, 68%, 42%);
-  --firebrick-hsl: color: hsla(0 68% 42%);
-  --firebrick-hsl-a50: color: hsla(0, 68%, 42%, .5);
-  --firebrick-hsl-a50: color: hsl(0 68% 42% / 50%);
+  --firebrick-a50: rgba(178, 34, 34, .5);
+  --firebrick-a50: rgb(70% 13.5% 13.5% / 50%);
+  --firebrick-hsl: hsl(0, 68%, 42%);
+  --firebrick-hsl: hsla(0 68% 42%);
+  --firebrick-hsl-a50: hsla(0, 68%, 42%, .5);
+  --firebrick-hsl-a50: hsl(0 68% 42% / 50%);
 }
 ```
 
@@ -191,8 +99,6 @@ postcssImageSetFunction({ preserve: true })
 [git-url]: https://gitter.im/postcss/postcss
 [npm-img]: https://img.shields.io/npm/v/postcss-color-functional-notation.svg
 [npm-url]: https://www.npmjs.com/package/postcss-color-functional-notation
-[win-img]: https://img.shields.io/appveyor/ci/jonathantneal/postcss-color-functional-notation.svg
-[win-url]: https://ci.appveyor.com/project/jonathantneal/postcss-color-functional-notation
 
 [CSS Color]: https://drafts.csswg.org/css-color/#ref-for-funcdef-rgb%E2%91%A1%E2%91%A0
 [Gulp PostCSS]: https://github.com/postcss/gulp-postcss

package/index.cjs.js

@@ -3,127 +3,114 @@
 function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
 
 var postcss = _interopDefault(require('postcss'));
-var parser = _interopDefault(require('postcss-values-parser'));
-
-var colorAnyRegExp = /(^|[^\w-])(hsla?|rgba?)\(/i;
-var colorRegExp = /^(hsla?|rgba?)$/i;
-
-var index = postcss.plugin('postcss-color-functional-notation', function (opts) {
-	var preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
-
-	return function (root) {
-		root.walkDecls(function (decl) {
-			var value = decl.value;
-
-
-			if (colorAnyRegExp.test(value)) {
-				var ast = parser(value).parse();
-
-				ast.walkType('func', function (node) {
-					if (colorRegExp.test(node.value)) {
-						var children = node.nodes.slice(1, -1);
-						var isFunctionalHSL = matchFunctionalHSL(children);
-						var isFunctionalRGB1 = matchFunctionalRGB1(children);
-						var isFunctionalRGB2 = matchFunctionalRGB2(children);
-
-						if (isFunctionalHSL || isFunctionalRGB1 || isFunctionalRGB2) {
-							var slashNode = children[3];
-							var alphaNode = children[4];
-
-							if (alphaNode) {
-								if (isPercentage(alphaNode) && !isCalc(alphaNode)) {
-									alphaNode.unit = '';
-									alphaNode.value = String(alphaNode.value / 100);
-								}
-
-								if (isHslRgb(node)) {
-									node.value += 'a';
-								}
-							} else if (isHslaRgba(node)) {
-								node.value = node.value.slice(0, -1);
-							}
-
-							if (isSlash(slashNode)) {
-								slashNode.replaceWith(newComma());
-							}
-
-							if (isFunctionalRGB2) {
-								children[0].unit = children[1].unit = children[2].unit = '';
-
-								children[0].value = String(Math.floor(children[0].value * 255 / 100));
-								children[1].value = String(Math.floor(children[1].value * 255 / 100));
-								children[2].value = String(Math.floor(children[2].value * 255 / 100));
-							}
-
-							node.nodes.splice(3, 0, [newComma()]);
-							node.nodes.splice(2, 0, [newComma()]);
-						}
-					}
-				});
-
-				var newValue = String(ast);
-
-				if (preserve) {
-					decl.cloneBefore({ value: newValue });
-				} else {
-					decl.value = newValue;
-				}
-			}
-		});
-	};
+var valuesParser = _interopDefault(require('postcss-values-parser'));
+
+var index = postcss.plugin('postcss-color-functional-notation', opts => {
+  const preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
+  return root => {
+    root.walkDecls(decl => {
+      const originalValue = decl.value;
+
+      if (colorAnyRegExp.test(originalValue)) {
+        const valueAST = valuesParser(originalValue).parse();
+        valueAST.walkType('func', node => {
+          if (colorRegExp.test(node.value)) {
+            const children = node.nodes.slice(1, -1);
+            const isFunctionalHSL = matchFunctionalHSL(node, children);
+            const isFunctionalRGB1 = matchFunctionalRGB1(node, children);
+            const isFunctionalRGB2 = matchFunctionalRGB2(node, children);
+
+            if (isFunctionalHSL || isFunctionalRGB1 || isFunctionalRGB2) {
+              const slashNode = children[3];
+              const alphaNode = children[4];
+
+              if (alphaNode) {
+                if (isPercentage(alphaNode) && !isCalc(alphaNode)) {
+                  alphaNode.unit = '';
+                  alphaNode.value = String(alphaNode.value / 100);
+                }
+
+                if (isHslRgb(node)) {
+                  node.value += 'a';
+                }
+              } else if (isHslaRgba(node)) {
+                node.value = node.value.slice(0, -1);
+              }
+
+              if (slashNode && isSlash(slashNode)) {
+                slashNode.replaceWith(newComma());
+              }
+
+              if (isFunctionalRGB2) {
+                children[0].unit = children[1].unit = children[2].unit = '';
+                children[0].value = String(Math.floor(children[0].value * 255 / 100));
+                children[1].value = String(Math.floor(children[1].value * 255 / 100));
+                children[2].value = String(Math.floor(children[2].value * 255 / 100));
+              }
+
+              node.nodes.splice(3, 0, [newComma()]);
+              node.nodes.splice(2, 0, [newComma()]);
+            }
+          }
+        });
+        const modifiedValue = String(valueAST);
+
+        if (modifiedValue !== originalValue) {
+          if (preserve) {
+            decl.cloneBefore({
+              value: modifiedValue
+            });
+          } else {
+            decl.value = modifiedValue;
+          }
+        }
+      }
+    });
+  };
 });
+const alphaUnitMatch = /^%?$/i;
+const calcFuncMatch = /^calc$/i;
+const colorAnyRegExp = /(^|[^\w-])(hsla?|rgba?)\(/i;
+const colorRegExp = /^(hsla?|rgba?)$/i;
+const hslishRegExp = /^hsla?$/i;
+const hslRgbFuncMatch = /^(hsl|rgb)$/i;
+const hslaRgbaFuncMatch = /^(hsla|rgba)$/i;
+const hueUnitMatch = /^(deg|grad|rad|turn)?$/i;
+const rgbishRegExp = /^rgba?$/i;
 
-var alphaUnitMatch = /^%?$/i;
-var calcFuncMatch = /^calc$/i;
-var hueUnitMatch = /^(deg|grad|rad|turn)?$/i;
-var hslRgbFuncMatch = /^(hsl|rgb)$/i;
-var hslaRgbaFuncMatch = /^(hsla|rgba)$/i;
-var isAlphaValue = function isAlphaValue(node) {
-	return isCalc(node) || Object(node).type === 'number' && alphaUnitMatch.test(node.unit);
-};
-var isCalc = function isCalc(node) {
-	return Object(node).type === 'func' && calcFuncMatch.test(node.value);
-};
-var isHue = function isHue(node) {
-	return isCalc(node) || Object(node).type === 'number' && hueUnitMatch.test(node.unit);
-};
-var isNumber = function isNumber(node) {
-	return isCalc(node) || Object(node).type === 'number' && node.unit === '';
-};
-var isPercentage = function isPercentage(node) {
-	return isCalc(node) || Object(node).type === 'number' && node.unit === '%';
-};
-var isHslRgb = function isHslRgb(node) {
-	return Object(node).type === 'func' && hslRgbFuncMatch.test(node.value);
-};
-var isHslaRgba = function isHslaRgba(node) {
-	return Object(node).type === 'func' && hslaRgbaFuncMatch.test(node.value);
-};
-var isSlash = function isSlash(node) {
-	return Object(node).type === 'operator' && node.value === '/';
-};
-var functionalHSLMatch = [isHue, isPercentage, isPercentage, isSlash, isAlphaValue];
-var functionalRGB1Match = [isNumber, isNumber, isNumber, isSlash, isAlphaValue];
-var functionalRGB2Match = [isPercentage, isPercentage, isPercentage, isSlash, isAlphaValue];
-
-var matchFunctionalHSL = function matchFunctionalHSL(children) {
-	return children.every(function (child, index) {
-		return typeof functionalHSLMatch[index] === 'function' && functionalHSLMatch[index](child);
-	});
-};
-var matchFunctionalRGB1 = function matchFunctionalRGB1(children) {
-	return children.every(function (child, index) {
-		return typeof functionalRGB1Match[index] === 'function' && functionalRGB1Match[index](child);
-	});
-};
-var matchFunctionalRGB2 = function matchFunctionalRGB2(children) {
-	return children.every(function (child, index) {
-		return typeof functionalRGB2Match[index] === 'function' && functionalRGB2Match[index](child);
-	});
-};
-
-var newComma = function newComma() {
-	return parser.comma({ value: ',' });
-};
+const isAlphaValue = node => isCalc(node) || node.type === 'number' && alphaUnitMatch.test(node.unit);
+
+const isCalc = node => node.type === 'func' && calcFuncMatch.test(node.value);
+
+const isHue = node => isCalc(node) || node.type === 'number' && hueUnitMatch.test(node.unit);
+
+const isNumber = node => isCalc(node) || node.type === 'number' && node.unit === '';
+
+const isPercentage = node => isCalc(node) || node.type === 'number' && (node.unit === '%' || node.unit === '' && node.value === '0');
+
+const isHslish = node => node.type === 'func' && hslishRegExp.test(node.value);
+
+const isHslRgb = node => node.type === 'func' && hslRgbFuncMatch.test(node.value);
+
+const isHslaRgba = node => node.type === 'func' && hslaRgbaFuncMatch.test(node.value);
+
+const isRgbish = node => node.type === 'func' && rgbishRegExp.test(node.value);
+
+const isSlash = node => node.type === 'operator' && node.value === '/';
+
+const functionalHSLMatch = [isHue, isPercentage, isPercentage, isSlash, isAlphaValue];
+const functionalRGB1Match = [isNumber, isNumber, isNumber, isSlash, isAlphaValue];
+const functionalRGB2Match = [isPercentage, isPercentage, isPercentage, isSlash, isAlphaValue];
+
+const matchFunctionalHSL = (node, children) => isHslish(node) && children.every((child, index) => typeof functionalHSLMatch[index] === 'function' && functionalHSLMatch[index](child));
+
+const matchFunctionalRGB1 = (node, children) => isRgbish(node) && children.every((child, index) => typeof functionalRGB1Match[index] === 'function' && functionalRGB1Match[index](child));
+
+const matchFunctionalRGB2 = (node, children) => isRgbish(node) && children.every((child, index) => typeof functionalRGB2Match[index] === 'function' && functionalRGB2Match[index](child));
+
+const newComma = () => valuesParser.comma({
+  value: ','
+});
 
 module.exports = index;
+//# sourceMappingURL=index.cjs.js.map

package/index.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs.js","sources":["index.js"],"sourcesContent":["import postcss from 'postcss';\nimport valuesParser from 'postcss-values-parser';\n\nexport default postcss.plugin('postcss-color-functional-notation', opts => {\n\tconst preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;\n\n\treturn root => {\n\t\troot.walkDecls(decl => {\n\t\t\tconst { value: originalValue } = decl;\n\n\t\t\tif (colorAnyRegExp.test(originalValue)) {\n\t\t\t\tconst valueAST = valuesParser(originalValue).parse();\n\n\t\t\t\tvalueAST.walkType('func', node => {\n\t\t\t\t\tif (colorRegExp.test(node.value)) {\n\t\t\t\t\t\tconst children = node.nodes.slice(1, -1);\n\t\t\t\t\t\tconst isFunctionalHSL = matchFunctionalHSL(node, children);\n\t\t\t\t\t\tconst isFunctionalRGB1 = matchFunctionalRGB1(node, children);\n\t\t\t\t\t\tconst isFunctionalRGB2 = matchFunctionalRGB2(node, children);\n\n\t\t\t\t\t\tif (isFunctionalHSL || isFunctionalRGB1 || isFunctionalRGB2) {\n\t\t\t\t\t\t\tconst slashNode = children[3];\n\t\t\t\t\t\t\tconst alphaNode = children[4];\n\n\t\t\t\t\t\t\tif (alphaNode) {\n\t\t\t\t\t\t\t\tif (isPercentage(alphaNode) && !isCalc(alphaNode)) {\n\t\t\t\t\t\t\t\t\talphaNode.unit = '';\n\t\t\t\t\t\t\t\t\talphaNode.value = String(alphaNode.value / 100);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\tif (isHslRgb(node)) {\n\t\t\t\t\t\t\t\t\tnode.value += 'a';\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} else if (isHslaRgba(node)) {\n\t\t\t\t\t\t\t\tnode.value = node.value.slice(0, -1);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (slashNode && isSlash(slashNode)) {\n\t\t\t\t\t\t\t\tslashNode.replaceWith( newComma() );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (isFunctionalRGB2) {\n\t\t\t\t\t\t\t\tchildren[0].unit = children[1].unit = children[2].unit = '';\n\n\t\t\t\t\t\t\t\tchildren[0].value = String(Math.floor(children[0].value * 255 / 100));\n\t\t\t\t\t\t\t\tchildren[1].value = String(Math.floor(children[1].value * 255 / 100));\n\t\t\t\t\t\t\t\tchildren[2].value = String(Math.floor(children[2].value * 255 / 100));\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tnode.nodes.splice(3, 0, [ newComma() ]);\n\t\t\t\t\t\t\tnode.nodes.splice(2, 0, [ newComma() ]);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t});\n\n\t\t\t\tconst modifiedValue = String(valueAST);\n\n\t\t\t\tif (modifiedValue !== originalValue) {\n\t\t\t\t\tif (preserve) {\n\t\t\t\t\t\tdecl.cloneBefore({ value: modifiedValue });\n\t\t\t\t\t} else {\n\t\t\t\t\t\tdecl.value = modifiedValue;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t};\n});\n\nconst alphaUnitMatch = /^%?$/i;\nconst calcFuncMatch = /^calc$/i;\nconst colorAnyRegExp = /(^|[^\\w-])(hsla?|rgba?)\\(/i;\nconst colorRegExp = /^(hsla?|rgba?)$/i;\nconst hslishRegExp = /^hsla?$/i;\nconst hslRgbFuncMatch = /^(hsl|rgb)$/i;\nconst hslaRgbaFuncMatch = /^(hsla|rgba)$/i;\nconst hueUnitMatch = /^(deg|grad|rad|turn)?$/i;\nconst rgbishRegExp = /^rgba?$/i;\nconst isAlphaValue = node => isCalc(node) || node.type === 'number' && alphaUnitMatch.test(node.unit);\nconst isCalc = node => node.type === 'func' && calcFuncMatch.test(node.value);\nconst isHue = node => isCalc(node) || node.type === 'number' && hueUnitMatch.test(node.unit);\nconst isNumber = node => isCalc(node) || node.type === 'number' && node.unit === '';\nconst isPercentage = node => isCalc(node) || node.type === 'number' && (node.unit === '%' || node.unit === '' && node.value === '0');\nconst isHslish = node => node.type === 'func' && hslishRegExp.test(node.value);\nconst isHslRgb = node => node.type === 'func' && hslRgbFuncMatch.test(node.value);\nconst isHslaRgba = node => node.type === 'func' && hslaRgbaFuncMatch.test(node.value);\nconst isRgbish = node => node.type === 'func' && rgbishRegExp.test(node.value);\nconst isSlash = node => node.type === 'operator' && node.value === '/';\nconst functionalHSLMatch = [isHue, isPercentage, isPercentage, isSlash, isAlphaValue];\nconst functionalRGB1Match = [isNumber, isNumber, isNumber, isSlash, isAlphaValue];\nconst functionalRGB2Match = [isPercentage, isPercentage, isPercentage, isSlash, isAlphaValue];\n\nconst matchFunctionalHSL = (node, children) => isHslish(node) && children.every(\n\t(child, index) => typeof functionalHSLMatch[index] === 'function' && functionalHSLMatch[index](child)\n);\nconst matchFunctionalRGB1 = (node, children) => isRgbish(node) && children.every(\n\t(child, index) => typeof functionalRGB1Match[index] === 'function' && functionalRGB1Match[index](child)\n);\nconst matchFunctionalRGB2 = (node, children) => isRgbish(node) && children.every(\n\t(child, index) => typeof functionalRGB2Match[index] === 'function' && functionalRGB2Match[index](child)\n);\n\nconst newComma = () => valuesParser.comma({ value: ',' })\n"],"names":["postcss","plugin","opts","preserve","Object","Boolean","root","walkDecls","decl","originalValue","value","colorAnyRegExp","test","valueAST","valuesParser","parse","walkType","node","colorRegExp","children","nodes","slice","isFunctionalHSL","matchFunctionalHSL","isFunctionalRGB1","matchFunctionalRGB1","isFunctionalRGB2","matchFunctionalRGB2","slashNode","alphaNode","isPercentage","isCalc","unit","String","isHslRgb","isHslaRgba","isSlash","replaceWith","newComma","Math","floor","splice","modifiedValue","cloneBefore","alphaUnitMatch","calcFuncMatch","hslishRegExp","hslRgbFuncMatch","hslaRgbaFuncMatch","hueUnitMatch","rgbishRegExp","isAlphaValue","type","isHue","isNumber","isHslish","isRgbish","functionalHSLMatch","functionalRGB1Match","functionalRGB2Match","every","child","index","comma"],"mappings":"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"}

package/index.es.mjs

@@ -0,0 +1,112 @@
+import postcss from 'postcss';
+import valuesParser from 'postcss-values-parser';
+
+var index = postcss.plugin('postcss-color-functional-notation', opts => {
+  const preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
+  return root => {
+    root.walkDecls(decl => {
+      const originalValue = decl.value;
+
+      if (colorAnyRegExp.test(originalValue)) {
+        const valueAST = valuesParser(originalValue).parse();
+        valueAST.walkType('func', node => {
+          if (colorRegExp.test(node.value)) {
+            const children = node.nodes.slice(1, -1);
+            const isFunctionalHSL = matchFunctionalHSL(node, children);
+            const isFunctionalRGB1 = matchFunctionalRGB1(node, children);
+            const isFunctionalRGB2 = matchFunctionalRGB2(node, children);
+
+            if (isFunctionalHSL || isFunctionalRGB1 || isFunctionalRGB2) {
+              const slashNode = children[3];
+              const alphaNode = children[4];
+
+              if (alphaNode) {
+                if (isPercentage(alphaNode) && !isCalc(alphaNode)) {
+                  alphaNode.unit = '';
+                  alphaNode.value = String(alphaNode.value / 100);
+                }
+
+                if (isHslRgb(node)) {
+                  node.value += 'a';
+                }
+              } else if (isHslaRgba(node)) {
+                node.value = node.value.slice(0, -1);
+              }
+
+              if (slashNode && isSlash(slashNode)) {
+                slashNode.replaceWith(newComma());
+              }
+
+              if (isFunctionalRGB2) {
+                children[0].unit = children[1].unit = children[2].unit = '';
+                children[0].value = String(Math.floor(children[0].value * 255 / 100));
+                children[1].value = String(Math.floor(children[1].value * 255 / 100));
+                children[2].value = String(Math.floor(children[2].value * 255 / 100));
+              }
+
+              node.nodes.splice(3, 0, [newComma()]);
+              node.nodes.splice(2, 0, [newComma()]);
+            }
+          }
+        });
+        const modifiedValue = String(valueAST);
+
+        if (modifiedValue !== originalValue) {
+          if (preserve) {
+            decl.cloneBefore({
+              value: modifiedValue
+            });
+          } else {
+            decl.value = modifiedValue;
+          }
+        }
+      }
+    });
+  };
+});
+const alphaUnitMatch = /^%?$/i;
+const calcFuncMatch = /^calc$/i;
+const colorAnyRegExp = /(^|[^\w-])(hsla?|rgba?)\(/i;
+const colorRegExp = /^(hsla?|rgba?)$/i;
+const hslishRegExp = /^hsla?$/i;
+const hslRgbFuncMatch = /^(hsl|rgb)$/i;
+const hslaRgbaFuncMatch = /^(hsla|rgba)$/i;
+const hueUnitMatch = /^(deg|grad|rad|turn)?$/i;
+const rgbishRegExp = /^rgba?$/i;
+
+const isAlphaValue = node => isCalc(node) || node.type === 'number' && alphaUnitMatch.test(node.unit);
+
+const isCalc = node => node.type === 'func' && calcFuncMatch.test(node.value);
+
+const isHue = node => isCalc(node) || node.type === 'number' && hueUnitMatch.test(node.unit);
+
+const isNumber = node => isCalc(node) || node.type === 'number' && node.unit === '';
+
+const isPercentage = node => isCalc(node) || node.type === 'number' && (node.unit === '%' || node.unit === '' && node.value === '0');
+
+const isHslish = node => node.type === 'func' && hslishRegExp.test(node.value);
+
+const isHslRgb = node => node.type === 'func' && hslRgbFuncMatch.test(node.value);
+
+const isHslaRgba = node => node.type === 'func' && hslaRgbaFuncMatch.test(node.value);
+
+const isRgbish = node => node.type === 'func' && rgbishRegExp.test(node.value);
+
+const isSlash = node => node.type === 'operator' && node.value === '/';
+
+const functionalHSLMatch = [isHue, isPercentage, isPercentage, isSlash, isAlphaValue];
+const functionalRGB1Match = [isNumber, isNumber, isNumber, isSlash, isAlphaValue];
+const functionalRGB2Match = [isPercentage, isPercentage, isPercentage, isSlash, isAlphaValue];
+
+const matchFunctionalHSL = (node, children) => isHslish(node) && children.every((child, index) => typeof functionalHSLMatch[index] === 'function' && functionalHSLMatch[index](child));
+
+const matchFunctionalRGB1 = (node, children) => isRgbish(node) && children.every((child, index) => typeof functionalRGB1Match[index] === 'function' && functionalRGB1Match[index](child));
+
+const matchFunctionalRGB2 = (node, children) => isRgbish(node) && children.every((child, index) => typeof functionalRGB2Match[index] === 'function' && functionalRGB2Match[index](child));
+
+const newComma = () => valuesParser.comma({
+  value: ','
+});
+
+export default index;
+//# sourceMappingURL=index.es.mjs.map

package/index.es.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.es.mjs","sources":["index.js"],"sourcesContent":["import postcss from 'postcss';\nimport valuesParser from 'postcss-values-parser';\n\nexport default postcss.plugin('postcss-color-functional-notation', opts => {\n\tconst preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;\n\n\treturn root => {\n\t\troot.walkDecls(decl => {\n\t\t\tconst { value: originalValue } = decl;\n\n\t\t\tif (colorAnyRegExp.test(originalValue)) {\n\t\t\t\tconst valueAST = valuesParser(originalValue).parse();\n\n\t\t\t\tvalueAST.walkType('func', node => {\n\t\t\t\t\tif (colorRegExp.test(node.value)) {\n\t\t\t\t\t\tconst children = node.nodes.slice(1, -1);\n\t\t\t\t\t\tconst isFunctionalHSL = matchFunctionalHSL(node, children);\n\t\t\t\t\t\tconst isFunctionalRGB1 = matchFunctionalRGB1(node, children);\n\t\t\t\t\t\tconst isFunctionalRGB2 = matchFunctionalRGB2(node, children);\n\n\t\t\t\t\t\tif (isFunctionalHSL || isFunctionalRGB1 || isFunctionalRGB2) {\n\t\t\t\t\t\t\tconst slashNode = children[3];\n\t\t\t\t\t\t\tconst alphaNode = children[4];\n\n\t\t\t\t\t\t\tif (alphaNode) {\n\t\t\t\t\t\t\t\tif (isPercentage(alphaNode) && !isCalc(alphaNode)) {\n\t\t\t\t\t\t\t\t\talphaNode.unit = '';\n\t\t\t\t\t\t\t\t\talphaNode.value = String(alphaNode.value / 100);\n\t\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\t\tif (isHslRgb(node)) {\n\t\t\t\t\t\t\t\t\tnode.value += 'a';\n\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t} else if (isHslaRgba(node)) {\n\t\t\t\t\t\t\t\tnode.value = node.value.slice(0, -1);\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (slashNode && isSlash(slashNode)) {\n\t\t\t\t\t\t\t\tslashNode.replaceWith( newComma() );\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tif (isFunctionalRGB2) {\n\t\t\t\t\t\t\t\tchildren[0].unit = children[1].unit = children[2].unit = '';\n\n\t\t\t\t\t\t\t\tchildren[0].value = String(Math.floor(children[0].value * 255 / 100));\n\t\t\t\t\t\t\t\tchildren[1].value = String(Math.floor(children[1].value * 255 / 100));\n\t\t\t\t\t\t\t\tchildren[2].value = String(Math.floor(children[2].value * 255 / 100));\n\t\t\t\t\t\t\t}\n\n\t\t\t\t\t\t\tnode.nodes.splice(3, 0, [ newComma() ]);\n\t\t\t\t\t\t\tnode.nodes.splice(2, 0, [ newComma() ]);\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t\t});\n\n\t\t\t\tconst modifiedValue = String(valueAST);\n\n\t\t\t\tif (modifiedValue !== originalValue) {\n\t\t\t\t\tif (preserve) {\n\t\t\t\t\t\tdecl.cloneBefore({ value: modifiedValue });\n\t\t\t\t\t} else {\n\t\t\t\t\t\tdecl.value = modifiedValue;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t});\n\t};\n});\n\nconst alphaUnitMatch = /^%?$/i;\nconst calcFuncMatch = /^calc$/i;\nconst colorAnyRegExp = /(^|[^\\w-])(hsla?|rgba?)\\(/i;\nconst colorRegExp = /^(hsla?|rgba?)$/i;\nconst hslishRegExp = /^hsla?$/i;\nconst hslRgbFuncMatch = /^(hsl|rgb)$/i;\nconst hslaRgbaFuncMatch = /^(hsla|rgba)$/i;\nconst hueUnitMatch = /^(deg|grad|rad|turn)?$/i;\nconst rgbishRegExp = /^rgba?$/i;\nconst isAlphaValue = node => isCalc(node) || node.type === 'number' && alphaUnitMatch.test(node.unit);\nconst isCalc = node => node.type === 'func' && calcFuncMatch.test(node.value);\nconst isHue = node => isCalc(node) || node.type === 'number' && hueUnitMatch.test(node.unit);\nconst isNumber = node => isCalc(node) || node.type === 'number' && node.unit === '';\nconst isPercentage = node => isCalc(node) || node.type === 'number' && (node.unit === '%' || node.unit === '' && node.value === '0');\nconst isHslish = node => node.type === 'func' && hslishRegExp.test(node.value);\nconst isHslRgb = node => node.type === 'func' && hslRgbFuncMatch.test(node.value);\nconst isHslaRgba = node => node.type === 'func' && hslaRgbaFuncMatch.test(node.value);\nconst isRgbish = node => node.type === 'func' && rgbishRegExp.test(node.value);\nconst isSlash = node => node.type === 'operator' && node.value === '/';\nconst functionalHSLMatch = [isHue, isPercentage, isPercentage, isSlash, isAlphaValue];\nconst functionalRGB1Match = [isNumber, isNumber, isNumber, isSlash, isAlphaValue];\nconst functionalRGB2Match = [isPercentage, isPercentage, isPercentage, isSlash, isAlphaValue];\n\nconst matchFunctionalHSL = (node, children) => isHslish(node) && children.every(\n\t(child, index) => typeof functionalHSLMatch[index] === 'function' && functionalHSLMatch[index](child)\n);\nconst matchFunctionalRGB1 = (node, children) => isRgbish(node) && children.every(\n\t(child, index) => typeof functionalRGB1Match[index] === 'function' && functionalRGB1Match[index](child)\n);\nconst matchFunctionalRGB2 = (node, children) => isRgbish(node) && children.every(\n\t(child, index) => typeof functionalRGB2Match[index] === 'function' && functionalRGB2Match[index](child)\n);\n\nconst newComma = () => valuesParser.comma({ value: ',' })\n"],"names":["postcss","plugin","opts","preserve","Object","Boolean","root","walkDecls","decl","originalValue","value","colorAnyRegExp","test","valueAST","valuesParser","parse","walkType","node","colorRegExp","children","nodes","slice","isFunctionalHSL","matchFunctionalHSL","isFunctionalRGB1","matchFunctionalRGB1","isFunctionalRGB2","matchFunctionalRGB2","slashNode","alphaNode","isPercentage","isCalc","unit","String","isHslRgb","isHslaRgba","isSlash","replaceWith","newComma","Math","floor","splice","modifiedValue","cloneBefore","alphaUnitMatch","calcFuncMatch","hslishRegExp","hslRgbFuncMatch","hslaRgbaFuncMatch","hueUnitMatch","rgbishRegExp","isAlphaValue","type","isHue","isNumber","isHslish","isRgbish","functionalHSLMatch","functionalRGB1Match","functionalRGB2Match","every","child","index","comma"],"mappings":";;;AAGA,YAAeA,OAAO,CAACC,MAAR,CAAe,mCAAf,EAAoDC,IAAI,IAAI;QACpEC,QAAQ,GAAG,cAAcC,MAAM,CAACF,IAAD,CAApB,GAA6BG,OAAO,CAACH,IAAI,CAACC,QAAN,CAApC,GAAsD,KAAvE;SAEOG,IAAI,IAAI;IACdA,IAAI,CAACC,SAAL,CAAeC,IAAI,IAAI;YACPC,aADO,GACWD,IADX,CACdE,KADc;;UAGlBC,cAAc,CAACC,IAAf,CAAoBH,aAApB,CAAJ,EAAwC;cACjCI,QAAQ,GAAGC,YAAY,CAACL,aAAD,CAAZ,CAA4BM,KAA5B,EAAjB;QAEAF,QAAQ,CAACG,QAAT,CAAkB,MAAlB,EAA0BC,IAAI,IAAI;cAC7BC,WAAW,CAACN,IAAZ,CAAiBK,IAAI,CAACP,KAAtB,CAAJ,EAAkC;kBAC3BS,QAAQ,GAAGF,IAAI,CAACG,KAAL,CAAWC,KAAX,CAAiB,CAAjB,EAAoB,CAAC,CAArB,CAAjB;kBACMC,eAAe,GAAGC,kBAAkB,CAACN,IAAD,EAAOE,QAAP,CAA1C;kBACMK,gBAAgB,GAAGC,mBAAmB,CAACR,IAAD,EAAOE,QAAP,CAA5C;kBACMO,gBAAgB,GAAGC,mBAAmB,CAACV,IAAD,EAAOE,QAAP,CAA5C;;gBAEIG,eAAe,IAAIE,gBAAnB,IAAuCE,gBAA3C,EAA6D;oBACtDE,SAAS,GAAGT,QAAQ,CAAC,CAAD,CAA1B;oBACMU,SAAS,GAAGV,QAAQ,CAAC,CAAD,CAA1B;;kBAEIU,SAAJ,EAAe;oBACVC,YAAY,CAACD,SAAD,CAAZ,IAA2B,CAACE,MAAM,CAACF,SAAD,CAAtC,EAAmD;kBAClDA,SAAS,CAACG,IAAV,GAAiB,EAAjB;kBACAH,SAAS,CAACnB,KAAV,GAAkBuB,MAAM,CAACJ,SAAS,CAACnB,KAAV,GAAkB,GAAnB,CAAxB;;;oBAGGwB,QAAQ,CAACjB,IAAD,CAAZ,EAAoB;kBACnBA,IAAI,CAACP,KAAL,IAAc,GAAd;;eAPF,MASO,IAAIyB,UAAU,CAAClB,IAAD,CAAd,EAAsB;gBAC5BA,IAAI,CAACP,KAAL,GAAaO,IAAI,CAACP,KAAL,CAAWW,KAAX,CAAiB,CAAjB,EAAoB,CAAC,CAArB,CAAb;;;kBAGGO,SAAS,IAAIQ,OAAO,CAACR,SAAD,CAAxB,EAAqC;gBACpCA,SAAS,CAACS,WAAV,CAAuBC,QAAQ,EAA/B;;;kBAGGZ,gBAAJ,EAAsB;gBACrBP,QAAQ,CAAC,CAAD,CAAR,CAAYa,IAAZ,GAAmBb,QAAQ,CAAC,CAAD,CAAR,CAAYa,IAAZ,GAAmBb,QAAQ,CAAC,CAAD,CAAR,CAAYa,IAAZ,GAAmB,EAAzD;gBAEAb,QAAQ,CAAC,CAAD,CAAR,CAAYT,KAAZ,GAAoBuB,MAAM,CAACM,IAAI,CAACC,KAAL,CAAWrB,QAAQ,CAAC,CAAD,CAAR,CAAYT,KAAZ,GAAoB,GAApB,GAA0B,GAArC,CAAD,CAA1B;gBACAS,QAAQ,CAAC,CAAD,CAAR,CAAYT,KAAZ,GAAoBuB,MAAM,CAACM,IAAI,CAACC,KAAL,CAAWrB,QAAQ,CAAC,CAAD,CAAR,CAAYT,KAAZ,GAAoB,GAApB,GAA0B,GAArC,CAAD,CAA1B;gBACAS,QAAQ,CAAC,CAAD,CAAR,CAAYT,KAAZ,GAAoBuB,MAAM,CAACM,IAAI,CAACC,KAAL,CAAWrB,QAAQ,CAAC,CAAD,CAAR,CAAYT,KAAZ,GAAoB,GAApB,GAA0B,GAArC,CAAD,CAA1B;;;cAGDO,IAAI,CAACG,KAAL,CAAWqB,MAAX,CAAkB,CAAlB,EAAqB,CAArB,EAAwB,CAAEH,QAAQ,EAAV,CAAxB;cACArB,IAAI,CAACG,KAAL,CAAWqB,MAAX,CAAkB,CAAlB,EAAqB,CAArB,EAAwB,CAAEH,QAAQ,EAAV,CAAxB;;;SArCH;cA0CMI,aAAa,GAAGT,MAAM,CAACpB,QAAD,CAA5B;;YAEI6B,aAAa,KAAKjC,aAAtB,EAAqC;cAChCN,QAAJ,EAAc;YACbK,IAAI,CAACmC,WAAL,CAAiB;cAAEjC,KAAK,EAAEgC;aAA1B;WADD,MAEO;YACNlC,IAAI,CAACE,KAAL,GAAagC,aAAb;;;;KAtDJ;GADD;CAHc,CAAf;AAkEA,MAAME,cAAc,GAAG,OAAvB;AACA,MAAMC,aAAa,GAAG,SAAtB;AACA,MAAMlC,cAAc,GAAG,4BAAvB;AACA,MAAMO,WAAW,GAAG,kBAApB;AACA,MAAM4B,YAAY,GAAG,UAArB;AACA,MAAMC,eAAe,GAAG,cAAxB;AACA,MAAMC,iBAAiB,GAAG,gBAA1B;AACA,MAAMC,YAAY,GAAG,yBAArB;AACA,MAAMC,YAAY,GAAG,UAArB;;AACA,MAAMC,YAAY,GAAGlC,IAAI,IAAIc,MAAM,CAACd,IAAD,CAAN,IAAgBA,IAAI,CAACmC,IAAL,KAAc,QAAd,IAA0BR,cAAc,CAAChC,IAAf,CAAoBK,IAAI,CAACe,IAAzB,CAAvE;;AACA,MAAMD,MAAM,GAAGd,IAAI,IAAIA,IAAI,CAACmC,IAAL,KAAc,MAAd,IAAwBP,aAAa,CAACjC,IAAd,CAAmBK,IAAI,CAACP,KAAxB,CAA/C;;AACA,MAAM2C,KAAK,GAAGpC,IAAI,IAAIc,MAAM,CAACd,IAAD,CAAN,IAAgBA,IAAI,CAACmC,IAAL,KAAc,QAAd,IAA0BH,YAAY,CAACrC,IAAb,CAAkBK,IAAI,CAACe,IAAvB,CAAhE;;AACA,MAAMsB,QAAQ,GAAGrC,IAAI,IAAIc,MAAM,CAACd,IAAD,CAAN,IAAgBA,IAAI,CAACmC,IAAL,KAAc,QAAd,IAA0BnC,IAAI,CAACe,IAAL,KAAc,EAAjF;;AACA,MAAMF,YAAY,GAAGb,IAAI,IAAIc,MAAM,CAACd,IAAD,CAAN,IAAgBA,IAAI,CAACmC,IAAL,KAAc,QAAd,KAA2BnC,IAAI,CAACe,IAAL,KAAc,GAAd,IAAqBf,IAAI,CAACe,IAAL,KAAc,EAAd,IAAoBf,IAAI,CAACP,KAAL,KAAe,GAAnF,CAA7C;;AACA,MAAM6C,QAAQ,GAAGtC,IAAI,IAAIA,IAAI,CAACmC,IAAL,KAAc,MAAd,IAAwBN,YAAY,CAAClC,IAAb,CAAkBK,IAAI,CAACP,KAAvB,CAAjD;;AACA,MAAMwB,QAAQ,GAAGjB,IAAI,IAAIA,IAAI,CAACmC,IAAL,KAAc,MAAd,IAAwBL,eAAe,CAACnC,IAAhB,CAAqBK,IAAI,CAACP,KAA1B,CAAjD;;AACA,MAAMyB,UAAU,GAAGlB,IAAI,IAAIA,IAAI,CAACmC,IAAL,KAAc,MAAd,IAAwBJ,iBAAiB,CAACpC,IAAlB,CAAuBK,IAAI,CAACP,KAA5B,CAAnD;;AACA,MAAM8C,QAAQ,GAAGvC,IAAI,IAAIA,IAAI,CAACmC,IAAL,KAAc,MAAd,IAAwBF,YAAY,CAACtC,IAAb,CAAkBK,IAAI,CAACP,KAAvB,CAAjD;;AACA,MAAM0B,OAAO,GAAGnB,IAAI,IAAIA,IAAI,CAACmC,IAAL,KAAc,UAAd,IAA4BnC,IAAI,CAACP,KAAL,KAAe,GAAnE;;AACA,MAAM+C,kBAAkB,GAAG,CAACJ,KAAD,EAAQvB,YAAR,EAAsBA,YAAtB,EAAoCM,OAApC,EAA6Ce,YAA7C,CAA3B;AACA,MAAMO,mBAAmB,GAAG,CAACJ,QAAD,EAAWA,QAAX,EAAqBA,QAArB,EAA+BlB,OAA/B,EAAwCe,YAAxC,CAA5B;AACA,MAAMQ,mBAAmB,GAAG,CAAC7B,YAAD,EAAeA,YAAf,EAA6BA,YAA7B,EAA2CM,OAA3C,EAAoDe,YAApD,CAA5B;;AAEA,MAAM5B,kBAAkB,GAAG,CAACN,IAAD,EAAOE,QAAP,KAAoBoC,QAAQ,CAACtC,IAAD,CAAR,IAAkBE,QAAQ,CAACyC,KAAT,CAChE,CAACC,KAAD,EAAQC,KAAR,KAAkB,OAAOL,kBAAkB,CAACK,KAAD,CAAzB,KAAqC,UAArC,IAAmDL,kBAAkB,CAACK,KAAD,CAAlB,CAA0BD,KAA1B,CADL,CAAjE;;AAGA,MAAMpC,mBAAmB,GAAG,CAACR,IAAD,EAAOE,QAAP,KAAoBqC,QAAQ,CAACvC,IAAD,CAAR,IAAkBE,QAAQ,CAACyC,KAAT,CACjE,CAACC,KAAD,EAAQC,KAAR,KAAkB,OAAOJ,mBAAmB,CAACI,KAAD,CAA1B,KAAsC,UAAtC,IAAoDJ,mBAAmB,CAACI,KAAD,CAAnB,CAA2BD,KAA3B,CADL,CAAlE;;AAGA,MAAMlC,mBAAmB,GAAG,CAACV,IAAD,EAAOE,QAAP,KAAoBqC,QAAQ,CAACvC,IAAD,CAAR,IAAkBE,QAAQ,CAACyC,KAAT,CACjE,CAACC,KAAD,EAAQC,KAAR,KAAkB,OAAOH,mBAAmB,CAACG,KAAD,CAA1B,KAAsC,UAAtC,IAAoDH,mBAAmB,CAACG,KAAD,CAAnB,CAA2BD,KAA3B,CADL,CAAlE;;AAIA,MAAMvB,QAAQ,GAAG,MAAMxB,YAAY,CAACiD,KAAb,CAAmB;EAAErD,KAAK,EAAE;CAA5B,CAAvB;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "postcss-color-functional-notation",
-  "version": "1.0.0",
+  "version": "2.0.1",
   "description": "Use space and slash separated color notation in CSS",
   "author": "Jonathan Neal <jonathantneal@hotmail.com>",
   "license": "CC0-1.0",
@@ -8,10 +8,12 @@
   "homepage": "https://github.com/jonathantneal/postcss-color-functional-notation#readme",
   "bugs": "https://github.com/jonathantneal/postcss-color-functional-notation/issues",
   "main": "index.cjs.js",
-  "module": "index.es.js",
+  "module": "index.es.mjs",
   "files": [
     "index.cjs.js",
-    "index.es.js"
+    "index.cjs.js.map",
+    "index.es.mjs",
+    "index.es.mjs.map"
   ],
   "scripts": {
     "prepublishOnly": "npm test",
@@ -22,22 +24,22 @@
     "test:tape": "postcss-tape"
   },
   "engines": {
-    "node": ">=4.0.0"
+    "node": ">=6.0.0"
   },
   "dependencies": {
-    "postcss": "^6.0.22",
-    "postcss-values-parser": "^1.5.0"
+    "postcss": "^7.0.2",
+    "postcss-values-parser": "^2.0.0"
   },
   "devDependencies": {
-    "babel-core": "^6.26.3",
-    "babel-eslint": "^8.2.3",
-    "babel-preset-env": "^1.6.1",
-    "eslint": "^4.19.1",
+    "@babel/core": "^7.1.0",
+    "@babel/preset-env": "^7.1.0",
+    "babel-eslint": "^9.0.0",
+    "eslint": "^5.6.0",
     "eslint-config-dev": "^2.0.0",
     "postcss-tape": "^2.2.0",
     "pre-commit": "^1.2.2",
-    "rollup": "^0.58.2",
-    "rollup-plugin-babel": "^3.0.4"
+    "rollup": "^0.66.0",
+    "rollup-plugin-babel": "^4.0.3"
   },
   "eslintConfig": {
     "extends": "dev",

package/index.es.js

@@ -1,125 +0,0 @@
-import postcss from 'postcss';
-import parser from 'postcss-values-parser';
-
-var colorAnyRegExp = /(^|[^\w-])(hsla?|rgba?)\(/i;
-var colorRegExp = /^(hsla?|rgba?)$/i;
-
-var index = postcss.plugin('postcss-color-functional-notation', function (opts) {
-	var preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
-
-	return function (root) {
-		root.walkDecls(function (decl) {
-			var value = decl.value;
-
-
-			if (colorAnyRegExp.test(value)) {
-				var ast = parser(value).parse();
-
-				ast.walkType('func', function (node) {
-					if (colorRegExp.test(node.value)) {
-						var children = node.nodes.slice(1, -1);
-						var isFunctionalHSL = matchFunctionalHSL(children);
-						var isFunctionalRGB1 = matchFunctionalRGB1(children);
-						var isFunctionalRGB2 = matchFunctionalRGB2(children);
-
-						if (isFunctionalHSL || isFunctionalRGB1 || isFunctionalRGB2) {
-							var slashNode = children[3];
-							var alphaNode = children[4];
-
-							if (alphaNode) {
-								if (isPercentage(alphaNode) && !isCalc(alphaNode)) {
-									alphaNode.unit = '';
-									alphaNode.value = String(alphaNode.value / 100);
-								}
-
-								if (isHslRgb(node)) {
-									node.value += 'a';
-								}
-							} else if (isHslaRgba(node)) {
-								node.value = node.value.slice(0, -1);
-							}
-
-							if (isSlash(slashNode)) {
-								slashNode.replaceWith(newComma());
-							}
-
-							if (isFunctionalRGB2) {
-								children[0].unit = children[1].unit = children[2].unit = '';
-
-								children[0].value = String(Math.floor(children[0].value * 255 / 100));
-								children[1].value = String(Math.floor(children[1].value * 255 / 100));
-								children[2].value = String(Math.floor(children[2].value * 255 / 100));
-							}
-
-							node.nodes.splice(3, 0, [newComma()]);
-							node.nodes.splice(2, 0, [newComma()]);
-						}
-					}
-				});
-
-				var newValue = String(ast);
-
-				if (preserve) {
-					decl.cloneBefore({ value: newValue });
-				} else {
-					decl.value = newValue;
-				}
-			}
-		});
-	};
-});
-
-var alphaUnitMatch = /^%?$/i;
-var calcFuncMatch = /^calc$/i;
-var hueUnitMatch = /^(deg|grad|rad|turn)?$/i;
-var hslRgbFuncMatch = /^(hsl|rgb)$/i;
-var hslaRgbaFuncMatch = /^(hsla|rgba)$/i;
-var isAlphaValue = function isAlphaValue(node) {
-	return isCalc(node) || Object(node).type === 'number' && alphaUnitMatch.test(node.unit);
-};
-var isCalc = function isCalc(node) {
-	return Object(node).type === 'func' && calcFuncMatch.test(node.value);
-};
-var isHue = function isHue(node) {
-	return isCalc(node) || Object(node).type === 'number' && hueUnitMatch.test(node.unit);
-};
-var isNumber = function isNumber(node) {
-	return isCalc(node) || Object(node).type === 'number' && node.unit === '';
-};
-var isPercentage = function isPercentage(node) {
-	return isCalc(node) || Object(node).type === 'number' && node.unit === '%';
-};
-var isHslRgb = function isHslRgb(node) {
-	return Object(node).type === 'func' && hslRgbFuncMatch.test(node.value);
-};
-var isHslaRgba = function isHslaRgba(node) {
-	return Object(node).type === 'func' && hslaRgbaFuncMatch.test(node.value);
-};
-var isSlash = function isSlash(node) {
-	return Object(node).type === 'operator' && node.value === '/';
-};
-var functionalHSLMatch = [isHue, isPercentage, isPercentage, isSlash, isAlphaValue];
-var functionalRGB1Match = [isNumber, isNumber, isNumber, isSlash, isAlphaValue];
-var functionalRGB2Match = [isPercentage, isPercentage, isPercentage, isSlash, isAlphaValue];
-
-var matchFunctionalHSL = function matchFunctionalHSL(children) {
-	return children.every(function (child, index) {
-		return typeof functionalHSLMatch[index] === 'function' && functionalHSLMatch[index](child);
-	});
-};
-var matchFunctionalRGB1 = function matchFunctionalRGB1(children) {
-	return children.every(function (child, index) {
-		return typeof functionalRGB1Match[index] === 'function' && functionalRGB1Match[index](child);
-	});
-};
-var matchFunctionalRGB2 = function matchFunctionalRGB2(children) {
-	return children.every(function (child, index) {
-		return typeof functionalRGB2Match[index] === 'function' && functionalRGB2Match[index](child);
-	});
-};
-
-var newComma = function newComma() {
-	return parser.comma({ value: ',' });
-};
-
-export default index;