Add Vue tree sitter grammar (#787)

* ✨ Add vue tree sitter support

* Update .gitmodules

Co-authored-by: Blaž Hrastnik <blaz@mxxn.io>

5 files changed, 51 insertions, 0 deletions

diff --git a/.gitmodules b/.gitmodules
index d1fc1517..95b3670b 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -122,3 +122,7 @@
 	path = helix-syntax/languages/tree-sitter-svelte
 	url = https://github.com/Himujjal/tree-sitter-svelte
 	shallow = true
+[submodule "helix-syntax/languages/tree-sitter-vue"]
+	path = helix-syntax/languages/tree-sitter-vue
+	url = https://github.com/ikatyang/tree-sitter-vue
+	shallow = true
diff --git a/helix-syntax/languages/tree-sitter-vue b/helix-syntax/languages/tree-sitter-vue
new file mode 160000
+Subproject 91fe2754796cd8fba5f229505a23fa08f3546c0
diff --git a/languages.toml b/languages.toml
index 509100e7..e716b3dc 100644
--- a/languages.toml
+++ b/languages.toml
@@ -278,6 +278,15 @@ roots = []
 indent = { tab-width = 2, unit = "  " }
 language-server = { command = "svelteserver", args = ["--stdio"] }
 
+
+[[language]]
+name = "vue"
+scope = "source.vue"
+injection-regex = "vue"
+file-types = ["vue"]
+roots = []
+indent = { tab-width = 2, unit = "  " }
+
 [[language]]
 name = "yaml"
 scope = "source.yaml"
diff --git a/runtime/queries/vue/highlights.scm b/runtime/queries/vue/highlights.scm
new file mode 100644
index 00000000..f90ae429
--- /dev/null
+++ b/runtime/queries/vue/highlights.scm
@@ -0,0 +1,21 @@
+(tag_name) @tag
+(end_tag) @tag
+
+(directive_name) @keyword
+(directive_argument) @constant
+
+(attribute
+  (attribute_name) @attribute
+  (quoted_attribute_value
+    (attribute_value) @string)
+)
+
+(comment) @comment
+
+[
+  "<"
+  ">"
+  "</"
+  "{{"
+  "}}"
+] @punctuation.bracket
\ No newline at end of file
diff --git a/runtime/queries/vue/injections.scm b/runtime/queries/vue/injections.scm
new file mode 100644
index 00000000..8ee34ffb
--- /dev/null
+++ b/runtime/queries/vue/injections.scm
@@ -0,0 +1,17 @@
+(directive_attribute
+  (directive_name) @keyword
+  (quoted_attribute_value
+    (attribute_value) @injection.content)
+ (#set! injection.language "javascript"))
+
+((interpolation
+  (raw_text) @injection.content)
+ (#set! injection.language "javascript"))
+
+((script_element
+  (raw_text) @injection.content)
+ (#set! injection.language "javascript"))
+
+((style_element
+  (raw_text) @injection.content)
+ (#set! injection.language "css"))