From 2cd5fce0aa458d860a700bb0fffd95a51883966d Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Wed, 8 Sep 2021 21:04:18 +0200
Subject: [PATCH 01/21] Add section separators

Improve readability.
---
 Vue Component.sublime-syntax             | 8 ++++++++
 Vue Component.sublime-syntax.yaml-macros | 8 ++++++++
 2 files changed, 16 insertions(+)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 4ee8e79..88ce4df 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -81,6 +81,8 @@ contexts:
         2: entity.name.tag.template.html
       push: template-mustache
 
+###[ TAG ATTRIBUTES ]#########################################################
+
   vue-directive:
     - match: (?=v-)
       push:
@@ -117,6 +119,8 @@ contexts:
         0: meta.string.html string.quoted.single.html punctuation.definition.string.end.html
     - include: else-pop
 
+###[ STYLE TAG ]##############################################################
+
   style-close-tag:
     # for compatibility with ST builds before 4114
     - match: (</)((?i:style){{tag_name_break}})
@@ -314,6 +318,8 @@ contexts:
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
 
+###[ SCRIPT TAG ]#############################################################
+
   script-close-tag:
     # for compatibility with ST builds before 4114
     - match: (</)((?i:script){{tag_name_break}})
@@ -445,6 +451,8 @@ contexts:
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
 
+###[ TEMPLATE TAG ]###########################################################
+
   template-common:
     - include: template-lang-attribute
     - include: tag-attributes
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 1f56464..418cfe2 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -82,6 +82,8 @@ contexts:
         2: entity.name.tag.template.html
       push: template-mustache
 
+###[ TAG ATTRIBUTES ]#########################################################
+
   vue-directive:
     - match: (?=v-)
       push:
@@ -126,6 +128,8 @@ contexts:
           punctuation.definition.string.end.html
     - include: else-pop
 
+###[ STYLE TAG ]##############################################################
+
   style-close-tag:
     # for compatibility with ST builds before 4114
     - match: (</)((?i:style){{tag_name_break}})
@@ -197,6 +201,8 @@ contexts:
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
 
+###[ SCRIPT TAG ]#############################################################
+
   script-close-tag:
     # for compatibility with ST builds before 4114
     - match: (</)((?i:script){{tag_name_break}})
@@ -265,6 +271,8 @@ contexts:
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
 
+###[ TEMPLATE TAG ]###########################################################
+
   template-common:
     - include: template-lang-attribute
     - include: tag-attributes

From 30c74d93c05e31881ac38c9e108d66d2ae80fed0 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Wed, 8 Sep 2021 21:05:31 +0200
Subject: [PATCH 02/21] Reorganize and group contexts in sections

---
 Vue Component.sublime-syntax             | 32 ++++++++++++------------
 Vue Component.sublime-syntax.yaml-macros | 32 ++++++++++++------------
 2 files changed, 32 insertions(+), 32 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 88ce4df..25a8760 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -69,20 +69,12 @@ contexts:
         - match: ''
           pop: true
 
+###[ TAG ATTRIBUTES ]#########################################################
+
   tag-attributes:
     - meta_prepend: true
     - include: vue-directive
 
-  template-tag:
-    - match: (<)((?i:template)){{tag_name_break}}
-      captures:
-        0: meta.tag.template.begin.html
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.template.html
-      push: template-mustache
-
-###[ TAG ATTRIBUTES ]#########################################################
-
   vue-directive:
     - match: (?=v-)
       push:
@@ -453,12 +445,13 @@ contexts:
 
 ###[ TEMPLATE TAG ]###########################################################
 
-  template-common:
-    - include: template-lang-attribute
-    - include: tag-attributes
-    - match: />
-      scope: punctuation.definition.tag.end.html
-      pop: true
+  template-tag:
+    - match: (<)((?i:template)){{tag_name_break}}
+      captures:
+        0: meta.tag.template.begin.html
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.template.html
+      push: template-mustache
 
   template-close-tag:
     - match: (</)((?i:template))(>)
@@ -469,6 +462,13 @@ contexts:
         3: punctuation.definition.tag.end.html
       pop: true
 
+  template-common:
+    - include: template-lang-attribute
+    - include: tag-attributes
+    - match: />
+      scope: punctuation.definition.tag.end.html
+      pop: true
+
   template-mustache:
     - meta_content_scope: meta.tag.template.begin.html
     - include: template-common
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 418cfe2..6ac66dd 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -70,20 +70,12 @@ contexts:
         - match: ''
           pop: true
 
+###[ TAG ATTRIBUTES ]#########################################################
+
   tag-attributes:
     - meta_prepend: true
     - include: vue-directive
 
-  template-tag:
-    - match: (<)((?i:template)){{tag_name_break}}
-      captures:
-        0: meta.tag.template.begin.html
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.template.html
-      push: template-mustache
-
-###[ TAG ATTRIBUTES ]#########################################################
-
   vue-directive:
     - match: (?=v-)
       push:
@@ -273,12 +265,13 @@ contexts:
 
 ###[ TEMPLATE TAG ]###########################################################
 
-  template-common:
-    - include: template-lang-attribute
-    - include: tag-attributes
-    - match: '/>'
-      scope: punctuation.definition.tag.end.html
-      pop: true
+  template-tag:
+    - match: (<)((?i:template)){{tag_name_break}}
+      captures:
+        0: meta.tag.template.begin.html
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.template.html
+      push: template-mustache
 
   template-close-tag:
     - match: (</)((?i:template))(>)
@@ -289,6 +282,13 @@ contexts:
         3: punctuation.definition.tag.end.html
       pop: true
 
+  template-common:
+    - include: template-lang-attribute
+    - include: tag-attributes
+    - match: '/>'
+      scope: punctuation.definition.tag.end.html
+      pop: true
+
   template-mustache:
     - meta_content_scope: meta.tag.template.begin.html
     - include: template-common

From bfb0a8326aa9b30eee65dc8404e68b3aa985a077 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Wed, 8 Sep 2021 21:20:21 +0200
Subject: [PATCH 03/21] Fix meta scopes of template tags

This commit...

1. fixes duplicated meta.tag scopes in `<template>` tags
2. fixes missing meta.tag scope at the closing `>` in `<template>` tags
3. adds syntax tests for template tags
---
 Vue Component.sublime-syntax             |   7 +-
 Vue Component.sublime-syntax.yaml-macros |   7 +-
 tests/syntax_test_template.vue           | 101 +++++++++++++++++++++++
 3 files changed, 105 insertions(+), 10 deletions(-)
 create mode 100644 tests/syntax_test_template.vue

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 25a8760..63840bd 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -448,7 +448,6 @@ contexts:
   template-tag:
     - match: (<)((?i:template)){{tag_name_break}}
       captures:
-        0: meta.tag.template.begin.html
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
       push: template-mustache
@@ -465,12 +464,10 @@ contexts:
   template-common:
     - include: template-lang-attribute
     - include: tag-attributes
-    - match: />
-      scope: punctuation.definition.tag.end.html
-      pop: true
+    - include: tag-end-self-closing
 
   template-mustache:
-    - meta_content_scope: meta.tag.template.begin.html
+    - meta_scope: meta.tag.template.begin.html
     - include: template-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 6ac66dd..69e6ff3 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -268,7 +268,6 @@ contexts:
   template-tag:
     - match: (<)((?i:template)){{tag_name_break}}
       captures:
-        0: meta.tag.template.begin.html
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
       push: template-mustache
@@ -285,12 +284,10 @@ contexts:
   template-common:
     - include: template-lang-attribute
     - include: tag-attributes
-    - match: '/>'
-      scope: punctuation.definition.tag.end.html
-      pop: true
+    - include: tag-end-self-closing
 
   template-mustache:
-    - meta_content_scope: meta.tag.template.begin.html
+    - meta_scope: meta.tag.template.begin.html
     - include: template-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
diff --git a/tests/syntax_test_template.vue b/tests/syntax_test_template.vue
new file mode 100644
index 0000000..3847a4e
--- /dev/null
+++ b/tests/syntax_test_template.vue
@@ -0,0 +1,101 @@
+// SYNTAX TEST "Vue Component.sublime-syntax"
+
+
+    <template lang="jade"> foo </template>
+//  ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+//                        ^^^^^ text.jade.embedded.html - meta.tag
+//                             ^^^^^^^^^^^ meta.tag - source
+
+    <template lang="jade"> foo --> </template>
+//  ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+//                        ^^^^^ text.jade.embedded.html - meta.tag
+//                             ^^^^ - meta.tag - source
+//                             ^^^ comment.block.html punctuation.definition.comment.end.html
+//                                 ^^^^^^^^^^^ meta.tag - source
+
+    <template lang="jade"> <!-- foo </template>
+//  ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+//                        ^^^^^ - meta.tag - source
+//                         ^^^^ punctuation.definition.comment.begin.html
+//                             ^^^^^ text.jade.embedded.html - meta.tag
+//                                  ^^^^^^^^^^^ meta.tag - source
+
+    <template lang="jade"> <!-- foo --> </template>
+//  ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
+//                        ^^^^^ - meta.tag - source
+//                         ^^^^ punctuation.definition.comment.begin.html
+//                             ^^^^^ text.jade.embedded.html - meta.tag
+//                                  ^^^^ - meta.tag - source
+//                                  ^^^ comment.block.html punctuation.definition.comment.end.html
+//                                      ^^^^^^^^^^^ meta.tag - source
+
+
+    <template lang="jade">
+
+// <- text.jade.embedded.html
+
+    </template>
+// <- text.jade.embedded.html
+//^^ text.jade.embedded.html
+//  ^^^^^^^^^^^ meta.tag - meta.tag meta.tag - text.jade
+
+
+    <template lang="jade">
+//  ^^^^^^^^^^ meta.tag - meta.tag meta.tag - meta.attribute-with-value
+//            ^^^^^^^^^^^ meta.tag meta.attribute-with-value.html - meta.tag meta.tag
+//                       ^ meta.tag.template.begin.html - meta.tag meta.tag
+//  ^ punctuation.definition.tag.begin.html
+//   ^^^^^^^^ entity.name.tag.template.html
+//            ^^^^ entity.other.attribute-name.html
+//                ^ punctuation.separator.key-value.html
+//                       ^ punctuation.definition.tag.end.html
+//                        ^ - text.jade
+
+// <- text.jade.embedded.html
+    </template>
+// <- text.jade.embedded.html
+//^^ text.jade.embedded.html
+//  ^^^^^^^^^^^ meta.tag - meta.tag meta.tag - text.jade
+//  ^^ punctuation.definition.tag.begin.html
+//    ^^^^^^^^ entity.name.tag.template.html
+//            ^ punctuation.definition.tag.end.html
+
+    <template lang="pug">
+//  ^^^^^^^^^^ meta.tag - meta.tag meta.tag - meta.attribute-with-value
+//            ^^^^^^^^^^ meta.tag meta.attribute-with-value.html - meta.tag meta.tag
+//                      ^ meta.tag.template.begin.html - meta.tag meta.tag
+//  ^ punctuation.definition.tag.begin.html
+//   ^^^^^^^^ entity.name.tag.template.html
+//            ^^^^ entity.other.attribute-name.html
+//                ^ punctuation.separator.key-value.html
+//                      ^ punctuation.definition.tag.end.html
+//                       ^ - text.pug
+
+// <- text.pug.embedded.html
+    </template>
+// <- text.pug.embedded.html
+//^^ text.pug.embedded.html
+//  ^^^^^^^^^^^ meta.tag - meta.tag meta.tag - text.pug
+//  ^^ punctuation.definition.tag.begin.html
+//    ^^^^^^^^ entity.name.tag.template.html
+//            ^ punctuation.definition.tag.end.html
+
+    <template lang="slm">
+//  ^^^^^^^^^^ meta.tag - meta.tag meta.tag - meta.attribute-with-value
+//            ^^^^^^^^^^ meta.tag meta.attribute-with-value.html - meta.tag meta.tag
+//                      ^ meta.tag.template.begin.html - meta.tag meta.tag
+//  ^ punctuation.definition.tag.begin.html
+//   ^^^^^^^^ entity.name.tag.template.html
+//            ^^^^ entity.other.attribute-name.html
+//                ^ punctuation.separator.key-value.html
+//                      ^ punctuation.definition.tag.end.html
+//                       ^ - text.slm
+
+// <- text.slm.embedded.html
+    </template>
+// <- text.slm.embedded.html
+//^^ text.slm.embedded.html
+//  ^^^^^^^^^^^ meta.tag - meta.tag meta.tag - text.slm
+//  ^^ punctuation.definition.tag.begin.html
+//    ^^^^^^^^ entity.name.tag.template.html
+//            ^ punctuation.definition.tag.end.html

From 7ecf306112c344605565c7223dfd0c3070a3ded8 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Wed, 8 Sep 2021 22:11:50 +0200
Subject: [PATCH 04/21] Fix mustage template interpolation

This commit fixes implementation of mustage template tags {{...}}.

Before this commit they tried to pop the `main` context off stack
and caused `template-tag-content` to never have been popped off stack
properly.

With this commit the syntax distinguishes between embedded template
tags and those which interpolate strings. The latter one remove
`string` scope for better highlighting java code in `{{ ... }}`.

It also does no longer push a dedicated `mustage-content` context on
stack as this is the same content as the whole document. It's not
required.
---
 Vue Component.sublime-syntax             | 112 ++++++++++++++---------
 Vue Component.sublime-syntax.yaml-macros |  64 +++++++++----
 tests/syntax_test_template.vue           |   8 ++
 tests/syntax_tests_mustage.vue           |  42 +++++++++
 4 files changed, 164 insertions(+), 62 deletions(-)
 create mode 100644 tests/syntax_tests_mustage.vue

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 63840bd..0de99d9 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -50,24 +50,16 @@ variables:
     )
 
 contexts:
+
+###[ HTML TAGS ]##############################################################
+
+  prototype:
+    - meta_prepend: true
+    - include: mustache-templates
+
   main:
     - meta_prepend: true
     - include: template-tag
-    - include: mustache-expression
-
-  mustache-expression:
-    - match: (?={{)
-      set:
-        - meta_scope: meta.template.vue
-        - match: '{{'
-          scope: punctuation.definition.template.begin.html
-          embed: scope:source.js
-          embed_scope: source.js.embedded.vue
-          escape: '}}'
-          escape_captures:
-            0: meta.template.vue punctuation.definition.template.end.html
-        - match: ''
-          pop: true
 
 ###[ TAG ATTRIBUTES ]#########################################################
 
@@ -75,6 +67,37 @@ contexts:
     - meta_prepend: true
     - include: vue-directive
 
+  tag-attribute-value-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+  strings-common-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+###[ MUSTAGE TEMPLATES ]######################################################
+
+  mustache-interpolations:
+    - match: (?={{)
+      push: mustache-interpolation-content
+
+  mustache-interpolation-content:
+    - clear_scopes: 1
+    - meta_scope: meta.interpolation.html
+    - include: mustache-templates
+    - include: immediately-pop
+
+  mustache-templates:
+    - match: '{{'
+      scope: meta.template.vue punctuation.definition.template.begin.html
+      embed: scope:source.js
+      embed_scope: meta.template.vue source.js.embedded.vue
+      escape: '}}'
+      escape_captures:
+        0: meta.template.vue punctuation.definition.template.end.html
+
+###[ VUE DIRECTIVES ]#########################################################
+
   vue-directive:
     - match: (?=v-)
       push:
@@ -180,13 +203,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - embed_scope: source.sass.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.sass.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.sass.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{style_content_begin}}'
+                      embed_scope: source.sass.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -202,13 +225,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - embed_scope: source.scss.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.scss.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.scss.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{style_content_begin}}'
+                      embed_scope: source.scss.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -224,13 +247,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - embed_scope: source.stylus.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.stylus.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.stylus.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{style_content_begin}}'
+                      embed_scope: source.stylus.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -246,13 +269,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - embed_scope: source.sss.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.sss.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.sss.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{style_content_begin}}'
+                      embed_scope: source.sss.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -268,13 +291,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - embed_scope: source.postcss.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.postcss.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.postcss.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{style_content_begin}}'
+                      embed_scope: source.postcss.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -290,13 +313,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - embed_scope: source.less.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.less.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.less.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{style_content_begin}}'
+                      embed_scope: source.less.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -379,13 +402,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: script-close-tag
-                -   - embed_scope: source.coffee.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.coffee.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.coffee.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{script_content_begin}}'
+                      embed_scope: source.coffee.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -401,13 +424,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: script-close-tag
-                -   - embed_scope: source.livescript.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.livescript.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.livescript.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{script_content_begin}}'
+                      embed_scope: source.livescript.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -423,13 +446,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: script-close-tag
-                -   - embed_scope: source.ts.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: source.ts.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.ts.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{script_content_begin}}'
+                      embed_scope: source.ts.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -451,6 +474,12 @@ contexts:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
       push: template-mustache
+    - match: (</)((?i:template))(>)
+      scope: meta.tag.template.end.html
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.template.html
+        3: punctuation.definition.tag.end.html
 
   template-close-tag:
     - match: (</)((?i:template))(>)
@@ -471,10 +500,7 @@ contexts:
     - include: template-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
-      set:
-        - include: template-close-tag
-        - match: ''
-          push: main
+      pop: 1
 
   template-lang-attribute:
     - match: (?i:lang){{attribute_name_break}}
@@ -503,13 +529,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: template-close-tag
-                -   - embed_scope: text.jade.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: text.jade.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: text.jade.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{template_content_begin}}'
+                      embed_scope: text.jade.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -525,13 +551,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: template-close-tag
-                -   - embed_scope: text.pug.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: text.pug.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: text.pug.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{template_content_begin}}'
+                      embed_scope: text.pug.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -547,13 +573,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: template-close-tag
-                -   - embed_scope: text.slm.embedded.html
-                      escape_captures:
+                -   - escape_captures:
                         1: text.slm.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: text.slm.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
                       match: '{{template_content_begin}}'
+                      embed_scope: text.slm.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 69e6ff3..27f73f9 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -51,24 +51,16 @@ variables:
     )
 
 contexts:
+
+###[ HTML TAGS ]##############################################################
+
+  prototype:
+    - meta_prepend: true
+    - include: mustache-templates
+
   main:
     - meta_prepend: true
     - include: template-tag
-    - include: mustache-expression
-
-  mustache-expression:
-    - match: '(?={{)'
-      set:
-        - meta_scope: meta.template.vue
-        - match: '{{'
-          scope: punctuation.definition.template.begin.html
-          embed: scope:source.js
-          embed_scope: source.js.embedded.vue
-          escape: '}}'
-          escape_captures:
-            0: meta.template.vue punctuation.definition.template.end.html
-        - match: ''
-          pop: true
 
 ###[ TAG ATTRIBUTES ]#########################################################
 
@@ -76,6 +68,37 @@ contexts:
     - meta_prepend: true
     - include: vue-directive
 
+  tag-attribute-value-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+  strings-common-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+###[ MUSTAGE TEMPLATES ]######################################################
+
+  mustache-interpolations:
+    - match: (?={{)
+      push: mustache-interpolation-content
+
+  mustache-interpolation-content:
+    - clear_scopes: 1
+    - meta_scope: meta.interpolation.html
+    - include: mustache-templates
+    - include: immediately-pop
+
+  mustache-templates:
+    - match: '{{'
+      scope: meta.template.vue punctuation.definition.template.begin.html
+      embed: scope:source.js
+      embed_scope: meta.template.vue source.js.embedded.vue
+      escape: '}}'
+      escape_captures:
+        0: meta.template.vue punctuation.definition.template.end.html
+
+###[ VUE DIRECTIVES ]#########################################################
+
   vue-directive:
     - match: (?=v-)
       push:
@@ -271,6 +294,12 @@ contexts:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
       push: template-mustache
+    - match: (</)((?i:template))(>)
+      scope: meta.tag.template.end.html
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.template.html
+        3: punctuation.definition.tag.end.html
 
   template-close-tag:
     - match: (</)((?i:template))(>)
@@ -291,10 +320,7 @@ contexts:
     - include: template-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
-      set:
-        - include: template-close-tag
-        - match: ''
-          push: main
+      pop: 1
 
   template-lang-attribute:
     - match: (?i:lang){{attribute_name_break}}
diff --git a/tests/syntax_test_template.vue b/tests/syntax_test_template.vue
index 3847a4e..2be75fe 100644
--- a/tests/syntax_test_template.vue
+++ b/tests/syntax_test_template.vue
@@ -1,5 +1,13 @@
 // SYNTAX TEST "Vue Component.sublime-syntax"
 
+    <template>
+// <- text.html.vue - text text
+//  ^^^^^^^^^^ meta.tag.template.begin.html
+
+    </template>
+// <- text.html.vue - text text
+//  ^^^^^^^^^^^ meta.tag.template.end.html
+
 
     <template lang="jade"> foo </template>
 //  ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
new file mode 100644
index 0000000..2563c96
--- /dev/null
+++ b/tests/syntax_tests_mustage.vue
@@ -0,0 +1,42 @@
+// SYNTAX TEST "Vue Component.sublime-syntax"
+
+    <h1> {{ foo.text }} </h1>
+//       ^^^^^^^^^^^^^^ meta.template.vue
+//       ^^ punctuation.definition.template.begin.html
+//         ^^^^^^^^^^ source.js.embedded.vue
+//                   ^^ punctuation.definition.template.end.html
+
+    <p {{foo.attrib}}>
+//     ^^^^^^^^^^^^^^ meta.template.vue
+//     ^^ punctuation.definition.template.begin.html
+//       ^^^^^^^^^^ source.js.embedded.vue
+//                 ^^ punctuation.definition.template.end.html
+
+    <p attrib="{{ foo.value }}" >
+//            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
+//             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.html
+//                            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
+//            ^ string.quoted.double.html punctuation.definition.string.begin.html
+//             ^^ punctuation.definition.template.begin.html - source.js
+//               ^^^^^^^^^^^ source.js.embedded.vue
+//                          ^^ punctuation.definition.template.end.html - source.js
+//                            ^ string.quoted.double.html punctuation.definition.string.end.html
+
+    <p attrib='{{ foo.value }}' >
+//            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
+//             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.html
+//                            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
+//            ^ string.quoted.single.html punctuation.definition.string.begin.html
+//             ^^ punctuation.definition.template.begin.html - source.js
+//               ^^^^^^^^^^^ source.js.embedded.vue
+//                          ^^ punctuation.definition.template.end.html - source.js
+//                            ^ string.quoted.single.html punctuation.definition.string.end.html
+
+    <p attrib={{ foo.value }} >
+//            ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.html
+//            ^^ punctuation.definition.template.begin.html - source.js
+//              ^^^^^^^^^^^ source.js.embedded.vue
+//                         ^^ punctuation.definition.template.end.html - source.js
+
+
+</html>
\ No newline at end of file

From 884d9556527a08e82d784879149f7f86e4d6e832 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Thu, 9 Sep 2021 17:41:51 +0200
Subject: [PATCH 05/21] Fix meta-attribute scopes in vue-directives

All `v-foo` directive attributes have not been scoped
`meta-attribute-with-value` which effects syntax highlighting when
using certain color schemes. That's fixed by this commit.

Note: It appears YAMLmacros sorts generated output randomly, so many
changes of the generated sublime-syntax file can be ignored.
---
 Vue Component.sublime-syntax             | 103 ++++++++++++-----------
 Vue Component.sublime-syntax.yaml-macros |  31 +++++--
 tests/syntax_tests_mustage.vue           |  17 ++++
 3 files changed, 95 insertions(+), 56 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 0de99d9..4a77c1c 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -101,37 +101,46 @@ contexts:
   vue-directive:
     - match: (?=v-)
       push:
+        - vue-directive-meta
         - vue-directive-assignment
         - tag-generic-attribute-name
     - match: (?::|@)
       scope: punctuation.definition.attribute.html
       push:
+        - vue-directive-meta
         - vue-directive-assignment
         - tag-generic-attribute-name
 
+  vue-directive-meta:
+    - meta_include_prototype: false
+    - meta_scope: meta.attribute-with-value.directive.html
+    - include: immediately-pop
+
   vue-directive-assignment:
-    - match: '='
+    - match: =
       scope: punctuation.separator.key-value.html
       set: vue-directive-value
     - include: else-pop
 
   vue-directive-value:
-    - match: '"'
+    - match: \"
       scope: meta.string.html string.quoted.double.html punctuation.definition.string.begin.html
-      embed: scope:source.js
       pop: true
-      embed_scope: meta.string.html source.js.embedded.vue
-      escape: '"'
+      embed: scope:source.js
+      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
+      escape: \"
       escape_captures:
-        0: meta.string.html string.quoted.double.html punctuation.definition.string.end.html
-    - match: "'"
+        0: meta.attribute-with-value.directive.html meta.string.html string.quoted.double.html
+          punctuation.definition.string.end.html
+    - match: \'
       scope: meta.string.html string.quoted.single.html punctuation.definition.string.begin.html
-      embed: scope:source.js
       pop: true
-      embed_scope: meta.string.html source.js.embedded.vue
-      escape: "'"
+      embed: scope:source.js
+      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
+      escape: \'
       escape_captures:
-        0: meta.string.html string.quoted.single.html punctuation.definition.string.end.html
+        0: meta.attribute-with-value.directive.html meta.string.html string.quoted.single.html
+          punctuation.definition.string.end.html
     - include: else-pop
 
 ###[ STYLE TAG ]##############################################################
@@ -203,13 +212,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.sass.embedded.html
+                      match: '{{style_content_begin}}'
+                      escape_captures:
                         1: source.sass.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.sass.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{style_content_begin}}'
-                      embed_scope: source.sass.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -225,13 +234,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.scss.embedded.html
+                      match: '{{style_content_begin}}'
+                      escape_captures:
                         1: source.scss.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.scss.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{style_content_begin}}'
-                      embed_scope: source.scss.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -247,13 +256,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.stylus.embedded.html
+                      match: '{{style_content_begin}}'
+                      escape_captures:
                         1: source.stylus.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.stylus.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{style_content_begin}}'
-                      embed_scope: source.stylus.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -269,13 +278,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.sss.embedded.html
+                      match: '{{style_content_begin}}'
+                      escape_captures:
                         1: source.sss.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.sss.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{style_content_begin}}'
-                      embed_scope: source.sss.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -291,13 +300,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.postcss.embedded.html
+                      match: '{{style_content_begin}}'
+                      escape_captures:
                         1: source.postcss.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.postcss.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{style_content_begin}}'
-                      embed_scope: source.postcss.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -313,13 +322,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: style-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.less.embedded.html
+                      match: '{{style_content_begin}}'
+                      escape_captures:
                         1: source.less.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.less.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{style_content_begin}}'
-                      embed_scope: source.less.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -402,13 +411,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: script-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.coffee.embedded.html
+                      match: '{{script_content_begin}}'
+                      escape_captures:
                         1: source.coffee.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.coffee.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{script_content_begin}}'
-                      embed_scope: source.coffee.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -424,13 +433,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: script-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.livescript.embedded.html
+                      match: '{{script_content_begin}}'
+                      escape_captures:
                         1: source.livescript.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.livescript.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{script_content_begin}}'
-                      embed_scope: source.livescript.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -446,13 +455,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: script-close-tag
-                -   - escape_captures:
+                -   - embed_scope: source.ts.embedded.html
+                      match: '{{script_content_begin}}'
+                      escape_captures:
                         1: source.ts.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: source.ts.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{script_content_begin}}'
-                      embed_scope: source.ts.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -529,13 +538,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: template-close-tag
-                -   - escape_captures:
+                -   - embed_scope: text.jade.embedded.html
+                      match: '{{template_content_begin}}'
+                      escape_captures:
                         1: text.jade.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: text.jade.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{template_content_begin}}'
-                      embed_scope: text.jade.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -551,13 +560,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: template-close-tag
-                -   - escape_captures:
+                -   - embed_scope: text.pug.embedded.html
+                      match: '{{template_content_begin}}'
+                      escape_captures:
                         1: text.pug.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: text.pug.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{template_content_begin}}'
-                      embed_scope: text.pug.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
@@ -573,13 +582,13 @@ contexts:
               scope: punctuation.definition.tag.end.html
               set:
                 -   - include: template-close-tag
-                -   - escape_captures:
+                -   - embed_scope: text.slm.embedded.html
+                      match: '{{template_content_begin}}'
+                      escape_captures:
                         1: text.slm.embedded.html
                         2: comment.block.html punctuation.definition.comment.end.html
                         3: text.slm.embedded.html
                         4: comment.block.html punctuation.definition.comment.end.html
-                      match: '{{template_content_begin}}'
-                      embed_scope: text.slm.embedded.html
                       captures:
                         1: comment.block.html punctuation.definition.comment.begin.html
                       pop: 1
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 27f73f9..c5b113c 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -102,43 +102,56 @@ contexts:
   vue-directive:
     - match: (?=v-)
       push:
+        - vue-directive-meta
         - vue-directive-assignment
         - tag-generic-attribute-name
     - match: (?::|@)
       scope: punctuation.definition.attribute.html
       push:
+        - vue-directive-meta
         - vue-directive-assignment
         - tag-generic-attribute-name
 
+  vue-directive-meta:
+    - meta_include_prototype: false
+    - meta_scope: meta.attribute-with-value.directive.html
+    - include: immediately-pop
+
   vue-directive-assignment:
-    - match: '='
+    - match: =
       scope: punctuation.separator.key-value.html
       set: vue-directive-value
     - include: else-pop
 
   vue-directive-value:
-    - match: '"'
+    - match: \"
       scope:
         meta.string.html string.quoted.double.html
         punctuation.definition.string.begin.html
-      embed: scope:source.js
       pop: true
-      embed_scope: meta.string.html source.js.embedded.vue
-      escape: '"'
+      embed: scope:source.js
+      embed_scope:
+        meta.string.html meta.interpolation.html
+        source.js.embedded.html
+      escape: \"
       escape_captures:
         0:
+          meta.attribute-with-value.directive.html
           meta.string.html string.quoted.double.html
           punctuation.definition.string.end.html
-    - match: "'"
+    - match: \'
       scope:
         meta.string.html string.quoted.single.html
         punctuation.definition.string.begin.html
-      embed: scope:source.js
       pop: true
-      embed_scope: meta.string.html source.js.embedded.vue
-      escape: "'"
+      embed: scope:source.js
+      embed_scope:
+        meta.string.html meta.interpolation.html
+        source.js.embedded.html
+      escape: \'
       escape_captures:
         0:
+          meta.attribute-with-value.directive.html
           meta.string.html string.quoted.single.html
           punctuation.definition.string.end.html
     - include: else-pop
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index 2563c96..57aa290 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -38,5 +38,22 @@
 //              ^^^^^^^^^^^ source.js.embedded.vue
 //                         ^^ punctuation.definition.template.end.html - source.js
 
+    <p v-attrib="let i = 0">
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
+//                        ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                         ^ meta.tag - meta.attribute-with-value
+//                          ^ - meta.tag
+
+    <p v-attrib='let i = 0'>
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
+//                        ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                         ^ meta.tag - meta.attribute-with-value
+//                          ^ - meta.tag
 
 </html>
\ No newline at end of file

From 71d282f181b8a9557db44c923c3bbabbf28271d3 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Thu, 9 Sep 2021 18:12:52 +0200
Subject: [PATCH 06/21] Fix stray script/style/template close tags

This commit refactors close-tag context handling in order to fix meta
scopes of stray closing tags.

Before this commit they received the default meta and entity scope from
HTML.sublime-syntax. This may result in inconsistent highlighting once
they are directly addressed by a color scheme.

That's a fix which is planned for core HTML.sublime-syntax, too.
The change of `script-tag` and `style-tag` also fixes duplicated
meta.tag scopes for script/style tags for ST builds before 4114.
---
 Vue Component.sublime-syntax             | 357 +++++++++++------------
 Vue Component.sublime-syntax.yaml-macros |  57 ++--
 src/macros.py                            |  37 +--
 tests/syntax_test_script.vue             |   2 +
 tests/syntax_test_style.vue              |   2 +
 tests/syntax_test_template.vue           |   3 +
 6 files changed, 231 insertions(+), 227 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 4a77c1c..01c3990 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -57,8 +57,10 @@ contexts:
     - meta_prepend: true
     - include: mustache-templates
 
-  main:
+  tag-html:
     - meta_prepend: true
+    - include: script-tag
+    - include: style-tag
     - include: template-tag
 
 ###[ TAG ATTRIBUTES ]#########################################################
@@ -145,15 +147,22 @@ contexts:
 
 ###[ STYLE TAG ]##############################################################
 
-  style-close-tag:
+  style-tag:
     # for compatibility with ST builds before 4114
+    - match: (<)((?i:style)){{tag_name_break}}
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.style.html
+      push: style-css
     - match: (</)((?i:style){{tag_name_break}})
       captures:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.style.html
-      set:
-        - meta_scope: meta.tag.style.end.html
-        - include: tag-end
+      push: style-close-tag-content
+
+  style-close-tag-content:
+    - meta_scope: meta.tag.style.end.html
+    - include: tag-end
 
   style-common:
     - meta_prepend: true
@@ -165,9 +174,7 @@ contexts:
     - include: style-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
-      set:
-        - style-close-tag
-        - style-css-content
+      set: style-css-content
 
   style-css-content:
     # for compatibility with ST builds before 4114
@@ -211,19 +218,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: style-close-tag
-                -   - embed_scope: source.sass.embedded.html
-                      match: '{{style_content_begin}}'
-                      escape_captures:
-                        1: source.sass.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.sass.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.sass
-                      escape: '{{style_content_end}}'
+                - embed_scope: source.sass.embedded.html
+                  match: '{{style_content_begin}}'
+                  escape_captures:
+                    1: source.sass.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.sass.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.sass
+                  escape: '{{style_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=scss{{unquoted_attribute_break}}|\'scss\'|"scss")
@@ -233,19 +239,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: style-close-tag
-                -   - embed_scope: source.scss.embedded.html
-                      match: '{{style_content_begin}}'
-                      escape_captures:
-                        1: source.scss.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.scss.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.scss
-                      escape: '{{style_content_end}}'
+                - embed_scope: source.scss.embedded.html
+                  match: '{{style_content_begin}}'
+                  escape_captures:
+                    1: source.scss.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.scss.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.scss
+                  escape: '{{style_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=stylus{{unquoted_attribute_break}}|\'stylus\'|"stylus")
@@ -255,19 +260,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: style-close-tag
-                -   - embed_scope: source.stylus.embedded.html
-                      match: '{{style_content_begin}}'
-                      escape_captures:
-                        1: source.stylus.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.stylus.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.stylus
-                      escape: '{{style_content_end}}'
+                - embed_scope: source.stylus.embedded.html
+                  match: '{{style_content_begin}}'
+                  escape_captures:
+                    1: source.stylus.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.stylus.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.stylus
+                  escape: '{{style_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=postcss\?parser=sugarss{{unquoted_attribute_break}}|\'postcss\?parser=sugarss\'|"postcss\?parser=sugarss")
@@ -277,19 +281,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: style-close-tag
-                -   - embed_scope: source.sss.embedded.html
-                      match: '{{style_content_begin}}'
-                      escape_captures:
-                        1: source.sss.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.sss.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.sss
-                      escape: '{{style_content_end}}'
+                - embed_scope: source.sss.embedded.html
+                  match: '{{style_content_begin}}'
+                  escape_captures:
+                    1: source.sss.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.sss.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.sss
+                  escape: '{{style_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=postcss{{unquoted_attribute_break}}|\'postcss\'|"postcss")
@@ -299,19 +302,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: style-close-tag
-                -   - embed_scope: source.postcss.embedded.html
-                      match: '{{style_content_begin}}'
-                      escape_captures:
-                        1: source.postcss.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.postcss.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.postcss
-                      escape: '{{style_content_end}}'
+                - embed_scope: source.postcss.embedded.html
+                  match: '{{style_content_begin}}'
+                  escape_captures:
+                    1: source.postcss.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.postcss.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.postcss
+                  escape: '{{style_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=less{{unquoted_attribute_break}}|\'less\'|"less")
@@ -321,19 +323,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: style-close-tag
-                -   - embed_scope: source.less.embedded.html
-                      match: '{{style_content_begin}}'
-                      escape_captures:
-                        1: source.less.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.less.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.less
-                      escape: '{{style_content_end}}'
+                - embed_scope: source.less.embedded.html
+                  match: '{{style_content_begin}}'
+                  escape_captures:
+                    1: source.less.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.less.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.less
+                  escape: '{{style_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
@@ -344,15 +345,22 @@ contexts:
 
 ###[ SCRIPT TAG ]#############################################################
 
-  script-close-tag:
+  script-tag:
     # for compatibility with ST builds before 4114
+    - match: (<)((?i:script)){{tag_name_break}}
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.script.html
+      push: script-javascript
     - match: (</)((?i:script){{tag_name_break}})
       captures:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.script.html
-      set:
-        - meta_scope: meta.tag.script.end.html
-        - include: tag-end
+      push: script-close-tag-content
+
+  script-close-tag-content:
+    - meta_scope: meta.tag.script.end.html
+    - include: tag-end
 
   script-common:
     - meta_prepend: true
@@ -364,9 +372,7 @@ contexts:
     - include: script-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
-      set:
-        - script-close-tag
-        - script-javascript-content
+      set: script-javascript-content
 
   script-javascript-content:
     # for compatibility with ST builds before 4114
@@ -410,19 +416,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: script-close-tag
-                -   - embed_scope: source.coffee.embedded.html
-                      match: '{{script_content_begin}}'
-                      escape_captures:
-                        1: source.coffee.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.coffee.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.coffee
-                      escape: '{{script_content_end}}'
+                - embed_scope: source.coffee.embedded.html
+                  match: '{{script_content_begin}}'
+                  escape_captures:
+                    1: source.coffee.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.coffee.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.coffee
+                  escape: '{{script_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=livescript{{unquoted_attribute_break}}|\'livescript\'|"livescript")
@@ -432,19 +437,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: script-close-tag
-                -   - embed_scope: source.livescript.embedded.html
-                      match: '{{script_content_begin}}'
-                      escape_captures:
-                        1: source.livescript.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.livescript.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.livescript
-                      escape: '{{script_content_end}}'
+                - embed_scope: source.livescript.embedded.html
+                  match: '{{script_content_begin}}'
+                  escape_captures:
+                    1: source.livescript.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.livescript.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.livescript
+                  escape: '{{script_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=ts{{unquoted_attribute_break}}|\'ts\'|"ts")
@@ -454,19 +458,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: script-close-tag
-                -   - embed_scope: source.ts.embedded.html
-                      match: '{{script_content_begin}}'
-                      escape_captures:
-                        1: source.ts.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: source.ts.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:source.ts
-                      escape: '{{script_content_end}}'
+                - embed_scope: source.ts.embedded.html
+                  match: '{{script_content_begin}}'
+                  escape_captures:
+                    1: source.ts.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.ts.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.ts
+                  escape: '{{script_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
@@ -483,21 +486,16 @@ contexts:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
       push: template-mustache
-    - match: (</)((?i:template))(>)
-      scope: meta.tag.template.end.html
+    - match: (</)((?i:template))
       captures:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
         3: punctuation.definition.tag.end.html
+      push: template-tag-content
 
-  template-close-tag:
-    - match: (</)((?i:template))(>)
-      scope: meta.tag.template.end.html
-      captures:
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.template.html
-        3: punctuation.definition.tag.end.html
-      pop: true
+  template-tag-content:
+    - meta_scope: meta.tag.template.end.html
+    - include: tag-end
 
   template-common:
     - include: template-lang-attribute
@@ -537,19 +535,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: template-close-tag
-                -   - embed_scope: text.jade.embedded.html
-                      match: '{{template_content_begin}}'
-                      escape_captures:
-                        1: text.jade.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: text.jade.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:text.jade
-                      escape: '{{template_content_end}}'
+                - embed_scope: text.jade.embedded.html
+                  match: '{{template_content_begin}}'
+                  escape_captures:
+                    1: text.jade.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: text.jade.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:text.jade
+                  escape: '{{template_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=pug{{unquoted_attribute_break}}|\'pug\'|"pug")
@@ -559,19 +556,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: template-close-tag
-                -   - embed_scope: text.pug.embedded.html
-                      match: '{{template_content_begin}}'
-                      escape_captures:
-                        1: text.pug.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: text.pug.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:text.pug
-                      escape: '{{template_content_end}}'
+                - embed_scope: text.pug.embedded.html
+                  match: '{{template_content_begin}}'
+                  escape_captures:
+                    1: text.pug.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: text.pug.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:text.pug
+                  escape: '{{template_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=slm{{unquoted_attribute_break}}|\'slm\'|"slm")
@@ -581,19 +577,18 @@ contexts:
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                -   - include: template-close-tag
-                -   - embed_scope: text.slm.embedded.html
-                      match: '{{template_content_begin}}'
-                      escape_captures:
-                        1: text.slm.embedded.html
-                        2: comment.block.html punctuation.definition.comment.end.html
-                        3: text.slm.embedded.html
-                        4: comment.block.html punctuation.definition.comment.end.html
-                      captures:
-                        1: comment.block.html punctuation.definition.comment.begin.html
-                      pop: 1
-                      embed: scope:text.slm
-                      escape: '{{template_content_end}}'
+                - embed_scope: text.slm.embedded.html
+                  match: '{{template_content_begin}}'
+                  escape_captures:
+                    1: text.slm.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: text.slm.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:text.slm
+                  escape: '{{template_content_end}}'
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index c5b113c..c810d08 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -58,8 +58,10 @@ contexts:
     - meta_prepend: true
     - include: mustache-templates
 
-  main:
+  tag-html:
     - meta_prepend: true
+    - include: script-tag
+    - include: style-tag
     - include: template-tag
 
 ###[ TAG ATTRIBUTES ]#########################################################
@@ -158,15 +160,22 @@ contexts:
 
 ###[ STYLE TAG ]##############################################################
 
-  style-close-tag:
+  style-tag:
     # for compatibility with ST builds before 4114
+    - match: (<)((?i:style)){{tag_name_break}}
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.style.html
+      push: style-css
     - match: (</)((?i:style){{tag_name_break}})
       captures:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.style.html
-      set:
-        - meta_scope: meta.tag.style.end.html
-        - include: tag-end
+      push: style-close-tag-content
+
+  style-close-tag-content:
+    - meta_scope: meta.tag.style.end.html
+    - include: tag-end
 
   style-common:
     - meta_prepend: true
@@ -178,9 +187,7 @@ contexts:
     - include: style-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
-      set:
-        - style-close-tag
-        - style-css-content
+      set: style-css-content
 
   style-css-content:
     # for compatibility with ST builds before 4114
@@ -231,15 +238,22 @@ contexts:
 
 ###[ SCRIPT TAG ]#############################################################
 
-  script-close-tag:
+  script-tag:
     # for compatibility with ST builds before 4114
+    - match: (<)((?i:script)){{tag_name_break}}
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.script.html
+      push: script-javascript
     - match: (</)((?i:script){{tag_name_break}})
       captures:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.script.html
-      set:
-        - meta_scope: meta.tag.script.end.html
-        - include: tag-end
+      push: script-close-tag-content
+
+  script-close-tag-content:
+    - meta_scope: meta.tag.script.end.html
+    - include: tag-end
 
   script-common:
     - meta_prepend: true
@@ -251,9 +265,7 @@ contexts:
     - include: script-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
-      set:
-        - script-close-tag
-        - script-javascript-content
+      set: script-javascript-content
 
   script-javascript-content:
     # for compatibility with ST builds before 4114
@@ -307,21 +319,16 @@ contexts:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
       push: template-mustache
-    - match: (</)((?i:template))(>)
-      scope: meta.tag.template.end.html
+    - match: (</)((?i:template))
       captures:
         1: punctuation.definition.tag.begin.html
         2: entity.name.tag.template.html
         3: punctuation.definition.tag.end.html
+      push: template-tag-content
 
-  template-close-tag:
-    - match: (</)((?i:template))(>)
-      scope: meta.tag.template.end.html
-      captures:
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.template.html
-        3: punctuation.definition.tag.end.html
-      pop: true
+  template-tag-content:
+    - meta_scope: meta.tag.template.end.html
+    - include: tag-end
 
   template-common:
     - include: template-lang-attribute
diff --git a/src/macros.py b/src/macros.py
index 3f727a6..85839af 100644
--- a/src/macros.py
+++ b/src/macros.py
@@ -20,27 +20,22 @@ def embed_language_in_tag(tag, match, embed):
                     match='>',
                     scope='punctuation.definition.tag.end.html',
                     set=[
-                        [
-                            _rule(include='%s-close-tag' % tag)
-                        ],
-                        [
-                            _rule(
-                                match=r'{{%s_content_begin}}' % tag,
-                                captures={
-                                    1: 'comment.block.html punctuation.definition.comment.begin.html',
-                                },
-                                pop=1,
-                                embed=('scope:%s' % embed),
-                                embed_scope=('%s.embedded.html' % embed),
-                                escape='{{%s_content_end}}' % tag,
-                                escape_captures={
-                                  1: ('%s.embedded.html' % embed),
-                                  2: 'comment.block.html punctuation.definition.comment.end.html',
-                                  3: ('%s.embedded.html' % embed),
-                                  4: 'comment.block.html punctuation.definition.comment.end.html',
-                                },
-                            )
-                        ]
+                        _rule(
+                            match=r'{{%s_content_begin}}' % tag,
+                            captures={
+                                1: 'comment.block.html punctuation.definition.comment.begin.html',
+                            },
+                            pop=1,
+                            embed=('scope:%s' % embed),
+                            embed_scope=('%s.embedded.html' % embed),
+                            escape='{{%s_content_end}}' % tag,
+                            escape_captures={
+                              1: ('%s.embedded.html' % embed),
+                              2: 'comment.block.html punctuation.definition.comment.end.html',
+                              3: ('%s.embedded.html' % embed),
+                              4: 'comment.block.html punctuation.definition.comment.end.html',
+                            },
+                        )
                     ]
                 ),
             ],
diff --git a/tests/syntax_test_script.vue b/tests/syntax_test_script.vue
index 05c8ac0..190fc8b 100644
--- a/tests/syntax_test_script.vue
+++ b/tests/syntax_test_script.vue
@@ -1,5 +1,7 @@
 // SYNTAX TEST "Vue Component.sublime-syntax"
 
+    </script>
+//  ^^^^^^^^^ meta.tag.script.end.html
 
     <script> var i = 0; </script>
 //  ^^^^^^^^ meta.tag - source
diff --git a/tests/syntax_test_style.vue b/tests/syntax_test_style.vue
index 8b88d44..55d19c0 100644
--- a/tests/syntax_test_style.vue
+++ b/tests/syntax_test_style.vue
@@ -1,5 +1,7 @@
 // SYNTAX TEST "Vue Component.sublime-syntax"
 
+    </style>
+//  ^^^^^^^^ meta.tag.style.end.html
 
     <style> h1 {} </style>
 //  ^^^^^^^ meta.tag - source
diff --git a/tests/syntax_test_template.vue b/tests/syntax_test_template.vue
index 2be75fe..0035c86 100644
--- a/tests/syntax_test_template.vue
+++ b/tests/syntax_test_template.vue
@@ -8,6 +8,9 @@
 // <- text.html.vue - text text
 //  ^^^^^^^^^^^ meta.tag.template.end.html
 
+    </template><!-- stray template close tag -->
+// <- text.html.vue - text text
+//  ^^^^^^^^^^^ meta.tag.template.end.html
 
     <template lang="jade"> foo </template>
 //  ^^^^^^^^^^^^^^^^^^^^^^ meta.tag - source

From 023ade45f96895468c29a70e52748eb4f24c1227 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Thu, 9 Sep 2021 18:47:23 +0200
Subject: [PATCH 07/21] Reorganize context/section order

This commit just moves sections/contexts around. It doesn't change
behavior.

The goal is to end up with the same order as HTML.sublime-syntax which
uses a top-down-order.

1. managing contexts
2. tag contexts
3. attribute contexts
4. other reusable contexts
5. prototypes
---
 Vue Component.sublime-syntax             | 406 +++++++++++------------
 Vue Component.sublime-syntax.yaml-macros | 310 ++++++++---------
 2 files changed, 358 insertions(+), 358 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 01c3990..8deb773 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -63,87 +63,140 @@ contexts:
     - include: style-tag
     - include: template-tag
 
-###[ TAG ATTRIBUTES ]#########################################################
+###[ SCRIPT TAG ]#############################################################
 
-  tag-attributes:
-    - meta_prepend: true
-    - include: vue-directive
+  script-tag:
+    # for compatibility with ST builds before 4114
+    - match: (<)((?i:script)){{tag_name_break}}
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.script.html
+      push: script-javascript
+    - match: (</)((?i:script){{tag_name_break}})
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.script.html
+      push: script-close-tag-content
 
-  tag-attribute-value-content:
-    - meta_prepend: true
-    - include: mustache-interpolations
+  script-close-tag-content:
+    - meta_scope: meta.tag.script.end.html
+    - include: tag-end
 
-  strings-common-content:
+  script-common:
     - meta_prepend: true
-    - include: mustache-interpolations
-
-###[ MUSTAGE TEMPLATES ]######################################################
-
-  mustache-interpolations:
-    - match: (?={{)
-      push: mustache-interpolation-content
+    - include: script-lang-attribute
 
-  mustache-interpolation-content:
-    - clear_scopes: 1
-    - meta_scope: meta.interpolation.html
-    - include: mustache-templates
-    - include: immediately-pop
+  script-javascript:
+    # for compatibility with ST builds before 4114
+    - meta_scope: meta.tag.script.begin.html
+    - include: script-common
+    - match: '>'
+      scope: punctuation.definition.tag.end.html
+      set: script-javascript-content
 
-  mustache-templates:
-    - match: '{{'
-      scope: meta.template.vue punctuation.definition.template.begin.html
+  script-javascript-content:
+    # for compatibility with ST builds before 4114
+    - meta_include_prototype: false
+    - match: '{{script_content_begin}}'
+      captures:
+        1: comment.block.html punctuation.definition.comment.begin.html
+      pop: 1  # make sure to match only once
       embed: scope:source.js
-      embed_scope: meta.template.vue source.js.embedded.vue
-      escape: '}}'
+      embed_scope: source.js.embedded.html
+      escape: '{{script_content_end}}'
       escape_captures:
-        0: meta.template.vue punctuation.definition.template.end.html
-
-###[ VUE DIRECTIVES ]#########################################################
-
-  vue-directive:
-    - match: (?=v-)
-      push:
-        - vue-directive-meta
-        - vue-directive-assignment
-        - tag-generic-attribute-name
-    - match: (?::|@)
-      scope: punctuation.definition.attribute.html
-      push:
-        - vue-directive-meta
-        - vue-directive-assignment
-        - tag-generic-attribute-name
+        1: source.js.embedded.html
+        2: comment.block.html punctuation.definition.comment.end.html
+        3: source.js.embedded.html
+        4: comment.block.html punctuation.definition.comment.end.html
 
-  vue-directive-meta:
-    - meta_include_prototype: false
-    - meta_scope: meta.attribute-with-value.directive.html
-    - include: immediately-pop
+  script-lang-attribute:
+    - match: (?i:lang){{attribute_name_break}}
+      scope: meta.attribute-with-value.html entity.other.attribute-name.html
+      set: script-lang-attribute-assignment
 
-  vue-directive-assignment:
+  script-lang-attribute-assignment:
+    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
     - match: =
       scope: punctuation.separator.key-value.html
-      set: vue-directive-value
-    - include: else-pop
+      set: script-lang-attribute-value
+    - match: (?=\S)
+      set: script-javascript
 
-  vue-directive-value:
-    - match: \"
-      scope: meta.string.html string.quoted.double.html punctuation.definition.string.begin.html
-      pop: true
-      embed: scope:source.js
-      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
-      escape: \"
-      escape_captures:
-        0: meta.attribute-with-value.directive.html meta.string.html string.quoted.double.html
-          punctuation.definition.string.end.html
-    - match: \'
-      scope: meta.string.html string.quoted.single.html punctuation.definition.string.begin.html
-      pop: true
-      embed: scope:source.js
-      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
-      escape: \'
-      escape_captures:
-        0: meta.attribute-with-value.directive.html meta.string.html string.quoted.single.html
-          punctuation.definition.string.end.html
-    - include: else-pop
+  script-lang-attribute-value:
+    - meta_include_prototype: false
+    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.html
+    - include: script-lang-decider
+
+  script-lang-decider:
+    - match: (?i)(?=coffee{{unquoted_attribute_break}}|\'coffee\'|"coffee")
+      set:
+        -   - meta_scope: meta.tag.script.begin.html
+            - include: script-common
+            - match: '>'
+              scope: punctuation.definition.tag.end.html
+              set:
+                - embed_scope: source.coffee.embedded.html
+                  match: '{{script_content_begin}}'
+                  escape_captures:
+                    1: source.coffee.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.coffee.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.coffee
+                  escape: '{{script_content_end}}'
+        - tag-generic-attribute-meta
+        - tag-generic-attribute-value
+    - match: (?i)(?=livescript{{unquoted_attribute_break}}|\'livescript\'|"livescript")
+      set:
+        -   - meta_scope: meta.tag.script.begin.html
+            - include: script-common
+            - match: '>'
+              scope: punctuation.definition.tag.end.html
+              set:
+                - embed_scope: source.livescript.embedded.html
+                  match: '{{script_content_begin}}'
+                  escape_captures:
+                    1: source.livescript.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.livescript.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.livescript
+                  escape: '{{script_content_end}}'
+        - tag-generic-attribute-meta
+        - tag-generic-attribute-value
+    - match: (?i)(?=ts{{unquoted_attribute_break}}|\'ts\'|"ts")
+      set:
+        -   - meta_scope: meta.tag.script.begin.html
+            - include: script-common
+            - match: '>'
+              scope: punctuation.definition.tag.end.html
+              set:
+                - embed_scope: source.ts.embedded.html
+                  match: '{{script_content_begin}}'
+                  escape_captures:
+                    1: source.ts.embedded.html
+                    2: comment.block.html punctuation.definition.comment.end.html
+                    3: source.ts.embedded.html
+                    4: comment.block.html punctuation.definition.comment.end.html
+                  captures:
+                    1: comment.block.html punctuation.definition.comment.begin.html
+                  pop: 1
+                  embed: scope:source.ts
+                  escape: '{{script_content_end}}'
+        - tag-generic-attribute-meta
+        - tag-generic-attribute-value
+    - match: (?=\S)
+      set:
+        - script-javascript
+        - tag-generic-attribute-meta
+        - tag-generic-attribute-value
 
 ###[ STYLE TAG ]##############################################################
 
@@ -343,141 +396,6 @@ contexts:
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
 
-###[ SCRIPT TAG ]#############################################################
-
-  script-tag:
-    # for compatibility with ST builds before 4114
-    - match: (<)((?i:script)){{tag_name_break}}
-      captures:
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.script.html
-      push: script-javascript
-    - match: (</)((?i:script){{tag_name_break}})
-      captures:
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.script.html
-      push: script-close-tag-content
-
-  script-close-tag-content:
-    - meta_scope: meta.tag.script.end.html
-    - include: tag-end
-
-  script-common:
-    - meta_prepend: true
-    - include: script-lang-attribute
-
-  script-javascript:
-    # for compatibility with ST builds before 4114
-    - meta_scope: meta.tag.script.begin.html
-    - include: script-common
-    - match: '>'
-      scope: punctuation.definition.tag.end.html
-      set: script-javascript-content
-
-  script-javascript-content:
-    # for compatibility with ST builds before 4114
-    - meta_include_prototype: false
-    - match: '{{script_content_begin}}'
-      captures:
-        1: comment.block.html punctuation.definition.comment.begin.html
-      pop: 1  # make sure to match only once
-      embed: scope:source.js
-      embed_scope: source.js.embedded.html
-      escape: '{{script_content_end}}'
-      escape_captures:
-        1: source.js.embedded.html
-        2: comment.block.html punctuation.definition.comment.end.html
-        3: source.js.embedded.html
-        4: comment.block.html punctuation.definition.comment.end.html
-
-  script-lang-attribute:
-    - match: (?i:lang){{attribute_name_break}}
-      scope: meta.attribute-with-value.html entity.other.attribute-name.html
-      set: script-lang-attribute-assignment
-
-  script-lang-attribute-assignment:
-    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
-    - match: =
-      scope: punctuation.separator.key-value.html
-      set: script-lang-attribute-value
-    - match: (?=\S)
-      set: script-javascript
-
-  script-lang-attribute-value:
-    - meta_include_prototype: false
-    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.html
-    - include: script-lang-decider
-
-  script-lang-decider:
-    - match: (?i)(?=coffee{{unquoted_attribute_break}}|\'coffee\'|"coffee")
-      set:
-        -   - meta_scope: meta.tag.script.begin.html
-            - include: script-common
-            - match: '>'
-              scope: punctuation.definition.tag.end.html
-              set:
-                - embed_scope: source.coffee.embedded.html
-                  match: '{{script_content_begin}}'
-                  escape_captures:
-                    1: source.coffee.embedded.html
-                    2: comment.block.html punctuation.definition.comment.end.html
-                    3: source.coffee.embedded.html
-                    4: comment.block.html punctuation.definition.comment.end.html
-                  captures:
-                    1: comment.block.html punctuation.definition.comment.begin.html
-                  pop: 1
-                  embed: scope:source.coffee
-                  escape: '{{script_content_end}}'
-        - tag-generic-attribute-meta
-        - tag-generic-attribute-value
-    - match: (?i)(?=livescript{{unquoted_attribute_break}}|\'livescript\'|"livescript")
-      set:
-        -   - meta_scope: meta.tag.script.begin.html
-            - include: script-common
-            - match: '>'
-              scope: punctuation.definition.tag.end.html
-              set:
-                - embed_scope: source.livescript.embedded.html
-                  match: '{{script_content_begin}}'
-                  escape_captures:
-                    1: source.livescript.embedded.html
-                    2: comment.block.html punctuation.definition.comment.end.html
-                    3: source.livescript.embedded.html
-                    4: comment.block.html punctuation.definition.comment.end.html
-                  captures:
-                    1: comment.block.html punctuation.definition.comment.begin.html
-                  pop: 1
-                  embed: scope:source.livescript
-                  escape: '{{script_content_end}}'
-        - tag-generic-attribute-meta
-        - tag-generic-attribute-value
-    - match: (?i)(?=ts{{unquoted_attribute_break}}|\'ts\'|"ts")
-      set:
-        -   - meta_scope: meta.tag.script.begin.html
-            - include: script-common
-            - match: '>'
-              scope: punctuation.definition.tag.end.html
-              set:
-                - embed_scope: source.ts.embedded.html
-                  match: '{{script_content_begin}}'
-                  escape_captures:
-                    1: source.ts.embedded.html
-                    2: comment.block.html punctuation.definition.comment.end.html
-                    3: source.ts.embedded.html
-                    4: comment.block.html punctuation.definition.comment.end.html
-                  captures:
-                    1: comment.block.html punctuation.definition.comment.begin.html
-                  pop: 1
-                  embed: scope:source.ts
-                  escape: '{{script_content_end}}'
-        - tag-generic-attribute-meta
-        - tag-generic-attribute-value
-    - match: (?=\S)
-      set:
-        - script-javascript
-        - tag-generic-attribute-meta
-        - tag-generic-attribute-value
-
 ###[ TEMPLATE TAG ]###########################################################
 
   template-tag:
@@ -596,3 +514,85 @@ contexts:
         - template-mustache
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
+
+###[ TAG ATTRIBUTES ]#########################################################
+
+  tag-attributes:
+    - meta_prepend: true
+    - include: vue-directive
+
+  tag-attribute-value-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+  strings-common-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+###[ MUSTAGE TEMPLATES ]######################################################
+
+  mustache-interpolations:
+    - match: (?={{)
+      push: mustache-interpolation-content
+
+  mustache-interpolation-content:
+    - clear_scopes: 1
+    - meta_scope: meta.interpolation.html
+    - include: mustache-templates
+    - include: immediately-pop
+
+  mustache-templates:
+    - match: '{{'
+      scope: meta.template.vue punctuation.definition.template.begin.html
+      embed: scope:source.js
+      embed_scope: meta.template.vue source.js.embedded.vue
+      escape: '}}'
+      escape_captures:
+        0: meta.template.vue punctuation.definition.template.end.html
+
+###[ VUE DIRECTIVES ]#########################################################
+
+  vue-directive:
+    - match: (?=v-)
+      push:
+        - vue-directive-meta
+        - vue-directive-assignment
+        - tag-generic-attribute-name
+    - match: (?::|@)
+      scope: punctuation.definition.attribute.html
+      push:
+        - vue-directive-meta
+        - vue-directive-assignment
+        - tag-generic-attribute-name
+
+  vue-directive-meta:
+    - meta_include_prototype: false
+    - meta_scope: meta.attribute-with-value.directive.html
+    - include: immediately-pop
+
+  vue-directive-assignment:
+    - match: =
+      scope: punctuation.separator.key-value.html
+      set: vue-directive-value
+    - include: else-pop
+
+  vue-directive-value:
+    - match: \"
+      scope: meta.string.html string.quoted.double.html punctuation.definition.string.begin.html
+      pop: true
+      embed: scope:source.js
+      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
+      escape: \"
+      escape_captures:
+        0: meta.attribute-with-value.directive.html meta.string.html string.quoted.double.html
+          punctuation.definition.string.end.html
+    - match: \'
+      scope: meta.string.html string.quoted.single.html punctuation.definition.string.begin.html
+      pop: true
+      embed: scope:source.js
+      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
+      escape: \'
+      escape_captures:
+        0: meta.attribute-with-value.directive.html meta.string.html string.quoted.single.html
+          punctuation.definition.string.end.html
+    - include: else-pop
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index c810d08..1025365 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -64,99 +64,80 @@ contexts:
     - include: style-tag
     - include: template-tag
 
-###[ TAG ATTRIBUTES ]#########################################################
+###[ SCRIPT TAG ]#############################################################
 
-  tag-attributes:
-    - meta_prepend: true
-    - include: vue-directive
+  script-tag:
+    # for compatibility with ST builds before 4114
+    - match: (<)((?i:script)){{tag_name_break}}
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.script.html
+      push: script-javascript
+    - match: (</)((?i:script){{tag_name_break}})
+      captures:
+        1: punctuation.definition.tag.begin.html
+        2: entity.name.tag.script.html
+      push: script-close-tag-content
 
-  tag-attribute-value-content:
-    - meta_prepend: true
-    - include: mustache-interpolations
+  script-close-tag-content:
+    - meta_scope: meta.tag.script.end.html
+    - include: tag-end
 
-  strings-common-content:
+  script-common:
     - meta_prepend: true
-    - include: mustache-interpolations
-
-###[ MUSTAGE TEMPLATES ]######################################################
-
-  mustache-interpolations:
-    - match: (?={{)
-      push: mustache-interpolation-content
+    - include: script-lang-attribute
 
-  mustache-interpolation-content:
-    - clear_scopes: 1
-    - meta_scope: meta.interpolation.html
-    - include: mustache-templates
-    - include: immediately-pop
+  script-javascript:
+    # for compatibility with ST builds before 4114
+    - meta_scope: meta.tag.script.begin.html
+    - include: script-common
+    - match: '>'
+      scope: punctuation.definition.tag.end.html
+      set: script-javascript-content
 
-  mustache-templates:
-    - match: '{{'
-      scope: meta.template.vue punctuation.definition.template.begin.html
+  script-javascript-content:
+    # for compatibility with ST builds before 4114
+    - meta_include_prototype: false
+    - match: '{{script_content_begin}}'
+      captures:
+        1: comment.block.html punctuation.definition.comment.begin.html
+      pop: 1  # make sure to match only once
       embed: scope:source.js
-      embed_scope: meta.template.vue source.js.embedded.vue
-      escape: '}}'
+      embed_scope: source.js.embedded.html
+      escape: '{{script_content_end}}'
       escape_captures:
-        0: meta.template.vue punctuation.definition.template.end.html
-
-###[ VUE DIRECTIVES ]#########################################################
-
-  vue-directive:
-    - match: (?=v-)
-      push:
-        - vue-directive-meta
-        - vue-directive-assignment
-        - tag-generic-attribute-name
-    - match: (?::|@)
-      scope: punctuation.definition.attribute.html
-      push:
-        - vue-directive-meta
-        - vue-directive-assignment
-        - tag-generic-attribute-name
+        1: source.js.embedded.html
+        2: comment.block.html punctuation.definition.comment.end.html
+        3: source.js.embedded.html
+        4: comment.block.html punctuation.definition.comment.end.html
 
-  vue-directive-meta:
-    - meta_include_prototype: false
-    - meta_scope: meta.attribute-with-value.directive.html
-    - include: immediately-pop
+  script-lang-attribute:
+    - match: (?i:lang){{attribute_name_break}}
+      scope: meta.attribute-with-value.html entity.other.attribute-name.html
+      set: script-lang-attribute-assignment
 
-  vue-directive-assignment:
+  script-lang-attribute-assignment:
+    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
     - match: =
       scope: punctuation.separator.key-value.html
-      set: vue-directive-value
-    - include: else-pop
+      set: script-lang-attribute-value
+    - match: (?=\S)
+      set: script-javascript
 
-  vue-directive-value:
-    - match: \"
-      scope:
-        meta.string.html string.quoted.double.html
-        punctuation.definition.string.begin.html
-      pop: true
-      embed: scope:source.js
-      embed_scope:
-        meta.string.html meta.interpolation.html
-        source.js.embedded.html
-      escape: \"
-      escape_captures:
-        0:
-          meta.attribute-with-value.directive.html
-          meta.string.html string.quoted.double.html
-          punctuation.definition.string.end.html
-    - match: \'
-      scope:
-        meta.string.html string.quoted.single.html
-        punctuation.definition.string.begin.html
-      pop: true
-      embed: scope:source.js
-      embed_scope:
-        meta.string.html meta.interpolation.html
-        source.js.embedded.html
-      escape: \'
-      escape_captures:
-        0:
-          meta.attribute-with-value.directive.html
-          meta.string.html string.quoted.single.html
-          punctuation.definition.string.end.html
-    - include: else-pop
+  script-lang-attribute-value:
+    - meta_include_prototype: false
+    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.html
+    - include: script-lang-decider
+
+  script-lang-decider:
+    - !script_language [ coffee, source.coffee ]
+    - !script_language [ livescript, source.livescript ]
+    - !script_language [ ts, source.ts ]
+    - match: (?=\S)
+      set:
+        - script-javascript
+        - tag-generic-attribute-meta
+        - tag-generic-attribute-value
 
 ###[ STYLE TAG ]##############################################################
 
@@ -236,81 +217,6 @@ contexts:
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
 
-###[ SCRIPT TAG ]#############################################################
-
-  script-tag:
-    # for compatibility with ST builds before 4114
-    - match: (<)((?i:script)){{tag_name_break}}
-      captures:
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.script.html
-      push: script-javascript
-    - match: (</)((?i:script){{tag_name_break}})
-      captures:
-        1: punctuation.definition.tag.begin.html
-        2: entity.name.tag.script.html
-      push: script-close-tag-content
-
-  script-close-tag-content:
-    - meta_scope: meta.tag.script.end.html
-    - include: tag-end
-
-  script-common:
-    - meta_prepend: true
-    - include: script-lang-attribute
-
-  script-javascript:
-    # for compatibility with ST builds before 4114
-    - meta_scope: meta.tag.script.begin.html
-    - include: script-common
-    - match: '>'
-      scope: punctuation.definition.tag.end.html
-      set: script-javascript-content
-
-  script-javascript-content:
-    # for compatibility with ST builds before 4114
-    - meta_include_prototype: false
-    - match: '{{script_content_begin}}'
-      captures:
-        1: comment.block.html punctuation.definition.comment.begin.html
-      pop: 1  # make sure to match only once
-      embed: scope:source.js
-      embed_scope: source.js.embedded.html
-      escape: '{{script_content_end}}'
-      escape_captures:
-        1: source.js.embedded.html
-        2: comment.block.html punctuation.definition.comment.end.html
-        3: source.js.embedded.html
-        4: comment.block.html punctuation.definition.comment.end.html
-
-  script-lang-attribute:
-    - match: (?i:lang){{attribute_name_break}}
-      scope: meta.attribute-with-value.html entity.other.attribute-name.html
-      set: script-lang-attribute-assignment
-
-  script-lang-attribute-assignment:
-    - meta_content_scope: meta.tag.script.begin.html meta.attribute-with-value.html
-    - match: =
-      scope: punctuation.separator.key-value.html
-      set: script-lang-attribute-value
-    - match: (?=\S)
-      set: script-javascript
-
-  script-lang-attribute-value:
-    - meta_include_prototype: false
-    - meta_scope: meta.tag.script.begin.html meta.attribute-with-value.html
-    - include: script-lang-decider
-
-  script-lang-decider:
-    - !script_language [ coffee, source.coffee ]
-    - !script_language [ livescript, source.livescript ]
-    - !script_language [ ts, source.ts ]
-    - match: (?=\S)
-      set:
-        - script-javascript
-        - tag-generic-attribute-meta
-        - tag-generic-attribute-value
-
 ###[ TEMPLATE TAG ]###########################################################
 
   template-tag:
@@ -369,3 +275,97 @@ contexts:
         - template-mustache
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
+
+###[ TAG ATTRIBUTES ]#########################################################
+
+  tag-attributes:
+    - meta_prepend: true
+    - include: vue-directive
+
+  tag-attribute-value-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+  strings-common-content:
+    - meta_prepend: true
+    - include: mustache-interpolations
+
+###[ MUSTAGE TEMPLATES ]######################################################
+
+  mustache-interpolations:
+    - match: (?={{)
+      push: mustache-interpolation-content
+
+  mustache-interpolation-content:
+    - clear_scopes: 1
+    - meta_scope: meta.interpolation.html
+    - include: mustache-templates
+    - include: immediately-pop
+
+  mustache-templates:
+    - match: '{{'
+      scope: meta.template.vue punctuation.definition.template.begin.html
+      embed: scope:source.js
+      embed_scope: meta.template.vue source.js.embedded.vue
+      escape: '}}'
+      escape_captures:
+        0: meta.template.vue punctuation.definition.template.end.html
+
+###[ VUE DIRECTIVES ]#########################################################
+
+  vue-directive:
+    - match: (?=v-)
+      push:
+        - vue-directive-meta
+        - vue-directive-assignment
+        - tag-generic-attribute-name
+    - match: (?::|@)
+      scope: punctuation.definition.attribute.html
+      push:
+        - vue-directive-meta
+        - vue-directive-assignment
+        - tag-generic-attribute-name
+
+  vue-directive-meta:
+    - meta_include_prototype: false
+    - meta_scope: meta.attribute-with-value.directive.html
+    - include: immediately-pop
+
+  vue-directive-assignment:
+    - match: =
+      scope: punctuation.separator.key-value.html
+      set: vue-directive-value
+    - include: else-pop
+
+  vue-directive-value:
+    - match: \"
+      scope:
+        meta.string.html string.quoted.double.html
+        punctuation.definition.string.begin.html
+      pop: true
+      embed: scope:source.js
+      embed_scope:
+        meta.string.html meta.interpolation.html
+        source.js.embedded.html
+      escape: \"
+      escape_captures:
+        0:
+          meta.attribute-with-value.directive.html
+          meta.string.html string.quoted.double.html
+          punctuation.definition.string.end.html
+    - match: \'
+      scope:
+        meta.string.html string.quoted.single.html
+        punctuation.definition.string.begin.html
+      pop: true
+      embed: scope:source.js
+      embed_scope:
+        meta.string.html meta.interpolation.html
+        source.js.embedded.html
+      escape: \'
+      escape_captures:
+        0:
+          meta.attribute-with-value.directive.html
+          meta.string.html string.quoted.single.html
+          punctuation.definition.string.end.html
+    - include: else-pop

From 0e4f459d7d9d479dc36c85af2921d5453438ece3 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Thu, 9 Sep 2021 19:01:38 +0200
Subject: [PATCH 08/21] Reorganize syntax header

applies https://github.com/sublimehq/Packages/issues/2430
---
 Vue Component.sublime-syntax             | 6 ++++--
 Vue Component.sublime-syntax.yaml-macros | 6 ++++--
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 8deb773..237a2fc 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -1,9 +1,11 @@
 %YAML 1.2
 ---
-extends: Packages/HTML/HTML.sublime-syntax
 name: Vue Component
-version: 2
 scope: text.html.vue
+version: 2
+
+extends: Packages/HTML/HTML.sublime-syntax
+
 file_extensions:
   - vue
 
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 1025365..328a526 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -1,10 +1,12 @@
 %YAML 1.2
 %TAG ! tag:yaml-macros:src.macros:
 ---
-extends: Packages/HTML/HTML.sublime-syntax
 name: Vue Component
-version: 2
 scope: text.html.vue
+version: 2
+
+extends: Packages/HTML/HTML.sublime-syntax
+
 file_extensions:
   - vue
 

From cf103ccc9956b70d61ca3eb0f9ead1f74652f7f1 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Thu, 9 Sep 2021 19:03:16 +0200
Subject: [PATCH 09/21] Replace remaining pop: true by pop: 1

All sublime-syntax version 2 files should use explicit `pop: 1` instead
of `pop: true`. It looks more consistent in case `pop: 2` are used.
---
 Vue Component.sublime-syntax             | 4 ++--
 Vue Component.sublime-syntax.yaml-macros | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 237a2fc..5b2e8de 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -581,7 +581,7 @@ contexts:
   vue-directive-value:
     - match: \"
       scope: meta.string.html string.quoted.double.html punctuation.definition.string.begin.html
-      pop: true
+      pop: 1
       embed: scope:source.js
       embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
       escape: \"
@@ -590,7 +590,7 @@ contexts:
           punctuation.definition.string.end.html
     - match: \'
       scope: meta.string.html string.quoted.single.html punctuation.definition.string.begin.html
-      pop: true
+      pop: 1
       embed: scope:source.js
       embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
       escape: \'
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 328a526..f2c5593 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -344,7 +344,7 @@ contexts:
       scope:
         meta.string.html string.quoted.double.html
         punctuation.definition.string.begin.html
-      pop: true
+      pop: 1
       embed: scope:source.js
       embed_scope:
         meta.string.html meta.interpolation.html
@@ -359,7 +359,7 @@ contexts:
       scope:
         meta.string.html string.quoted.single.html
         punctuation.definition.string.begin.html
-      pop: true
+      pop: 1
       embed: scope:source.js
       embed_scope:
         meta.string.html meta.interpolation.html

From 0af7f8b497c6a9a38d65152057f7c69fa633ff63 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Thu, 9 Sep 2021 19:07:26 +0200
Subject: [PATCH 10/21] Reuse tag-end context

No need to duplicate the match directive if it already exists.
---
 Vue Component.sublime-syntax             | 4 +---
 Vue Component.sublime-syntax.yaml-macros | 4 +---
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 5b2e8de..9ac8971 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -425,9 +425,7 @@ contexts:
   template-mustache:
     - meta_scope: meta.tag.template.begin.html
     - include: template-common
-    - match: '>'
-      scope: punctuation.definition.tag.end.html
-      pop: 1
+    - include: tag-end
 
   template-lang-attribute:
     - match: (?i:lang){{attribute_name_break}}
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index f2c5593..7bede0e 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -246,9 +246,7 @@ contexts:
   template-mustache:
     - meta_scope: meta.tag.template.begin.html
     - include: template-common
-    - match: '>'
-      scope: punctuation.definition.tag.end.html
-      pop: 1
+    - include: tag-end
 
   template-lang-attribute:
     - match: (?i:lang){{attribute_name_break}}

From 5b0e5de1dfd5b38c23d052425866c9e0233d8736 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Thu, 9 Sep 2021 19:56:54 +0200
Subject: [PATCH 11/21] Exclude prototypes from attribute value starts

This commit fixes https://github.com/sublimehq/Packages/pull/2910 for
all ST builds before 4114.
---
 Vue Component.sublime-syntax             |  4 ++++
 Vue Component.sublime-syntax.yaml-macros | 20 ++++++++++++++++++++
 2 files changed, 24 insertions(+)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 9ac8971..0d0414c 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -521,6 +521,10 @@ contexts:
     - meta_prepend: true
     - include: vue-directive
 
+  tag-generic-attribute-value:
+    - meta_prepend: true
+    - meta_include_prototype: false
+
   tag-attribute-value-content:
     - meta_prepend: true
     - include: mustache-interpolations
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 7bede0e..65467cb 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -282,6 +282,26 @@ contexts:
     - meta_prepend: true
     - include: vue-directive
 
+  tag-class-attribute-value:
+    # for compatibility with ST builds before 4114
+    - meta_prepend: true
+    - meta_include_prototype: false
+
+  tag-generic-attribute-value:
+    # for compatibility with ST builds before 4114
+    - meta_prepend: true
+    - meta_include_prototype: false
+
+  tag-href-attribute-value:
+    # for compatibility with ST builds before 4114
+    - meta_prepend: true
+    - meta_include_prototype: false
+
+  tag-id-attribute-value:
+    # for compatibility with ST builds before 4114
+    - meta_prepend: true
+    - meta_include_prototype: false
+
   tag-attribute-value-content:
     - meta_prepend: true
     - include: mustache-interpolations

From 00ad76b27e05f28147fcf6cdab45b056a3642b22 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Wed, 2 Feb 2022 19:11:35 +0100
Subject: [PATCH 12/21] Prepare for future changes of ST's HTML.sublime-syntax

ST's HTML.sublime-syntax may change in the future so that the change of
this commit is required to maintain compatibility. It is planned to
highlight certain self-closing tags illegal, if they are known not to
support it.

This change is backward compatible with older builds of ST4.
---
 Vue Component.sublime-syntax | 88 +++++++++++++++++++++---------------
 src/macros.py                |  2 +-
 2 files changed, 53 insertions(+), 37 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 0d0414c..4a75593 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -134,12 +134,11 @@ contexts:
     - match: (?i)(?=coffee{{unquoted_attribute_break}}|\'coffee\'|"coffee")
       set:
         -   - meta_scope: meta.tag.script.begin.html
-            - include: script-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.coffee.embedded.html
-                  match: '{{script_content_begin}}'
+                - match: '{{script_content_begin}}'
+                  embed_scope: source.coffee.embedded.html
                   escape_captures:
                     1: source.coffee.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -150,17 +149,17 @@ contexts:
                   pop: 1
                   embed: scope:source.coffee
                   escape: '{{script_content_end}}'
+            - include: script-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=livescript{{unquoted_attribute_break}}|\'livescript\'|"livescript")
       set:
         -   - meta_scope: meta.tag.script.begin.html
-            - include: script-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.livescript.embedded.html
-                  match: '{{script_content_begin}}'
+                - match: '{{script_content_begin}}'
+                  embed_scope: source.livescript.embedded.html
                   escape_captures:
                     1: source.livescript.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -171,17 +170,17 @@ contexts:
                   pop: 1
                   embed: scope:source.livescript
                   escape: '{{script_content_end}}'
+            - include: script-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=ts{{unquoted_attribute_break}}|\'ts\'|"ts")
       set:
         -   - meta_scope: meta.tag.script.begin.html
-            - include: script-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.ts.embedded.html
-                  match: '{{script_content_begin}}'
+                - match: '{{script_content_begin}}'
+                  embed_scope: source.ts.embedded.html
                   escape_captures:
                     1: source.ts.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -192,6 +191,7 @@ contexts:
                   pop: 1
                   embed: scope:source.ts
                   escape: '{{script_content_end}}'
+            - include: script-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
@@ -269,12 +269,11 @@ contexts:
     - match: (?i)(?=sass{{unquoted_attribute_break}}|\'sass\'|"sass")
       set:
         -   - meta_scope: meta.tag.style.begin.html
-            - include: style-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.sass.embedded.html
-                  match: '{{style_content_begin}}'
+                - match: '{{style_content_begin}}'
+                  embed_scope: source.sass.embedded.html
                   escape_captures:
                     1: source.sass.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -285,17 +284,17 @@ contexts:
                   pop: 1
                   embed: scope:source.sass
                   escape: '{{style_content_end}}'
+            - include: style-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=scss{{unquoted_attribute_break}}|\'scss\'|"scss")
       set:
         -   - meta_scope: meta.tag.style.begin.html
-            - include: style-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.scss.embedded.html
-                  match: '{{style_content_begin}}'
+                - match: '{{style_content_begin}}'
+                  embed_scope: source.scss.embedded.html
                   escape_captures:
                     1: source.scss.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -306,17 +305,17 @@ contexts:
                   pop: 1
                   embed: scope:source.scss
                   escape: '{{style_content_end}}'
+            - include: style-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=stylus{{unquoted_attribute_break}}|\'stylus\'|"stylus")
       set:
         -   - meta_scope: meta.tag.style.begin.html
-            - include: style-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.stylus.embedded.html
-                  match: '{{style_content_begin}}'
+                - match: '{{style_content_begin}}'
+                  embed_scope: source.stylus.embedded.html
                   escape_captures:
                     1: source.stylus.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -327,17 +326,17 @@ contexts:
                   pop: 1
                   embed: scope:source.stylus
                   escape: '{{style_content_end}}'
+            - include: style-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=postcss\?parser=sugarss{{unquoted_attribute_break}}|\'postcss\?parser=sugarss\'|"postcss\?parser=sugarss")
       set:
         -   - meta_scope: meta.tag.style.begin.html
-            - include: style-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.sss.embedded.html
-                  match: '{{style_content_begin}}'
+                - match: '{{style_content_begin}}'
+                  embed_scope: source.sss.embedded.html
                   escape_captures:
                     1: source.sss.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -348,17 +347,17 @@ contexts:
                   pop: 1
                   embed: scope:source.sss
                   escape: '{{style_content_end}}'
+            - include: style-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=postcss{{unquoted_attribute_break}}|\'postcss\'|"postcss")
       set:
         -   - meta_scope: meta.tag.style.begin.html
-            - include: style-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.postcss.embedded.html
-                  match: '{{style_content_begin}}'
+                - match: '{{style_content_begin}}'
+                  embed_scope: source.postcss.embedded.html
                   escape_captures:
                     1: source.postcss.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -369,17 +368,17 @@ contexts:
                   pop: 1
                   embed: scope:source.postcss
                   escape: '{{style_content_end}}'
+            - include: style-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=less{{unquoted_attribute_break}}|\'less\'|"less")
       set:
         -   - meta_scope: meta.tag.style.begin.html
-            - include: style-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: source.less.embedded.html
-                  match: '{{style_content_begin}}'
+                - match: '{{style_content_begin}}'
+                  embed_scope: source.less.embedded.html
                   escape_captures:
                     1: source.less.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -390,6 +389,7 @@ contexts:
                   pop: 1
                   embed: scope:source.less
                   escape: '{{style_content_end}}'
+            - include: style-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
@@ -449,12 +449,11 @@ contexts:
     - match: (?i)(?=jade{{unquoted_attribute_break}}|\'jade\'|"jade")
       set:
         -   - meta_scope: meta.tag.template.begin.html
-            - include: template-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: text.jade.embedded.html
-                  match: '{{template_content_begin}}'
+                - match: '{{template_content_begin}}'
+                  embed_scope: text.jade.embedded.html
                   escape_captures:
                     1: text.jade.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -465,17 +464,17 @@ contexts:
                   pop: 1
                   embed: scope:text.jade
                   escape: '{{template_content_end}}'
+            - include: template-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=pug{{unquoted_attribute_break}}|\'pug\'|"pug")
       set:
         -   - meta_scope: meta.tag.template.begin.html
-            - include: template-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: text.pug.embedded.html
-                  match: '{{template_content_begin}}'
+                - match: '{{template_content_begin}}'
+                  embed_scope: text.pug.embedded.html
                   escape_captures:
                     1: text.pug.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -486,17 +485,17 @@ contexts:
                   pop: 1
                   embed: scope:text.pug
                   escape: '{{template_content_end}}'
+            - include: template-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?i)(?=slm{{unquoted_attribute_break}}|\'slm\'|"slm")
       set:
         -   - meta_scope: meta.tag.template.begin.html
-            - include: template-common
             - match: '>'
               scope: punctuation.definition.tag.end.html
               set:
-                - embed_scope: text.slm.embedded.html
-                  match: '{{template_content_begin}}'
+                - match: '{{template_content_begin}}'
+                  embed_scope: text.slm.embedded.html
                   escape_captures:
                     1: text.slm.embedded.html
                     2: comment.block.html punctuation.definition.comment.end.html
@@ -507,6 +506,7 @@ contexts:
                   pop: 1
                   embed: scope:text.slm
                   escape: '{{template_content_end}}'
+            - include: template-common
         - tag-generic-attribute-meta
         - tag-generic-attribute-value
     - match: (?=\S)
@@ -521,7 +521,23 @@ contexts:
     - meta_prepend: true
     - include: vue-directive
 
+  tag-class-attribute-value:
+    # for compatibility with ST builds before 4114
+    - meta_prepend: true
+    - meta_include_prototype: false
+
   tag-generic-attribute-value:
+    # for compatibility with ST builds before 4114
+    - meta_prepend: true
+    - meta_include_prototype: false
+
+  tag-href-attribute-value:
+    # for compatibility with ST builds before 4114
+    - meta_prepend: true
+    - meta_include_prototype: false
+
+  tag-id-attribute-value:
+    # for compatibility with ST builds before 4114
     - meta_prepend: true
     - meta_include_prototype: false
 
diff --git a/src/macros.py b/src/macros.py
index 85839af..9884d5a 100644
--- a/src/macros.py
+++ b/src/macros.py
@@ -15,7 +15,6 @@ def embed_language_in_tag(tag, match, embed):
         set=[
             [
                 _rule(meta_scope='meta.tag.%s.begin.html' % tag),
-                _rule(include='%s-common' % tag),
                 _rule(
                     match='>',
                     scope='punctuation.definition.tag.end.html',
@@ -38,6 +37,7 @@ def embed_language_in_tag(tag, match, embed):
                         )
                     ]
                 ),
+                _rule(include='%s-common' % tag),
             ],
             'tag-generic-attribute-meta',
             'tag-generic-attribute-value',

From 78f5c47aadcc94f41bdac75afdb68610c67ca204 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Tue, 22 Feb 2022 20:48:31 +0100
Subject: [PATCH 13/21] Fix JS expression interpolation in directives

Addresses https://github.com/vuejs/vue-syntax-highlight/pull/216#discussion_r812048219

This commit includes `JavaScript#expression-statement` context in
attribute/directive values to highlight mappings correctly.

The `pop: 1` is removed as the included context pops itself off stack.
---
 Vue Component.sublime-syntax             |  6 ++---
 Vue Component.sublime-syntax.yaml-macros |  6 ++---
 tests/syntax_tests_mustage.vue           | 29 ++++++++++++++++--------
 3 files changed, 23 insertions(+), 18 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 4a75593..705de44 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -599,8 +599,7 @@ contexts:
   vue-directive-value:
     - match: \"
       scope: meta.string.html string.quoted.double.html punctuation.definition.string.begin.html
-      pop: 1
-      embed: scope:source.js
+      embed: scope:source.js#expression-statement
       embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
       escape: \"
       escape_captures:
@@ -608,8 +607,7 @@ contexts:
           punctuation.definition.string.end.html
     - match: \'
       scope: meta.string.html string.quoted.single.html punctuation.definition.string.begin.html
-      pop: 1
-      embed: scope:source.js
+      embed: scope:source.js#expression-statement
       embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
       escape: \'
       escape_captures:
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 65467cb..9db402a 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -362,8 +362,7 @@ contexts:
       scope:
         meta.string.html string.quoted.double.html
         punctuation.definition.string.begin.html
-      pop: 1
-      embed: scope:source.js
+      embed: scope:source.js#expression-statement
       embed_scope:
         meta.string.html meta.interpolation.html
         source.js.embedded.html
@@ -377,8 +376,7 @@ contexts:
       scope:
         meta.string.html string.quoted.single.html
         punctuation.definition.string.begin.html
-      pop: 1
-      embed: scope:source.js
+      embed: scope:source.js#expression-statement
       embed_scope:
         meta.string.html meta.interpolation.html
         source.js.embedded.html
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index 57aa290..1b9c783 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -38,22 +38,31 @@
 //              ^^^^^^^^^^^ source.js.embedded.vue
 //                         ^^ punctuation.definition.template.end.html - source.js
 
-    <p v-attrib="let i = 0">
+    <p v-attrib="{'key': 'value'}">
 //  ^^^ meta.tag - meta.attribute-with-value
 //     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
 //              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
-//               ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
-//                        ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
-//                         ^ meta.tag - meta.attribute-with-value
-//                          ^ - meta.tag
+//               ^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html meta.mapping
+//                               ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                                ^ meta.tag - meta.attribute-with-value
+//                                 ^ - meta.tag
 
-    <p v-attrib='let i = 0'>
+    <p v-attrib="i = 0">
 //  ^^^ meta.tag - meta.attribute-with-value
 //     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
 //              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
-//               ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
-//                        ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
-//                         ^ meta.tag - meta.attribute-with-value
-//                          ^ - meta.tag
+//               ^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
+//                    ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                     ^ meta.tag - meta.attribute-with-value
+//                      ^ - meta.tag
+
+    <p v-attrib='i = 0'>
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
+//                    ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                     ^ meta.tag - meta.attribute-with-value
+//                      ^ - meta.tag
 
 </html>
\ No newline at end of file

From c05ea53d62b59ee58dca796fbcfa2a65c0c90452 Mon Sep 17 00:00:00 2001
From: DeathAxe <deathaxe82@googlemail.com>
Date: Tue, 22 Feb 2022 20:48:49 +0100
Subject: [PATCH 14/21] Opt-in to python 3.8 plugin host

Run YAML macros in python 3.8 in order to maintain dictionary key sort
order.
---
 .python-version | 1 +
 1 file changed, 1 insertion(+)
 create mode 100644 .python-version

diff --git a/.python-version b/.python-version
new file mode 100644
index 0000000..98fccd6
--- /dev/null
+++ b/.python-version
@@ -0,0 +1 @@
+3.8
\ No newline at end of file

From 34d3b01a4bad9ca58a8e9a2d4deae7acd1a01412 Mon Sep 17 00:00:00 2001
From: FichteFoll <fichtefoll2@googlemail.com>
Date: Sat, 15 Oct 2022 12:03:08 +0200
Subject: [PATCH 15/21] Use `vue` suffix for embed_scope in attributes and
 mustache

This allows easily targeting the embed scopes inside attributes as
something that is contributed and supported by the vue syntax only as
opposed to a a `<script>` tag which uses HTML syntax.
---
 Vue Component.sublime-syntax             |  6 +++---
 Vue Component.sublime-syntax.yaml-macros | 10 +++++-----
 tests/syntax_tests_mustage.vue           | 12 ++++++------
 3 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 705de44..2c1a3d7 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -557,7 +557,7 @@ contexts:
 
   mustache-interpolation-content:
     - clear_scopes: 1
-    - meta_scope: meta.interpolation.html
+    - meta_scope: meta.interpolation.vue
     - include: mustache-templates
     - include: immediately-pop
 
@@ -600,7 +600,7 @@ contexts:
     - match: \"
       scope: meta.string.html string.quoted.double.html punctuation.definition.string.begin.html
       embed: scope:source.js#expression-statement
-      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
+      embed_scope: meta.string.html meta.interpolation.vue source.js.embedded.vue
       escape: \"
       escape_captures:
         0: meta.attribute-with-value.directive.html meta.string.html string.quoted.double.html
@@ -608,7 +608,7 @@ contexts:
     - match: \'
       scope: meta.string.html string.quoted.single.html punctuation.definition.string.begin.html
       embed: scope:source.js#expression-statement
-      embed_scope: meta.string.html meta.interpolation.html source.js.embedded.html
+      embed_scope: meta.string.html meta.interpolation.vue source.js.embedded.vue
       escape: \'
       escape_captures:
         0: meta.attribute-with-value.directive.html meta.string.html string.quoted.single.html
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 9db402a..dad3f0e 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -318,7 +318,7 @@ contexts:
 
   mustache-interpolation-content:
     - clear_scopes: 1
-    - meta_scope: meta.interpolation.html
+    - meta_scope: meta.interpolation.vue
     - include: mustache-templates
     - include: immediately-pop
 
@@ -364,8 +364,8 @@ contexts:
         punctuation.definition.string.begin.html
       embed: scope:source.js#expression-statement
       embed_scope:
-        meta.string.html meta.interpolation.html
-        source.js.embedded.html
+        meta.string.html meta.interpolation.vue
+        source.js.embedded.vue
       escape: \"
       escape_captures:
         0:
@@ -378,8 +378,8 @@ contexts:
         punctuation.definition.string.begin.html
       embed: scope:source.js#expression-statement
       embed_scope:
-        meta.string.html meta.interpolation.html
-        source.js.embedded.html
+        meta.string.html meta.interpolation.vue
+        source.js.embedded.vue
       escape: \'
       escape_captures:
         0:
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index 1b9c783..84bc49d 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -14,7 +14,7 @@
 
     <p attrib="{{ foo.value }}" >
 //            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
-//             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.html
+//             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.vue
 //                            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
 //            ^ string.quoted.double.html punctuation.definition.string.begin.html
 //             ^^ punctuation.definition.template.begin.html - source.js
@@ -24,7 +24,7 @@
 
     <p attrib='{{ foo.value }}' >
 //            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
-//             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.html
+//             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.vue
 //                            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
 //            ^ string.quoted.single.html punctuation.definition.string.begin.html
 //             ^^ punctuation.definition.template.begin.html - source.js
@@ -33,7 +33,7 @@
 //                            ^ string.quoted.single.html punctuation.definition.string.end.html
 
     <p attrib={{ foo.value }} >
-//            ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.html
+//            ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.vue
 //            ^^ punctuation.definition.template.begin.html - source.js
 //              ^^^^^^^^^^^ source.js.embedded.vue
 //                         ^^ punctuation.definition.template.end.html - source.js
@@ -42,7 +42,7 @@
 //  ^^^ meta.tag - meta.attribute-with-value
 //     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
 //              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
-//               ^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html meta.mapping
+//               ^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue meta.mapping
 //                               ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
 //                                ^ meta.tag - meta.attribute-with-value
 //                                 ^ - meta.tag
@@ -51,7 +51,7 @@
 //  ^^^ meta.tag - meta.attribute-with-value
 //     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
 //              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
-//               ^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
+//               ^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
 //                    ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
 //                     ^ meta.tag - meta.attribute-with-value
 //                      ^ - meta.tag
@@ -60,7 +60,7 @@
 //  ^^^ meta.tag - meta.attribute-with-value
 //     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
 //              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
-//               ^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.html source.js.embedded.html
+//               ^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
 //                    ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
 //                     ^ meta.tag - meta.attribute-with-value
 //                      ^ - meta.tag

From e576c3134fbe0cb487d79d14c70e2482c16a90fb Mon Sep 17 00:00:00 2001
From: FichteFoll <fichtefoll2@googlemail.com>
Date: Sat, 15 Oct 2022 12:03:22 +0200
Subject: [PATCH 16/21] Add line break at EOL

---
 tests/syntax_tests_mustage.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index 84bc49d..a4353b1 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -65,4 +65,4 @@
 //                     ^ meta.tag - meta.attribute-with-value
 //                      ^ - meta.tag
 
-</html>
\ No newline at end of file
+</html>

From a5b2f140e665111404d021e52c1f8d7743c57cdd Mon Sep 17 00:00:00 2001
From: FichteFoll <fichtefoll2@googlemail.com>
Date: Sat, 15 Oct 2022 12:06:43 +0200
Subject: [PATCH 17/21] Add highlighting for `#attr="name-list"` slot syntax

---
 Vue Component.sublime-syntax             |  2 +-
 Vue Component.sublime-syntax.yaml-macros |  2 +-
 tests/syntax_tests_mustage.vue           | 60 ++++++++++++++++++++++++
 3 files changed, 62 insertions(+), 2 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 2c1a3d7..95a5e52 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -578,7 +578,7 @@ contexts:
         - vue-directive-meta
         - vue-directive-assignment
         - tag-generic-attribute-name
-    - match: (?::|@)
+    - match: (?::|@|#)
       scope: punctuation.definition.attribute.html
       push:
         - vue-directive-meta
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index dad3f0e..0781f59 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -339,7 +339,7 @@ contexts:
         - vue-directive-meta
         - vue-directive-assignment
         - tag-generic-attribute-name
-    - match: (?::|@)
+    - match: (?::|@|#)
       scope: punctuation.definition.attribute.html
       push:
         - vue-directive-meta
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index a4353b1..bc46070 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -65,4 +65,64 @@
 //                     ^ meta.tag - meta.attribute-with-value
 //                      ^ - meta.tag
 
+    <p @handler="function_call($event)">
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//     ^ punctuation.definition.attribute.html
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
+//                                    ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                                     ^ meta.tag - meta.attribute-with-value
+//                                      ^ - meta.tag
+
+    <p @handler='function_call($event)'>
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//     ^ punctuation.definition.attribute.html
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
+//                                    ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                                     ^ meta.tag - meta.attribute-with-value
+//                                      ^ - meta.tag
+
+    <p #handler="variable">
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//     ^ punctuation.definition.attribute.html
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
+//                       ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                        ^ meta.tag - meta.attribute-with-value
+//                         ^ - meta.tag
+
+    <p #handler='variable'>
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//     ^ punctuation.definition.attribute.html
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
+//                       ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                        ^ meta.tag - meta.attribute-with-value
+//                         ^ - meta.tag
+
+    <p :handler="expression">
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//     ^ punctuation.definition.attribute.html
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
+//                         ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                          ^ meta.tag - meta.attribute-with-value
+//                           ^ - meta.tag
+
+    <p :handler='expression'>
+//  ^^^ meta.tag - meta.attribute-with-value
+//     ^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html - meta.string
+//     ^ punctuation.definition.attribute.html
+//              ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//               ^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html meta.string.html meta.interpolation.vue source.js.embedded.vue
+//                         ^ meta.tag meta.attribute-with-value.directive.html meta.string.html - meta.interpolation
+//                          ^ meta.tag - meta.attribute-with-value
+//                           ^ - meta.tag
+
 </html>

From b01098916f2695ac59f9c74ac9fe1f40c587c161 Mon Sep 17 00:00:00 2001
From: FichteFoll <fichtefoll2@googlemail.com>
Date: Thu, 5 Jan 2023 17:16:07 +0100
Subject: [PATCH 18/21] Add support for "dynamic arguments"

---
 Vue Component.sublime-syntax             | 17 +++++++++++++++++
 Vue Component.sublime-syntax.yaml-macros | 17 +++++++++++++++++
 tests/syntax_tests_mustage.vue           | 18 ++++++++++++++++++
 3 files changed, 52 insertions(+)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 95a5e52..e91fcfb 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -614,3 +614,20 @@ contexts:
         0: meta.attribute-with-value.directive.html meta.string.html string.quoted.single.html
           punctuation.definition.string.end.html
     - include: else-pop
+
+  tag-generic-attribute-name:
+    - meta_prepend: true
+    # https://vuejs.org/guide/essentials/template-syntax.html#dynamic-arguments
+    - match: (?=\[)
+      push: vue-dynamic-attribute-name
+
+  vue-dynamic-attribute-name:
+    - clear_scopes: 1  # clear `entity.other.attribute-name`
+    - match: \[
+      scope: punctuation.section.interpolation.begin.vue
+      embed: scope:source.js#expression-statement
+      embed_scope: meta.interpolation.vue source.js.embedded.vue
+      escape: \]
+      escape_captures:
+        0: punctuation.definition.string.end.html
+    - include: else-pop
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 0781f59..4b6948b 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -387,3 +387,20 @@ contexts:
           meta.string.html string.quoted.single.html
           punctuation.definition.string.end.html
     - include: else-pop
+
+  tag-generic-attribute-name:
+    - meta_prepend: true
+    # https://vuejs.org/guide/essentials/template-syntax.html#dynamic-arguments
+    - match: (?=\[)
+      push: vue-dynamic-attribute-name
+
+  vue-dynamic-attribute-name:
+    - clear_scopes: 1  # clear `entity.other.attribute-name`
+    - match: \[
+      scope: punctuation.section.interpolation.begin.vue
+      embed: scope:source.js#expression-statement
+      embed_scope: meta.interpolation.vue source.js.embedded.vue
+      escape: \]
+      escape_captures:
+        0: punctuation.definition.string.end.html
+    - include: else-pop
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index bc46070..33ceefe 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -125,4 +125,22 @@
 //                          ^ meta.tag - meta.attribute-with-value
 //                           ^ - meta.tag
 
+    <template #[`content-${variable}`]>
+//            ^^^^^^^^^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html
+//            ^ entity.other.attribute-name.html
+//             ^ punctuation.section.interpolation.begin.vue
+//              ^^^^^^^^^^^^^^^^^^^^^ meta.interpolation.vue source.js.embedded.vue - entity.other.attribute-name.html
+//                                   ^ punctuation.definition.string.end.html
+//                                    ^ meta.tag - meta.attribute-with-value
+//                                     ^ - meta.tag
+
+    <template v-slot:[`content-${variable}`]>
+//            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html
+//            ^^^^^^^ entity.other.attribute-name.html
+//                   ^ punctuation.section.interpolation.begin.vue
+//                    ^^^^^^^^^^^^^^^^^^^^^ meta.interpolation.vue source.js.embedded.vue - entity.other.attribute-name.html
+//                                         ^ punctuation.definition.string.end.html
+//                                          ^ meta.tag - meta.attribute-with-value
+//                                           ^ - meta.tag
+
 </html>

From 63fb8bfdddf8c51933c2def9ba3de441b37d29f9 Mon Sep 17 00:00:00 2001
From: deathaxe <deathaxe82@googlemail.com>
Date: Thu, 5 Jan 2023 17:48:23 +0100
Subject: [PATCH 19/21] Tweak script/style pattern order

This commit moves terminating patterns to the top so they match with
max priority in case of overlapping patterns. This change is just to
be future proof if core HTML syntax changes.
---
 Vue Component.sublime-syntax             | 6 +++---
 Vue Component.sublime-syntax.yaml-macros | 6 +++---
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index e91fcfb..c75390b 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -91,10 +91,10 @@ contexts:
   script-javascript:
     # for compatibility with ST builds before 4114
     - meta_scope: meta.tag.script.begin.html
-    - include: script-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
       set: script-javascript-content
+    - include: script-common
 
   script-javascript-content:
     # for compatibility with ST builds before 4114
@@ -226,10 +226,10 @@ contexts:
   style-css:
     # for compatibility with ST builds before 4114
     - meta_scope: meta.tag.style.begin.html
-    - include: style-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
       set: style-css-content
+    - include: style-common
 
   style-css-content:
     # for compatibility with ST builds before 4114
@@ -424,8 +424,8 @@ contexts:
 
   template-mustache:
     - meta_scope: meta.tag.template.begin.html
-    - include: template-common
     - include: tag-end
+    - include: template-common
 
   template-lang-attribute:
     - match: (?i:lang){{attribute_name_break}}
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 4b6948b..7630d05 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -92,10 +92,10 @@ contexts:
   script-javascript:
     # for compatibility with ST builds before 4114
     - meta_scope: meta.tag.script.begin.html
-    - include: script-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
       set: script-javascript-content
+    - include: script-common
 
   script-javascript-content:
     # for compatibility with ST builds before 4114
@@ -167,10 +167,10 @@ contexts:
   style-css:
     # for compatibility with ST builds before 4114
     - meta_scope: meta.tag.style.begin.html
-    - include: style-common
     - match: '>'
       scope: punctuation.definition.tag.end.html
       set: style-css-content
+    - include: style-common
 
   style-css-content:
     # for compatibility with ST builds before 4114
@@ -245,8 +245,8 @@ contexts:
 
   template-mustache:
     - meta_scope: meta.tag.template.begin.html
-    - include: template-common
     - include: tag-end
+    - include: template-common
 
   template-lang-attribute:
     - match: (?i:lang){{attribute_name_break}}

From b083a278bbf4aa6990d43c2ffb389dc68eb9654d Mon Sep 17 00:00:00 2001
From: deathaxe <deathaxe82@googlemail.com>
Date: Thu, 5 Jan 2023 17:59:22 +0100
Subject: [PATCH 20/21] Drop meta.template

This commit follows a scope naming scheme introduced to Astro, Blade, Liquid, PHP and Slim recently, which uses

1. `meta.embedded.<template-name>` for those template code sections,
   which are used for control structures primarily.

   This scope has already been in use in PHP syntax to scope all
   `<?php ... ?>` code sections.

2. `meta.interpolation.<template-name>` for those template code
    sections, which primarily emit data to the output document.

    That's what Mustage tags `{{ expr }}` do primarily.
---
 Vue Component.sublime-syntax             |  7 +++----
 Vue Component.sublime-syntax.yaml-macros |  7 +++----
 tests/syntax_tests_mustage.vue           | 24 ++++++++++++------------
 3 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index c75390b..182f3df 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -557,18 +557,17 @@ contexts:
 
   mustache-interpolation-content:
     - clear_scopes: 1
-    - meta_scope: meta.interpolation.vue
     - include: mustache-templates
     - include: immediately-pop
 
   mustache-templates:
     - match: '{{'
-      scope: meta.template.vue punctuation.definition.template.begin.html
+      scope: meta.interpolation.vue punctuation.definition.interpolation.begin.html
       embed: scope:source.js
-      embed_scope: meta.template.vue source.js.embedded.vue
+      embed_scope: meta.interpolation.vue source.js.embedded.vue
       escape: '}}'
       escape_captures:
-        0: meta.template.vue punctuation.definition.template.end.html
+        0: meta.interpolation.vue punctuation.definition.interpolation.end.html
 
 ###[ VUE DIRECTIVES ]#########################################################
 
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index 7630d05..b22b0c4 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -318,18 +318,17 @@ contexts:
 
   mustache-interpolation-content:
     - clear_scopes: 1
-    - meta_scope: meta.interpolation.vue
     - include: mustache-templates
     - include: immediately-pop
 
   mustache-templates:
     - match: '{{'
-      scope: meta.template.vue punctuation.definition.template.begin.html
+      scope: meta.interpolation.vue punctuation.definition.interpolation.begin.html
       embed: scope:source.js
-      embed_scope: meta.template.vue source.js.embedded.vue
+      embed_scope: meta.interpolation.vue source.js.embedded.vue
       escape: '}}'
       escape_captures:
-        0: meta.template.vue punctuation.definition.template.end.html
+        0: meta.interpolation.vue punctuation.definition.interpolation.end.html
 
 ###[ VUE DIRECTIVES ]#########################################################
 
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index 33ceefe..39110bd 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -1,25 +1,25 @@
 // SYNTAX TEST "Vue Component.sublime-syntax"
 
     <h1> {{ foo.text }} </h1>
-//       ^^^^^^^^^^^^^^ meta.template.vue
-//       ^^ punctuation.definition.template.begin.html
+//       ^^^^^^^^^^^^^^ meta.interpolation.vue
+//       ^^ punctuation.definition.interpolation.begin.html
 //         ^^^^^^^^^^ source.js.embedded.vue
-//                   ^^ punctuation.definition.template.end.html
+//                   ^^ punctuation.definition.interpolation.end.html
 
     <p {{foo.attrib}}>
-//     ^^^^^^^^^^^^^^ meta.template.vue
-//     ^^ punctuation.definition.template.begin.html
+//     ^^^^^^^^^^^^^^ meta.interpolation.vue
+//     ^^ punctuation.definition.interpolation.begin.html
 //       ^^^^^^^^^^ source.js.embedded.vue
-//                 ^^ punctuation.definition.template.end.html
+//                 ^^ punctuation.definition.interpolation.end.html
 
     <p attrib="{{ foo.value }}" >
 //            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
 //             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.vue
 //                            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
 //            ^ string.quoted.double.html punctuation.definition.string.begin.html
-//             ^^ punctuation.definition.template.begin.html - source.js
+//             ^^ punctuation.definition.interpolation.begin.html - source.js
 //               ^^^^^^^^^^^ source.js.embedded.vue
-//                          ^^ punctuation.definition.template.end.html - source.js
+//                          ^^ punctuation.definition.interpolation.end.html - source.js
 //                            ^ string.quoted.double.html punctuation.definition.string.end.html
 
     <p attrib='{{ foo.value }}' >
@@ -27,16 +27,16 @@
 //             ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.vue
 //                            ^ meta.tag meta.attribute-with-value.html meta.string.html - meta.interpolation
 //            ^ string.quoted.single.html punctuation.definition.string.begin.html
-//             ^^ punctuation.definition.template.begin.html - source.js
+//             ^^ punctuation.definition.interpolation.begin.html - source.js
 //               ^^^^^^^^^^^ source.js.embedded.vue
-//                          ^^ punctuation.definition.template.end.html - source.js
+//                          ^^ punctuation.definition.interpolation.end.html - source.js
 //                            ^ string.quoted.single.html punctuation.definition.string.end.html
 
     <p attrib={{ foo.value }} >
 //            ^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.html meta.string.html meta.interpolation.vue
-//            ^^ punctuation.definition.template.begin.html - source.js
+//            ^^ punctuation.definition.interpolation.begin.html - source.js
 //              ^^^^^^^^^^^ source.js.embedded.vue
-//                         ^^ punctuation.definition.template.end.html - source.js
+//                         ^^ punctuation.definition.interpolation.end.html - source.js
 
     <p v-attrib="{'key': 'value'}">
 //  ^^^ meta.tag - meta.attribute-with-value

From 30380d08be57c929190d20cbcd4bffdd31610b63 Mon Sep 17 00:00:00 2001
From: deathaxe <deathaxe82@googlemail.com>
Date: Thu, 5 Jan 2023 18:12:23 +0100
Subject: [PATCH 21/21] Fix attribute name interpolation

1. extend `meta.interpolation` to include leading and trailing
   punctuation to comply with ST's scope naming guidelines.
2. fix closing `]` scope.
3. adjust/add tests
---
 Vue Component.sublime-syntax             |  6 +++---
 Vue Component.sublime-syntax.yaml-macros |  6 +++---
 tests/syntax_tests_mustage.vue           | 15 ++++++++-------
 3 files changed, 14 insertions(+), 13 deletions(-)

diff --git a/Vue Component.sublime-syntax b/Vue Component.sublime-syntax
index 182f3df..abd5245 100644
--- a/Vue Component.sublime-syntax	
+++ b/Vue Component.sublime-syntax	
@@ -623,10 +623,10 @@ contexts:
   vue-dynamic-attribute-name:
     - clear_scopes: 1  # clear `entity.other.attribute-name`
     - match: \[
-      scope: punctuation.section.interpolation.begin.vue
+      scope: meta.interpolation.vue punctuation.section.interpolation.begin.vue
       embed: scope:source.js#expression-statement
       embed_scope: meta.interpolation.vue source.js.embedded.vue
       escape: \]
       escape_captures:
-        0: punctuation.definition.string.end.html
-    - include: else-pop
+        0: meta.interpolation.vue punctuation.definition.interpolation.end.vue
+    - include: immediately-pop
diff --git a/Vue Component.sublime-syntax.yaml-macros b/Vue Component.sublime-syntax.yaml-macros
index b22b0c4..6daadfb 100644
--- a/Vue Component.sublime-syntax.yaml-macros	
+++ b/Vue Component.sublime-syntax.yaml-macros	
@@ -396,10 +396,10 @@ contexts:
   vue-dynamic-attribute-name:
     - clear_scopes: 1  # clear `entity.other.attribute-name`
     - match: \[
-      scope: punctuation.section.interpolation.begin.vue
+      scope: meta.interpolation.vue punctuation.section.interpolation.begin.vue
       embed: scope:source.js#expression-statement
       embed_scope: meta.interpolation.vue source.js.embedded.vue
       escape: \]
       escape_captures:
-        0: punctuation.definition.string.end.html
-    - include: else-pop
+        0: meta.interpolation.vue punctuation.definition.interpolation.end.vue
+    - include: immediately-pop
diff --git a/tests/syntax_tests_mustage.vue b/tests/syntax_tests_mustage.vue
index 39110bd..693ae30 100644
--- a/tests/syntax_tests_mustage.vue
+++ b/tests/syntax_tests_mustage.vue
@@ -128,19 +128,20 @@
     <template #[`content-${variable}`]>
 //            ^^^^^^^^^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html
 //            ^ entity.other.attribute-name.html
-//             ^ punctuation.section.interpolation.begin.vue
+//             ^ meta.interpolation.vue punctuation.section.interpolation.begin.vue - source.js.embedded
 //              ^^^^^^^^^^^^^^^^^^^^^ meta.interpolation.vue source.js.embedded.vue - entity.other.attribute-name.html
-//                                   ^ punctuation.definition.string.end.html
+//                                   ^ meta.interpolation.vue punctuation.definition.interpolation.end.vue - source.js.embedded
 //                                    ^ meta.tag - meta.attribute-with-value
 //                                     ^ - meta.tag
 
-    <template v-slot:[`content-${variable}`]>
+    <template v-slot:[`content-${variable}`] >
 //            ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ meta.tag meta.attribute-with-value.directive.html
 //            ^^^^^^^ entity.other.attribute-name.html
-//                   ^ punctuation.section.interpolation.begin.vue
+//                   ^ meta.interpolation.vue punctuation.section.interpolation.begin.vue - source.js.embedded
 //                    ^^^^^^^^^^^^^^^^^^^^^ meta.interpolation.vue source.js.embedded.vue - entity.other.attribute-name.html
-//                                         ^ punctuation.definition.string.end.html
-//                                          ^ meta.tag - meta.attribute-with-value
-//                                           ^ - meta.tag
+//                                         ^ meta.interpolation.vue punctuation.definition.interpolation.end.vue - source.js.embedded
+//                                          ^ meta.tag - meta.interpolation
+//                                           ^ meta.tag - meta.attribute-with-value
+//                                            ^ - meta.tag
 
 </html>