Skip to content

Commit 8e25958

Browse files
authored
Merge pull request #23 from MaxMEllon/support/tsx
Support typescript
2 parents a90b5f9 + 6316ad0 commit 8e25958

File tree

5 files changed

+322
-2
lines changed

5 files changed

+322
-2
lines changed

README.md

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,10 @@ Demo
1414

1515
![Auto indent demo](https://raw.githubusercontent.com/MaxMEllon/demos/master/vim-jsx-pretty/auto-indent.gif)
1616

17+
- support typescript
18+
19+
![typescript demo](https://user-images.githubusercontent.com/9594376/32855974-beb2432a-ca86-11e7-99a4-85c2630aa5d5.png)
20+
1721
Requirement
1822
---
1923

@@ -37,6 +41,13 @@ your `~/.vimrc`:
3741
Plug 'maxmellon/vim-jsx-pretty'
3842
```
3943
44+
- if you want to highlight tsx files.
45+
46+
```vim
47+
Plug 'leafgarland/typescript-vim'
48+
Plug 'maxmellon/vim-jsx-pretty'
49+
```
50+
4051
- with: yajs.vim (If you use neovim, doesn't work.)
4152
4253
```vim

after/ftplugin/javascript.vim

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
22
" Vim ftplugin file
33
"
4-
" Language: javascript.jsx
4+
" Language: typescript.jsx
55
" Maintainer: MaxMEllon <[email protected]>
6-
" Depends: pangloss/vim-javascript
6+
" Depends: leafgarland/typescript-vim
77
"
88
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
99

after/ftplugin/typescript.vim

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
if exists("loaded_matchit")
2+
let b:match_ignorecase = 0
3+
let b:match_words = '(:),\[:\],{:},<:>,' .
4+
\ '<\@<=\([^/][^ \t>]*\)[^>]*\%(>\|$\):<\@<=/\1>'
5+
endif
6+
7+
setlocal suffixesadd+=.tsx

after/indent/typescript.vim

Lines changed: 160 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,160 @@
1+
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
2+
" Vim indent file
3+
"
4+
" Language: typescript.jsx
5+
" Maintainer: MaxMellon <[email protected]>
6+
" Depends: leafgarland/typescript-vim
7+
"
8+
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
9+
10+
if exists('b:did_indent')
11+
let s:did_indent = b:did_indent
12+
unlet b:did_indent
13+
endif
14+
15+
runtime! indent/xml.vim
16+
17+
let s:keepcpo = &cpo
18+
set cpo&vim
19+
20+
if exists('s:did_indent')
21+
let b:did_indent = s:did_indent
22+
endif
23+
24+
setlocal indentexpr=GetJsxIndent()
25+
setlocal indentkeys=0{,0},0),0],0\,,!^F,o,O,e,*<Return>,<>>,<<>,/
26+
27+
if exists('*shiftwidth')
28+
function! s:sw()
29+
return shiftwidth()
30+
endfunction
31+
else
32+
function! s:sw()
33+
return &sw
34+
endfunction
35+
endif
36+
37+
let s:starttag = '^\s*<'
38+
let s:endtag = '^\s*\/\?>\s*;\='
39+
let s:real_endtag = '\s*<\/\+[A-Za-z]*>'
40+
41+
let s:has_typescript_vim = exists('*GetTypescriptIndent')
42+
43+
let s:true = !0
44+
let s:false = 0
45+
46+
function! s:syn_sol(lnum)
47+
return map(synstack(a:lnum, 1), 'synIDattr(v:val, "name")')
48+
endfunction
49+
50+
function! s:syn_eol(lnum)
51+
let lnum = prevnonblank(a:lnum)
52+
let col = strlen(getline(lnum))
53+
return map(synstack(lnum, col), 'synIDattr(v:val, "name")')
54+
endfunction
55+
56+
function! s:syn_attr_jsx(synattr)
57+
return a:synattr =~ "^jsx"
58+
endfunction
59+
60+
function! s:syn_xmlish(syns)
61+
return s:syn_attr_jsx(get(a:syns, -1))
62+
endfunction
63+
64+
function! s:syn_jsx_block_end(syns)
65+
return get(a:syns, -1) =~ '\%(js\|javascript\)Braces' ||
66+
\ s:syn_attr_jsx(get(a:syns, -2))
67+
endfunction
68+
69+
function! s:syn_jsx_region(syns)
70+
return len(filter(copy(a:syns), 'v:val ==# "jsxRegion"'))
71+
endfunction
72+
73+
function! s:syn_js_repeat_braces(syns)
74+
return len(filter(copy(a:syns), 'v:val ==# "jsRepeatBraces"'))
75+
endfunction
76+
77+
function! s:syn_jsx_else_block(syns)
78+
return len(filter(copy(a:syns), 'v:val ==# "jsIfElseBlock"'))
79+
endfunction
80+
81+
function! s:syn_jsx_close_tag(syns)
82+
return len(filter(copy(a:syns), 'v:val ==# "jsxCloseTag"'))
83+
endfunction
84+
85+
function! s:syn_jsx_escapejs(syns)
86+
return len(filter(copy(a:syns), 'v:val ==# "jsxEscapeJs"'))
87+
endfunction
88+
89+
function! s:syn_jsx_continues(cursyn, prevsyn)
90+
let curdepth = s:syn_jsx_region(a:cursyn)
91+
let prevdepth = s:syn_jsx_region(a:prevsyn)
92+
93+
return prevdepth == curdepth ||
94+
\ (prevdepth == curdepth + 1 && get(a:cursyn, -1) ==# 'jsxRegion')
95+
endfunction
96+
97+
function! GetJsxIndent()
98+
let cursyn = s:syn_sol(v:lnum)
99+
let prevsyn = s:syn_eol(v:lnum - 1)
100+
let nextsyn = s:syn_eol(v:lnum + 1)
101+
102+
if (s:syn_xmlish(prevsyn) || s:syn_jsx_block_end(prevsyn)) &&
103+
\ s:syn_jsx_continues(cursyn, prevsyn)
104+
let ind = XmlIndentGet(v:lnum, 0)
105+
106+
if getline(v:lnum) =~? s:endtag
107+
let ind = ind - s:sw()
108+
endif
109+
110+
if getline(v:lnum - 1) =~? s:endtag
111+
let ind = ind + s:sw()
112+
endif
113+
114+
" <div | <div
115+
" hoge={ | hoge={
116+
" <div></div> | ##<div></div>
117+
if s:syn_jsx_escapejs(prevsyn) && !(getline(v:lnum - 1) =~? '}')
118+
\&& getline(v:lnum - 1) =~? '{'
119+
let ind = ind + s:sw()
120+
endif
121+
122+
if getline(v:lnum) =~? s:starttag
123+
\&& !getline(v:lnum) =~? '}' && getline(v:lnum) =~? '{'
124+
let ind = ind + s:sw()
125+
endif
126+
127+
" <div | <div
128+
" hoge={ | hoge={
129+
" <div></div> | <div></div>
130+
" } | }##
131+
if s:syn_jsx_escapejs(cursyn) && getline(v:lnum) =~? '}'
132+
\&& !(getline(v:lnum) =~? '{')
133+
let ind = ind - s:sw()
134+
endif
135+
136+
" return ( | return (
137+
" <div> | <div>
138+
" </div> | </div>
139+
" ##); | ); <--
140+
if getline(v:lnum) =~? ');\?' && s:syn_jsx_close_tag(prevsyn)
141+
let ind = ind - s:sw()
142+
endif
143+
144+
if (s:syn_jsx_else_block(cursyn) || s:syn_js_repeat_braces(cursyn))
145+
\&& s:syn_jsx_close_tag(prevsyn)
146+
let ind = ind - s:sw()
147+
endif
148+
else
149+
if s:has_typescript_vim ==# s:true
150+
let ind = GetTypescriptIndent()
151+
else
152+
let ind = cindent(v:lnum)
153+
endif
154+
endif
155+
156+
return ind
157+
endfunction
158+
159+
let &cpo = s:keepcpo
160+
unlet s:keepcpo

after/syntax/typescript.vim

Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
2+
" Vim syntax file
3+
"
4+
" Language: javascript.jsx
5+
" Maintainer: MaxMellon <[email protected]>
6+
" Depends: leafgarland/typescript-vim
7+
"
8+
"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
9+
10+
let s:jsx_cpo = &cpo
11+
set cpo&vim
12+
13+
syntax case match
14+
15+
if exists('b:current_syntax')
16+
let s:current_syntax = b:current_syntax
17+
unlet b:current_syntax
18+
endif
19+
20+
if exists('s:current_syntax')
21+
let b:current_syntax = s:current_syntax
22+
endif
23+
24+
" <tag id="sample">
25+
" s~~~~~~~~~~~~~~~e
26+
" and self close tag
27+
" <tag id="sample" />
28+
" s~~~~~~~~~~~~~~~~~e
29+
syntax region jsxTag
30+
\ start=+<\([^/!?<>="':]\+\)\@=+
31+
\ skip=+</[^ /!?<>"']\+>+
32+
\ end=+/\@<!>+
33+
\ end=+\(/>\)\@=+
34+
\ contained
35+
\ contains=jsxTag,jsxError,jsxTagName,jsxAttrib,jsxEqual,jsxString,jsxEscapeJs,
36+
\jsxCloseString
37+
\ keepend
38+
\ extend
39+
40+
41+
" <tag></tag>
42+
" s~~~~~~~~~e
43+
" and self close tag
44+
" <tag/>
45+
" s~~~~e
46+
" A big start regexp borrowed from https://git.io/vDyxc
47+
syntax region jsxRegion
48+
\ start=+\(\((\|{\|}\|\[\|,\|&&\|||\|?\|:\|=\|=>\|\Wreturn\|^return\|\Wdefault\|^\|>\)\_s*\)\@<=<\_s*\z([_\$a-zA-Z]\(\.\?[\$0-9a-zA-Z]\+\)*\)+
49+
\ skip=+<!--\_.\{-}-->+
50+
\ end=+</\_s*\z1>+
51+
\ end=+/>+
52+
\ fold
53+
\ contains=jsxRegion,jsxCloseString,jsxCloseTag,jsxTag,jsxComment,jsFuncBlock,
54+
\@Spell
55+
\ keepend
56+
\ extend
57+
58+
" </tag>
59+
" ~~~~~~
60+
syntax match jsxCloseTag
61+
\ +</\_s*[^/!?<>"']\+>+
62+
\ contained
63+
\ contains=jsxNamespace
64+
65+
syntax match jsxCloseString
66+
\ +/>+
67+
\ contained
68+
69+
" <!-- -->
70+
" ~~~~~~~~
71+
syntax match jsxComment /<!--\_.\{-}-->/ display
72+
73+
syntax match jsxEntity "&[^; \t]*;" contains=jsxEntityPunct
74+
syntax match jsxEntityPunct contained "[&.;]"
75+
76+
" <tag key={this.props.key}>
77+
" ~~~
78+
syntax match jsxTagName
79+
\ +<\_s*\zs[^/!?<>"']\++
80+
\ contained
81+
\ display
82+
83+
" <tag key={this.props.key}>
84+
" ~~~
85+
syntax match jsxAttrib
86+
\ +\(\(<\_s*\)\@<!\_s\)\@<=\<[a-zA-Z_][-0-9a-zA-Z_]*\>\(\_s\+\|\_s*[=/>]\)\@=+
87+
\ contained
88+
\ display
89+
90+
" <tag id="sample">
91+
" ~
92+
" syntax match jsxEqual +=+ display
93+
94+
" <tag id="sample">
95+
" s~~~~~~e
96+
syntax region jsxString contained start=+"+ end=+"+ contains=jsxEntity,@Spell display
97+
98+
" <tag id='sample'>
99+
" s~~~~~~e
100+
syntax region jsxString contained start=+'+ end=+'+ contains=jsxEntity,@Spell display
101+
102+
" <tag key={this.props.key}>
103+
" s~~~~~~~~~~~~~~e
104+
syntax region jsxEscapeJs
105+
\ contained
106+
\ contains=jsBlock,jsxRegion
107+
\ start=+{+
108+
\ end=++
109+
\ extend
110+
111+
syntax match jsxIfOperator +?+
112+
syntax match jsxElseOperator +:+
113+
114+
syntax cluster typescriptParens add=jsxRegion
115+
116+
let s:vim_jsx_pretty_enable_jsx_highlight = get(g:, 'vim_jsx_pretty_enable_jsx_highlight', 1)
117+
118+
if s:vim_jsx_pretty_enable_jsx_highlight == 1
119+
highlight def link jsxTag Function
120+
highlight def link jsxTagName Function
121+
highlight def link jsxString String
122+
highlight def link jsxNameSpace Function
123+
highlight def link jsxComment Error
124+
highlight def link jsxAttrib Type
125+
highlight def link jsxEscapeJs jsxEscapeJs
126+
highlight def link jsxCloseTag Identifier
127+
highlight def link jsxCloseString Identifier
128+
endif
129+
130+
let s:vim_jsx_pretty_colorful_config = get(g:, 'vim_jsx_pretty_colorful_config', 0)
131+
132+
if s:vim_jsx_pretty_colorful_config == 1
133+
highlight def link jsObjectKey Label
134+
highlight def link jsArrowFuncArgs Type
135+
highlight def link jsFuncArgs Type
136+
endif
137+
138+
139+
let b:current_syntax = 'typescript.jsx'
140+
141+
let &cpo = s:jsx_cpo
142+
unlet s:jsx_cpo

0 commit comments

Comments
 (0)