fix: extra space between '#' and '{' (#13286)

* fix: extra space between '#' and '{'

* Update src/language-css/printer-postcss.js

Co-authored-by: fisker Cheung <lionkay@gmail.com>

* adding changelog

* Update 13286.md

Co-authored-by: fisker Cheung <lionkay@gmail.com>

changelog_unreleased/scss/13286.md

@@ -0,0 +1,13 @@
+#### fix: extra space between '#' and '{' (#13286 by @jspereiramoura)
+
+<!-- prettier-ignore -->
+```scss
+// Input
+padding: var(--spacer#{(1) + 2});
+
+// Prettier stable
+padding: var(--spacer# {(1) + 2});
+
+// Prettier main
+padding: var(--spacer#{(1) + 2});
+```

src/language-css/printer-postcss.js

@@ -825,6 +825,14 @@ function genericPrint(path, options, print) {
           continue;
         }
 
+        if (
+          iNode.value?.endsWith("#") &&
+          iNextNode.value === "{" &&
+          isParenGroupNode(iNextNode.group)
+        ) {
+          continue;
+        }
+
         // Be default all values go through `line`
         parts.push(line);
       }

tests/format/scss/variables/__snapshots__/jsfmt.spec.js.snap

@@ -12,6 +12,7 @@ printWidth: 80
   prop1: var(--#{$var});
   prop2: var(#{$var}, --my-#{$var}, pink);
   prop3: calc(var(--#{$var}) * 1px);
+  prop4: var(--spacer#{(1) + 2});
 }
 
 @supports (--#{$prop}: green) {
@@ -27,6 +28,7 @@ printWidth: 80
   prop1: var(--#{$var});
   prop2: var(#{$var}, --my-#{$var}, pink);
   prop3: calc(var(--#{$var}) * 1px);
+  prop4: var(--spacer#{(1) + 2});
 }
 
 @supports (--#{$prop}: green) {

tests/format/scss/variables/variables.scss

@@ -4,6 +4,7 @@
   prop1: var(--#{$var});
   prop2: var(#{$var}, --my-#{$var}, pink);
   prop3: calc(var(--#{$var}) * 1px);
+  prop4: var(--spacer#{(1) + 2});
 }
 
 @supports (--#{$prop}: green) {