SCSS: Added support for Sass modules (#2643)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77
diff --git a/components/prism-scss.js b/components/prism-scss.js
index a92baa9..a3ed747 100644
--- a/components/prism-scss.js
+++ b/components/prism-scss.js
@@ -41,7 +41,7 @@ Prism.languages.scss = Prism.languages.extend('css', {
Prism.languages.insertBefore('scss', 'atrule', {
'keyword': [
- /@(?:if|else(?: if)?|for|each|while|import|extend|debug|warn|mixin|include|function|return|content)/i,
+ /@(?:if|else(?: if)?|forward|for|each|while|import|use|extend|debug|warn|mixin|include|function|return|content)\b/i,
{
pattern: /( +)(?:from|through)(?= )/,
lookbehind: true
@@ -55,6 +55,10 @@ Prism.languages.insertBefore('scss', 'important', {
});
Prism.languages.insertBefore('scss', 'function', {
+ 'module-modifier': {
+ pattern: /\b(?:as|with|show|hide)\b/i,
+ alias: 'keyword'
+ },
'placeholder': {
pattern: /%[-\w]+/,
alias: 'selector'
diff --git a/components/prism-scss.min.js b/components/prism-scss.min.js
index 0e10678..7f54c3b 100644
--- a/components/prism-scss.min.js
+++ b/components/prism-scss.min.js
@@ -1 +1 @@
-Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-]+(?:\([^()]+\)|[^(])*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()]|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}]+[:{][^}]+))/m,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:if|else(?: if)?|for|each|while|import|extend|debug|warn|mixin|include|function|return|content)/i,{pattern:/( +)(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:true|false)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|or|not)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss;
\ No newline at end of file
+Prism.languages.scss=Prism.languages.extend("css",{comment:{pattern:/(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,lookbehind:!0},atrule:{pattern:/@[\w-]+(?:\([^()]+\)|[^(])*?(?=\s+[{;])/,inside:{rule:/@[\w-]+/}},url:/(?:[-a-z]+-)?url(?=\()/i,selector:{pattern:/(?=\S)[^@;{}()]?(?:[^@;{}()]|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}]+[:{][^}]+))/m,inside:{parent:{pattern:/&/,alias:"important"},placeholder:/%[-\w]+/,variable:/\$[-\w]+|#\{\$[-\w]+\}/}},property:{pattern:/(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,inside:{variable:/\$[-\w]+|#\{\$[-\w]+\}/}}}),Prism.languages.insertBefore("scss","atrule",{keyword:[/@(?:if|else(?: if)?|forward|for|each|while|import|use|extend|debug|warn|mixin|include|function|return|content)\b/i,{pattern:/( +)(?:from|through)(?= )/,lookbehind:!0}]}),Prism.languages.insertBefore("scss","important",{variable:/\$[-\w]+|#\{\$[-\w]+\}/}),Prism.languages.insertBefore("scss","function",{"module-modifier":{pattern:/\b(?:as|with|show|hide)\b/i,alias:"keyword"},placeholder:{pattern:/%[-\w]+/,alias:"selector"},statement:{pattern:/\B!(?:default|optional)\b/i,alias:"keyword"},boolean:/\b(?:true|false)\b/,null:{pattern:/\bnull\b/,alias:"keyword"},operator:{pattern:/(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|or|not)(?=\s)/,lookbehind:!0}}),Prism.languages.scss.atrule.inside.rest=Prism.languages.scss;
\ No newline at end of file
diff --git a/tests/languages/scss/keyword_feature.test b/tests/languages/scss/keyword_feature.test
index 90ca11d..be6eadd 100644
--- a/tests/languages/scss/keyword_feature.test
+++ b/tests/languages/scss/keyword_feature.test
@@ -1,6 +1,6 @@
@if @else if @else
@for @each @while
-@import @extend
+@import @extend @use @forward
@debug @warn @mixin
@include @function
@return @content
@@ -12,7 +12,7 @@
[
["keyword", "@if"], ["keyword", "@else if"], ["keyword", "@else"],
["keyword", "@for"], ["keyword", "@each"], ["keyword", "@while"],
- ["keyword", "@import"], ["keyword", "@extend"],
+ ["keyword", "@import"], ["keyword", "@extend"], ["keyword", "@use"], ["keyword", "@forward"],
["keyword", "@debug"], ["keyword", "@warn"], ["keyword", "@mixin"],
["keyword", "@include"], ["keyword", "@function"],
["keyword", "@return"], ["keyword", "@content"],
diff --git a/tests/languages/scss/module-modifier_feature.test b/tests/languages/scss/module-modifier_feature.test
new file mode 100644
index 0000000..1aa8615
--- /dev/null
+++ b/tests/languages/scss/module-modifier_feature.test
@@ -0,0 +1,17 @@
+@use "foo" as bar;
+@use "foo" with ($color: blue);
+@forward "foo" show bar;
+@forward "foo" hide baz;
+
+----------------------------------------------------
+
+[
+ ["keyword", "@use"], ["string", "\"foo\""], ["module-modifier", "as"], " bar", ["punctuation", ";"],
+ ["keyword", "@use"], ["string", "\"foo\""], ["module-modifier", "with"], ["punctuation", "("], ["property", [["variable", "$color"]]], ["punctuation", ":"], " blue", ["punctuation", ")"], ["punctuation", ";"],
+ ["keyword", "@forward"], ["string", "\"foo\""], ["module-modifier", "show"], " bar", ["punctuation", ";"],
+ ["keyword", "@forward"], ["string", "\"foo\""], ["module-modifier", "hide"], " baz", ["punctuation", ";"]
+]
+
+----------------------------------------------------
+
+Checks for Sass module modifiers