postcss-color-functional-notation - npm Package Compare versions

Comparing version 3.0.2 to 4.0.0

dist/index.cjs.js

 'use strict';
 
-function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }
-
-var postcss = _interopDefault(require('postcss'));
 var postcssValuesParser = require('postcss-values-parser');
@@ -22,6 +19,2 @@
 
-    if (name === 'hsl' && !isHsl) {
-      console.log([name, isHue(nodes[0])], nodes[0]);
-    }
-
     if (isHsl || isRgbWithNumbers || isRgbWithPercents) {
@@ -99,21 +92,21 @@ // rename the Color function to `hsl` or `rgb`
 
-const createRegExpTest = Function.bind.bind(RegExp.prototype.test);
+const createRegExpTest$1 = Function.bind.bind(RegExp.prototype.test);
 /** Return whether the function name is `hsl()`, `hsla()`, `rgb()`, or `rgba()`. */
 
-const isColorFunctionName = createRegExpTest(/^(hsl|rgb)a?$/i);
+const isColorFunctionName = createRegExpTest$1(/^(hsl|rgb)a?$/i);
 /** Return whether the function name is `hsl()` or `hsla()`. */
 
-const isHslColorFunctionName = createRegExpTest(/^hsla?$/i);
+const isHslColorFunctionName = createRegExpTest$1(/^hsla?$/i);
 /** Return whether the function name is `rgb()` or `rgba()`. */
 
-const isRgbColorFunctionName = createRegExpTest(/^rgba?$/i);
+const isRgbColorFunctionName = createRegExpTest$1(/^rgba?$/i);
 /** Return whether the function name is `calc`. */
 
-const isCalcFunctionName = createRegExpTest(/^calc$/i);
+const isCalcFunctionName = createRegExpTest$1(/^calc$/i);
 /** Return whether the unit is alpha-like. */
 
-const isAlphaLikeUnit = createRegExpTest(/^%?$/i);
+const isAlphaLikeUnit = createRegExpTest$1(/^%?$/i);
 /** Return whether the unit is hue-like. */
 
-const isHueLikeUnit = createRegExpTest(/^(deg|grad|rad|turn)?$/i);
+const isHueLikeUnit = createRegExpTest$1(/^(deg|grad|rad|turn)?$/i);
 /** @type {(node: CSSNumber) => boolean} Return whether the node is an Alpha-like unit. */
@@ -200,6 +193,6 @@
 
-const createRegExpTest$1 = Function.bind.bind(RegExp.prototype.test);
+const createRegExpTest = Function.bind.bind(RegExp.prototype.test);
 /** Return whether the value has an `hsl()`, `hsla()`, `rgb()`, or `rgba()` function. */
 
-const hasAnyColorFunction = createRegExpTest$1(/(^|[^\w-])(hsla?|rgba?)\(/i);
+const hasAnyColorFunction = createRegExpTest(/(^|[^\w-])(hsla?|rgba?)\(/i);
 /** @typedef {import('postcss').Declaration} CSSDeclaration */
@@ -209,8 +202,10 @@
 
-const postcssPlugin = postcss.plugin('postcss-color-functional-notation', opts => {
+function postcssColorFunctionalNotation(opts) {
   options.preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
-  return root => {
-    root.walkDecls(onCSSDeclaration);
+  return {
+    postcssPlugin: 'postcss-color-functional-notation',
+    Declaration: onCSSDeclaration
   };
-});
+}
+postcssColorFunctionalNotation.postcss = true;
 /** @typedef {import('postcss').Root} CSSRoot */
@@ -222,2 +217,2 @@
 
-module.exports = postcssPlugin;
+module.exports = postcssColorFunctionalNotation;

dist/index.esm.js

@@ -1,2 +0,1 @@
-import postcss from 'postcss';
 import { parse } from 'postcss-values-parser';
@@ -18,6 +17,2 @@
 
-    if (name === 'hsl' && !isHsl) {
-      console.log([name, isHue(nodes[0])], nodes[0]);
-    }
-
     if (isHsl || isRgbWithNumbers || isRgbWithPercents) {
@@ -95,21 +90,21 @@ // rename the Color function to `hsl` or `rgb`
 
-const createRegExpTest = Function.bind.bind(RegExp.prototype.test);
+const createRegExpTest$1 = Function.bind.bind(RegExp.prototype.test);
 /** Return whether the function name is `hsl()`, `hsla()`, `rgb()`, or `rgba()`. */
 
-const isColorFunctionName = createRegExpTest(/^(hsl|rgb)a?$/i);
+const isColorFunctionName = createRegExpTest$1(/^(hsl|rgb)a?$/i);
 /** Return whether the function name is `hsl()` or `hsla()`. */
 
-const isHslColorFunctionName = createRegExpTest(/^hsla?$/i);
+const isHslColorFunctionName = createRegExpTest$1(/^hsla?$/i);
 /** Return whether the function name is `rgb()` or `rgba()`. */
 
-const isRgbColorFunctionName = createRegExpTest(/^rgba?$/i);
+const isRgbColorFunctionName = createRegExpTest$1(/^rgba?$/i);
 /** Return whether the function name is `calc`. */
 
-const isCalcFunctionName = createRegExpTest(/^calc$/i);
+const isCalcFunctionName = createRegExpTest$1(/^calc$/i);
 /** Return whether the unit is alpha-like. */
 
-const isAlphaLikeUnit = createRegExpTest(/^%?$/i);
+const isAlphaLikeUnit = createRegExpTest$1(/^%?$/i);
 /** Return whether the unit is hue-like. */
 
-const isHueLikeUnit = createRegExpTest(/^(deg|grad|rad|turn)?$/i);
+const isHueLikeUnit = createRegExpTest$1(/^(deg|grad|rad|turn)?$/i);
 /** @type {(node: CSSNumber) => boolean} Return whether the node is an Alpha-like unit. */
@@ -196,6 +191,6 @@
 
-const createRegExpTest$1 = Function.bind.bind(RegExp.prototype.test);
+const createRegExpTest = Function.bind.bind(RegExp.prototype.test);
 /** Return whether the value has an `hsl()`, `hsla()`, `rgb()`, or `rgba()` function. */
 
-const hasAnyColorFunction = createRegExpTest$1(/(^|[^\w-])(hsla?|rgba?)\(/i);
+const hasAnyColorFunction = createRegExpTest(/(^|[^\w-])(hsla?|rgba?)\(/i);
 /** @typedef {import('postcss').Declaration} CSSDeclaration */
@@ -205,8 +200,10 @@
 
-const postcssPlugin = postcss.plugin('postcss-color-functional-notation', opts => {
+function postcssColorFunctionalNotation(opts) {
   options.preserve = 'preserve' in Object(opts) ? Boolean(opts.preserve) : false;
-  return root => {
-    root.walkDecls(onCSSDeclaration);
+  return {
+    postcssPlugin: 'postcss-color-functional-notation',
+    Declaration: onCSSDeclaration
   };
-});
+}
+postcssColorFunctionalNotation.postcss = true;
 /** @typedef {import('postcss').Root} CSSRoot */
@@ -218,2 +215,2 @@
 
-export default postcssPlugin;
+export { postcssColorFunctionalNotation as default };

package.json

 {
   "name": "postcss-color-functional-notation",
-  "version": "3.0.2",
+  "version": "4.0.0",
   "description": "Use space and slash separated color notation in CSS",
@@ -26,17 +26,19 @@ "author": "Jonathan Neal <[e-mail]>",
   "engines": {
-    "node": ">=10.0.0"
+    "node": ">=12"
   },
   "dependencies": {
-    "postcss": "^7.0.27",
-    "postcss-values-parser": "^3.2.0"
+    "postcss-values-parser": "6.0.0"
   },
+  "peerDependencies": {
+    "postcss": "^8.3"
+  },
   "devDependencies": {
-    "@babel/core": "^7.9.0",
-    "@babel/preset-env": "^7.9.5",
-    "babel-eslint": "^10.1.0",
-    "eslint": "^6.8.0",
-    "postcss-tape": "^5.0.2",
-    "pre-commit": "^1.2.2",
-    "rollup": "^2.7.2",
-    "rollup-plugin-babel": "^4.4.0"
+    "@babel/core": "7.15.5",
+    "@babel/preset-env": "7.15.6",
+    "eslint": "7.32.0",
+    "postcss": "8.3.6",
+    "postcss-tape": "6.0.1",
+    "pre-commit": "1.2.2",
+    "rollup": "2.56.3",
+    "rollup-plugin-babel": "4.4.0"
   },
@@ -59,3 +61,5 @@ "babel": {
     "extends": "eslint:recommended",
-    "parser": "babel-eslint"
+    "parserOptions": {
+      "sourceType": "module"
+    }
   },
@@ -69,2 +73,3 @@ "rollup": {
       {
+        "exports": "default",
         "file": "dist/index.cjs.js",
@@ -71,0 +76,0 @@ "format": "cjs"

README.md

@@ -5,3 +5,3 @@ # PostCSS Color Functional Notation [<img src="https://postcss.github.io/postcss/logo.svg" alt="PostCSS Logo" width="90" height="90" align="right">][postcss]
 [<img alt="CSS Standard Status" src="https://cssdb.org/badge/lab-function.svg" height="20">][css-url]
-[<img alt="Build Status" src="https://img.shields.io/travis/csstools/postcss-color-functional-notation/master.svg" height="20">][cli-url]
+[<img alt="Build Status" src="https://github.com/csstools/postcss-color-functional-notation/workflows/test/badge.svg" height="20">][cli-url]
 [<img alt="Support Chat" src="https://img.shields.io/badge/support-chat-blue.svg" height="20">][git-url]
@@ -41,10 +41,2 @@
 ```js
-const postcssColorFunctionalNotation = require('postcss-color-functional-notation');
-
-postcssColorFunctionalNotation.process(YOUR_CSS /*, processOptions, pluginOptions */);
-```
-
-Or use it as a [PostCSS] plugin:
-
-```js
 const postcss = require('postcss');
@@ -96,3 +88,3 @@ const postcssColorFunctionalNotation = require('postcss-color-functional-notation');
 
-[cli-url]: https://travis-ci.org/csstools/postcss-color-functional-notation
+[cli-url]: https://github.com/csstools/postcss-color-functional-notation/actions/workflows/test.yml?query=workflow/test
 [css-url]: https://cssdb.org/#color-functional-notation
@@ -99,0 +91,0 @@ [git-url]: https://gitter.im/postcss/postcss

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

Worsened metrics

Total package byte prevSize

28380

decreased by-3.71%

Number of package files

5

decreased by-16.67%

Lines of code

301

decreased by-1.63%

Number of lines in readme file

97

decreased by-7.62%

Dependency changes

• + Addedis-url-superb@4.0.0(transitive)

• + Addednanoid@3.3.7(transitive)

• + Addedpicocolors@1.1.1(transitive)

• + Addedpostcss@8.4.49(transitive)

• + Addedpostcss-values-parser@6.0.0(transitive)

• + Addedquote-unquote@1.0.0(transitive)

• + Addedsource-map-js@1.2.1(transitive)

• - Removedpostcss@^7.0.27

• - Removedip-regex@4.3.0(transitive)

• - Removedis-url-superb@3.0.0(transitive)

• - Removedpicocolors@0.2.1(transitive)

• - Removedpostcss@7.0.39(transitive)

• - Removedpostcss-values-parser@3.2.1(transitive)

• - Removedsource-map@0.6.1(transitive)

• - Removedtlds@1.255.0(transitive)

• - Removedurl-regex@5.0.0(transitive)

• Updatedpostcss-values-parser@6.0.0