git.iko.soy/helix
on master help sign in
fix: Improve JSX and TSX tag highlighting (#3973)
90468adJacob Chandler
runtime/queries/jsx/highlights.scm+13−3
compare with master
unifiedsplit
@@ -1,5 +1,3 @@
1−; inherits: ecma
2−
3; Highlight component names differently
1; Highlight component names differently
4(jsx_opening_element ((identifier) @constructor
2(jsx_opening_element ((identifier) @constructor
5 (#match? @constructor "^[A-Z]")))
3 (#match? @constructor "^[A-Z]")))
@@ -7,21 +5,33 @@
7; Handle the dot operator effectively - <My.Component>
5; Handle the dot operator effectively - <My.Component>
8(jsx_opening_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
6(jsx_opening_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
9
7
8+; Highlight brackets differently
9+(jsx_opening_element ["<" ">"] @punctuation.bracket)
10+
10(jsx_closing_element ((identifier) @constructor
11(jsx_closing_element ((identifier) @constructor
11 (#match? @constructor "^[A-Z]")))
12 (#match? @constructor "^[A-Z]")))
12
13
13; Handle the dot operator effectively - </My.Component>
14; Handle the dot operator effectively - </My.Component>
14(jsx_closing_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
15(jsx_closing_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
15
16
17+; Highlight brackets differently
18+(jsx_closing_element ["<" "/" ">"] @punctuation.bracket)
19+
16(jsx_self_closing_element ((identifier) @constructor
20(jsx_self_closing_element ((identifier) @constructor
17 (#match? @constructor "^[A-Z]")))
21 (#match? @constructor "^[A-Z]")))
18
22
19; Handle the dot operator effectively - <My.Component />
23; Handle the dot operator effectively - <My.Component />
20(jsx_self_closing_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
24(jsx_self_closing_element ((nested_identifier (identifier) @tag (identifier) @constructor)))
21
25
26+; Highlight brackets differently
27+(jsx_self_closing_element ["<" "/" ">"] @punctuation.bracket)
28+
29+; Handle attribute delimiter
22−; TODO: also tag @punctuation.delimiter?
30+(jsx_attribute "=" @punctuation.delimiter)
23
31
24(jsx_opening_element (identifier) @tag)
32(jsx_opening_element (identifier) @tag)
25(jsx_closing_element (identifier) @tag)
33(jsx_closing_element (identifier) @tag)
26(jsx_self_closing_element (identifier) @tag)
34(jsx_self_closing_element (identifier) @tag)
27(jsx_attribute (property_identifier) @variable.other.member)
35(jsx_attribute (property_identifier) @variable.other.member)
36+
37+; inherits: ecma
runtime/queries/tsx/highlights.scm+1−1
@@ -1 +1 @@
1−; inherits: typescript
1+; inherits: jsx,typescript