diff --git a/NgxHTML.sublime-syntax b/NgxHTML.sublime-syntax index 8d14473..4dc6f16 100644 --- 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,39 +219,51 @@ 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: @@ -251,20 +271,26 @@ contexts: - 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 index 313fff1..4cbefac 100644 --- a/tests/syntax_test_scopes.component.html +++ b/tests/syntax_test_scopes.component.html @@ -6,6 +6,8 @@ --> @let name = user.name; + + @@ -16,6 +18,7 @@ @let func = user.func(); + @@ -29,6 +32,7 @@ @let greeting = 'Hello, ' + name; + @@ -41,6 +45,7 @@ @let data = data$ | async; + @@ -53,6 +58,7 @@ @let item = var[10]['bar']; + @@ -71,6 +77,7 @@ @let path = .foo?.bar? ; + @@ -87,6 +94,7 @@ @let path = .orders.value()?.[0]?.$extra?.#currency.unit; + @@ -116,6 +124,7 @@ @let path = orders.value()?.[0]?.$extra?.#currency.unit; + @@ -149,9 +158,10 @@ --> @if (a > b) { - - - + + + + @@ -173,6 +183,7 @@ } @else if (b > a()) { + @@ -202,7 +213,8 @@ } @else { - + + {{ a }} is equal to {{ b }} @@ -250,6 +262,8 @@ --> @switch (accessLevel) { + + @@ -257,7 +271,7 @@ @case ('admin') { - + @@ -277,7 +291,7 @@ @case { - + @@ -292,7 +306,7 @@ @default { - + @@ -311,6 +325,8 @@ --> @for (user of users; track user.id) { + + @@ -326,14 +342,16 @@ {{ user.name }} } @empty { - - + + + Empty list of users -} - +.html} + @for (item of items; track item.id; let idx = $index, e = $even) { + @@ -370,9 +388,11 @@ } - + @if (users$ | async; as users) { + + @@ -402,7 +422,7 @@ } - + @defer { } + @@ -422,6 +443,7 @@ @defer (on viewport) { + @@ -433,18 +455,21 @@ } @loading { + Loading… } @error { + Loading failed :( } @placeholder { + @@ -454,6 +479,7 @@ @defer (on viewport; when $var prefetch on idle; prefetch when true) { +