summaryrefslogtreecommitdiffstats
path: root/after
diff options
context:
space:
mode:
Diffstat (limited to 'after')
-rw-r--r--after/ftplugin/javascript.vim6
-rw-r--r--after/ftplugin/typescript.vim4
-rw-r--r--after/indent/jsx.vim170
-rw-r--r--after/indent/typescript.vim170
-rw-r--r--after/syntax/javascript.vim66
-rw-r--r--after/syntax/jsx_pretty.vim216
-rw-r--r--after/syntax/typescript.vim241
7 files changed, 259 insertions, 614 deletions
diff --git a/after/ftplugin/javascript.vim b/after/ftplugin/javascript.vim
index 093f0b7b..4a6346d9 100644
--- a/after/ftplugin/javascript.vim
+++ b/after/ftplugin/javascript.vim
@@ -83,6 +83,10 @@ fu! IsStyledDefinition(lnum)
endfu
if exists('&ofu')
- let b:prevofu=&ofu
+ if &ofu
+ " Do not keep track of previous omnifunc if it was not set in the first
+ " place
+ let b:prevofu=&ofu
+ endif
setl omnifunc=styledcomplete#CompleteSC
endif
diff --git a/after/ftplugin/typescript.vim b/after/ftplugin/typescript.vim
index 29ac50a6..21da03be 100644
--- a/after/ftplugin/typescript.vim
+++ b/after/ftplugin/typescript.vim
@@ -25,3 +25,7 @@ augroup jsx_comment
augroup end
setlocal suffixesadd+=.tsx
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'styled-components') != -1
+ finish
+endif
+
diff --git a/after/indent/jsx.vim b/after/indent/jsx.vim
index 9d8da5d1..3f25a7f1 100644
--- a/after/indent/jsx.vim
+++ b/after/indent/jsx.vim
@@ -2,172 +2,4 @@ if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'styled-component
finish
endif
-" Vim syntax file
-" Language: styled-components (js/ts)
-" Maintainer: Karl Fleischmann <fleischmann.karl@gmail.com>
-" URL: https://github.com/styled-components/vim-styled-components
-
-" initialize variable to check, if the indentation expression is run
-" multiple times in a row, which indicates an infinite recursion
-let s:is_recursion = 0
-
-" store current indentexpr for later
-let b:js_ts_indent=&indentexpr
-
-" set indentexpr for this filetype (styled-components)
-setlocal indentexpr=GetStyledIndent()
-
-" add the following keys to trigger reindenting, when in insert mode
-" - *; - Indent and insert on press of ';' key.
-" - *<:> - Indent and insert on press of ':' key.
-set indentkeys+=*;,*<:>,*<Return>
-
-fu! s:GetSyntaxNames(lnum, cnum)
- return map(synstack(a:lnum, a:cnum), 'synIDattr(v:val, "name")')
-endfu
-
-" re-implement SynSOL of vim-jsx
-" TODO: add dependency to the readme and remove duplicate implementation
-fu! s:SynSOL(lnum)
- return s:GetSyntaxNames(a:lnum, 1)
-endfu
-
-" re-implement SynEOL of vim-jsx
-" TODO: add dependency to the readme and remove duplicate implementation
-fu! s:SynEOL(lnum, offset)
- let l:lnum = prevnonblank(a:lnum)
- let l:col = strlen(getline(l:lnum))
-
- return s:GetSyntaxNames(l:lnum, l:col + a:offset)
-endfu
-
-
-"" Return whether the current line is a jsTemplateString
-fu! s:IsStyledDefinition(lnum)
- " iterate through all syntax items in the given line
- for item in s:SynSOL(a:lnum)
- " if syntax-item is a jsTemplateString return 1 - true
- " `==#` is a match case comparison of the item
- if item ==# 'styledDefinition'
- return 1
- endif
- endfor
-
- " fallback to 0 - false
- return 0
-endfu
-
-"" Count occurences of `str` at the beginning of the given `lnum` line
-fu! s:CountOccurencesInSOL(lnum, str)
- let l:occurence = 0
-
- " iterate through all items in the given line
- for item in s:SynSOL(a:lnum)
- " if the syntax-item equals the given str increment the counter
- " `==?` is a case isensitive equal operation
- if item ==? a:str
- let l:occurence += 1
- endif
- endfor
-
- " return the accumulated count of occurences
- return l:occurence
-endfu
-
-"" Count occurences of `str` at the end of the given `lnum` line
-fu! s:CountOccurencesInEOL(lnum, str, offset)
- let l:occurence = 0
-
- " iterate through all items in the given line
- for item in s:SynEOL(a:lnum, a:offset)
- " if the syntax-item equals the given str increment the counter
- " `==?` is a case insensitive equal operation
- if item == a:str
- let l:occurence += 1
- endif
- endfor
-
- " return the accumulated count of occurences
- return l:occurence
-endfu
-
-"" Get the indentation of the current line
-fu! GetStyledIndent()
- if s:IsStyledDefinition(v:lnum)
- let l:baseIndent = 0
-
- " find last non-styled line
- let l:cnum = v:lnum
- while s:IsStyledDefinition(l:cnum)
- let l:cnum -= 1
- endwhile
-
- " get indentation of the last non-styled line as base indentation
- let l:baseIndent = indent(l:cnum)
-
- " incrementally build indentation based on current indentation
- " - one shiftwidth for the styled definition region
- " - one shiftwidth per open nested definition region
- let l:styledIndent = &sw
- let l:styledIndent += min([
- \ s:CountOccurencesInSOL(v:lnum, 'styledNestedRegion'),
- \ s:CountOccurencesInEOL(v:lnum, 'styledNestedRegion', 0)
- \ ]) * &sw
-
- " decrease indentation by one shiftwidth, if the styled definition
- " region ends on the current line
- " - either directly via styled definition region, or
- " - if the very last
- if s:CountOccurencesInEOL(v:lnum, 'styledDefinition', 1) == 0
- let l:styledIndent -= &sw
- endif
-
- " return the base indentation
- " (for nested styles inside classes/objects/etc.) plus the actual
- " indentation inside the styled definition region
- return l:baseIndent + l:styledIndent
- elseif len(b:js_ts_indent)
- let l:result = 0
- let l:offset = 0
-
- " increase indentation by one shiftwidth, if the last line ended on a
- " styledXmlRegion and this line does not continue with it
- " this is a fix for an incorrectly indented xml prop after a
- " glamor-styled styledXmlRegion
- if s:CountOccurencesInEOL(v:lnum-1, 'styledXmlRegion', 0) == 1 &&
- \ s:CountOccurencesInSOL(v:lnum, 'styledXmlRegion') == 0
- let l:offset = &sw
- endif
-
- " make sure `GetStyledIndent` and `GetJsxIndent` don't infinitely
- " recurse by incrementing a counter variable, before evaluating the
- " stored indent expression
- if s:is_recursion == 0
- let s:is_recursion = 1
- let l:result = eval(b:js_ts_indent)
- endif
-
- " `is_recursion` being 0 at this point indicates, that
- " `eval(b:js_ts_indent)` did itself evaluate it's stored indentexpr
- " and thus it can be assumed, that the current line should be
- " indented as JS
- if s:is_recursion == 0
- " use one of `GetJavascriptIndent` or `GetJsIndent` if existing
- " fallback to cindent, if not
- if exists('*GetJavascriptIndent')
- let l:result = GetJavascriptIndent()
- elseif exists('*GetJsIndent')
- let l:result = GetJsIndent()
- else
- let l:result = cindent(v:lnum)
- endif
- endif
-
- " reset `is_recursion` counter and return the indentation value
- let s:is_recursion = 0
- return l:result + l:offset
- endif
-
- " if all else fails indent according to C-syntax
- return cindent(v:lnum)
-endfu
+runtime! indent/javascript.vim
diff --git a/after/indent/typescript.vim b/after/indent/typescript.vim
index 996c3d8c..4e281b22 100644
--- a/after/indent/typescript.vim
+++ b/after/indent/typescript.vim
@@ -36,172 +36,4 @@ if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'styled-component
finish
endif
-" Vim syntax file
-" Language: styled-components (js/ts)
-" Maintainer: Karl Fleischmann <fleischmann.karl@gmail.com>
-" URL: https://github.com/styled-components/vim-styled-components
-
-" initialize variable to check, if the indentation expression is run
-" multiple times in a row, which indicates an infinite recursion
-let s:is_recursion = 0
-
-" store current indentexpr for later
-let b:js_ts_indent=&indentexpr
-
-" set indentexpr for this filetype (styled-components)
-setlocal indentexpr=GetStyledIndent()
-
-" add the following keys to trigger reindenting, when in insert mode
-" - *; - Indent and insert on press of ';' key.
-" - *<:> - Indent and insert on press of ':' key.
-set indentkeys+=*;,*<:>,*<Return>
-
-fu! s:GetSyntaxNames(lnum, cnum)
- return map(synstack(a:lnum, a:cnum), 'synIDattr(v:val, "name")')
-endfu
-
-" re-implement SynSOL of vim-jsx
-" TODO: add dependency to the readme and remove duplicate implementation
-fu! s:SynSOL(lnum)
- return s:GetSyntaxNames(a:lnum, 1)
-endfu
-
-" re-implement SynEOL of vim-jsx
-" TODO: add dependency to the readme and remove duplicate implementation
-fu! s:SynEOL(lnum, offset)
- let l:lnum = prevnonblank(a:lnum)
- let l:col = strlen(getline(l:lnum))
-
- return s:GetSyntaxNames(l:lnum, l:col + a:offset)
-endfu
-
-
-"" Return whether the current line is a jsTemplateString
-fu! s:IsStyledDefinition(lnum)
- " iterate through all syntax items in the given line
- for item in s:SynSOL(a:lnum)
- " if syntax-item is a jsTemplateString return 1 - true
- " `==#` is a match case comparison of the item
- if item ==# 'styledDefinition'
- return 1
- endif
- endfor
-
- " fallback to 0 - false
- return 0
-endfu
-
-"" Count occurences of `str` at the beginning of the given `lnum` line
-fu! s:CountOccurencesInSOL(lnum, str)
- let l:occurence = 0
-
- " iterate through all items in the given line
- for item in s:SynSOL(a:lnum)
- " if the syntax-item equals the given str increment the counter
- " `==?` is a case isensitive equal operation
- if item ==? a:str
- let l:occurence += 1
- endif
- endfor
-
- " return the accumulated count of occurences
- return l:occurence
-endfu
-
-"" Count occurences of `str` at the end of the given `lnum` line
-fu! s:CountOccurencesInEOL(lnum, str, offset)
- let l:occurence = 0
-
- " iterate through all items in the given line
- for item in s:SynEOL(a:lnum, a:offset)
- " if the syntax-item equals the given str increment the counter
- " `==?` is a case insensitive equal operation
- if item == a:str
- let l:occurence += 1
- endif
- endfor
-
- " return the accumulated count of occurences
- return l:occurence
-endfu
-
-"" Get the indentation of the current line
-fu! GetStyledIndent()
- if s:IsStyledDefinition(v:lnum)
- let l:baseIndent = 0
-
- " find last non-styled line
- let l:cnum = v:lnum
- while s:IsStyledDefinition(l:cnum)
- let l:cnum -= 1
- endwhile
-
- " get indentation of the last non-styled line as base indentation
- let l:baseIndent = indent(l:cnum)
-
- " incrementally build indentation based on current indentation
- " - one shiftwidth for the styled definition region
- " - one shiftwidth per open nested definition region
- let l:styledIndent = &sw
- let l:styledIndent += min([
- \ s:CountOccurencesInSOL(v:lnum, 'styledNestedRegion'),
- \ s:CountOccurencesInEOL(v:lnum, 'styledNestedRegion', 0)
- \ ]) * &sw
-
- " decrease indentation by one shiftwidth, if the styled definition
- " region ends on the current line
- " - either directly via styled definition region, or
- " - if the very last
- if s:CountOccurencesInEOL(v:lnum, 'styledDefinition', 1) == 0
- let l:styledIndent -= &sw
- endif
-
- " return the base indentation
- " (for nested styles inside classes/objects/etc.) plus the actual
- " indentation inside the styled definition region
- return l:baseIndent + l:styledIndent
- elseif len(b:js_ts_indent)
- let l:result = 0
- let l:offset = 0
-
- " increase indentation by one shiftwidth, if the last line ended on a
- " styledXmlRegion and this line does not continue with it
- " this is a fix for an incorrectly indented xml prop after a
- " glamor-styled styledXmlRegion
- if s:CountOccurencesInEOL(v:lnum-1, 'styledXmlRegion', 0) == 1 &&
- \ s:CountOccurencesInSOL(v:lnum, 'styledXmlRegion') == 0
- let l:offset = &sw
- endif
-
- " make sure `GetStyledIndent` and `GetJsxIndent` don't infinitely
- " recurse by incrementing a counter variable, before evaluating the
- " stored indent expression
- if s:is_recursion == 0
- let s:is_recursion = 1
- let l:result = eval(b:js_ts_indent)
- endif
-
- " `is_recursion` being 0 at this point indicates, that
- " `eval(b:js_ts_indent)` did itself evaluate it's stored indentexpr
- " and thus it can be assumed, that the current line should be
- " indented as JS
- if s:is_recursion == 0
- " use one of `GetJavascriptIndent` or `GetJsIndent` if existing
- " fallback to cindent, if not
- if exists('*GetJavascriptIndent')
- let l:result = GetJavascriptIndent()
- elseif exists('*GetJsIndent')
- let l:result = GetJsIndent()
- else
- let l:result = cindent(v:lnum)
- endif
- endif
-
- " reset `is_recursion` counter and return the indentation value
- let s:is_recursion = 0
- return l:result + l:offset
- endif
-
- " if all else fails indent according to C-syntax
- return cindent(v:lnum)
-endfu
+runtime! indent/javascript.vim
diff --git a/after/syntax/javascript.vim b/after/syntax/javascript.vim
index 000ac954..27818b58 100644
--- a/after/syntax/javascript.vim
+++ b/after/syntax/javascript.vim
@@ -54,9 +54,7 @@ else " build-in javascript syntax
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()
+runtime syntax/jsx_pretty.vim
let b:current_syntax = 'javascript.jsx'
@@ -169,55 +167,16 @@ syn match styledPrefix "\<styled\>\.\k\+"
\ transparent fold
\ nextgroup=styledDefinition
\ contains=cssTagName,javascriptTagRef
- \ containedin=jsFuncBlock
+ \ containedin=jsFuncBlock,jsParen,jsObject,jsObjectValue
syn match styledPrefix "\.\<attrs\>\s*(\%(\n\|\s\|.\)\{-})"
\ transparent fold extend
\ nextgroup=styledDefinition
\ contains=jsObject,jsParen
- \ containedin=jsFuncBlock
+ \ containedin=jsFuncBlock,jsParen,jsObject,jsObjectValue
syn match styledPrefix "\.\<extend\>"
\ transparent fold
\ nextgroup=styledDefinition
- \ containedin=jsFuncBlock
-
-" define custom API section, that contains typescript annotations
-" this is structurally similar to `jsFuncCall`, but allows type
-" annotations (delimited by brackets (e.g. "<>")) between `styled` and
-" the function call parenthesis
-syn match styledTypescriptPrefix
- \ "\<styled\><\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>(\%('\k\+'\|\"\k\+\"\|\k\+\))"
- \ transparent fold
- \ nextgroup=styledDefinition
- \ contains=cssTagName,
- \ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
- \ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
- \ styledTagNameString
-syn match styledTypescriptPrefix
- \ "\<styled\>\%((\%('\k\+'\|\"\k\+\"\|\k\+\))\|\.\k\+\)<\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
- \ transparent fold
- \ nextgroup=styledDefinition
- \ contains=cssTagName,
- \ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
- \ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
- \ styledTagNameString
-syn match styledTypescriptPrefix "\.\<attrs\>\s*(\%(\n\|\s\|.\)\{-})<\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
- \ transparent fold extend
- \ nextgroup=styledDefinition
- \ contains=cssTagName,
- \ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
- \ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
- \ styledTagNameString
-syn match styledTypescriptPrefix "\.\<extend\><\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
- \ transparent fold extend
- \ nextgroup=styledDefinition
- \ contains=cssTagName,
- \ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
- \ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
- \ styledTagNameString
+ \ containedin=jsFuncBlock,jsParen,jsObject,jsObjectValue
" define emotion css prop
" to bypass problems from top-level defined xml/js definitions, this
@@ -244,19 +203,13 @@ syn match cssError contained "{@<>"
" extend javascript matches to trigger styledDefinition highlighting
syn match jsTaggedTemplate extend
- \ "\<css\>\|\<keyframes\>\|\<injectGlobal\>\|\<fontFace\>\|\<createGlobalStyle\>"
+ \ "\<css\>\|\.\<resolve\>\|\.\<global\>\|\<keyframes\>\|\<injectGlobal\>\|\<fontFace\>\|\<createGlobalStyle\>"
\ nextgroup=styledDefinition
syn match jsFuncCall "\<styled\>\s*(.\+)" transparent
\ nextgroup=styledDefinition
syn match jsFuncCall "\<styled\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))"
\ contains=styledTagNameString
\ nextgroup=styledDefinition
-syn match jsFuncCall "\<styled\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))<\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
- \ contains=typescriptBraces,typescriptOpSymbols,typescriptEndColons,
- \ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
- \ styledTagNameString
- \ nextgroup=styledDefinition
syn match jsFuncCall "\.\<withComponent\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))"
\ contains=styledTagNameString
syn match jsFuncCall "\<dc\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))\%((\)\@="
@@ -279,8 +232,6 @@ syn region styledDefinition contained transparent fold extend
syn region styledDefinitionArgument contained transparent start=+(+ end=+)+
\ contains=styledDefinition
-syn cluster typescriptValue add=styledPrefix,jsFuncCall,styledTypescriptPrefix
-
""" yajs specific extensions
" define template tag keywords, that trigger styledDefinitions again to be
" contained in and also do contain the `javascriptTagRef` region
@@ -295,13 +246,6 @@ syn cluster javascriptExpression
\ add=styledPrefix,jsFuncCall,javascriptTagRefStyledPrefix
syn cluster javascriptAfterIdentifier add=styledPrefix,jsFuncCall
-""" yats specific extensions
-" extend typescriptIdentifierName to allow styledDefinitions in their
-" tagged templates
-syn match typescriptIdentifierName extend
- \ "\<css\>\|\<keyframes\>\|\<injectGlobal\>\|\<fontFace\>\|\<createGlobalStyle\>"
- \ nextgroup=styledDefinition
-
" color the custom highlight elements
hi def link cssCustomKeyFrameSelector Constant
hi def link cssCustomPositioningPrefix StorageClass
diff --git a/after/syntax/jsx_pretty.vim b/after/syntax/jsx_pretty.vim
new file mode 100644
index 00000000..bc98202a
--- /dev/null
+++ b/after/syntax/jsx_pretty.vim
@@ -0,0 +1,216 @@
+if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'jsx') != -1
+ finish
+endif
+
+let s:highlight_close_tag = get(g:, 'vim_jsx_pretty_highlight_close_tag', 0)
+
+" <tag id="sample">
+" ~~~~~~~~~~~~~~~~~
+" and self close tag
+" <tag id="sample" />
+" ~~~~~~~~~~~~~~~~~~~
+syntax region jsxTag
+ \ start=+<+
+ \ matchgroup=jsxOpenPunct
+ \ end=+>+
+ \ matchgroup=NONE
+ \ end=+\(/\_s*>\)\@=+
+ \ contained
+ \ contains=jsxOpenTag,jsxEscapeJs,jsxAttrib,jsComment,@javascriptComments,javaScriptLineComment,javaScriptComment,typescriptLineComment,typescriptComment,jsxSpreadOperator
+ \ keepend
+ \ extend
+
+" <tag></tag>
+" ~~~~~~~~~~~
+" and fragment
+" <></>
+" ~~~~~
+" and self close tag
+" <tag />
+" ~~~~~~~
+syntax region jsxElement
+ \ start=+<\_s*\(>\|\${\|\z(\<[-:_\.\$0-9A-Za-z]\+\>\)\)+
+ \ end=+/\_s*>+
+ \ end=+<\_s*/\_s*\z1\_s*>+
+ \ contains=jsxElement,jsxEscapeJs,jsxTag,jsxComment,jsxCloseString,jsxCloseTag,@Spell
+ \ keepend
+ \ extend
+ \ contained
+ \ fold
+
+" detect jsx region
+syntax region jsxRegion
+ \ start=+\(\(\_[([,?:=+\-*/<>{}]\|&&\|||\|=>\|\<return\|\<default\|\<await\|\<yield\)\_s*\)\@<=<\_s*\(>\|\z(\(script\)\@!\<[_\$A-Za-z][-:_\.\$0-9A-Za-z]*\>\)\(\_s*\([-+*)\]}&|?]\|/\([/*]\|\_s*>\)\@!\)\)\@!\)+
+ \ end=++
+ \ contains=jsxElement
+
+" <tag key={this.props.key}>
+" ~~~~~~~~~~~~~~~~
+syntax region jsxEscapeJs
+ \ start=+{+
+ \ end=++
+ \ extend
+ \ contained
+ \ contains=jsBlock,javascriptBlock,javaScriptBlockBuildIn,typescriptBlock
+
+" <tag key={this.props.key}>
+" ~~~~
+" and fragment start tag
+" <>
+" ~~
+exe 'syntax region jsxOpenTag
+ \ matchgroup=jsxOpenPunct
+ \ start=+<+
+ \ end=+>+
+ \ matchgroup=NONE
+ \ end=+\>+
+ \ contained
+ \ contains=jsxTagName
+ \ nextgroup=jsxAttrib
+ \ skipwhite
+ \ skipempty ' .(s:highlight_close_tag ? 'transparent' : '')
+
+" <foo.bar>
+" ~
+syntax match jsxDot +\.+ contained display
+
+" <foo:bar>
+" ~
+syntax match jsxNamespace +:+ contained display
+
+" <tag id="sample">
+" ~
+syntax match jsxEqual +=+ contained display nextgroup=jsxString,jsxEscapeJs,jsxRegion skipwhite
+
+" <tag />
+" ~~
+syntax match jsxCloseString +/\_s*>+ contained
+
+" </tag>
+" ~~~~~~
+" and fragment close tag
+" </>
+" ~~~
+syntax region jsxCloseTag
+ \ matchgroup=jsxClosePunct
+ \ start=+<\_s*/+
+ \ end=+>+
+ \ contained
+ \ contains=jsxTagName
+
+" <tag key={this.props.key}>
+" ~~~
+syntax match jsxAttrib
+ \ +\<[-A-Za-z_][-:_\$0-9A-Za-z]*\>+
+ \ contained
+ \ nextgroup=jsxEqual
+ \ skipwhite
+ \ skipempty
+ \ contains=jsxAttribKeyword
+ \ display
+
+" <MyComponent ...>
+" ~~~~~~~~~~~
+" NOT
+" <someCamel ...>
+" ~~~~~
+exe 'syntax match jsxComponentName
+ \ +\<[A-Z][\$0-9A-Za-z]\+\>+
+ \ contained
+ \ display ' .(s:highlight_close_tag ? 'transparent' : '')
+
+" <tag key={this.props.key}>
+" ~~~
+exe 'syntax match jsxTagName
+ \ +\<[-:_\.\$0-9A-Za-z]\+\>+
+ \ contained
+ \ contains=jsxComponentName,jsxDot,jsxNamespace
+ \ nextgroup=jsxAttrib
+ \ skipempty
+ \ skipwhite
+ \ display ' .(s:highlight_close_tag ? 'transparent' : '')
+
+" <tag id="sample">
+" ~~~~~~~~
+" and
+" <tag id='sample'>
+" ~~~~~~~~
+syntax region jsxString start=+\z(["']\)+ skip=+\\\%(\z1\|$\)+ end=+\z1+ contained contains=@Spell display
+
+let s:tags = get(g:, 'vim_jsx_pretty_template_tags', ['html', 'raw'])
+let s:enable_tagged_jsx = !empty(s:tags)
+
+" add support to JSX inside the tagged template string
+" https://github.com/developit/htm
+if s:enable_tagged_jsx
+ exe 'syntax region jsxTaggedRegion
+ \ start=+\%('. join(s:tags, '\|') .'\)\@<=`+ms=s+1
+ \ end=+`+me=e-1
+ \ extend
+ \ contained
+ \ containedin=jsTemplateString,javascriptTemplate,javaScriptStringT,typescriptStringB
+ \ contains=jsxElement'
+
+ syntax region jsxEscapeJs
+ \ start=+\${+
+ \ end=++
+ \ extend
+ \ contained
+ \ contains=jsTemplateExpression,javascriptTemplateSubstitution,javaScriptEmbed,typescriptInterpolation
+
+ syntax region jsxOpenTag
+ \ matchgroup=jsxOpenPunct
+ \ start=+<\%(\${\)\@=+
+ \ matchgroup=NONE
+ \ end=++
+ \ contained
+ \ contains=jsxEscapeJs
+ \ nextgroup=jsxAttrib,jsxSpreadOperator
+ \ skipwhite
+ \ skipempty
+
+ syntax keyword jsxAttribKeyword class contained display
+
+ syntax match jsxSpreadOperator +\.\.\.+ contained display nextgroup=jsxEscapeJs skipwhite
+
+ syntax match jsxCloseTag +<//>+ display
+
+ syntax match jsxComment +<!--\_.\{-}-->+ display
+endif
+
+" Highlight the tag name
+highlight def link jsxTag Function
+highlight def link jsxTagName Identifier
+highlight def link jsxComponentName Function
+
+highlight def link jsxAttrib Type
+highlight def link jsxAttribKeyword jsxAttrib
+highlight def link jsxEqual Operator
+highlight def link jsxString String
+highlight def link jsxDot Operator
+highlight def link jsxNamespace Operator
+
+if s:highlight_close_tag
+ highlight def link jsxCloseString Identifier
+ highlight def link jsxOpenPunct jsxTag
+else
+ " Highlight the jsxCloseString (i.e. />), jsxPunct (i.e. <,>) and jsxCloseTag (i.e. <//>)
+ highlight def link jsxCloseString Comment
+ highlight def link jsxOpenPunct jsxPunct
+endif
+
+highlight def link jsxPunct jsxCloseString
+highlight def link jsxClosePunct jsxPunct
+highlight def link jsxCloseTag jsxCloseString
+
+highlight def link jsxComment Comment
+highlight def link jsxSpreadOperator Operator
+
+let s:vim_jsx_pretty_colorful_config = get(g:, 'vim_jsx_pretty_colorful_config', 0)
+
+if s:vim_jsx_pretty_colorful_config == 1
+ highlight def link jsObjectKey Label
+ highlight def link jsArrowFuncArgs Type
+ highlight def link jsFuncArgs Type
+endif
+
diff --git a/after/syntax/typescript.vim b/after/syntax/typescript.vim
index d1b87c92..f39d755f 100644
--- a/after/syntax/typescript.vim
+++ b/after/syntax/typescript.vim
@@ -28,21 +28,21 @@ 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
+if !hlexists('typescriptTypeCast')
+ " add a typescriptBlock group for typescript
+ syntax region typescriptBlock
+ \ matchgroup=typescriptBraces
+ \ start="{"
+ \ end="}"
+ \ contained
+ \ extend
+ \ contains=@typescriptExpression,typescriptBlock
+ \ fold
+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()
+syntax cluster typescriptExpression add=jsxRegion,typescriptParens
-syntax cluster typescriptExpression add=jsxRegion
+runtime syntax/jsx_pretty.vim
let b:current_syntax = 'typescript.tsx'
@@ -52,119 +52,7 @@ if exists('g:polyglot_disabled') && index(g:polyglot_disabled, 'styled-component
finish
endif
-" Vim syntax file
-" Language: styled-components (js/ts)
-" Maintainer: Karl Fleischmann <fleischmann.karl@gmail.com>
-" URL: https://github.com/styled-components/vim-styled-components
-
-if exists("b:current_syntax")
- let s:current_syntax=b:current_syntax
- unlet b:current_syntax
-endif
-
-
-" fix for "-" before cssPositioningProp
-" - needs to be above CSS include to not match cssVendor definitions
-syn region cssCustomPositioningPrefix contained
- \ start='-' end='\%(\s\{-}:\)\@='
- \ contains=cssPositioningProp
-
-" introduce CSS cluster from built-in (or single third party syntax file)
-syn include @CSS syntax/css.vim
-
-" try to include CSS3 definitions from multiple files
-" this is only possible on vim version above 7
-if v:version >= 700
- try
- syn include @CSS3 syntax/css/*.vim
- catch
- endtry
-endif
-
-" TODO: include react-native keywords
-
-" define custom cssAttrRegion
-" - add ",", "`" and "{" to the end characters
-" - add "cssPseudoClassId" to it's containing elements
-" this will incorrectly highlight pseudo elements incorrectly used as
-" attributes but correctly highlight actual attributes
-syn region cssCustomAttrRegion contained
- \ start=":" end="\ze\%(;\|)\|{\|}\|`\)"
- \ contains=css.*Attr,cssColor,cssImportant,cssValue.*,cssFunction,
- \ cssString.*,cssURL,cssComment,cssUnicodeEscape,cssVendor,
- \ cssError,cssAttrComma,cssNoise,cssPseudoClassId,
- \ jsTemplateExpression,
- \ typescriptInterpolation,typescriptTemplateSubstitution
-syn region cssCustomAttrRegion contained
- \ start="transition\s*:" end="\ze\%(;\|)\|{\|}\|`\)"
- \ contains=css.*Prop,css.*Attr,cssColor,cssImportant,cssValue.*,
- \ cssFunction,cssString.*,cssURL,cssComment,cssUnicodeEscape,
- \ cssVendor,cssError,cssAttrComma,cssNoise,cssPseudoClassId,
- \ jsTemplateExpression,
- \ typescriptInterpolation,typescriptTemplateSubstitution
-
-" define custom css elements to not utilize cssDefinition
-syn region cssCustomMediaBlock contained fold transparent matchgroup=cssBraces
- \ start="{" end="}"
- \ contains=css.*Attr,css.*Prop,cssComment,cssValue.*,cssColor,cssURL,
- \ cssImportant,cssError,cssStringQ,cssStringQQ,cssFunction,
- \ cssUnicodeEscape,cssVendor,cssTagName,cssClassName,
- \ cssIdentifier,cssPseudoClass,cssSelectorOp,cssSelectorOp2,
- \ cssAttributeSelector
-syn region cssCustomPageWrap contained transparent matchgroup=cssBraces
- \ start="{" end="}"
- \ contains=cssPageMargin,cssPageProp,cssCustomAttrRegion,css.*Prop,
- \ cssComment,cssValue.*,cssColor,cssURL,cssImportant,cssError,
- \ cssStringQ,cssStringQQ,cssFunction,cssUnicodeEscape,cssVendor,
- \ cssHacks
-syn match cssCustomPageMargin contained skipwhite skipnl
- \ "@\%(\%(top\|left\|right\|bottom\)-\%(left\|center\|right\|middle\|bottom\)\)\%(-corner\)\="
-syn match cssCustomKeyFrameSelector "\%(\d*%\|\<from\>\|\<to\>\)" contained
- \ skipwhite skipnl
-
-" define css include customly to overwrite nextgroup
-syn region cssInclude start="@media\>" end="\ze{" skipwhite skipnl
- \ contains=cssMediaProp,cssValueLength,cssMediaKeyword,cssValueInteger,
- \ cssMediaMediaAttr,cssVencor,cssMediaType,cssIncludeKeyword,
- \ cssMediaComma,cssComment
- \ nextgroup=cssCustomMediaBlock
-
-" define all non-contained css definitions
-syn cluster CSSTop
- \ contains=cssTagName,cssSelectorOp,cssAttributeSelector,cssClassName,
- \ cssBraces,cssIdentifier,cssIncludeKeyword,cssPage,cssKeyFrame,
- \ cssFontDescriptor,cssAttrComma,cssPseudoClass,cssUnicodeEscape
-
-" custom highlights for styled components
-" - "&" inside top level
-" - cssTagName inside of jsStrings inside of styledPrefix regions
-" TODO: override highlighting of cssTagName with more subtle one
-syn match styledAmpersand contained "&"
-syn region styledTagNameString matchgroup=jsString contained
- \ start=+'+ end=+'+ skip=+\\\%(\'\|$\)+
- \ contains=cssTagName
-syn region styledTagNameString matchgroup=jsString contained
- \ start=+"+ end=+"+ skip=+\\\%(\"\|$\)+
- \ contains=cssTagName
-syn region styledTagNameString matchgroup=jsString contained
- \ start=+`+ end=+`+ skip=+\\\%(\`\|$\)+
- \ contains=cssTagName
-
-" define custom API sections that trigger the styledDefinition highlighting
-syn match styledPrefix "\<styled\>\.\k\+"
- \ transparent fold
- \ nextgroup=styledDefinition
- \ contains=cssTagName,javascriptTagRef
- \ containedin=jsFuncBlock
-syn match styledPrefix "\.\<attrs\>\s*(\%(\n\|\s\|.\)\{-})"
- \ transparent fold extend
- \ nextgroup=styledDefinition
- \ contains=jsObject,jsParen
- \ containedin=jsFuncBlock
-syn match styledPrefix "\.\<extend\>"
- \ transparent fold
- \ nextgroup=styledDefinition
- \ containedin=jsFuncBlock
+runtime! syntax/javascript.vim
" define custom API section, that contains typescript annotations
" this is structurally similar to `jsFuncCall`, but allows type
@@ -172,132 +60,57 @@ syn match styledPrefix "\.\<extend\>"
" the function call parenthesis
syn match styledTypescriptPrefix
\ "\<styled\><\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>(\%('\k\+'\|\"\k\+\"\|\k\+\))"
- \ transparent fold
+ \ transparent fold extend
\ nextgroup=styledDefinition
\ contains=cssTagName,
\ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
\ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
+ \ typescriptType,foldBraces,
\ styledTagNameString
+ \ containedin=foldBraces
syn match styledTypescriptPrefix
\ "\<styled\>\%((\%('\k\+'\|\"\k\+\"\|\k\+\))\|\.\k\+\)<\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
- \ transparent fold
+ \ transparent fold extend
\ nextgroup=styledDefinition
\ contains=cssTagName,
\ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
\ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
+ \ typescriptType,foldBraces,
\ styledTagNameString
+ \ containedin=foldBraces
syn match styledTypescriptPrefix "\.\<attrs\>\s*(\%(\n\|\s\|.\)\{-})<\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
\ transparent fold extend
\ nextgroup=styledDefinition
\ contains=cssTagName,
\ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
\ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
+ \ typescriptType,foldBraces,
\ styledTagNameString
+ \ containedin=foldBraces
syn match styledTypescriptPrefix "\.\<extend\><\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
\ transparent fold extend
\ nextgroup=styledDefinition
\ contains=cssTagName,
\ typescriptBraces,typescriptOpSymbols,typescriptEndColons,
\ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
+ \ typescriptType,foldBraces,
\ styledTagNameString
+ \ containedin=foldBraces
-" define emotion css prop
-" to bypass problems from top-level defined xml/js definitions, this
-" plugin re-defines keywords/noise for highlighting inside of the custom
-" xmlAttrib definition
-syn keyword styledXmlRegionKeyword css contained
-syn match styledXmlRegionNoise "\%(=\|{\|}\)" contained
-" only include styledDefinitions inside of xmlAttribs, that are wrapped
-" in `css={}` regions, `keepend` is necessary to correctly break on the
-" higher-level xmlAttrib region end
-syn region styledXmlRegion
- \ start="\<css\>={" end="}"
- \ keepend fold
- \ containedin=xmlAttrib
- \ contains=styledXmlRegionKeyword,styledXmlRegionNoise,styledDefinition
-
-" define nested region for indenting
-syn region styledNestedRegion contained transparent
- \ matchgroup=cssBraces
- \ start="{" end="}"
-
-" re-define cssError to be highlighted correctly in styledNestedRegion
-syn match cssError contained "{@<>"
-
-" extend javascript matches to trigger styledDefinition highlighting
-syn match jsTaggedTemplate extend
- \ "\<css\>\|\<keyframes\>\|\<injectGlobal\>\|\<fontFace\>\|\<createGlobalStyle\>"
- \ nextgroup=styledDefinition
-syn match jsFuncCall "\<styled\>\s*(.\+)" transparent
- \ nextgroup=styledDefinition
-syn match jsFuncCall "\<styled\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))"
- \ contains=styledTagNameString
- \ nextgroup=styledDefinition
syn match jsFuncCall "\<styled\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))<\%(\[\|\]\|{\|}\||\|&\|:\|;\|,\|?\|'\|\"\|\k\|\s\|\n\)\+>"
+ \ transparent fold
\ contains=typescriptBraces,typescriptOpSymbols,typescriptEndColons,
\ typescriptParens,typescriptStringS,@typescriptType,
- \ typescriptType,
+ \ typescriptType,foldBraces,
\ styledTagNameString
\ nextgroup=styledDefinition
-syn match jsFuncCall "\.\<withComponent\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))"
- \ contains=styledTagNameString
-syn match jsFuncCall "\<dc\>\s*(\%('\k\+'\|\"\k\+\"\|`\k\+`\))\%((\)\@="
- \ contains=styledTagNameString
- \ nextgroup=styledDefinitionArgument
-
-" inject css highlighting into custom jsTemplateString region
-" - use `extend` to not end all nested jsTemplateExpression on the first
-" closing one
-syn region styledDefinition contained transparent fold extend
- \ start="`" end="`" skip="\\\%(`\|$\)"
- \ contains=@CSSTop,
- \ css.*Prop,cssValue.*,cssColor,cssUrl,cssImportant,cssError,
- \ cssStringQ,cssStringQQ,cssFunction,cssUnicodeEscape,cssVendor,
- \ cssHacks,
- \ cssCustom.*,
- \ jsComment,jsTemplateExpression,
- \ typescriptInterpolation,typescriptTemplateSubstitution,
- \ styledAmpersand,styledNestedRegion
-syn region styledDefinitionArgument contained transparent start=+(+ end=+)+
- \ contains=styledDefinition
+ \ containedin=foldBraces
syn cluster typescriptValue add=styledPrefix,jsFuncCall,styledTypescriptPrefix
-""" yajs specific extensions
-" define template tag keywords, that trigger styledDefinitions again to be
-" contained in and also do contain the `javascriptTagRef` region
-syn match javascriptTagRefStyledPrefix transparent fold
- \ "\<css\>\|\<keyframes\>\|\<injectGlobal\>\|\<fontFace\>\|\<createGlobalStyle\>"
- \ containedin=javascriptTagRef
- \ contains=javascriptTagRef
- \ nextgroup=styledDefinition
-" extend the yajs clusters to include the previously and extraneously defined
-" styled-related matches
-syn cluster javascriptExpression
- \ add=styledPrefix,jsFuncCall,javascriptTagRefStyledPrefix
-syn cluster javascriptAfterIdentifier add=styledPrefix,jsFuncCall
-
""" yats specific extensions
" extend typescriptIdentifierName to allow styledDefinitions in their
" tagged templates
syn match typescriptIdentifierName extend
\ "\<css\>\|\<keyframes\>\|\<injectGlobal\>\|\<fontFace\>\|\<createGlobalStyle\>"
\ nextgroup=styledDefinition
-
-" color the custom highlight elements
-hi def link cssCustomKeyFrameSelector Constant
-hi def link cssCustomPositioningPrefix StorageClass
-hi def link styledAmpersand Special
-
-hi def link styledXmlRegionKeyword Type
-hi def link styledXmlRegionNoise Noise
-hi def link styledXmlRegion String
-
-
-if exists("s:current_syntax")
- let b:current_syntax=s:current_syntax
-endif
cgit-1.2.3-r5 | srcnode v0.4.0