postcss-color-mod-function - npm Package Compare versions

Comparing version 4.0.0 to 4.1.0

index.cjs.js

 'use strict';
 
-var valueParser = require('postcss-values-parser');
+var parser = require('postcss-value-parser');
 var fs = require('fs');
@@ -30,3 +30,3 @@ var path = require('path');
 					// write the parsed value to the custom property
-					customPropertiesObject[prop] = valueParser(decl.value).parse();
+					customPropertiesObject[prop] = parser(decl.value);
 
@@ -93,3 +93,3 @@ // conditionally remove the custom property declaration
 	for (const prop in customProperties) {
-		customProperties[prop] = valueParser(customProperties[prop]).parse();
+		customProperties[prop] = parser(customProperties[prop]);
 	}
@@ -877,3 +877,3 @@
 function transformAST(node, opts) {
-	node.nodes.slice(0).forEach(child => {
+	node.nodes.slice(0).forEach((child, index) => {
 		if (isColorModFunction(child)) {
@@ -890,6 +890,6 @@ // transform any variables within the color-mod() function
 				// update the color-mod() function with the transformed value
-				child.replaceWith(valueParser.word({
-					raws: child.raws,
+				node.nodes.splice(index, 1, {
+					type: 'word',
 					value: opts.stringifier(color)
-				}));
+				});
 			}
@@ -906,3 +906,3 @@ } else if (child.nodes && Object(child.nodes).length) {
 function transformVariables(node, opts) {
-	walk(node, child => {
+	parser.walk(node.nodes, (child, index, nodes) => {
 		if (isVariable(child)) {
@@ -920,4 +920,4 @@ // get the custom property and fallback value from var()
 				// follow custom properties referencing custom properties
-				if (looseVarMatch.test(customPropertyValue)) {
-					const rootChildAST = customPropertyValue.clone();
+				if (looseVarMatch.test(parser.stringify(customPropertyValue))) {
+					const rootChildAST = JSON.parse(JSON.stringify({ nodes: customPropertyValue.nodes }));
 
@@ -930,9 +930,7 @@ transformVariables(rootChildAST, opts);
 				// replace var() with the custom property value
-				if (customPropertyValue.nodes.length === 1 && customPropertyValue.nodes[0].nodes.length) {
-					customPropertyValue.nodes[0].nodes.forEach(customPropertyChild => {
-						child.parent.insertBefore(child, customPropertyChild);
-					});
+				if (customPropertyValue.nodes.length) {
+					nodes.splice(index, 0, ...JSON.parse(JSON.stringify(customPropertyValue.nodes)));
 				}
 
-				child.remove();
+				nodes.splice(nodes.indexOf(child), 1);
 			} else if (fallbackNode && fallbackNode.nodes.length === 1 && fallbackNode.nodes[0].nodes.length) {
@@ -942,3 +940,3 @@ // otherwise, replace var() with the fallback value
 
-				child.replaceWith(...fallbackNode.nodes[0].nodes[0]);
+				nodes.splice(index, 1, ...fallbackNode.nodes[0].nodes[0]);
 			}
@@ -1029,3 +1027,3 @@ }
 	// [ <color> | <hue> ] <color-adjuster>*
-	const [colorOrHueNode, ...adjusterNodes] = (node.nodes || []).slice(1, -1) || [];
+	const [colorOrHueNode, ...adjusterNodes] = node.nodes || [];
 
@@ -1088,3 +1086,5 @@ if (colorOrHueNode !== undefined) {
 function transformColorByAdjusters(color, adjusterNodes, opts) {
-	const adjustedColor = adjusterNodes.reduce((base, node) => {
+	const adjustedColor = adjusterNodes.filter((node) => {
+		return node.type !== 'space' && node.type !== 'comment';
+	}).reduce((base, node) => {
 		if (isAlphaBlueGreenRedAdjuster(node)) {
@@ -1342,3 +1342,3 @@ return transformAlphaBlueGreenRedAdjuster(base, node, opts);
 		// <number>
-		return node.value * 100;
+		return Number(parser.unit(node.value).number) * 100;
 	} else if (isPercentage(node)) {
@@ -1366,16 +1366,16 @@ // <percentage>
 		// <hue> = <number> | <angle>
-		const unit = node.unit.toLowerCase();
+		const unit = parser.unit(node.value).unit.toLowerCase();
 
 		if (unit === 'grad') {
 			// if <angle> = <gradian> (400 per circle)
-			return convertGtoD(node.value);
+			return convertGtoD(Number(parser.unit(node.value).number));
 		} else if (unit === 'rad') {
 			// if <angle> = <radian> (2π per circle)
-			return convertRtoD(node.value);
+			return convertRtoD(Number(parser.unit(node.value).number));
 		} else if (unit === 'turn') {
 			// if <angle> = <turn> (1 per circle)
-			return convertTtoD(node.value);
+			return convertTtoD(Number(parser.unit(node.value).number));
 		} else {
 			// if <angle> = [ <degree> | <number> ] (360 per circle)
-			return convertDtoD(node.value);
+			return convertDtoD(Number(parser.unit(node.value).number));
 		}
@@ -1391,5 +1391,5 @@ } else {
 		// <percentage>
-		return Number(node.value);
+		return Number(parser.unit(node.value).number);
 	} else {
-		return manageUnresolved(node, opts, node.value, `Expected a valid hue`);
+		return manageUnresolved(node, opts, node.value, `Expected a valid percentage`);
 	}
@@ -1448,26 +1448,20 @@ }
 function transformArgsByParams(node, params) {
-	const nodes = (node.nodes || []).slice(1, -1);
+	const nodes = (node.nodes || []).filter((node) => {
+		return node.type !== 'space' && node.type !== 'comment';
+	});
 	const opts = { unresolved: 'ignore' };
 
-	return params.map(param => nodes.map(
-		(childNode, index) => typeof param[index] === 'function' ? param[index](childNode, opts) : undefined
-	).filter(child => typeof child !== 'boolean')).filter(param => param.every(
-		result => result !== undefined
-	))[0] || [];
+	return params.map((param) => {
+		return nodes.map((childNode, index) => {
+			return typeof param[index] === 'function' ? param[index](childNode, opts) : undefined
+		}).filter((child) => {
+			return typeof child !== 'boolean'
+		})
+	}).filter((param) => {
+		return param.every((result) => {
+			return result !== undefined
+		})
+	})[0] || [];
 }
 
-/* Walk helper (required because the default walker is affected by mutations)
-/* ========================================================================== */
-
-// run a function over each node and hen walk each child node of that node
-function walk(node, fn) {
-	fn(node);
-
-	if (Object(node.nodes).length) {
-		node.nodes.slice().forEach(childNode => {
-			walk(childNode, fn);
-		});
-	}
-}
-
 /* Variable validators
@@ -1479,3 +1473,3 @@ /* ========================================================================== */
 	// var()
-	return Object(node).type === 'func' && varMatch.test(node.value);
+	return Object(node).type === 'function' && varMatch.test(node.value);
 }
@@ -1489,3 +1483,3 @@
 	// [ a(), alpha(), blue(), green(), red() ]
-	return Object(node).type === 'func' && alphaBlueGreenRedMatch.test(node.value);
+	return Object(node).type === 'function' && alphaBlueGreenRedMatch.test(node.value);
 }
@@ -1495,3 +1489,3 @@
 function isRGBAdjuster(node) {
-	return Object(node).type === 'func' && rgbMatch.test(node.value);
+	return Object(node).type === 'function' && rgbMatch.test(node.value);
 }
@@ -1502,3 +1496,3 @@
 	// [ h() | hue() ]
-	return Object(node).type === 'func' && hueMatch.test(node.value);
+	return Object(node).type === 'function' && hueMatch.test(node.value);
 }
@@ -1509,3 +1503,3 @@
 	// [ b() | blackness() | l() | lightness() | s() | saturation() | w() | whiteness() ]
-	return Object(node).type === 'func' && blacknessLightnessSaturationWhitenessMatch.test(node.value);
+	return Object(node).type === 'function' && blacknessLightnessSaturationWhitenessMatch.test(node.value);
 }
@@ -1516,3 +1510,3 @@
 	// [ shade() | tint() ]
-	return Object(node).type === 'func' && shadeTintMatch.test(node.value);
+	return Object(node).type === 'function' && shadeTintMatch.test(node.value);
 }
@@ -1523,3 +1517,3 @@
 	// [ blend(), blenda() ]
-	return Object(node).type === 'func' && blendMatch.test(node.value);
+	return Object(node).type === 'function' && blendMatch.test(node.value);
 }
@@ -1530,3 +1524,3 @@
 	// [ contrast() ]
-	return Object(node).type === 'func' && contrastMatch.test(node.value);
+	return Object(node).type === 'function' && contrastMatch.test(node.value);
 }
@@ -1540,3 +1534,3 @@
 	// [ rgb(), rgba() ]
-	return Object(node).type === 'func' && rgbaMatch.test(node.value);
+	return Object(node).type === 'function' && rgbaMatch.test(node.value);
 }
@@ -1547,3 +1541,3 @@
 	// [ hsl(), hsla() ]
-	return Object(node).type === 'func' && hslaMatch.test(node.value);
+	return Object(node).type === 'function' && hslaMatch.test(node.value);
 }
@@ -1554,3 +1548,3 @@
 	// hwb()
-	return Object(node).type === 'func' && hwbMatch.test(node.value);
+	return Object(node).type === 'function' && hwbMatch.test(node.value);
 }
@@ -1561,3 +1555,3 @@
 	// color-mod()
-	return Object(node).type === 'func' && colorModMatch.test(node.value);
+	return Object(node).type === 'function' && colorModMatch.test(node.value);
 }
@@ -1587,3 +1581,8 @@
 function isHue(node) {
-	return Object(node).type === 'number' && hueUnitMatch.test(node.unit);
+	if (Object(node).type !== 'word') {
+		return false;
+	}
+
+	const parsedNumber = parser.unit(node.value);
+	return parsedNumber && hueUnitMatch.test(parsedNumber.unit);
 }
@@ -1593,3 +1592,3 @@
 function isComma(node) {
-	return Object(node).type === 'comma';
+	return Object(node).type === 'div' && node.value === ',';
 }
@@ -1599,3 +1598,3 @@
 function isSlash(node) {
-	return Object(node).type === 'operator' && node.value === '/';
+	return Object(node).type === 'div' && node.value === '/';
 }
@@ -1605,3 +1604,8 @@
 function isNumber(node) {
-	return Object(node).type === 'number' && node.unit === '';
+	if (Object(node).type !== 'word') {
+		return false;
+	}
+
+	const parsedNumber = parser.unit(node.value);
+	return parsedNumber && parsedNumber.unit === '';
 }
@@ -1611,3 +1615,3 @@
 function isMinusPlusOperator(node) {
-	return Object(node).type === 'operator' && minusPlusMatch.test(node.value);
+	return Object(node).type === 'word' && minusPlusMatch.test(node.value);
 }
@@ -1617,3 +1621,3 @@
 function isMinusPlusTimesOperator(node) {
-	return Object(node).type === 'operator' && minusPlusTimesMatch.test(node.value);
+	return Object(node).type === 'word' && minusPlusTimesMatch.test(node.value);
 }
@@ -1623,3 +1627,3 @@
 function isTimesOperator(node) {
-	return Object(node).type === 'operator' && timesMatch.test(node.value);
+	return Object(node).type === 'word' && timesMatch.test(node.value);
 }
@@ -1629,3 +1633,8 @@
 function isPercentage(node) {
-	return Object(node).type === 'number' && (node.unit === '%' || node.value === '0');
+	if (Object(node).type !== 'word') {
+		return false;
+	}
+
+	const parsedNumber = parser.unit(node.value);
+	return parsedNumber && (parsedNumber.unit === '%' || parseFloat(parsedNumber.number) === 0);
 }
@@ -1686,9 +1695,9 @@
 			);
-	
+
 			root.walkDecls(decl => {
 				const originalValue = decl.value;
-	
+
 				if (colorModFunctionMatch.test(originalValue)) {
-					const ast = valueParser(originalValue, { loose: true }).parse();
-	
+					const ast = parser(originalValue);
+
 					transformAST(ast, {
@@ -1702,5 +1711,5 @@ unresolved: unresolvedOpt,
 					});
-	
-					const modifiedValue = ast.toString();
-	
+
+					const modifiedValue = parser.stringify(ast);
+
 					if (originalValue !== modifiedValue) {
@@ -1707,0 +1716,0 @@ decl.value = modifiedValue;

package.json

 {
   "name": "postcss-color-mod-function",
-  "version": "4.0.0",
+  "version": "4.1.0",
   "description": "Modify colors using the color-mod() function in CSS",
@@ -29,3 +29,3 @@ "author": "Jonathan Neal <[e-mail]>",
     "@csstools/convert-colors": "^1.4.0",
-    "postcss-values-parser": "^2.0.0"
+    "postcss-value-parser": "^4.2.0"
   },
@@ -35,4 +35,3 @@ "devDependencies": {
     "postcss-tape": "^6.0.1",
-    "rollup": "^4.24.0",
-    "@rollup/plugin-babel": "^6.0.4"
+    "rollup": "^4.24.0"
   },
@@ -39,0 +38,0 @@ "peerDependencies": {

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

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

343690

increased by0.82%

Dev dependency count

3

decreased by-25%

Lines of code

2799

increased by0.65%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• + Addedpostcss-value-parser@^4.2.0

• + Addedpostcss-value-parser@4.2.0(transitive)

• - Removedpostcss-values-parser@^2.0.0

• - Removedflatten@1.0.3(transitive)

• - Removedindexes-of@1.0.1(transitive)

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

• - Removeduniq@1.0.1(transitive)