Add meta scope to control flow statements

This commit scopes all control flow statements `meta.embedded.statement source.ngx.embedded.html`. to also apply proper `source.ngx` to angular expressions.
princemaple · Dec 17, 2024 · b5c906f · b5c906f
1 parent 2077851
commit b5c906f
Show file tree

Hide file tree

Showing 2 changed files with 79 additions and 26 deletions.
diff --git a/NgxHTML.sublime-syntax b/NgxHTML.sublime-syntax
@@ -177,7 +177,9 @@ contexts:
 
   ng-declarations:
     - match: (@)let{{ident_break}}
-      scope: meta.let.ngx keyword.declaration.variable.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        meta.let.ngx keyword.declaration.variable.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push:
@@ -191,15 +193,21 @@ contexts:
     - include: else-pop
 
   ng-let-assignment:
-    - meta_content_scope: meta.let.identifier.ngx
+    - meta_content_scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        meta.let.identifier.ngx
     - match: =
-      scope: meta.let.ngx keyword.operator.assignment.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        meta.let.ngx keyword.operator.assignment.ngx
       set: ng-let-value
     - include: else-pop
 
   ng-let-value:
     - meta_include_prototype: false
-    - meta_content_scope: meta.let.value.ngx
+    - meta_content_scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        meta.let.value.ngx
     - match: ';'
       scope: punctuation.terminator.expression.ngx
       pop: 1
@@ -211,60 +219,78 @@ contexts:
     # conditionals
     # https://angular.dev/guide/templates/control-flow#conditionally-display-content-with-if-else-if-and-else
     - match: (@)if{{ident_break}}
-      scope: keyword.control.conditional.if.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.conditional.if.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push:
         - ng-block
         - ng-conditional-group
     - match: (@)else\s+if{{ident_break}}
-      scope: keyword.control.conditional.elseif.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.conditional.elseif.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push:
         - ng-block
         - ng-conditional-group
     - match: (@)else{{ident_break}}
-      scope: keyword.control.conditional.else.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.conditional.else.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push: ng-block
     # https://angular.dev/guide/templates/control-flow#conditionally-display-content-with-the-switch-block
     - match: (@)case{{ident_break}}
-      scope: keyword.control.conditional.case.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.conditional.case.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push:
         - ng-block
         - ng-conditional-group
     - match: (@)default{{ident_break}}
-      scope: keyword.control.conditional.case.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.conditional.case.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push: ng-block
     - match: (@)switch{{ident_break}}
-      scope: keyword.control.conditional.switch.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.conditional.switch.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push:
         - ng-block
         - ng-conditional-group
     # https://angular.dev/guide/templates/control-flow#providing-a-fallback-for-for-blocks-with-the-empty-block
     - match: (@)for{{ident_break}}
-      scope: keyword.control.loop.for.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.loop.for.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push:
         - ng-block
         - ng-for-group
     - match: (@)empty{{ident_break}}
-      scope: keyword.control.loop.else.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.loop.else.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push: ng-block
     # https://angular.dev/guide/templates/defer
     - match: (@)(?:defer|error|loading|placeholder){{ident_break}}
-      scope: keyword.control.flow.ngx
+      scope:
+        meta.embedded.statement.ngx.html source.ngx.embedded.html
+        keyword.control.flow.ngx
       captures:
         1: punctuation.definition.keyword.ngx
       push:
@@ -273,6 +299,7 @@ contexts:
 
   ng-block:
     - meta_include_prototype: false
+    - meta_content_scope: meta.embedded.statement.ngx.html source.ngx.embedded.html
     - match: \{
       scope: punctuation.section.block.begin.ngx
       set: ng-block-body

diff --git a/tests/syntax_test_scopes.component.html b/tests/syntax_test_scopes.component.html
@@ -6,6 +6,8 @@
  -->
 
 @let name = user.name;
+<!-- <- meta.embedded.statement.ngx.html source.ngx.embedded.html meta.let.ngx keyword.declaration.variable.ngx punctuation.definition.keyword.ngx -->
+<!--^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ meta.let.identifier.ngx -->
 <!-- ^^^^ variable.other.readwrite.ngx -->
 <!--      ^ meta.let.ngx keyword.operator.assignment.ngx -->
@@ -16,6 +18,7 @@
 <!--                 ^ punctuation.terminator.expression.ngx -->
 
 @let func = user.func();
+<!--^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ meta.let.identifier.ngx -->
 <!-- ^^^^ variable.other.readwrite.ngx -->
 <!--      ^ meta.let.ngx keyword.operator.assignment.ngx -->
@@ -29,6 +32,7 @@
 <!--                   ^ punctuation.terminator.expression.ngx -->
 
 @let greeting = 'Hello, ' + name;
+<!--^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^^^^^ meta.let.identifier.ngx -->
 <!-- ^^^^^^^^ variable.other.readwrite.ngx -->
 <!--          ^ meta.let.ngx keyword.operator.assignment.ngx -->
@@ -41,6 +45,7 @@
 <!--                            ^ punctuation.terminator.expression.ngx -->
 
 @let data = data$ | async;
+<!--^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ meta.let.identifier.ngx -->
 <!--      ^ meta.let.ngx -->
 <!--       ^^^^^^^ meta.let.value.ngx - meta.filter -->
@@ -53,6 +58,7 @@
 <!--                     ^ punctuation.terminator.expression.ngx -->
 
 @let item = var[10]['bar'];
+<!--^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ meta.let.identifier.ngx -->
 <!--      ^ meta.let.ngx -->
 <!--       ^^^^^^^^^^^^^^^ meta.let.value.ngx -->
@@ -71,6 +77,7 @@
 
 <!-- qualified property with missing leading object in incomplete ternary expression -->
 @let path = .foo?.bar? ;
+<!--^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ meta.let.identifier.ngx -->
 <!--      ^ meta.let.ngx -->
 <!--       ^ meta.let.value.ngx - meta.path -->
@@ -87,6 +94,7 @@
 <!--                   ^ punctuation.terminator.expression.ngx -->
 
 @let path = .orders.value()?.[0]?.$extra?.#currency.unit;
+<!--^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ meta.let.identifier.ngx -->
 <!--      ^ meta.let.ngx -->
 <!--       ^ meta.let.value.ngx - meta.path -->
@@ -116,6 +124,7 @@
 <!--                                                    ^ punctuation.terminator.expression.ngx -->
 
 @let path = orders.value()?.[0]?.$extra?.#currency.unit;
+<!--^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ meta.let.identifier.ngx -->
 <!--      ^ meta.let.ngx -->
 <!--       ^ meta.let.value.ngx - meta.path -->
@@ -149,9 +158,10 @@
  -->
 
 @if (a > b) {
-<!-- <- keyword.control.conditional.if.ngx punctuation.definition.keyword.ngx -->
- <!-- <- keyword.control.conditional.if.ngx -->
-  <!-- <- keyword.control.conditional.if.ngx -->
+<!--^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
+<!-- <- meta.embedded.statement.ngx.html source.ngx.embedded.html keyword.control.conditional.if.ngx punctuation.definition.keyword.ngx -->
+ <!-- <- meta.embedded.statement.ngx.html source.ngx.embedded.html keyword.control.conditional.if.ngx -->
+  <!-- <- meta.embedded.statement.ngx.html source.ngx.embedded.html keyword.control.conditional.if.ngx -->
 <!--^^^^^^^ meta.group.ngx -->
 <!--^ punctuation.section.group.begin.ngx -->
 <!-- ^ variable.other.readwrite.ngx -->
@@ -173,6 +183,7 @@
 <!--                             ^^ punctuation.section.embedded.end.ngx.html - source.ngx -->
 } @else if (b > a()) {
 <!-- <- meta.block.ngx punctuation.section.block.end.ngx -->
+<!--^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ keyword.control.conditional.elseif.ngx -->
 <!--       ^^^^^^^^^ meta.group.ngx -->
 <!--       ^ punctuation.section.group.begin.ngx -->
@@ -202,7 +213,8 @@
 <!--                                ^^ punctuation.section.embedded.end.ngx.html -->
 } @else {
 <!-- <- meta.block.ngx punctuation.section.block.end.ngx -->
-  <!-- <- keyword.control.conditional.else.ngx punctuation.definition.keyword.ngx -->
+  <!-- <- meta.embedded.statement.ngx.html source.ngx.embedded.html keyword.control.conditional.else.ngx punctuation.definition.keyword.ngx -->
+<!--^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^ keyword.control.conditional.else.ngx -->
 <!--    ^ meta.block.ngx punctuation.section.block.begin.ngx -->
     {{ a }} is equal to {{ b }}
@@ -250,14 +262,16 @@
  -->
 
 @switch (accessLevel) {
+<!-- <- meta.embedded.statement.ngx.html source.ngx.embedded.html keyword.control.conditional.switch.ngx punctuation.definition.keyword.ngx -->
+<!--^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^ keyword.control.conditional.switch.ngx -->
 <!--    ^^^^^^^^^^^^^ meta.group.ngx -->
 <!--    ^ punctuation.section.group.begin.ngx -->
 <!--     ^^^^^^^^^^^ variable.other.readwrite.ngx -->
 <!--                ^ punctuation.section.group.end.ngx -->
 <!--                  ^ meta.block.ngx punctuation.section.block.begin.ngx -->
     @case ('admin') {
-<!--^^^^^^^^^^^^^^^^ meta.block.ngx - meta.block meta.block -->
+<!--^^^^^^^^^^^^^^^^ meta.block.ngx meta.embedded.statement.ngx.html source.ngx.embedded.html  - meta.block meta.block -->
 <!--                ^^ meta.block.ngx meta.block.ngx -->
 <!--^^^^^ keyword.control.conditional.case.ngx -->
 <!--^ punctuation.definition.keyword.ngx -->
@@ -277,7 +291,7 @@
 <!-- ^ meta.block.ngx - meta.block meta.block -->
 
     @case {
-<!--^^^^^^ meta.block.ngx - meta.block meta.block -->
+<!--^^^^^^ meta.block.ngx meta.embedded.statement.ngx.html source.ngx.embedded.html - meta.block meta.block -->
 <!--      ^^ meta.block.ngx meta.block.ngx -->
 <!--^^^^^ keyword.control.conditional.case.ngx -->
 <!--^ punctuation.definition.keyword.ngx -->
@@ -292,7 +306,7 @@
 <!--^ meta.block.ngx meta.block.ngx punctuation.section.block.end.ngx -->
 <!-- ^ meta.block.ngx - meta.block meta.block -->
     @default {
-<!--^^^^^^^^^ meta.block.ngx - meta.block meta.block -->
+<!--^^^^^^^^^ meta.block.ngx meta.embedded.statement.ngx.html source.ngx.embedded.html - meta.block meta.block -->
 <!--         ^^ meta.block.ngx meta.block.ngx -->
 <!--^^^^^^^^ keyword.control.conditional.case.ngx -->
 <!--^ punctuation.definition.keyword.ngx -->
@@ -311,6 +325,8 @@
  -->
 
 @for (user of users; track user.id) {
+<!-- <- meta.embedded.statement.ngx source.ngx.embedded.html keyword.control.loop.for.ngx punctuation.definition.keyword.ngx -->
+<!--^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx source.ngx.embedded.html -->
 <!-- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.ngx -->
 <!-- ^ punctuation.section.group.begin.ngx -->
 <!--  ^^^^ variable.other.readwrite.ngx -->
@@ -326,14 +342,16 @@
   {{ user.name }}
 } @empty {
 <!-- <- meta.block.ngx punctuation.section.block.end.ngx -->
-  <!-- <- keyword.control.loop.else.ngx punctuation.definition.keyword.ngx -->
-<!--^^^^ keyword.control.loop.else.ngx -->
+  <!-- <- meta.embedded.statement.ngx source.ngx.embedded.html keyword.control.loop.else.ngx punctuation.definition.keyword.ngx -->
+<!--^^^^ meta.embedded.statement.ngx source.ngx.embedded.html keyword.control.loop.else.ngx -->
+<!--    ^ meta.embedded.statement.ngx source.ngx.embedded.html - keyword - punctuation -->
 <!--     ^ meta.block.ngx punctuation.section.block.begin.ngx -->
   Empty list of users
-}
-<!-- <- meta.block.ngx punctuation.section.block.end.ngx -->
+.html}
+<!--.html <- meta.block.ngx punctuation.section.block.end.ngx -->
 
 @for (item of items; track item.id; let idx = $index, e = $even) {
+<!--^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx source.ngx.embedded.html -->
 <!-- ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.ngx -->
 <!-- ^ punctuation.section.group.begin.ngx -->
 <!--  ^^^^ variable.other.readwrite.ngx -->
@@ -370,9 +388,11 @@
 <!--                       ^^^^ variable.other.member.ngx -->
 <!--                            ^^ punctuation.section.embedded.end.ngx.html -->
 }
-<!-- <- meta.block.ngx punctuation.section.block.end.ngx -->
+<!--.html <- meta.block.ngx punctuation.section.block.end.ngx -->
 
 @if (users$ | async; as users) {
+<!-- <- meta.embedded.statement.ngx source.ngx.embedded.html keyword.control.conditional.if.ngx punctuation.definition.keyword.ngx -->
+<!--^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx source.ngx.embedded.html -->
 <!--^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.ngx -->
 <!--^ punctuation.section.group.begin.ngx -->
 <!-- ^^^^^^ variable.other.readwrite.ngx -->
@@ -402,7 +422,7 @@
 <!--                       ^ entity.name.tag.block.any.html -->
 <!--                        ^ punctuation.definition.tag.end.html -->
 }
-<!-- <- meta.block.ngx punctuation.section.block.end.ngx -->
+<!--.html <- meta.block.ngx punctuation.section.block.end.ngx -->
 
 
 <!--
@@ -411,6 +431,7 @@
  -->
 
     @defer { <comment-list /> }
+<!--^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ keyword.control.flow.ngx -->
 <!--^ punctuation.definition.keyword.ngx -->
 <!--       ^^^^^^^^^^^^^^^^^^^^ meta.block.ngx -->
@@ -422,6 +443,7 @@
 <!--                          ^ punctuation.section.block.end.ngx -->
 
     @defer (on viewport) {
+<!--^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--^^^^^^ keyword.control.flow.ngx -->
 <!--^ punctuation.definition.keyword.ngx -->
 <!--       ^^^^^^^^^^^^^ meta.group.ngx -->
@@ -433,18 +455,21 @@
         <comment-list />
     } @loading {
 <!--^ meta.block.ngx punctuation.section.block.end.ngx -->
+<!--  ^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--  ^^^^^^^^ keyword.control.flow.ngx -->
 <!--  ^ punctuation.definition.keyword.ngx -->
 <!--           ^ meta.block.ngx punctuation.section.block.begin.ngx -->
       Loading…
     } @error {
 <!--^ meta.block.ngx punctuation.section.block.end.ngx -->
+<!--  ^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--  ^^^^^^ keyword.control.flow.ngx -->
 <!--  ^ punctuation.definition.keyword.ngx -->
 <!--         ^ meta.block.ngx punctuation.section.block.begin.ngx -->
       Loading failed :(
     } @placeholder {
 <!--^ meta.block.ngx punctuation.section.block.end.ngx -->
+<!--  ^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--  ^^^^^^^^^^^^ keyword.control.flow.ngx -->
 <!--  ^ punctuation.definition.keyword.ngx -->
 <!--               ^ meta.block.ngx punctuation.section.block.begin.ngx -->
@@ -454,6 +479,7 @@
 <!-- ^ - meta.block -->
 
 @defer (on viewport; when $var prefetch on idle; prefetch when true) {
+<!--^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.embedded.statement.ngx.html source.ngx.embedded.html -->
 <!--   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.group.ngx -->
 <!--   ^ punctuation.section.group.begin.ngx -->
 <!--    ^^ keyword.control.flow.ngx -->