feat(css): allow infinity values within css calc expressions (#10705)

NathanWalker · web-flow · commit 24116c5ec35d · 2025-02-21T14:53:08.000-08:00
diff --git a/packages/core/ui/core/properties/index.ts b/packages/core/ui/core/properties/index.ts
@@ -150,12 +150,14 @@ export function _evaluateCssCalcExpression(value: string) {
 	}
 
 	if (isCssCalcExpression(value)) {
-		// WORKAROUND: reduce-css-calc can't handle the dip-unit.
+		// Note: reduce-css-calc can't handle certain values
 		let cssValue = value.replace(/([0-9]+(\.[0-9]+)?)dip\b/g, '$1');
 		if (cssValue.includes('unset')) {
-			// ensure unset is properly handled before processing calc
 			cssValue = cssValue.replace(/unset/g, '0');
 		}
+		if (cssValue.includes('infinity')) {
+			cssValue = cssValue.replace(/infinity/g, '999999');
+		}
 		return require('reduce-css-calc')(cssValue);
 	} else {
 		return value;
