From eb25ac99f5691a9379be7c3af3269527aedf4c8a Mon Sep 17 00:00:00 2001
From: deathaxe <deathaxe82@googlemail.com>
Date: Fri, 8 Mar 2024 18:07:11 +0100
Subject: [PATCH] Fix unquoted strings/urls beginning with scss interpolation

---
 Syntaxes/SCSS.sublime-syntax | 25 ++++++++++++++++++++++++-
 Tests/syntax_test_scss.scss  | 30 +++++++++++++++++++++++++++---
 2 files changed, 51 insertions(+), 4 deletions(-)

diff --git a/Syntaxes/SCSS.sublime-syntax b/Syntaxes/SCSS.sublime-syntax
index 47898779..4a2623a2 100644
--- a/Syntaxes/SCSS.sublime-syntax
+++ b/Syntaxes/SCSS.sublime-syntax
@@ -25,6 +25,7 @@ variables:
   selector_end: (?=[;{}])
 
   tag_name_begin: (?=[[:alpha:]]|#{)
+  unquoted_url_begin: (?=[[:alnum:]/]|#{)
 
   # SCSS variables
 
@@ -260,6 +261,20 @@ contexts:
 
 ###[ CSS STRINGS ]#############################################################
 
+  font-family-names:
+    # replace CSS context to add interpolation support
+    - match: '{{ident_begin}}'
+      push: font-family-name-body
+
+  font-family-name-body:
+    - meta_include_prototype: false
+    - meta_scope: meta.string.css string.unquoted.css
+    - include: scss-string-interpolations
+    - match: '{{break}}(?!\s+{{ident_start}})'
+      pop: 1
+    # consume unicode escapes and possibly following whitespace
+    - match: '{{unicode}}'
+
   string-content:
     - meta_prepend: true
     - include: scss-string-interpolations
@@ -281,6 +296,15 @@ contexts:
     - include: comments
     - include: else-pop
 
+  unquoted-urls:
+    # replace CSS context to add interpolation support
+    - match: '{{unquoted_url_begin}}'
+      push: unquoted-url-body
+
+  unquoted-url-body:
+    - meta_prepend: true
+    - include: scss-string-interpolations
+
 ###[ SassDoc COMMENTS ]########################################################
 
   sassdoc-comments:
@@ -780,7 +804,6 @@ contexts:
     - include: important-operators
     - include: scss-declarations
     - include: scss-constants
-    - include: scss-interpolations
     - include: scss-variables
     - include: scss-operators
     - include: scss-variadics
diff --git a/Tests/syntax_test_scss.scss b/Tests/syntax_test_scss.scss
index 3cf8e5a6..bb4a8603 100644
--- a/Tests/syntax_test_scss.scss
+++ b/Tests/syntax_test_scss.scss
@@ -113,10 +113,11 @@
     src: url($roboto-font-path + "/Roboto-Light.woff2") format("woff2");
 
     // This is parsed as an interpolated special function.
-/* TODO: unsure how this should be handled, */
     src: url(#{$roboto-font-path}/Roboto-Regular.woff2) format("woff2");
-//           ^^^^^^^^^^^^^^^^^^^^ meta.interpolation.scss
-//                               ^ -meta.interpolation.scss
+//       ^^^ meta.function-call.identifier.css
+//          ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.function-call.arguments.css meta.group.css
+//           ^^^^^^^^^^^^^^^^^^^^ meta.string.css meta.interpolation.scss
+//                               ^^^^^^^^^^^^^^^^^^^^^ meta.string.css string.unquoted.css - meta.interpolation.scss
 //             ^^^^^^^^^^^^^^^^^ variable.other.scss
 //             ^ punctuation.definition.variable.scss
 }
@@ -188,6 +189,29 @@
 // ^ punctuation.section.interpolation.begin.scss
 //  ^^^^^^^^^ variable.other.scss
 //           ^ punctuation.section.interpolation.end.scss
+
+  $color: "red";
+
+  color: #{$color};
+//^^^^^ meta.property-name.css support.type.property-name.css
+//     ^ punctuation.separator.key-value.css
+//      ^ meta.property-value.css - meta.interpolation
+//       ^^^^^^^^^ meta.property-value.css support.constant.property-value.css meta.interpolation.scss
+
+  $font_name: "Roboto";
+
+  font-family: #{$font_name + "Mono"};
+//^^^^^^^^^^^ meta.property-name.css support.type.property-name.css
+//           ^ punctuation.separator.key-value.css
+//            ^ meta.property-value.css - meta.interpolation
+//             ^^^^^^^^^^^^^^^^^^^^^^ meta.property-value.css meta.string.css meta.interpolation.scss
+
+  font-family: My#{$font_name};
+//^^^^^^^^^^^ meta.property-name.css support.type.property-name.css
+//           ^ punctuation.separator.key-value.css
+//            ^ meta.property-value.css - meta.string - meta.interpolation
+//             ^^ meta.property-value.css meta.string.css string.unquoted.css
+//               ^^^^^^^^^^^^^ meta.property-value.css meta.string.css meta.interpolation.scss
 }
 
 .gray {