fix(treesitter): JSX/TSX tags are missing highlights

Fixes: #360

Author: tmillr

CHANGELOG.md

@@ -6,6 +6,10 @@ The format is based on [Keep a Changelog], and this project adheres to [Semantic
 
 ## [unreleased]
 
+### Issues Fix
+
+-  Fixed JSX/TSX tags are missing highlights with nvim 0.10 (#360)
+
 ## [v1.1.2] - 05 August 2024
 
 _This release contains a crucial ***hotfix*** for a bug that prevented the ability to

lua/github-theme/group/modules/treesitter.lua

@@ -188,6 +188,7 @@ If you want to stay on nvim 0.7, disable the module, or track on 'v0.0.x' branch
 --- XML Tags -----------------------------------------------------------------------------
 
     ['@tag']                      = { fg = syn.tag },                                           -- Tags like HTML tag names
+    ['@tag.builtin']              = { link = '@tag' },                                          -- Tags, but only non-user-defined ones (e.g. `<a>`)
     ['@tag.attribute']            = { link = '@variable.member' },                              -- Tag attributes (e.g. HTML element attributes)
     ['@tag.delimiter']            = FALLBACK_OR_NONE,                                           -- Tag delimiter like `<`, `>`, `/`, etc.
 
@@ -252,8 +253,8 @@ If you want to stay on nvim 0.7, disable the module, or track on 'v0.0.x' branch
  -- ['@variable.javascript']                    = { link = '@constant' },
 
     -- JSX/TSX
-    ['@tag.javascript']                         = FALLBACK_OR_NONE,
-    ['@tag.tsx']                                = FALLBACK_OR_NONE,
+    ['@tag.javascript']                         = { link = '@type.javascript' },
+    ['@tag.tsx']                                = { link = '@type.tsx' },
     ['@tag.delimiter.javascript']               = { link = '@tag.attribute.javascript' },
     ['@tag.delimiter.tsx']                      = { link = '@tag.attribute.tsx' },
 

queries/ecma/highlights.scm

@@ -0,0 +1,22 @@
+;; extends
+
+; These fix an nvim-treesitter bug where the `Abc` in `Abc.Xyz` is captured as a
+; builtin tag. They also change the capture for `Xyz` to `@variable.member`
+; instead of e.g. `@tag` (which gives the property a different color).
+(jsx_opening_element
+  name: (member_expression
+    ; If the tag name contains a dot (operator), it must always be a custom
+    ; tag? Therefore, we're not even going to try matching a `@tag.builtin`
+    ; here.
+    object: (identifier) @tag (#set! "priority" 115)
+    property: (property_identifier) @variable.member (#set! "priority" 115)))
+
+(jsx_closing_element
+  name: (member_expression
+    object: (identifier) @tag (#set! "priority" 115)
+    property: (property_identifier) @variable.member (#set! "priority" 115)))
+
+(jsx_self_closing_element
+  name: (member_expression
+    object: (identifier) @tag (#set! "priority" 115)
+    property: (property_identifier) @variable.member (#set! "priority" 115)))