Improve yats.vim support

- Extend `typescriptIdentifierName` to contain keywords that trigger
  styled definitions as their next group specifically.
- Add issue example file to investigate this issue.

after/syntax/javascript.vim

@@ -227,6 +227,12 @@ 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

examples/issue-56.ts

@@ -0,0 +1,15 @@
+const dynamicStyle = (props: any) => css`
+  color: ${props.color};
+  padding: 10px;
+`;
+
+css`
+  padding: 10px;
+`;
+
+const exampleCSS = css`
+  display: flex;
+  background-color: ${color('primary')};
+  align-items: center;
+  padding: ${spacing('tiny')} 0;
+`;