fix: CSS variable second parameter gets cut out (#5378)

michaelokolo · michaelokolo · commit a839f59567b2 · 2025-10-10T21:12:31.000+01:00
diff --git a/apps/builder/app/builder/features/style-panel/shared/css-value-input/css-value-input.tsx b/apps/builder/app/builder/features/style-panel/shared/css-value-input/css-value-input.tsx
@@ -335,7 +335,9 @@ const itemToString = (item: CssValueInputValue | null) => {
     return "";
   }
   if (item.type === "var") {
-    return `var(--${item.value})`;
+    return item.fallback
+      ? `var(--${item.value}, ${toValue(item.fallback)})`
+      : `var(--${item.value})`;
   }
   if (item.type === "keyword") {
     // E.g. we want currentcolor to be lower case

Original file line number	Diff line number	Diff line change
`@@ -335,7 +335,9 @@ const itemToString = (item: CssValueInputValue \| null) => {`
`335`	`335`	`return "";`
`336`	`336`	`}`
`337`	`337`	`if (item.type === "var") {`
`338`		- return `var(--${item.value})`;
	`338`	`+ return item.fallback`
	`339`	+ ? `var(--${item.value}, ${toValue(item.fallback)})`
	`340`	+ : `var(--${item.value})`;
`339`	`341`	`}`
`340`	`342`	`if (item.type === "keyword") {`
`341`	`343`	`// E.g. we want currentcolor to be lower case`