Syntax cleanup (#1953)

* refactor(extension): clean up embedded language configuration

The embeddedLanguages configuration of a grammer is meant to map scope name to the name of the language
for that scope.

* refactor(syntaxes): Only inject template scopes to html

Template scopes do not need to be injected directly to source.ts.
Instead, template scopes apply when inline templates have been matched
in TS files and are included as patterns under that match.

The Angular template syntaxes _could_ be directly injected into TS like
they are now. This would apply them to any embedded `text.html` in a TS file.
This change applies Angular template grammars only to embedded HTML
matched by the inline template grammar (strings under `template:` of a
decorator).

`injectTo` applies only to the top-level file language and not embedded
labguages. So our `injectTo` `text.html` will not automatically apply to
inline templates simply by setting the `contentName` and language.

It would also be nice to further limit our grammars to apply only to
files that we know are Angular templates rather than injecting to every
to-level `.html` file.
In the future we might want to explore _not_ injecting into all top-level
`html` and then using `injectionSelector` to control from there. This
approach makes it difficult for environments that support
many frameworks/languages (stackblitz/textmate#4).

We might be able to create an "angular" language for `.component.html` and `.ng.html` files and use
our grammars only for those extensions rather than injecting them into
any and all `html`.

Author: atscott

.aspect/rules/external_repository_action_cache/npm_translate_lock_LTE4Nzc1MDcwNjU=

@@ -4,5 +4,5 @@
 .npmrc=974837034
 pnpm-lock.yaml=943190807
 yarn.lock=-1098466397
-package.json=-90176185
+package.json=619455070
 pnpm-workspace.yaml=1711114604

package.json

@@ -164,42 +164,22 @@
       {
         "path": "./syntaxes/template.json",
         "scopeName": "template.ng",
-        "injectTo": [
-          "text.html.derivative",
-          "source.ts"
-        ],
-        "embeddedLanguages": {
-          "text.html": "html",
-          "source.css": "css"
-        }
+        "injectTo": ["text.html.derivative"]
       },
       {
         "path": "./syntaxes/template-blocks.json",
         "scopeName": "template.blocks.ng",
-        "injectTo": [
-          "text.html.derivative",
-          "source.ts"
-        ],
-        "embeddedLanguages": {
-          "text.html": "html",
-          "expression.ng": "javascript"
-        }
+        "injectTo": ["text.html.derivative"]
       },
       {
         "path": "./syntaxes/let-declaration.json",
         "scopeName": "template.let.ng",
-        "injectTo": [
-          "text.html.derivative",
-          "source.ts"
-        ]
+        "injectTo": [ "text.html.derivative" ]
       },
       {
         "path": "./syntaxes/template-tag.json",
         "scopeName": "template.tag.ng",
-        "injectTo": [
-          "text.html.derivative",
-          "source.ts"
-        ]
+        "injectTo": ["text.html.derivative"]
       },
       {
         "path": "./syntaxes/expression.json",

syntaxes/inline-template.json

@@ -69,6 +69,15 @@
         },
         {
           "include": "template.ng"
+        },
+        {
+          "include": "template.blocks.ng"
+        },
+        {
+          "include": "template.tag.ng"
+        },
+        {
+          "include": "template.let.ng"
         }
       ]
     }

syntaxes/src/inline-template.ts

@@ -37,7 +37,13 @@ export const InlineTemplate: GrammarDefinition = {
       end: /\1/,
       endCaptures: {0: {name: 'string'}},
       contentName: 'text.html',
-      patterns: [{include: 'text.html.derivative'}, {include: 'template.ng'}]
+      patterns: [
+        {include: 'text.html.derivative'},
+        {include: 'template.ng'},
+        {include: 'template.blocks.ng'},
+        {include: 'template.tag.ng'},
+        {include: 'template.let.ng'},
+      ]
     }
   }
 };