12 files changed, 243 insertions, 435 deletions
diff --git a/after/ftplugin/javascript.vim b/after/ftplugin/javascript.vim
index 9efbb8d9..26d00bf2 100644
--- a/after/ftplugin/javascript.vim
+++ b/after/ftplugin/javascript.vim
@@ -14,3 +14,38 @@ if exists('b:undo_ftplugin')
 else
   let b:undo_ftplugin = 'setlocal iskeyword< suffixesadd<'
 endif
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
+  finish
+endif
+
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+" Vim ftplugin file
+"
+" Language: javascript.jsx
+" Maintainer: MaxMEllon <maxmellon1994@gmail.com>
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+
+" modified from html.vim
+" For matchit plugin
+if exists("loaded_matchit")
+  let b:match_ignorecase = 0
+  let b:match_words = '(:),\[:\],{:},<:>,' .
+        \ '<\@<=\([^/][^ \t>]*\)[^>]*\%(>\|$\):<\@<=/\1>'
+endif
+
+" For andymass/vim-matchup plugin
+if exists("loaded_matchup")
+  setlocal matchpairs=(:),{:},[:],<:>
+  let b:match_words = '<\@<=\([^/][^ \t>]*\)\g{hlend}[^>]*\%(/\@<!>\|$\):<\@<=/\1>'
+  let b:match_skip = 's:comment\|string'
+endif
+
+let b:original_commentstring = &l:commentstring
+
+augroup jsx_comment
+  autocmd! CursorMoved <buffer>
+  autocmd CursorMoved <buffer> call jsx_pretty#comment#update_commentstring(b:original_commentstring)
+augroup end
+
+setlocal suffixesadd+=.jsx
diff --git a/after/ftplugin/jsx.vim b/after/ftplugin/jsx.vim
deleted file mode 100644
index e1d689aa..00000000
--- a/after/ftplugin/jsx.vim
+++ /dev/null
@@ -1,31 +0,0 @@
-if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
-  finish
-endif
-
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-" Vim ftplugin file
-"
-" Language: JSX (JavaScript)
-" Maintainer: Max Wang <mxawng@gmail.com>
-"
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-
-" modified from html.vim
-if exists("loaded_matchit")
-  let b:match_ignorecase = 0
-  let s:jsx_match_words = '<\([a-zA-Z0-9.]\+\)\(>\|$\|\s\):<\/\1>'
-
-  if !exists('b:loaded_jsx_match_words')
-    let b:loaded_jsx_match_words = 0
-  endif
-
-  if b:loaded_jsx_match_words == 0
-    let b:match_words = exists('b:match_words')
-      \ ? b:match_words . ',' . s:jsx_match_words
-      \ : s:jsx_match_words
-  endif
-
-  let b:loaded_jsx_match_words = 1
-endif
-
-setlocal suffixesadd+=.jsx
diff --git a/after/ftplugin/tsx.vim b/after/ftplugin/tsx.vim
deleted file mode 100644
index 62112bba..00000000
--- a/after/ftplugin/tsx.vim
+++ /dev/null
@@ -1,21 +0,0 @@
-if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'tsx') != -1
-  finish
-endif
-
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-" Vim ftplugin file
-"
-" Language: TSX (JavaScript)
-" Maintainer: Ian Ker-Seymer <i.kerseymer@gmail.com>
-" Depends: leafgarland/typescript-vim
-"
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-
-" modified from html.vim
-if exists("loaded_matchit")
-  let b:match_ignorecase = 0
-  let b:match_words = '(:),\[:\],{:},<:>,' .
-        \ '<\@<=\([^/][^ \t>]*\)[^>]*\%(>\|$\):<\@<=/\1>'
-endif
-
-setlocal suffixesadd+=.tsx
diff --git a/after/ftplugin/typescript.vim b/after/ftplugin/typescript.vim
new file mode 100644
index 00000000..29ac50a6
--- /dev/null
+++ b/after/ftplugin/typescript.vim
@@ -0,0 +1,27 @@
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
+  finish
+endif
+
+" modified from html.vim
+" For matchit plugin
+if exists("loaded_matchit")
+  let b:match_ignorecase = 0
+  let b:match_words = '(:),\[:\],{:},<:>,' .
+        \ '<\@<=\([^/][^ \t>]*\)[^>]*\%(>\|$\):<\@<=/\1>'
+endif
+
+" For andymass/vim-matchup plugin
+if exists("loaded_matchup")
+  setlocal matchpairs=(:),{:},[:],<:>
+  let b:match_words = '<\@<=\([^/][^ \t>]*\)\g{hlend}[^>]*\%(/\@<!>\|$\):<\@<=/\1>'
+  let b:match_skip = 's:comment\|string'
+endif
+
+let b:original_commentstring = &l:commentstring
+
+augroup jsx_comment
+  autocmd! CursorMoved <buffer>
+  autocmd CursorMoved <buffer> call jsx_pretty#comment#update_commentstring(b:original_commentstring)
+augroup end
+
+setlocal suffixesadd+=.tsx
diff --git a/after/indent/javascript.vim b/after/indent/javascript.vim
new file mode 100644
index 00000000..1825446e
--- /dev/null
+++ b/after/indent/javascript.vim
@@ -0,0 +1,33 @@
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
+  finish
+endif
+
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+" Vim indent file
+"
+" Language: javascript.jsx
+" Maintainer: MaxMellon <maxmellon1994@gmail.com>
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+
+if exists('b:did_indent')
+  let s:did_indent = b:did_indent
+  unlet b:did_indent
+endif
+
+let s:keepcpo = &cpo
+set cpo&vim
+
+if exists('s:did_indent')
+  let b:did_indent = s:did_indent
+endif
+
+setlocal indentexpr=GetJsxIndent()
+setlocal indentkeys=0{,0},0),0],0\,,!^F,o,O,e,*<Return>,<>>,<<>,/
+
+function! GetJsxIndent()
+  return jsx_pretty#indent#get(function('GetJavascriptIndent'))
+endfunction
+
+let &cpo = s:keepcpo
+unlet s:keepcpo
diff --git a/after/indent/jsx.vim b/after/indent/jsx.vim
deleted file mode 100644
index 35df1f5f..00000000
--- a/after/indent/jsx.vim
+++ /dev/null
@@ -1,118 +0,0 @@
-if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
-  finish
-endif
-
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-" Vim indent file
-"
-" Language: JSX (JavaScript)
-" Maintainer: Max Wang <mxawng@gmail.com>
-"
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-
-" Save the current JavaScript indentexpr.
-let b:jsx_js_indentexpr = &indentexpr
-
-" Prologue; load in XML indentation.
-if exists('b:did_indent')
-  let s:did_indent=b:did_indent
-  unlet b:did_indent
-endif
-exe 'runtime! indent/xml.vim'
-if exists('s:did_indent')
-  let b:did_indent=s:did_indent
-endif
-
-setlocal indentexpr=GetJsxIndent()
-
-" JS indentkeys
-setlocal indentkeys=0{,0},0),0],0\,,!^F,o,O,e
-" XML indentkeys
-setlocal indentkeys+=*<Return>,<>>,<<>,/
-
-" Multiline end tag regex (line beginning with '>' or '/>')
-let s:endtag = '^\s*\/\?>\s*;\='
-
-" Get all syntax types at the beginning of a given line.
-fu! SynSOL(lnum)
-  return map(synstack(a:lnum, 1), 'synIDattr(v:val, "name")')
-endfu
-
-" Get all syntax types at the end of a given line.
-fu! SynEOL(lnum)
-  let lnum = prevnonblank(a:lnum)
-  let col = strlen(getline(lnum))
-  return map(synstack(lnum, col), 'synIDattr(v:val, "name")')
-endfu
-
-" Check if a syntax attribute is XMLish.
-fu! SynAttrXMLish(synattr)
-  return a:synattr =~ "^xml" || a:synattr =~ "^jsx"
-endfu
-
-" Check if a synstack is XMLish (i.e., has an XMLish last attribute).
-fu! SynXMLish(syns)
-  return SynAttrXMLish(get(a:syns, -1))
-endfu
-
-" Check if a synstack denotes the end of a JSX block.
-fu! SynJSXBlockEnd(syns)
-  return get(a:syns, -1) =~ '\%(js\|javascript\)Braces' &&
-       \ SynAttrXMLish(get(a:syns, -2))
-endfu
-
-" Determine how many jsxRegions deep a synstack is.
-fu! SynJSXDepth(syns)
-  return len(filter(copy(a:syns), 'v:val ==# "jsxRegion"'))
-endfu
-
-" Check whether `cursyn' continues the same jsxRegion as `prevsyn'.
-fu! SynJSXContinues(cursyn, prevsyn)
-  let curdepth = SynJSXDepth(a:cursyn)
-  let prevdepth = SynJSXDepth(a:prevsyn)
-
-  " In most places, we expect the nesting depths to be the same between any
-  " two consecutive positions within a jsxRegion (e.g., between a parent and
-  " child node, between two JSX attributes, etc.).  The exception is between
-  " sibling nodes, where after a completed element (with depth N), we return
-  " to the parent's nesting (depth N - 1).  This case is easily detected,
-  " since it is the only time when the top syntax element in the synstack is
-  " jsxRegion---specifically, the jsxRegion corresponding to the parent.
-  return prevdepth == curdepth ||
-      \ (prevdepth == curdepth + 1 && get(a:cursyn, -1) ==# 'jsxRegion')
-endfu
-
-" Cleverly mix JS and XML indentation.
-fu! GetJsxIndent()
-  let cursyn  = SynSOL(v:lnum)
-  let prevsyn = SynEOL(v:lnum - 1)
-
-  " Use XML indenting iff:
-  "   - the syntax at the end of the previous line was either JSX or was the
-  "     closing brace of a jsBlock whose parent syntax was JSX; and
-  "   - the current line continues the same jsxRegion as the previous line.
-  if (SynXMLish(prevsyn) || SynJSXBlockEnd(prevsyn)) &&
-        \ SynJSXContinues(cursyn, prevsyn)
-    let ind = XmlIndentGet(v:lnum, 0)
-
-    " Align '/>' and '>' with '<' for multiline tags.
-    if getline(v:lnum) =~? s:endtag
-      let ind = ind - &sw
-    endif
-
-    " Then correct the indentation of any JSX following '/>' or '>'.
-    if getline(v:lnum - 1) =~? s:endtag
-      let ind = ind + &sw
-    endif
-  else
-    if len(b:jsx_js_indentexpr)
-      " Invoke the base JS package's custom indenter.  (For vim-javascript,
-      " e.g., this will be GetJavascriptIndent().)
-      let ind = eval(b:jsx_js_indentexpr)
-    else
-      let ind = cindent(v:lnum)
-    endif
-  endif
-
-  return ind
-endfu
diff --git a/after/indent/tsx.vim b/after/indent/tsx.vim
deleted file mode 100644
index a74c7bef..00000000
--- a/after/indent/tsx.vim
+++ /dev/null
@@ -1,95 +0,0 @@
-if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'tsx') != -1
-  finish
-endif
-
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-" Vim indent file
-"
-" Language: TSX (JavaScript)
-" Maintainer: Ian Ker-Seymer <i.kerseymer@gmail.com>
-" Depends: pangloss/vim-typescript
-"
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-
-" Prologue; load in XML indentation.
-if exists('b:did_indent')
-  let s:did_indent=b:did_indent
-  unlet b:did_indent
-endif
-exe 'runtime! indent/xml.vim'
-if exists('s:did_indent')
-  let b:did_indent=s:did_indent
-endif
-
-setlocal indentexpr=GetTsxIndent()
-
-" TS indentkeys
-setlocal indentkeys=0{,0},0),0],0\,,!^F,o,O,e
-" XML indentkeys
-setlocal indentkeys+=*<Return>,<>>,<<>,/
-
-" Self-closing tag regex.
-let s:sctag = '^\s*\/>\s*;\='
-
-" Get all syntax types at the beginning of a given line.
-fu! SynSOL(lnum)
-  return map(synstack(a:lnum, 1), 'synIDattr(v:val, "name")')
-endfu
-
-" Get all syntax types at the end of a given line.
-fu! SynEOL(lnum)
-  let lnum = prevnonblank(a:lnum)
-  let col = strlen(getline(lnum))
-  return map(synstack(lnum, col), 'synIDattr(v:val, "name")')
-endfu
-
-" Check if a syntax attribute is XMLish.
-fu! SynAttrXMLish(synattr)
-  return a:synattr =~ "^xml" || a:synattr =~ "^tsx"
-endfu
-
-" Check if a synstack is XMLish (i.e., has an XMLish last attribute).
-fu! SynXMLish(syns)
-  return SynAttrXMLish(get(a:syns, -1))
-endfu
-
-" Check if a synstack has any XMLish attribute.
-fu! SynXMLishAny(syns)
-  for synattr in a:syns
-    if SynAttrXMLish(synattr)
-      return 1
-    endif
-  endfor
-  return 0
-endfu
-
-" Check if a synstack denotes the end of a TSX block.
-fu! SynTSXBlockEnd(syns)
-  return get(a:syns, -1) == 'tsBraces' && SynAttrXMLish(get(a:syns, -2))
-endfu
-
-" Cleverly mix TS and XML indentation.
-fu! GetTsxIndent()
-  let cursyn  = SynSOL(v:lnum)
-  let prevsyn = SynEOL(v:lnum - 1)
-
-  " Use XML indenting if the syntax at the end of the previous line was either
-  " TSX or was the closing brace of a tsBlock whose parent syntax was TSX.
-  if (SynXMLish(prevsyn) || SynTSXBlockEnd(prevsyn)) && SynXMLishAny(cursyn)
-    let ind = XmlIndentGet(v:lnum, 0)
-
-    " Align '/>' with '<' for multiline self-closing tags.
-    if getline(v:lnum) =~? s:sctag
-      let ind = ind - &sw
-    endif
-
-    " Then correct the indentation of any TSX following '/>'.
-    if getline(v:lnum - 1) =~? s:sctag
-      let ind = ind + &sw
-    endif
-  else
-    let ind = GetTypescriptIndent()
-  endif
-
-  return ind
-endfu
diff --git a/after/indent/typescript.vim b/after/indent/typescript.vim
new file mode 100644
index 00000000..dc8a5845
--- /dev/null
+++ b/after/indent/typescript.vim
@@ -0,0 +1,34 @@
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
+  finish
+endif
+
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+" Vim indent file
+"
+" Language: typescript.jsx
+" Maintainer: MaxMellon <maxmellon1994@gmail.com>
+" Depends: leafgarland/typescript-vim
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+
+if exists('b:did_indent')
+  let s:did_indent = b:did_indent
+  unlet b:did_indent
+endif
+
+let s:keepcpo = &cpo
+set cpo&vim
+
+if exists('s:did_indent')
+  let b:did_indent = s:did_indent
+endif
+
+setlocal indentexpr=GetJsxIndent()
+setlocal indentkeys=0{,0},0),0],0\,,!^F,o,O,e,*<Return>,<>>,<<>,/
+
+function! GetJsxIndent()
+  return jsx_pretty#indent#get(function('GetTypescriptIndent'))
+endfunction
+
+let &cpo = s:keepcpo
+unlet s:keepcpo
diff --git a/after/syntax/javascript.vim b/after/syntax/javascript.vim
new file mode 100644
index 00000000..7b92ecbd
--- /dev/null
+++ b/after/syntax/javascript.vim
@@ -0,0 +1,64 @@
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
+  finish
+endif
+
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+" Vim syntax file
+"
+" Language: javascript.jsx
+" Maintainer: MaxMellon <maxmellon1994@gmail.com>
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+
+let s:jsx_cpo = &cpo
+set cpo&vim
+
+syntax case match
+
+if exists('b:current_syntax')
+  let s:current_syntax = b:current_syntax
+  unlet b:current_syntax
+endif
+
+if exists('s:current_syntax')
+  let b:current_syntax = s:current_syntax
+endif
+
+if hlexists("jsNoise")    " pangloss/vim-javascript
+  syntax cluster jsExpression add=jsxRegion
+elseif hlexists("javascriptOpSymbols")    " othree/yajs.vim
+  " refine the javascript line comment
+  syntax region javascriptLineComment start=+//+ end=/$/ contains=@Spell,javascriptCommentTodo extend keepend
+  syntax cluster javascriptValue add=jsxRegion
+  syntax cluster javascriptNoReserved add=jsxElement,jsxTag
+
+  " add support to arrow function which returns a tagged template string, e.g.
+  " () => html`<div></div>`
+  syntax cluster afterArrowFunc add=javascriptTagRef
+else    " build-in javascript syntax
+  " refine the javascript line comment
+  syntax region javaScriptLineComment start=+//+ end=/$/ contains=@Spell,javascriptCommentTodo extend keepend
+  " add a javaScriptBlock group for build-in syntax
+  syntax region javaScriptBlockBuildIn
+        \ contained
+        \ matchgroup=javaScriptBraces
+        \ start="{"
+        \ end="}"
+        \ extend
+        \ contains=javaScriptBlockBuildIn,@javaScriptEmbededExpr,javaScript.*
+        \ fold
+  syntax cluster javaScriptEmbededExpr add=jsxRegion
+
+  " refine the template string syntax
+  syntax region javaScriptStringT start=+`+ skip=+\\\\\|\\`+ end=+`+ contains=javaScriptSpecial,javaScriptEmbed,@htmlPreproc extend
+  syntax region javaScriptEmbed matchgroup=javaScriptEmbedBraces start=+\${+ end=+}+ contained contains=@javaScriptEmbededExpr,javaScript.*
+endif
+
+" because this is autoloaded, when developing you're going to need to source
+" the autoload/jsx_pretty/*.vim file manually, or restart vim
+call jsx_pretty#syntax#highlight()
+
+let b:current_syntax = 'javascript.jsx'
+
+let &cpo = s:jsx_cpo
+unlet s:jsx_cpo
diff --git a/after/syntax/jsx.vim b/after/syntax/jsx.vim
deleted file mode 100644
index ac4dd616..00000000
--- a/after/syntax/jsx.vim
+++ /dev/null
@@ -1,83 +0,0 @@
-if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
-  finish
-endif
-
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-" Vim syntax file
-"
-" Language: JSX (JavaScript)
-" Maintainer: Max Wang <mxawng@gmail.com>
-" Depends: pangloss/vim-javascript
-"
-" CREDITS: Inspired by Facebook.
-"
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-
-" Prologue; load in XML syntax.
-if exists('b:current_syntax')
-  let s:current_syntax=b:current_syntax
-  unlet b:current_syntax
-endif
-syn include @XMLSyntax syntax/xml.vim
-if exists('s:current_syntax')
-  let b:current_syntax=s:current_syntax
-endif
-
-" Officially, vim-jsx depends on the pangloss/vim-javascript syntax package
-" (and is tested against it exclusively).  However, in practice, we make some
-" effort towards compatibility with other packages.
-"
-" These are the plugin-to-syntax-element correspondences:
-"
-"   - pangloss/vim-javascript:      jsBlock, jsExpression
-"   - jelera/vim-javascript-syntax: javascriptBlock
-"   - othree/yajs.vim:              javascriptNoReserved
-
-
-" JSX attributes should color as JS.  Note the trivial end pattern; we let
-" jsBlock take care of ending the region.
-syn region xmlString contained start=+{+ end=++ contains=jsBlock,javascriptBlock
-
-" JSX comments inside XML tag should color as comment.  Note the trivial end pattern; we let
-" jsComment take care of ending the region.
-syn region xmlString contained start=+//+ end=++ contains=jsComment
-
-" JSX child blocks behave just like JSX attributes, except that (a) they are
-" syntactically distinct, and (b) they need the syn-extend argument, or else
-" nested XML end-tag patterns may end the outer jsxRegion.
-syn region jsxChild contained start=+{+ end=++ contains=jsBlock,javascriptBlock
-  \ extend
-
-" Highlight JSX regions as XML; recursively match.
-"
-" Note that we prohibit JSX tags from having a < or word character immediately
-" preceding it, to avoid conflicts with, respectively, the left shift operator
-" and generic Flow type annotations (http://flowtype.org/).
-syn region jsxRegion
-  \ contains=@Spell,@XMLSyntax,jsxRegion,jsxChild,jsBlock,javascriptBlock
-  \ start=+\%(<\|\w\)\@<!<\z([a-zA-Z_][a-zA-Z0-9:\-.]*\>[:,]\@!\)\([^>]*>(\)\@!+
-  \ skip=+<!--\_.\{-}-->+
-  \ end=+</\z1\_\s\{-}>+
-  \ end=+/>+
-  \ keepend
-  \ extend
-
-" Shorthand fragment support
-"
-" Note that since the main jsxRegion contains @XMLSyntax, we cannot simply
-" adjust the regex above since @XMLSyntax will highlight the opening `<` as an
-" XMLError. Instead we create a new group with the same name that does not
-" include @XMLSyntax and instead uses matchgroup to get the same highlighting.
-syn region jsxRegion
-  \ contains=@Spell,jsxRegion,jsxChild,jsBlock,javascriptBlock
-  \ matchgroup=xmlTag
-  \ start=/<>/
-  \ end=/<\/>/
-  \ keepend
-  \ extend
-
-" Add jsxRegion to the lowest-level JS syntax cluster.
-syn cluster jsExpression add=jsxRegion
-
-" Allow jsxRegion to contain reserved words.
-syn cluster javascriptNoReserved add=jsxRegion
diff --git a/after/syntax/tsx.vim b/after/syntax/tsx.vim
deleted file mode 100644
index 05bfc9ea..00000000
--- a/after/syntax/tsx.vim
+++ /dev/null
@@ -1,87 +0,0 @@
-if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'tsx') != -1
-  finish
-endif
-
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-" Vim syntax file
-"
-" Language: TSX (JavaScript)
-" Maintainer: Ian Ker-Seymer <i.kerseymer@gmail.com>
-" Depends: leafgarland/typescript-vim
-"
-"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
-
-if exists('b:current_syntax')
-  let s:current_syntax=b:current_syntax
-  unlet b:current_syntax
-endif
-
-syn include @XMLSyntax syntax/xml.vim
-
-if exists('s:current_syntax')
-  let b:current_syntax=s:current_syntax
-endif
-
-syn region embeddedTs
-      \ matchgroup=NONE
-      \ start=+{+
-      \ end=+}+
-      \ contains=@Spell,@typescriptAll,xmlEntity,tsxRegion
-      \ contained
-
-" Add embeddedTs to everything where xmlString is used to allow for
-" both string highlighting and @typescriptAll highlighting
-syn region   xmlTag
-      \ matchgroup=xmlTag start=+<[^ /!?<>"']\@=+
-      \ matchgroup=xmlTag end=+>+
-      \ contained
-      \ contains=xmlError,xmlTagName,xmlAttrib,xmlEqual,xmlString,@xmlStartTagHook,embeddedTs
-
-syn region xmlProcessing
-      \ matchgroup=xmlProcessingDelim
-      \ start="<?"
-      \ end="?>"
-      \ contains=xmlAttrib,xmlEqual,xmlString,embeddedTs
-
-
-if exists('g:xml_syntax_folding')
-  " DTD -- we use dtd.vim here
-  syn region  xmlDocType matchgroup=xmlDocTypeDecl
-        \ start="<!DOCTYPE"he=s+2,rs=s+2
-        \ end=">"
-        \ fold
-        \ contains=xmlDocTypeKeyword,xmlInlineDTD,xmlString,embeddedTs
-else
-  syn region  xmlDocType matchgroup=xmlDocTypeDecl
-        \ start="<!DOCTYPE"he=s+2,rs=s+2
-        \ end=">"
-        \ contains=xmlDocTypeKeyword,xmlInlineDTD,xmlString,embeddedTs
-endif
-
-
-if exists('g:xml_syntax_folding')
-  syn region xmlTag
-        \ matchgroup=xmlTag start=+<[^ /!?<>"']\@=+
-        \ matchgroup=xmlTag end=+>+
-        \ contained
-        \ contains=xmlError,xmlTagName,xmlAttrib,xmlEqual,xmlString,@xmlStartTagHook,embeddedTs
-else
-  syn region xmlTag
-        \ matchgroup=xmlTag start=+<[^ /!?<>"']\@=+
-        \ matchgroup=xmlTag end=+>+
-        \ contains=xmlError,xmlTagName,xmlAttrib,xmlEqual,xmlString,@xmlStartTagHook,embeddedTs
-endif
-
-
-syn region tsxRegion
-      \ contains=@Spell,@XMLSyntax,tsxRegion,@typescriptAll
-      \ start=+\%(<\|\w\)\@<!<\z([a-zA-Z][a-zA-Z0-9:\-.]*\)+
-      \ skip=+<!--\_.\{-}-->+
-      \ end=+</\z1\_\s\{-}>+
-      \ end=+/>+
-      \ keepend
-      \ extend
-
-hi def link embeddedTs NONE
-
-syn cluster @typescriptAll add=tsxRegion
diff --git a/after/syntax/typescript.vim b/after/syntax/typescript.vim
new file mode 100644
index 00000000..e4aab79f
--- /dev/null
+++ b/after/syntax/typescript.vim
@@ -0,0 +1,50 @@
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
+  finish
+endif
+
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+" Vim syntax file
+"
+" Language: javascript.jsx
+" Maintainer: MaxMellon <maxmellon1994@gmail.com>
+" Depends:  leafgarland/typescript-vim
+"
+"""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""""
+
+let s:jsx_cpo = &cpo
+set cpo&vim
+
+syntax case match
+
+if exists('b:current_syntax')
+  let s:current_syntax = b:current_syntax
+  unlet b:current_syntax
+endif
+
+if exists('s:current_syntax')
+  let b:current_syntax = s:current_syntax
+endif
+
+" refine the typescript line comment
+syntax region typescriptLineComment start=+//+ end=/$/ contains=@Spell,typescriptCommentTodo,typescriptRef extend keepend
+
+" add a typescriptBlock group for typescript
+syntax region typescriptBlock
+      \ contained
+      \ matchgroup=typescriptBraces
+      \ start="{"
+      \ end="}"
+      \ extend
+      \ contains=@typescriptAll,@typescriptExpression,typescriptBlock
+      \ fold
+
+" because this is autoloaded, when developing you're going to need to source
+" the autoload/jsx_pretty/*.vim file manually, or restart vim
+call jsx_pretty#syntax#highlight()
+
+syntax cluster typescriptExpression add=jsxRegion
+
+let b:current_syntax = 'typescript.tsx'
+
+let &cpo = s:jsx_cpo
+unlet s:jsx_cpo