kc/helix
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 3

fix: Improve JSX and TSX tag highlighting (#3973)

Browse source
This commit is contained in:
Jacob Chandler 2022-09-26 19:27:54 -04:00 • committed by GitHub
parent d2bb7f5a09
commit 90468ad6c5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 14 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
runtime/queries/jsx/highlights.scm
View file

@ -1,5 +1,3 @@
; inherits: ecma
; Highlight component names differently
(jsx_opening_element ((identifier) @constructor
(#match? @constructor "^[A-Z]")))
@ -7,21 +5,33 @@
; Handle the dot operator effectively - <My.Component>
(jsx_opening_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
; Highlight brackets differently
(jsx_opening_element ["<" ">"] @punctuation.bracket)
(jsx_closing_element ((identifier) @constructor
(#match? @constructor "^[A-Z]")))
; Handle the dot operator effectively - </My.Component>
(jsx_closing_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
; Highlight brackets differently
(jsx_closing_element ["<" "/" ">"] @punctuation.bracket)
(jsx_self_closing_element ((identifier) @constructor
(#match? @constructor "^[A-Z]")))
; Handle the dot operator effectively - <My.Component />
(jsx_self_closing_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
; TODO: also tag @punctuation.delimiter?
; Highlight brackets differently
(jsx_self_closing_element ["<" "/" ">"] @punctuation.bracket)
; Handle attribute delimiter
(jsx_attribute "=" @punctuation.delimiter)
(jsx_opening_element (identifier) @tag)
(jsx_closing_element (identifier) @tag)
(jsx_self_closing_element (identifier) @tag)
(jsx_attribute (property_identifier) @variable.other.member)
; inherits: ecma

2
runtime/queries/tsx/highlights.scm
View file

@ -1 +1 @@
; inherits: typescript
; inherits: jsx,typescript