Allow calc function interpolation in SassScript (#947)

CHANGELOG.md

@@ -1,3 +1,9 @@
+# 6.0.1
+
+- `function-calculation-no-interpolation` allows calc function interpolation in SassScript when declaring CSS custom properties.
+
+**Full Changelog**: https://github.com/stylelint-scss/stylelint-scss/compare/v6.0.0...v6.0.1
+
 # 6.0.0
 
 - Added: `stylelint@16` support.

package.json

@@ -1,7 +1,7 @@
 {
   "name": "stylelint-scss",
   "description": "A collection of SCSS-specific rules for Stylelint",
-  "version": "6.0.0",
+  "version": "6.0.1",
   "author": "Krister Kari",
   "repository": "stylelint-scss/stylelint-scss",
   "license": "MIT",

src/rules/function-calculation-no-interpolation/__tests__/index.js

@@ -25,6 +25,14 @@ testRule({
       .a { .b: calc(abc(#{$c})); }
       `,
       description: "Allowed function with interpolation nested in `calc`"
+    },
+    {
+      code: `
+      $c: 1;
+      --test-d: calc(#{$c} + 1);
+      `,
+      description:
+        "Custom property declaration with interpolation inside `calc`"
     }
   ],
   reject: [
@@ -41,7 +49,6 @@ testRule({
       description: "`calc` function one argument interpolated"
     },
     {
-      only: true,
       code: `
       $c: 1;
       .a { .b: calc(#{$c + 1}); }

src/rules/function-calculation-no-interpolation/index.js

@@ -31,6 +31,9 @@ function rule(actual) {
 
         if (!calculationFunctions.includes(node.value)) return;
 
+        // Interpolation is valid in SassScript.
+        if (decl.type === "decl" && decl.prop.startsWith("--")) return;
+
         const interpolation = node.nodes.find(
           ({ type, value }) => type === "word" && /^#{.*|\s*}/.test(value)
         );