Skip to content

Commit 8e7d7ef

Browse files
nielknielk
authored
fix: properly highlight svelte 5 <component.dot.notation /> (#2552)
#2525
1 parent 39f3d04 commit 8e7d7ef

File tree

3 files changed

+91
-9
lines changed

3 files changed

+91
-9
lines changed

‎packages/svelte-vscode/syntaxes/svelte.tmLanguage.src.yaml

Lines changed: 11 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -224,7 +224,7 @@ repository:
224224
{ match: if|else\s+if|else, name: keyword.control.conditional.svelte },
225225
{ match: each|key, name: keyword.control.svelte },
226226
{ match: await|then|catch, name: keyword.control.flow.svelte },
227-
{ match: snippet, name: keyword.control.svelte },
227+
{ match: snippet, name: keyword.control.svelte },
228228
{ match: html, name: keyword.other.svelte },
229229
{ match: render, name: keyword.other.svelte },
230230
{ match: debug, name: keyword.other.debugger.svelte },
@@ -509,16 +509,22 @@ repository:
509509
# Scopes the `name` part in `<name>`.
510510
tags-name:
511511
patterns:
512-
# Svelte (`svelte:<type>`) elements.
513-
- match: '(svelte)(:)([a-z][\w0-9:-]*)'
512+
# Svelte built-in elements (e.g., svelte:self, svelte:component).
513+
- match: '(svelte)(:)([a-z][\w:-]*)'
514514
captures:
515515
1: { name: keyword.control.svelte }
516516
2: { name: punctuation.definition.keyword.svelte }
517517
3: { name: entity.name.tag.svelte }
518518
# Slot.
519519
- { match: 'slot', name: keyword.control.svelte }
520-
# Components.
521-
- { match: '[A-Z][a-zA-Z0-9_]*', name: support.class.component.svelte }
520+
# Components (either Namespaced.Component, namespaced.component or PascalCase).
521+
- match: '([\w]+(?:\.[\w]+)+)|([A-Z][\w]+)'
522+
captures:
523+
1: { patterns: [
524+
{ match: '\w+', name: support.class.component.svelte },
525+
{ match: '\.', name: punctuation.definition.keyword.svelte },
526+
]}
527+
2: { name: support.class.component.svelte }
522528
# Custom elements. (has a dash, but otherwise is a valid HTML element)
523529
- { match: '[a-z][\w0-9:]*-[\w0-9:-]*', name: meta.tag.custom.svelte entity.name.tag.svelte }
524530
# HTML elements.

‎packages/svelte-vscode/test/grammar/samples/namespaced-component/input.svelte

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,6 @@
1-
<Hi.Input></Hi.Input>
1+
<Hi.Input></Hi.Input>
2+
<Hello.World.Input></Hello.World.Input>
3+
<Hello._World123.Input></Hello._World123.Input>
4+
<hi.input></hi.input>
5+
<hello.world.input></hello.world.input>
6+
<hello._world123.input></hello._world123.input>

‎packages/svelte-vscode/test/grammar/samples/namespaced-component/input.svelte.snap

Lines changed: 74 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,82 @@
11
><Hi.Input></Hi.Input>
22
#^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
33
# ^^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.start.svelte support.class.component.svelte
4-
# ^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.start.svelte
4+
# ^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
55
# ^^^^^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.start.svelte support.class.component.svelte
66
# ^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
77
# ^^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
88
# ^^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.end.svelte support.class.component.svelte
9-
# ^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.end.svelte
9+
# ^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
1010
# ^^^^^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.end.svelte support.class.component.svelte
11-
# ^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
11+
# ^ source.svelte meta.scope.tag.Hi.Input.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
12+
><Hello.World.Input></Hello.World.Input>
13+
#^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
14+
# ^^^^^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.start.svelte support.class.component.svelte
15+
# ^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
16+
# ^^^^^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.start.svelte support.class.component.svelte
17+
# ^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
18+
# ^^^^^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.start.svelte support.class.component.svelte
19+
# ^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
20+
# ^^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
21+
# ^^^^^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.end.svelte support.class.component.svelte
22+
# ^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
23+
# ^^^^^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.end.svelte support.class.component.svelte
24+
# ^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
25+
# ^^^^^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.end.svelte support.class.component.svelte
26+
# ^ source.svelte meta.scope.tag.Hello.World.Input.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
27+
><Hello._World123.Input></Hello._World123.Input>
28+
#^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
29+
# ^^^^^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.start.svelte support.class.component.svelte
30+
# ^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
31+
# ^^^^^^^^^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.start.svelte support.class.component.svelte
32+
# ^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
33+
# ^^^^^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.start.svelte support.class.component.svelte
34+
# ^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
35+
# ^^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
36+
# ^^^^^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.end.svelte support.class.component.svelte
37+
# ^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
38+
# ^^^^^^^^^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.end.svelte support.class.component.svelte
39+
# ^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
40+
# ^^^^^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.end.svelte support.class.component.svelte
41+
# ^ source.svelte meta.scope.tag.Hello._World123.Input.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
42+
><hi.input></hi.input>
43+
#^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
44+
# ^^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.start.svelte support.class.component.svelte
45+
# ^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
46+
# ^^^^^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.start.svelte support.class.component.svelte
47+
# ^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
48+
# ^^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
49+
# ^^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.end.svelte support.class.component.svelte
50+
# ^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
51+
# ^^^^^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.end.svelte support.class.component.svelte
52+
# ^ source.svelte meta.scope.tag.hi.input.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
53+
><hello.world.input></hello.world.input>
54+
#^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
55+
# ^^^^^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.start.svelte support.class.component.svelte
56+
# ^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
57+
# ^^^^^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.start.svelte support.class.component.svelte
58+
# ^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
59+
# ^^^^^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.start.svelte support.class.component.svelte
60+
# ^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
61+
# ^^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
62+
# ^^^^^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.end.svelte support.class.component.svelte
63+
# ^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
64+
# ^^^^^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.end.svelte support.class.component.svelte
65+
# ^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
66+
# ^^^^^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.end.svelte support.class.component.svelte
67+
# ^ source.svelte meta.scope.tag.hello.world.input.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte
68+
><hello._world123.input></hello._world123.input>
69+
#^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.start.svelte punctuation.definition.tag.begin.svelte
70+
# ^^^^^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.start.svelte support.class.component.svelte
71+
# ^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
72+
# ^^^^^^^^^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.start.svelte support.class.component.svelte
73+
# ^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.start.svelte punctuation.definition.keyword.svelte
74+
# ^^^^^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.start.svelte support.class.component.svelte
75+
# ^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.start.svelte punctuation.definition.tag.end.svelte
76+
# ^^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.end.svelte punctuation.definition.tag.begin.svelte
77+
# ^^^^^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.end.svelte support.class.component.svelte
78+
# ^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
79+
# ^^^^^^^^^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.end.svelte support.class.component.svelte
80+
# ^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.end.svelte punctuation.definition.keyword.svelte
81+
# ^^^^^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.end.svelte support.class.component.svelte
82+
# ^ source.svelte meta.scope.tag.hello._world123.input.svelte meta.tag.end.svelte punctuation.definition.tag.end.svelte

0 commit comments

Comments
 (0)