1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
|
if polyglot#init#is_disabled(expand('<sfile>:p'), 'svelte', 'syntax/svelte-html.vim')
finish
endif
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
"
" Config {{{
"
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
let s:highlight_svelte_attr = svelte#GetConfig('highlight_svelte_attr', 0)
")}}}
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
"
" Syntax highlight {{{
"
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
syntax match svelteComponentName containedin=htmlTagN '\v\C<[a-zA-Z0-9]+(\.[A-Z][a-zA-Z0-9]+)*>'
syntax match svelteComponentName containedin=htmlTagN '\v\C<[a-z0-9]+(-[a-z0-9]+)+>'
syntax match svelteComponentName containedin=htmlTagN '\vsvelte:\w*'
" Syntax for vim-svelte-theme
syntax match htmlAttr '\v(\S|\<)@<![^\/\<\>[:blank:]]+' containedin=htmlTag
\ contains=htmlString,svelteValue,htmlArg
syntax match htmlAttrEqual '\v\=' containedin=htmlAttr
syntax match svelteAttr
\ '\v(\S)@<!(on|bind|use|in|out|transition|animate|class):[^\=\>[:blank:]]+(\=\"[^"]*\"|\=\{[^}]*\})?'
\ containedin=htmlTag
\ contains=svelteKey,svelteValue
syntax match svelteKey contained '\v(on|bind|use|in|out|transition|animate|class):[^\=\>[:blank:]]+'
syntax match svelteValue contained '\v\{[^}]*\}'
syntax region svelteExpression
\ containedin=htmlH.*,htmlItalic
\ matchgroup=svelteBrace
\ transparent
\ start="{"
\ end="}\(}\)\@!"
syntax region svelteExpression
\ containedin=htmlSvelteTemplate,svelteValue,htmlString,htmlValue,htmlArg,htmlTag
\ contains=@simpleJavascriptExpression,svelteAtTags
\ matchgroup=svelteBrace
\ transparent
\ start="{"
\ end="}\(}\)\@!"
syntax region svelteExpression
\ containedin=htmlTag
\ contains=@simpleJavascriptExpression,svelteAtTags,svelteShortProp
\ matchgroup=svelteBrace
\ transparent
\ start="{"
\ end="}\(}\)\@!"
syntax match svelteAtTags '\v\@(html|debug)'
syntax match svelteShortProp '\v<\w+>'
syntax region svelteBlockBody
\ containedin=htmlSvelteTemplate,htmlLink
\ contains=@simpleJavascriptExpression,svelteBlockKeyword
\ matchgroup=svelteBrace
\ start="{:"
\ end="}"
syntax region svelteBlockStart
\ containedin=htmlSvelteTemplate,htmlLink
\ contains=@simpleJavascriptExpression,svelteBlockKeyword
\ matchgroup=svelteBrace
\ start="{#"
\ end="}"
syntax region svelteBlockEnd
\ containedin=htmlSvelteTemplate,htmlLink
\ contains=@simpleJavascriptExpression,svelteBlockKeyword
\ matchgroup=svelteBrace
\ start="{\/"
\ end="}"
syntax keyword svelteBlockKeyword if else each await then catch as
syntax cluster simpleJavascriptExpression
\ contains=javaScriptStringS,javaScriptStringD,javaScriptTemplateString,javascriptNumber,javaScriptOperator
" Redefine JavaScript syntax
syntax region javaScriptStringS
\ start=+'+ skip=+\\\\\|\\'+ end=+'\|$+ contained
syntax region javaScriptStringD
\ start=+"+ skip=+\\\\\|\\"+ end=+"\|$+ contained
syntax region javaScriptTemplateString
\ start=+`+ skip=+\\`+ end=+`+ contained
\ contains=javaScriptTemplateExpression
syntax region javaScriptTemplateExpression
\ matchgroup=Type
\ start=+${+ end=+}+ keepend contained
syntax match javaScriptNumber '\v<-?\d+L?>|0[xX][0-9a-fA-F]+>' contained
syntax match javaScriptOperator '[-!|&+<>=%*~^]' contained
syntax match javaScriptOperator '\v(*)@<!/(/|*)@!' contained
syntax keyword javaScriptOperator delete instanceof typeof void new in of contained
highlight default link svelteAttr htmlTag
if s:highlight_svelte_attr
highlight default link svelteKey Type
highlight default link svelteValue None
else
highlight default link svelteKey htmlArg
highlight default link svelteValue String
endif
highlight default link svelteBrace Type
highlight default link svelteBlockKeyword Statement
highlight default link svelteComponentName htmlTagName
highlight default link javaScriptTemplateString String
highlight default link javaScriptStringS String
highlight default link javaScriptStringD String
highlight default link javaScriptNumber Constant
highlight default link javaScriptOperator Operator
highlight default link svelteAttr htmlTag
highlight default link svelteAttrEqual htmlTag
highlight default link svelteShortProp htmlValue
"}}}
" vim: fdm=marker
|
