astro-vscode 2.16.11 → 2.16.13

package/languages/astro.code-snippets

@@ -21,6 +21,7 @@
 			"</html>",
 		],
 		"description": "Page with full HTML",
+		"include": "*.astro",
 	},
 	"page_layout": {
 		"prefix": "page_layout",
@@ -36,6 +37,7 @@
 			"</$1>",
 		],
 		"description": "Page from Layout",
+		"include": "*.astro",
 	},
 	"component": {
 		"prefix": "component",
@@ -43,5 +45,6 @@
 		"scope": "astro",
 		"body": ["---", "$1", "---", "", "$0"],
 		"description": "Component",
+		"include": "*.astro",
 	},
 }

package/package.json

@@ -24,7 +24,7 @@
     "color": "#17191E",
     "theme": "dark"
   },
-  "version": "2.16.11",
+  "version": "2.16.13",
   "author": "withastro",
   "license": "MIT",
   "publisher": "astro-build",
@@ -235,7 +235,7 @@
     ]
   },
   "devDependencies": {
-    "@astrojs/language-server": "^2.16.4",
+    "@astrojs/language-server": "^2.16.6",
     "@astrojs/ts-plugin": "^1.10.7",
     "@types/mocha": "^10.0.10",
     "@types/node": "^20.9.0",

package/syntaxes/astro.tmLanguage.json

@@ -3,7 +3,7 @@
   "scopeName": "source.astro",
   "fileTypes": ["astro"],
   "injections": {
-    "L:(meta.script.astro) (meta.lang.json) - (meta source)": {
+    "L:(meta.script.astro) (meta.lang.json) - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -18,7 +18,7 @@
         }
       ]
     },
-    "L:(meta.script.astro) (meta.lang.js | meta.lang.javascript | meta.lang.partytown | meta.lang.node) - (meta source)": {
+    "L:(meta.script.astro) (meta.lang.js | meta.lang.javascript | meta.lang.partytown | meta.lang.node) - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?=[^\\n]+</script[\\s>])",
@@ -44,7 +44,7 @@
         }
       ]
     },
-    "L:(meta.script.astro) (meta.lang.ts | meta.lang.typescript) - (meta source)": {
+    "L:(meta.script.astro) (meta.lang.ts | meta.lang.typescript) - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?=[^\\n]+</script[\\s>])",
@@ -70,7 +70,7 @@
         }
       ]
     },
-    "L:meta.script.astro - meta.lang - (meta source)": {
+    "L:meta.script.astro - meta.lang - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?=[^\\n]+</script[\\s>])",
@@ -96,7 +96,7 @@
         }
       ]
     },
-    "L:meta.style.astro meta.lang.stylus - (meta source)": {
+    "L:meta.style.astro meta.lang.stylus - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -111,7 +111,7 @@
         }
       ]
     },
-    "L:meta.style.astro meta.lang.sass - (meta source)": {
+    "L:meta.style.astro meta.lang.sass - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -126,7 +126,7 @@
         }
       ]
     },
-    "L:meta.style.astro meta.lang.css - (meta source)": {
+    "L:meta.style.astro meta.lang.css - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -141,7 +141,7 @@
         }
       ]
     },
-    "L:meta.style.astro meta.lang.scss - (meta source)": {
+    "L:meta.style.astro meta.lang.scss - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -156,7 +156,7 @@
         }
       ]
     },
-    "L:meta.style.astro meta.lang.less - (meta source)": {
+    "L:meta.style.astro meta.lang.less - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -171,7 +171,7 @@
         }
       ]
     },
-    "L:meta.style.astro meta.lang.postcss - (meta source)": {
+    "L:meta.style.astro meta.lang.postcss - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -186,7 +186,7 @@
         }
       ]
     },
-    "L:meta.style.astro - meta.lang - (meta source)": {
+    "L:meta.style.astro - meta.lang - (meta.embedded.block source)": {
       "patterns": [
         {
           "begin": "(?<=>)(?!</)",
@@ -200,6 +200,13 @@
           ]
         }
       ]
+    },
+    "L:meta.embedded.expression.astro - meta.embedded.block": {
+      "patterns": [
+        {
+          "include": "#tags-lang"
+        }
+      ]
     }
   },
   "patterns": [

package/syntaxes/astro.tmLanguage.src.yaml

@@ -9,13 +9,13 @@ injections:
   # ---- EMBEDDED LANGUAGES
 
   # Format:
-  #  'L:meta.<script|style|template>.astro (meta.lang.<lang> | meta.lang.<langalternative> | ...) - (meta source)'
+  #  'L:meta.<script|style|template>.astro (meta.lang.<lang> | meta.lang.<langalternative> | ...) - (meta.embedded.block source)'
   #     patterns: [{begin: '(?<=>)(?!</)', end: '(?=</)', name: meta.embedded.block.astro,
   #     contentName: source.<lang>, patterns: [{ include: source.<lang> }]}]
 
   # Style/Script Languages
   # JSON | 'application/ld+json'
-  'L:(meta.script.astro) (meta.lang.json) - (meta source)':
+  'L:(meta.script.astro) (meta.lang.json) - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -28,7 +28,7 @@ injections:
       ]
 
   # JavaScript | 'javascript' | 'source.js' | 'partytown'
-  'L:(meta.script.astro) (meta.lang.js | meta.lang.javascript | meta.lang.partytown | meta.lang.node) - (meta source)':
+  'L:(meta.script.astro) (meta.lang.js | meta.lang.javascript | meta.lang.partytown | meta.lang.node) - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -48,7 +48,7 @@ injections:
       ]
 
   # TypeScript | 'ts'
-  'L:(meta.script.astro) (meta.lang.ts | meta.lang.typescript) - (meta source)':
+  'L:(meta.script.astro) (meta.lang.ts | meta.lang.typescript) - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -69,7 +69,7 @@ injections:
 
   # Script Languages
   # Default (JavaScript)
-  'L:meta.script.astro - meta.lang - (meta source)':
+  'L:meta.script.astro - meta.lang - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -92,7 +92,7 @@ injections:
 
   # Style Languages
   # Stylus | 'stylus' | 'source.stylus'
-  'L:meta.style.astro meta.lang.stylus - (meta source)':
+  'L:meta.style.astro meta.lang.stylus - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -105,7 +105,7 @@ injections:
       ]
 
   # Sass | 'sass' | 'source.sass'
-  'L:meta.style.astro meta.lang.sass - (meta source)':
+  'L:meta.style.astro meta.lang.sass - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -118,7 +118,7 @@ injections:
       ]
 
   # CSS | 'css' | 'source.css'
-  'L:meta.style.astro meta.lang.css - (meta source)':
+  'L:meta.style.astro meta.lang.css - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -131,7 +131,7 @@ injections:
       ]
 
   # SCSS | 'scss' | 'source.css.scss'
-  'L:meta.style.astro meta.lang.scss - (meta source)':
+  'L:meta.style.astro meta.lang.scss - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -144,7 +144,7 @@ injections:
       ]
 
   # Less | 'less' | 'source.css.less'
-  'L:meta.style.astro meta.lang.less - (meta source)':
+  'L:meta.style.astro meta.lang.less - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -157,7 +157,7 @@ injections:
       ]
 
   # PostCSS | 'postcss' | 'source.css.postcss'
-  'L:meta.style.astro meta.lang.postcss - (meta source)':
+  'L:meta.style.astro meta.lang.postcss - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -170,7 +170,7 @@ injections:
       ]
 
   # Default (CSS)
-  'L:meta.style.astro - meta.lang - (meta source)':
+  'L:meta.style.astro - meta.lang - (meta.embedded.block source)':
     patterns:
       [
         {
@@ -182,6 +182,14 @@ injections:
         },
       ]
 
+  # ---- SCRIPT/STYLE INSIDE EXPRESSIONS
+  # Inside expressions ({...}), content is scoped as source.tsx. We need to inject
+  # script/style tag handling so they get proper language injection instead of being
+  # treated as plain JSX elements.
+  'L:meta.embedded.expression.astro - meta.embedded.block':
+    patterns:
+      - include: '#tags-lang'
+
 # Start of grammar.
 patterns:
   - include: '#scope'

package/test/grammar/fixtures/script/expression.astro

@@ -0,0 +1,13 @@
+---
+const view = 'Gallery';
+---
+
+{view === 'Gallery' ? (
+  <script>
+    for (let index = 0; index < 10; index++) {
+      console.log(index);
+    }
+  </script>
+) : null}
+
+{view === 'Gallery' && <script>console.log("inline")</script>}

package/test/grammar/fixtures/script/expression.astro.snap

@@ -0,0 +1,42 @@
+>---
+#^^^ source.astro comment
+>const view = 'Gallery';
+#^^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.block.astro source.ts
+>---
+#^^^ source.astro comment
+>
+>{view === 'Gallery' ? (
+#^ source.astro punctuation.section.embedded.begin.astro
+# ^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx
+>  <script>
+#^^ source.astro meta.embedded.expression.astro source.tsx
+#  ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.start.astro punctuation.definition.tag.begin.astro
+#   ^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.start.astro entity.name.tag.astro
+#         ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.start.astro punctuation.definition.tag.end.astro
+>    for (let index = 0; index < 10; index++) {
+#^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.embedded.block.astro source.js
+>      console.log(index);
+#^^^^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.embedded.block.astro source.js
+>    }
+#^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.embedded.block.astro source.js
+>  </script>
+#^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro
+#  ^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.end.astro punctuation.definition.tag.begin.astro
+#    ^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.end.astro entity.name.tag.astro
+#          ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.end.astro punctuation.definition.tag.end.astro
+>) : null}
+#^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx
+#        ^ source.astro punctuation.section.embedded.end.astro
+>
+>{view === 'Gallery' && <script>console.log("inline")</script>}
+#^ source.astro punctuation.section.embedded.begin.astro
+# ^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx
+#                       ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.start.astro punctuation.definition.tag.begin.astro
+#                        ^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.start.astro entity.name.tag.astro
+#                              ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.start.astro punctuation.definition.tag.end.astro
+#                               ^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.embedded.block.astro source.js
+#                                                    ^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.end.astro punctuation.definition.tag.begin.astro
+#                                                      ^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.end.astro entity.name.tag.astro
+#                                                            ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.script.astro meta.script.astro meta.tag.end.astro punctuation.definition.tag.end.astro
+#                                                             ^ source.astro punctuation.section.embedded.end.astro
+>

package/test/grammar/fixtures/style/expression.astro

@@ -0,0 +1,11 @@
+---
+const view = 'Gallery';
+---
+
+{view === 'Gallery' ? (
+  <style>
+    .gallery { display: grid; }
+  </style>
+) : null}
+
+{view === 'Gallery' && <style>.inline { color: red; }</style>}

package/test/grammar/fixtures/style/expression.astro.snap

@@ -0,0 +1,38 @@
+>---
+#^^^ source.astro comment
+>const view = 'Gallery';
+#^^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.block.astro source.ts
+>---
+#^^^ source.astro comment
+>
+>{view === 'Gallery' ? (
+#^ source.astro punctuation.section.embedded.begin.astro
+# ^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx
+>  <style>
+#^^ source.astro meta.embedded.expression.astro source.tsx
+#  ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.start.astro punctuation.definition.tag.begin.astro
+#   ^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.start.astro entity.name.tag.astro
+#        ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.start.astro punctuation.definition.tag.end.astro
+>    .gallery { display: grid; }
+#^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.embedded.block.astro source.css
+>  </style>
+#^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.embedded.block.astro source.css
+#  ^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.end.astro punctuation.definition.tag.begin.astro
+#    ^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.end.astro entity.name.tag.astro
+#         ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.end.astro punctuation.definition.tag.end.astro
+>) : null}
+#^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx
+#        ^ source.astro punctuation.section.embedded.end.astro
+>
+>{view === 'Gallery' && <style>.inline { color: red; }</style>}
+#^ source.astro punctuation.section.embedded.begin.astro
+# ^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx
+#                       ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.start.astro punctuation.definition.tag.begin.astro
+#                        ^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.start.astro entity.name.tag.astro
+#                             ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.start.astro punctuation.definition.tag.end.astro
+#                              ^^^^^^^^^^^^^^^^^^^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.embedded.block.astro source.css
+#                                                     ^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.end.astro punctuation.definition.tag.begin.astro
+#                                                       ^^^^^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.end.astro entity.name.tag.astro
+#                                                            ^ source.astro meta.embedded.expression.astro source.tsx meta.scope.tag.style.astro meta.style.astro meta.tag.end.astro punctuation.definition.tag.end.astro
+#                                                             ^ source.astro punctuation.section.embedded.end.astro
+>